 |
|
|
| TEXT AND STYLE GUIDE
If you 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 AAES/ACES/COAG stylesheet appropriate for your organization (Alabama Agricultural Experiment Station, Alabama Cooperative Extension System or the College of Agriculture at Auburn University) 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 AAES/ACES/COAG stylesheets also incorportate an ADA-compliant heading system hierarchy, which makes it easier for text readers to determine the information flow of the site. See the ACES/AG IT Web development site (stylesheets)
If there is a compelling reason that you cannot use the existing AAES/ACES/COAG stylesheets for your Web site, your stylesheet still must retain the elements of the AAES/ACES/COAG stylesheets and be approved by your communications department. Also please be aware that you will be responsible for ensuring that your site continues to comply with AAES/ACES/COAG's evolving site standards in the future.
A note about content: Ultimately, YOU are responsible for the content (both text and graphics) that appears on the pages of your Web site. 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 AAES/ACES/COAG Web sites.
Colors in Text
Emphasis
Text Size
Text Fonts
Links in Text
Editing and Proofreading
Understand How People
Read on the Web
|
| Colors in Text |
• For text, use dark colors on a light background for maximum contrast and readability. Recommended body text colors are # 000000 (black) or #000066 (dark blue). Always use dark colors for any text longer than a couple of lines.
• Background color for body text should be #FFFFFF (white). Alternative colors are #CCCCCC (light grey), #FFFFCC (pale yellow), or #CCCC99 (light tan).
• Use hard returns between paragraphs in your body text to create white space and make the text easier to read. Reading long lines of type causes eye strain and makes keeping track of the text difficult. For improved readability, limit the width of the text to about 356 pixels, or about nine to 11 words per line of 12 pixel type.
• Menus are useful not only for navigation but also as a means of organizing and designing your page. Therefore, it is a good idea to use colors for menus that contrast with the text background colors. For AAES and COAG sites, acceptable background colors for menus are #0000FF, #003399, #6666CC, #6666FF (shades of blue) and #FF6600, #FF3300, #CC3300 (shades of orange). Recommended text colors for these backgrounds are #FFFFFF (white), #CCCCCC (light grey) or #CCCC99 (light tan)
For ACES sites, acceptable background colors are the #1E78C1 (blue) and #006666 (green).
• If you wish to use color in text, stick to the Web color palette (256 colors) and use colors that will work within the AAES/ACES/COAG 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.
• 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.
|
| Emphasis |
• Do not underline text or use blinking (<blink>) 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 words or, at most, lines of text at a time.
|
| Text Size |
For good legibility and visual organization use the following guides: header fonts should be 20 to 24 pixels; subheads should be 14 to 16 pixels; body text should be 12 pixels or size “2”; and footers should be a little smaller. Text sizes are built in to the AAES/ACES/COAG stylesheets.
Be aware that font sizes are rendered differently on Mac and PC browsers (PCs render text larger than Macs).
|
| Text Fonts |
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 AAES/ACES/COAG stylesheets. The AAES/ACES/COAG templates and stylesheets are designed to use Verdana / Arial as the sans-serif default for online text.
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. Don’t forget to use ALT text for ADA compliance.
Avoid using multiple fonts on a
page--this is unprofessional and distracting.
|
| Links in Text |
Link text must be legible on the background color. Unvisited links should be a different color than visited links. Make sure the user knows they are links. For graphic links, construct the navigation so links are obvious. Be consistent with text throughout your site.
|
| 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 and Contribute also provide a very functional spell-check feature. Even so, there is no substitute for a human proofreader.
Common resources for writing styles are Associated Press and Chicago style guides.
|
| 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. Use the following principles:
• Break up large blocks of text into small portions.
• Use bulleted lists.
• Highlight important terms or phrases (but not excessively). Don't expect your readers to read every word.
• Try to be concise.
• Design your pages to lead to the most important sections (primary navigation or elements) with clear visual cues.
|
| |
|
|
|
|
