Best Practices
Information Architecture
The Information Architecture (IA) of a website is the organization of the website. You can think of it as an outline. It organizes all the of the pages of the your Website into sections and subsections. It allows us to be aware of all the pages that exist on a website, reduce redundancy, and improve the overall management of content. IA makes it easier for website visitors to find what they’re looking. With a good IA, a user can navigate to any place they need to go.
Vertical Scrolling
The most important information should appear near the top of your page. However, screen resolution and browser viewport dimensions vary from computer to computer. All of your information does not need to fit "above the fold". Generally, users expect to scroll and it is best to meet user expectations.
Accessibility
Accessibility on the web is a legal requirement and a social issue. There is a misconception that the main focus of web accessibility may be people with permanent or long-term disabilities, but accessibility benefits people with or without disabilities.
- Build document structure using heading styles
- Ensure hyperlinks are self-describing (not the full URL and “click here”)
- Use built-in menu options to create lists and other formatting
- Keep table structure clear and simple
- Use sans-serif fonts such as Arial, Tahoma, or Verdana at a minimum of 12 pt. size
- Ensure adequate color contrast and never use color alone for emphasis
- Add alt-text for all non-text objects
- Ensure video content has accurate captions
- Ensure audio content has an accurate transcript
Learn more about Web and Digital Accessibility
Navigation and Links
- Differentiate linked text from unlinked text.
- Make link text work in context.
- Make it scannable (that is, make it work if not out of context, then without the context of the sentence that includes it).
- Keep it short but predictive of what users will get when they click.
- Put the words related to that prediction at the start of the link text.
Writing for Web
- Put your most important information first.
- Be brief and direct. Write short paragraphs and minimize unnecessary words.
- Group content with headings for users that scan the page.
- Write clear links that explain what the user is clicking on. Do not create links that use the phrase "click here".
- Don't use your space or time for welcoming people. They are looking for valuable content and answers.
- Bulleted lists are preferred. You can link to longer pages that have more details if you use this technique.
- Use essential, meaningful sub-headings.
- More tips on writing on the web
Images for Web
Web images should be saved at a lower quality and be optimized for web.
Images should never be used as text nor should text be on an image. If you feel you need to put a title on an image the font should be 26px or larger in order to be legible when the image is scaled down on a mobile phone device.
All images should include a description or "alt-text" to make the image readable to those who use assistive technology such as screenreaders.