Desktop Publishing Tips and Tutorials · Text Layout

What this is about:

Good Web design is much more than graphics, content, and navigation. From a Desktop Publishing standpoint, it includes the knowledge of average visitor's attention span and what works in terms of layout, for an average page. Web visitors have a very short attention span, but if a subject interests them, they'll be more likely to study the site. It then becomes the responsibility of the designer to make the words aesthetically appealing and easy to understand.

Text in Terms of Layout

by Judy Vorfeld

Idiom Sisters Guidepost Award — Presented
			to Internet Brothers in 2000 Here's an example from a page I worked on at Asthma Reality. Look at the first grouping under the Introduction. While the author had the three items numbered, there was no paragraph break from beginning to end, and no indentation. It was one large paragraph from "We will ask" to "behaviour of the individual."

I began by using an ordered list that would number each item while moving the sub-grouping away from the introductory paragraph. Ordered lists <ol> and unordered lists <ul> indent either the numbers or the bullets from the left margin, then indent the subject matter. Everything in items 1, 2, and 3 started in lower case. I capitalized the beginning word in each heading, removed the short dashes that preceded each sub-section, and capitalized the first word in each.

Go back to the site and scroll down to the heading, "Sympathetic-parasympathetic nerve." In this section, the two quotes simply had line breaks, a short dash at the beginning of the sentences, and no capitalization of the first word in the sentence. Adding bullets transformed them, giving the words the importance they deserve.

All text coloring on the site was done by the author. This can add a great deal of emphasis to words and phrases, and can also be used well in headings.

Another successful way of laying out text is to occasionally use the <blockquote> </blockquote> tag around text. It indents from the right and left, and also a bit from the top and bottom.

One last item: try to avoid typing completely across a screen. It often pushes the reader away and sends him/her elsewhere. The only time when it may be okay is on a site with information that will be printed (for study purposes) more than it will be read online.



Judy Vorfeld (aka Webgrammar), owns Editing and Writing Services, a home-based business specializing in the value of good grammar usage. Services include typing, copyediting, Web analysis, renovation, and design. She also works with foreign Web site editors when translated text needs clarification for the American English audience.

Printing / Typography Resources

  1. Paper and Paper Related
  2. Alphagraphics: Glossary
  3. CDL Printing and Packaging: Glossary
  4. Neenah Paper: Glossary
  5. FedEx Office: Print Online
  6. Wausau: Consumer Paper Products
  7. Webgrammar's Typography Resources