Web Best Practices
Navigation and Linking
It all comes down to the label!
Finding what you're looking for may be the most crucial part of a positive online experience. There is one, singular, top, ultimate (you get the idea) way to make navigation intuitive. Simply - call it what it is.
When a visitor clicks a link, their assumption is always that they will get another webpage that is internal to the subsite they're in which contains the information the link implied. In any case where this assumption is not correct, tell visitors clearly what they can expect when they click.
1) Tell them "you're going to get something other than a webpage" by ending links that open a file with a clear label such as (PDF).
2) Tell them "you're about to leave this subsite" by organizing external links in a "related links" section. Or opening the new page in a new tab or window.
And always, fit the label to the content or fit the content to the label.
|
|
||
|
|
|
|
|
|
||
|
|
|
|
|
|
Do not use all caps in the main body copy area - using caps lock online traditionally signifies shouting |
|
| LET THE STYLE SHEET TAKE CARE OF THESE | ||
|
|
Do rely on the style sheet to dictate text font – some fonts are not universally available and will automatically be replaced with a universal alternative, or worse yet, show up as: ccccccc |
Do not change font or font size or font color |
| Font Color |
Do rely on the style sheet to dictate text color black text on a white background is easiest to read and most accessible (notice how hard the example is to read?) |
Do not change font color |
| Text justification |
Do leave text left-justified by default page titles may be centered |
Do not change justification |
Content Management
iComm works with content contributors from across campus to create a user-friendly, attractive website. The goal of this partnership is to market the university with a consistent identity that reflects the UW-L brand and is capable of reaching campus' strategic goals.
iComm handles all functions of content management support, training, site administration and development.
iComm's campus clients are the subject matter experts and primary content contributors for their designated web pages. iComm collaborates with content contributors on content planning, as well as offering tips and tricks for improving the visitor's experience.
6 C's of quality Web content
If you want to improve your website's content, keep these six qualities in mind. They're based on the "7 Cs of Communication*," reworked for communicating online.
|
|
|
| Considered |
Good web content shows that its purpose and target audience have been considered. You know what your visitors need, and you provide it. The content speaks the language and at the level of its audience not its author. It is approachable and relevant. Text, images and links all enhance to the purpose of the page. |
|
|
The structure is clear and logical easily understood at a glance. Headings and links are meaningful. Text is easy to scan and comprehend. The main task is obvious and clearly supported. |
| Concise |
Good content gets straight to the point. Readers dont have to skim over fluff, introductions or welcome messages. Basic rule: if you think it's good cut it in half! |
| Concrete |
Good content provides concrete and useful information that helps the visitor accomplish a task like facts and instructions. |
| Chunked |
Good web content is chunked. It can be scanned for basic meaning which invites a closer look. Related chunks of information are grouped and presented in a parallel manner. Your readers find it easy to skim over the page to find the information they are looking for. |
| Correct |
The content has been reviewed and proofread. There are no spelling or grammatical errors. The links work. Information is up to date. |
*For the curious - the original 7 Cs are: Clear, Concise, Concrete, Correct, Coherent, Complete and Courteous
The above is based on information found here.
Formatting best practices
Writing:
| BEST PRACTICE | DO | DO NOT |
|
Text is meaningful, useful and up-to-date |
Do write with the target audience in mind Do create content expiration reminders for yourself try using Google calendar |
Do not use acronyms, jargon or slang Do not leave old information up, especially dates |
|
Text is minimal |
Do remove all but essential words - no "fluff" Do limit words per page to 250-400 |
Do not treat websites like prose or academic writing - think flier or billboard |
|
Text is organized and written in a consistent way |
Do make the transition from page to page smooth Do choose one "voice" and stick to it |
|
|
Text is "written for the web" |
Do chunk text using headers, which are easy to scan Do use bulleted lists, which make information easier to digest Do use numbered lists, which are good for explaining steps Ideal web content is written at the 10th grade level |
Do not present lists in the form of a paragraph |
|
Text is free of typographical, grammatical and contextual errors |
Do use spell check Do have someone else review the site Do check facts first |
Do not publish text someone else wrote without reviewing it first (even bosses makes mistakes) |
|
Text provides links to other useful sites |
Do embed (3-5) links to relevant information within the content area - think Wikipedia! Do set links to open in a new window if they take visitors off site |
Do not rely on the left navigation to house every link Do not recreate information - link to it - especially if it is on www.uwlax.edu Do not use the words "click here" as linked text |
Images:
| BEST PRACTICE | DO | DO NOT | ||||||||||||
|
Images are only used to enhance meaning |
Do embed images that add context to the site |
Do not add images for decorative purposes only
|
Images are accessible
|
Do not apply an alt tag to every image so screen readers can "see" them
|
Do not use images that are more than 25% text - alt tags should not include that much information
|
Images are free of copyright liability and legally obtained
|
Do contact iComm for help with selecting or purchasing images
|
Do not use images obtained via image search - most are copyrighted and therefore illegal to use without permission
|
Images are optimized and do not slow load time
|
Do resize images before uploading them Always set image resolution to 72 dots per inch (dpi)
|
Do not distort an image's proportions, making it short/fat or tall/skinny
|
Images are authentic
|
Do use UW-L photos which depict real people, place and things when possible Do contact University Communications about photo availability
|
Do not stock photography exclusively Do not use traditional clip art |
Effective subsites don't stand out, they fit in.
Consistency is a very important part of successful web design. A consistent website embraces the "don't make me think" mentality.
A site that offers the visitor an expected, fluid experience will improve the good will of the visitor, which increases follow-through on whatever calls to action it's trying to produce.
Current style sheets and templates
Style sheets and templates control the look and feel (formatting) of uwlax.edu and provide the consistency necessary for successful web design. UW-L's style sheets and templates have been carefully developed with all the site's visitors in mind.