Web Resourcesfor Evergreen Web Developers

Decorative graphic

Web Style Guide

Want to know how to visually style things?

Visit the web team's web-style library for a complete collection of the styles available in the v4 Theme.

Writing Style

The Basics

  • Use simple, direct sentences.
  • Provide factual and content-rich information. Avoid anything that can be perceived as advertising copy or fluff.
  • Start a web page with the conclusion first, as well as a short summary of the remaining content, instead of leading up to the main point (as is typical in a paragraph).
  • Write in the active voice. For example, "The ability to jump-start their careers with an internship" becomes "Jumpstart your career with an internship."
  • Update your site's content often.
Use An Appropriate Tone
  • Refer to the college in the first person plural (when pronouns are used at all), such as "We know that nobody learns exactly the same way and there's no place to learn exactly like Evergreen."
  • Refer to the reader in the second person, as in "...we think you'll see that our difference not only sets us apart..."
  • Write for your audience - not for yourself.
  • If your content needs instructions or you have to explain it, there's room for improvement. The length of your instructional text is almost always inversely proportionate to the usability of your product.
Divide Text Into Small, Easy-to-Read Chunks
  • Use section titles, headings, and sub-heads (h2, h3, h4, h5). They are signposts that help readers find content they are interested in and also help develop symantec structure for screen readers and search engines. The heading 1 tag has been used for the Page Title so do not use h1 in the content area as it should only be used once per page.
  • Present lists as bulleted items, not as prose. Avoid lists of more than seven items (if you have long lists think of ways to break them up logically).
  • Use clear section titles and liberally include headings and sub-headings where they help users to quickly find information.
  • Avoid ambiguity. Avoid incomplete teasers. Give your readers the information as soon as possible and as succinctly as possible.
Spelling
  • Be sure to spell check your content.
  • "Website" is one word.
  • Use American spelling throughout.
Abbreviations and Acronyms
  • Avoid abbreviations, even for commonly abbreviated words. Abbreviations usually don't make any sense when they are read aloud by screen reading software (used by people with visual disabilities).
  • Spell out acronyms the first time they are used on a page - A Very Long Title (AVLT.)
  • Refer to the college as The Evergreen State College or Evergreen, not TESC (It's taken: Thomas Edison State College)

Structuring Your Document

  • An effective HTML page is one that is structured. Dave Raggett (of the World Wide Web Consortium) has posted some tips for Getting Started with HTML .

Formatting

  • Align all content to the left (including headers, paragraphs and images).
  • Use bullets or the blockquotes, not spaces, to indent text.

Do's and Don'ts

  • Use bold to highlight words as phrases when appropriate.
  • Do not use all caps. This is the online equivalent of SHOUTING.
  • Do not underline. Underlining words suggests a hyperlink.
  • Do not rely on variations of font size or color. Font size and color are all defined by the college's core style sheet.

Dealing With Links

  • Link in context. Avoid self-referential terms like "Click here " and "follow this link. "
    • An example of linking in context is: "We have put together a web development checklist to help you develop an effective web presence."
  • Email links should use the email script. For example, an email link to Mr. Example's email at example@evergreen.edu, that is sent from the Web Resources page, would be written out like this:
    <a xhref="http://www.evergreen.edu/scripts/contact.asp?sm=example&amp;sub=Email from Web Resources Site&amp;title=Contact Mr. Example">
    If the email is not an @evergreen.edu address, you must include the entire address.
  • The name of the page file, page title, left nav link name, and page heading should be consistent when possible. (i.e. studentsupport.htm, Student Support Services, Student Support Services at Evergreen)
  • Do not use "return to top" or "top" links.
  • Whenever a link takes the visitor to a Word Document or PDF file, make that clear in the link name. For example: 10-Year Capital Plan (Word) or IT Strategic Plan (PDF). If there's both, it should look like (Word | PDF).
  • Whenever a link takes the visitor to a different web site (a non-evergreen.edu page) you may want the link to open a new window (<a href="http://google.com" target="_blank">Google</a>

Content Delivery Format

  • When submitting content to the Web Team, please send the content in Word or plain text.

Use of Images

  • Avoid using complex graphics and photo collages that can take an long amount of time to download for visitors with slower connections (30kb+ for a photo is pretty big)
  • Multimedia effects should only be used when they truly add to the reader's understanding of the information.
  • Resize images in an image editing program (or forward them to the Web Team) to decrease their file size.
  • Images can be aligned left or right (using class="right" or "left").
  • Images should not have borders, frames or background colors.
  • All images should have a relevant and descriptive alt tag.

Contact Guidelines

Examples of contact information for the right sidebar (v3 templates) or footer (v4 templates).

Standard Brief Extra Detail
Academic Advising
Location: Library Building, Room 2153
Phone: (360) 867.6312
Office Hours: Mon - Thu 9 am - 6 pm
Fri 9 am - 5 pm
Drop-ins:
Mon - Fri 1 pm - close
Email: Advising
Prime Time Advising Hours (A-Dorm, 205):
Writing Tutors Hours:
Sun - Wed 6 pm - 9 pm
Academic Advisor Hours:
Mon - Wed 6 pm - 9 pm
College Recreation Center
Office Location: CRC 210
Phone: (360) 867.6770
Office Hours:
Mon - Fri 8:30 am - 5 pm
Sat - Sun Closed
Pool Hours:
Mon - Fri 8 am - 4:30 pm & 6 pm - 9 pm
Sat 10 am - 6 pm
Sun noon - 4 pm
Rec Center Hours:
Mon - Fri 6 am - 9 pm
Sat 10 am - 6 pm
Sun noon - 4 pm
Email: Rec Center