Text and Style Guide

Top recommendation: Use the EMU stylesheet, which will help you integrate the information on this page into your web development.

If there is a compelling reason that you can not use the EMU stylesheet for your web site, you will still need to integrate certain components of the EMU stylesheet into your own stylesheet. Please retain the elements of the EMU stylesheet.

A note about content: Ultimately, YOU are responsible for the content (text and graphics) that appears on your web pages. This standards guide will provide some assistance in developing your site, but you must be attentive to the accuracy, currency and professionalism of all your official EMU web pages.

Be consistent: text specifications | Understand how people read on the web

Want people to use your site? Be consistent.

One of the best ways to ensure consistency and professionalism in your text is to use cascading stylesheets, which ensure that the presentation of your text is consistent throughout your site. The EMU stylesheet makes it very easy to make changes that apply to your entire site--a change to the stylesheet automatically changes every page that refers to it.

The stylesheet

• We strongly recommend that you use the EMU stylesheet for all your official EMU web pages. Whether or not you wish to use specifications not integrated in the EMU stylesheet, please follow these guidelines:

Colors in text

• For text, use dark colors on a light background for maximum contrast and readability. Black text is recommended for greatest readability. Always use black text (hex color #000000) for any text longer than a couple of lines.
• If you are using color in text for emphasis, provide an additional means of emphasis as well, for those who are colorblind. Any colors you use should also be clear, contrasting and readable.
• If you wish to use color in text, stick to the web color palette (256 colors) and use colors that will work within the EMU color palette. Avoid using multiple text colors. Text colors should be used sparingly for selective highlights, not as a way to add decoration or color to a page.

Emphasis

• Do not underline text for emphasis; use bold (<strong>) or italic (<em>) text instead. For web users, underlined text--and particularly colored underlined text--signifies a link.
• When using bold or italic for emphasis, do not overemphasize. As the saying goes, "all bold is no bold." And, since italicized text is harder to read than regular text, use italics sparingly, and for no more than a few lines of text at a time.

Text size

• Text size should be within a readable range. A general size of "2" or 12px is standard for text. A little larger is appropriate for headlines; a little smaller is appropriate for footers. Text sizes are built in to the EMU stylesheet. Be aware that font sizes are rendered differently on Mac and PC browsers (PCs render text larger than Macs).

Text font

• Specified fonts on your web pages should be part of the common set that is the default on current desktop/laptop PCs and Macs. This is a very limited set. A good convention is to use the default font (which is usually Times or Times New Roman for serif text) or the "arial, helvetica, verdana, sans-serif" convention for sans-serif type. (Text specifications are built in to the EMU stylesheet. The EMU templates and stylesheet are designed to use Verdana / Arial as the sans-serif default for text.)

• If you specify a font that does not exist on a user's computer, the browser will use its own default font. Common fonts on Windows systems are Arial, Arial Black, Book Antiqua, Bookman Old Style, Century Gothic, Century Schoolbook, Courier, Courier New, Garamond, MS Serif, MS Sans Serif, Times New Roman, Verdana. Common fonts for Mac systems are Arial, Avant Garde, Bookman, Chicago, Courier, Geneva, Helvetica, Monaco, New Century Schoolbook, New York, Palatino, Times. If you wish to use specific fonts in these sets, note that individual font names must be specifically and exactly listed under the "face" attribute to appear in browsers. Text specifications are built in to the EMU stylesheet.
• If you wish to use a non-standard font in a limited way (such as in a page header, etc.), you can create an image file using the font. Avoid using multiple fonts on a page--this is unprofessional and distracting.

Links in text

• For links in text, use the browser default colors OR an intuitive color structure. For example, unvisited links should be darker in color than visited links. Make sure text links are underlined* so the user knows they are links. For graphic links, construct the navigation so links are obvious. Be consistent with text throughout your site.

(*While it is true that mouseovers can provide the visual cues necessary to signify links in text, they require user navigation. Underlined text--the universal "link" cue--does not.)

Editing and proofreading

• You are responsible for editing and proofreading your site's content. You may wish to create text in a word processing program (such as Word) that has full-featured grammar and spell-checking capabilities. Dreamweaver also provides a very functional spell-check feature. Even so, there is no substitute for a human proofreader. Please be aware not to use special characters in word processing programs--such as em-dashes and smart-quotes--that may not translate to the web.
• The University Marketing & Communications department can provide proofreading support for web sites on a limited basis (depending on the current project load). Contact University Marketing at 487-2483 and ask to speak to a Marketing Associate about your project. Normal turnaround time is 48 hours for every three pages. This may be modified depending on the size of your web site.

EMU style for editorial content

• Be aware the EMU uses AP style for editorial content. You are responsible for ensuring that the content of your site complies with EMU style guidelines. You may want to refer to the EMU Publications Style Guide at http://www.emich.edu/styleguide.

Understand how people read on the web

Studies have shown that people generally do not read large blocks of text on the web. Most readers approach large blocks of text on web sites in the following three ways:

• They scan the content for highlights.
• They print out pages.
• They leave the site without reading the text.

Therefore, if you want people to read the text on your web pages, make the content scannable. Break it up into small portions. Use bulleted lists. Highlight important terms or phrases (but not excessively). Don't expect your readers to read every word. And try to be concise.

Also, design your pages to lead to the most important sections (primary navigation or elements) with clear visual cues.

You can also serve your readers by making your pages printable. Even if you don't intend for people to print your pages, some will, and you should accommodate this option. You may provide a separate printable version, if you wish to take the time to do so. For general page design, printable pages require certain design protocols: no reversing text out of a dark background, for example. You should also avoid extreme landscape-oriented designs. Avoid using frames. (Further information about frames is available under the "design" section of General Site Standards.)

Questions about this site should be referred to the director of Web Communications.