WCAS Web Standards

Created: September 6, 2001
Last Revised: April 23, 2007

Compliance

Northwestern University's Web Standards exist to facilitate consistency, usability, and to promote standardized University branding across web sites University-wide. University branding allows visitors to recognize immediately a web page's affiliation with Northwestern University. Weinberg College of Arts and Sciences seeks compliance with the Northwestern and the WCAS web standards across all department and program web sites associated with WCAS.

• Standardized Tools
• General Standards
• Design Standards
• Printing Considerations
• Footer Standards
• Standards for Listing E-Mail Addresses
• Content Accessibility Standards
• Publishing Guidelines
• Content Management Guidelines
• Copyright Guidelines
• Testing Guidelines
• Resources

Standardized Tools

• Macromedia Dreamweaver MX 2004, Dreamweaver 8 (or above), or Contribute 3 (or above) must be used for all web page creation and editing. Designers should make use of Dreamweaver Templates to control the design, Dreamweaver Library Items for the footer, navigation, and other common elements, and style sheets (CSS) to control the presentation.
  
  
• Adobe Acrobat 5.0 (or above) must be used to create all PDF files. Note: Previous versions of Acrobat have poor accessibility compliance. With version 5.0 of Acrobat, Adobe has greatly improved accessibility.

Note: We understand that many web editing tools exist and that each person may have their own favorite. However, the time and effort required to decipher and correct HTML created by other tools is greater than our resources can or should handle. Furthermore, in addition to its ease of use and standardization, it also has a built-in accessibility checker.

[back to top]

General Standards

• On every web page, the following three things should be immediately apparent to the visitor:
  • their specific location within the site
  • what is the most important/relevant information on that page
  • where they can go from there.
    
• The home page should include links to the WCAS home page and Northwestern home page near the top
• On each page, the navigation should include a link back to WCAS home page.
• You must ensure your web content is accessible to people with disabilities. To accomplish this, you should do the following:
  • Review the W3C guidelines
  • Use Dreamweaver's accessibility checker on every web page you create
  • Adhere to Northwestern's Content Accessibility Standards (outlined below)
• As Jakob Nielsen, the guru of web usability, writes: "Frames: Just say no!" Using frames inhibits accessibility and is strongly discouraged.
• Underlining text should be avoided, except in links.
• Meta tags should be used on the department home page

[back to top]

Design Standards

• The hexadecimal HTML color code for the Northwestern purple is #520063
• Graphical buttons (if you use them) should be between 1 and 4K each.
• Graphics/icons/photos should not exceed 15 to 20 K in size (each).
• Total web page file size (HTML file + the file size of all the graphics on that page) should not exceed 70K.
• We recommend using a tool like Fireworks or Photoshop to optimize your graphics for the web.
• Try to avoid using icons or clipart for navigation (e.g. while the "thumbs up" hand gesture means "good" to us, it carries a very offensive meaning to people from some other countries).
• Web pages should not be wider than 740 pixels.
• Although height varies according to content, every effort should be made to avoid or minimize the need to scroll.
• Avoid complicated HTML code.  Over time complicated code becomes more difficult to maintain.  Take this into consideration before making use of the latest browser features.
  

Printing Considerations

