District Office Web Standards
All district office web pages viewable to the general public are required to use a district office template and adhere to the following guidelines. These guidlines are subject to change as web trends and user behavior changes. For more information, please contact the web communications team.
1. Review and understand MCCCD technology resource standards
http://www.maricopa.edu/legal/it/trs.htm
2. Validate all pages
3. Test all pages on target browsers
Mac
Windows
- IE 5.0 +
- Netscape 7.0 +
- Firefox 1.0.4
4. Branding & Logos
- Phase out dist.maricopa.edu and go to maricopa.edu.
- When listing all of the colleges, be sure to include the two skill centers.
- Use “Maricopa Community Colleges,” “Maricopa County Community College District” or “MCCCD.” Do not use “Maricopa Community College District,” “MCCD” or “Maricopa.”
- Use “district office” or “DO.” Do not use “District Support Services Center,” “DSSC” or “District.”
- The Maricopa Community Colleges logo is displayed on the upper left corner of each page. If additional use of the logo is preferred, download an official copy.
- Keep program logos internal or secondary to the Maricopa Community Colleges logo. New logos confuse external audiences.
5. Write for the web (Nielsen)
- Be succinct. Write no more than 50% of the text you would have used to cover the same material in a print publication. Reading from computer screens is 25% slower than print and a majority of people report feeling unpleasant when reading online text.
- Write for scannability. Skimming instead of reading is a fact of the web. Use meaningful rather than cute headings in addition to short paragraphs, subheadings, and bulleted lists. Use highlighting and emphasis to make important words catch the user's eye.
- Practice the inverted-pyramid principle with summary paragraph first, one idea per paragraph, clear and simple topic sentences.
- Avoid metaphors in headings; use humor in paragraphs with great caution.
- Split up long information into multiple pages. Each page should be written in the inverted-pyramid style. In case someone ends up in the middle of your article, each page should make sense and be able to stand alone relatively well.
- ALWAYS spell check and proofread for grammatical errors.
6. Type
- Maximize the color contrast between text and its background.
- Do not use absolute font sizes – use %, but generally no lower than 85%.
- Use web-friendly fonts: Georgia, Verdana, Arial, Trebuchet.
- Use CSS to specify fonts and list several options
(font-family: "Trebuchet MS", Verdana, Helvetica, sans-serif;).
- Contain large blocks of text in about 400px of space or roughly 7 words per line and left-justify only.
7. Links
- When linking to a PDF, MS Word document, or any non-web document type, let people know. It can be an unpleasant surprise, especially for those with slow connections, to wait for another program to open.
- Avoid setting your links to open in a new window. The browser thinks a pop-up ad is trying to open and many of the latest browser versions are set to block pop-ups by default.
8. Applications/Forms/Surveys
- Phase out Cold Fusion and go to PHP/MySQL.
- Test, test and re-test all scenarios.
- Limit constraints and required fields. The easier and more flexible the form, the more likely it will be completed and submitted.
9. Moving or deleting pages
- Conduct a Google search for “link:www.maricopa.edu/yoursite/yourpage.php” to determine outside links to your page. Send a notification that you are moving or deleting the content.
- When moving pages, submit a helpdesk request for an HTTP redirect. This will prevent error messages and get users to your new location quickly. Provide the old URL and the new URL in your request.
10. Drop Down Navigation Menus
Use sparingly. Users want to see all of their options at once.
|
