Document Journal  

Peter Schmidt


| Peter Schmidt's  Document Design Journal > Home > Journal #2  

| Next |

Journal #1
| Designer's Collection Series  Job Card | 
Journal #2
| HTML for the World Wide Web | 
Journal #3
| A Man A Can A Plan Cookbook | 
Journal #4
| Health Alert Notice SARS | 
Journal #5
| Black & Decker Toast -R-Oven Manual | 
Journal #6
| MOH Frontline  Guide Booklet | 

HTML for the
World Wide Web

Visual Quick Start Guide

(Full Document)



The purpose of the document is to teach users how to write HTML code. The first chapter is intended to be read from start to finish giving the user the building blocks necessary to write HTML code. The subsequent chapters can also be read from start to finish but are more likely to be scanned and referenced for particular bits of information such as creating an e-mail link in a Web page.

The document teaches people how to create their own Web page whether as a hobby or for a small/personal business.


The document is designed for novice HTML writers or those who have the bare bones of HTML programming skills and are seeking information on how to perform (write) specific HTML commands. The document is not designed for advanced HTML programmers as they will find most of the material remedial – however, they may wish to have a copy on hand in case they need a refresher.

The document assumes that the user has access to an HTML writing program and has a least a basic to intermediate level of computer literacy.


The document is intended to be used at the computer workstation. This way the user can “follow along” with the instructions given. The document will most often be used as a reference guide – when a programmer is stuck on a particular piece of code and needs to find a solution.


The body text of the document is in a Serif face allowing for easy processing of the linear instructions. The headings and subheadings are in a Sans-Serif face to signify the authority of the document. The text tells the user, "If you want to know how to add an e-mail link to your Web page, this is how you do it.".


The document makes excellent use of screen captures to display the end result of the task being explained, as well as, a visual comparison between the user’s computer screen and how it should look according to the author’s screen.

The graphics are in black and white for the most part which creates little extra noise to distract the user from the information they are seeking – they are not distracted by fancy artwork while they glance back and forth between their computer screen and the document.


The white ground and black figure create a mechanical and authoritative tone. This designates the author of the document as the authority by appealing to the user’s expectations of what a computer programming book should be – this document is similar to the instructional documents (manuals) that came with the user's computer and the HTML software package – cold and informative – very serious business. This also assures the user they are not wasting their time by using a document that is beneath them – for example an elementary school book with lots of colourful examples. 

As well, the high contrast of the figure and ground aid the user in locating information. When the user looks up an item in the index and receives the corresponding page number it is easy to scan the page and locate the required information.

The only colour to be used outside of the black, white and grey scale is red. However, the colour is used sparingly, only illustrating particularly tricky or new portions of code, as well as, visual examples of before and after shots when making Web page enhancements. Thus the colour does not become a noisy distraction to the user.


The document has an excellent rear index that provides clearly marked sections and easy to follow outdenting. As well, the index also has a number of different keywords that can be used to locate the same information. For example if you wanted to know how to add an e-mail link to your Web page you could look under Links or under E-mail – instead of having one index entry refer to the other.

However, the Serif font that is used in this index makes the user struggle to differentiate between the different bits of information – one word to the next. A Sans-serif font would have been a better choice to allow the user to scan the index more rapidly and with less strain on the eyes.


| Back to the Top | Next |