Different versions of browsers print web pages differently. Safari 1+ and Firefox 1+ will scale a printed image to the size of the paper. Internet Explorer 6 will crop a page at 670 pixels. Pages that may be printed should not exceed 670 pixels or should be able to collapse to 670 pixels (i.e., if a table's width is set to 740, the last 70 pixels will be cropped when printed).

[back to top]

Footer Standards

Each web page should have a footer that contains the following information:

• A link back to Northwestern's home page (logo)
• A link back to the WCAS home page (logo)
• The name of the creating entity
• Contact information (name, phone number, e-mail address, street address)
• Date of last revision
• Links to the Northwestern disclaimer and policy statements
• Copyright notice

Here are some examples of the standard WCAS Footer:

[back to top]

Standards for listing e-mail addresses

All staff and faculty email addresses should be listed in the proper format (i.e., a-jones@northwestern.edu). The departments can decide whether the e-mail addresses are going to be listed as links or just text.

[back to top]

Content Accessibility Standards

Northwestern strives to adhere to Section 504 of the Rehabilitation Act of 1973 and the Americans with Disabilities Act. These acts ensure that Northwestern Web pages will be readable by users with disabilities, whose must rely on assistive technology (screen readers, text-to-Brail devices, etc). Northwestern strives to adhere to the Web Content Accessibility Guidelines of the World Wide Web Consortium (W3C).

Some basic guidelines for accessibility include:

• Provide text equivalents to all nontext content.
  Images, movies, sound files, applets, etc., may not be accessible to all users. Providing a description of all such features in an ALT text attribute allows you to convey to all users the content and meaning of your page. For example:
  
  <img src="picture.jpg" alt="Northwestern University Library">
  
  If your nontext content is dynamic, make sure that equivalents change with the nontext elements. If your page cannot contain text equivalents within it, consider create a parallel text-only version of the page.
  
  
• Make sure that text and graphics are understandable without color.
  People who cannot differentiate between colors or who are using devices with noncolor or nonvisual displays will not receive or understand information that relies on color for its meaning. Also take care in choosing backgrounds that contrast with page text and don't interfere with readability of content.
  
  
• Do not use frames/iframes for navigation.
  Frames and iframes are not universally accessible. Also, the content of frames may not be searchable by search engines.
  
  
• Avoid using server-side image maps.
  Navigation of pages using server-side image maps require a mouse and are therefore inaccessible to the blind. If used, provide a link to an alternate text version or summary.
  
  
• Describe links.
  Instead of denoting a link by the words "Click here" or similar phrase, be descriptive when providing links; for example: further information from the W3C on Web accessibility. Also consider allowing such links to stand on their own line or to provide an ordered or unordered list of links in HTML.
  
  
• Use headings and lists to organize your page and reinforce consistent page structure.
  When possible use mark-up language rather than images or visual cues to emphasize the structure of your page. Organize documents so they may be read without style sheets. For example, when an HTML document is rendered without associated style sheets, it must still be possible to read the document.
  
  
• Use language that is as simple and clear as possible.
  
  
• Test pages in multiple browsers, operating systems, and connection speeds.
  See testing (below).
  
  
• Provide alternate routes to information when using interactive technologies.
  Pages that use Flash, Shockwave, or other interactive elements may not be accessible with older browsers. Provide a link to a text-only or non-interactive version of the information.

[back to top]

Publishing guidelines

If you do have someone in your department dedicated to updating the content on your Web site, request web server access from Weinberg Web Communications at web@wcas.northwestern.edu.

Once you have ensured all pages/links are working properly, contact Weinberg Web Communications Manager for final page pre-launch review, approval, and publishing.

[back to top]

Content management guidelines

The WCAS offices and departments hold primary responsibility for the accuracy of their information on the WCAS Web sites.

The Weinberg Web Communications Manager is responsible for confirming the authority of any person submitting content on behalf of a WCAS office or department for publishing on any sites under the umbrella of WCAS. Any office or department with questions about publishing content on the Web may e-mail web@wcas.northwestern.edu or visit the Contact Us page.

[back to top]

Copyright guidelines

It is a good idea to remind users that your work is protected. Therefore, the following copyright notice should be included somewhere on every Web page you publish:

Copyright © 2007 Northwestern University. All Rights Reserved

The © copyright symbol is the standard identifier of a copyright notice and is required in many foreign countries to ensure copyright protection. In the United States, however, the word "Copyright" may be substituted for the symbol.

The year of publication must be included in the copyright notice.

The name of the copyright owner must be included in the notice. Generally, individual creators own the copyright for the original material they publish. However, employers usually hold the copyright for work done by employees in the course of employment. Therefore, unless otherwise specified by contract, the owner of the copyright for Web pages published at Northwestern should be Northwestern University (and not the individual creator, a department, or a school).

Including the phrase "All rights reserved" ensures broader international protection of your work.

[back to top]

Testing guidelines

• Test all links on every document, as well as layout/readability on both PC and Mac platforms, both with monitors set to 800 by 600 screen resolution.
  • Northwestern's supported browsers are Internet Explorer 6+ (PC), Safari 2+ (Mac), and Firefox 2+ (PC and Mac)
• All pages should be checked for accessibility using (at least) Dreamweaver's Accessibility Checker.
• Focus groups/user testing is strongly encouraged when possible.

[back to top]

Resources

• Dreamweaver, Contribute, Acrobat, and Fireworks
• The Northwestern Web Standards Handbook
• Copyright resources
• US copyright office
• The Public Domain in the US
  
• Usage Request form (PDF)
• Photo Release form (PDF)

[back to top]