Projects: Web Maintenance and Design
Authoring Style Guide
This page contains guidelines and resources for authors of pages on the UXPA web site.
Page Headings
The top page header contains the section identification, matching the entry in the left menu
Tab Name: Section Name
Examples:
About UXPA: Membership
Usability Resources: Usability in the Real World
The second level heading contains the title of the current page.
- The page title is also a left menu item, if the page is in the menu
- On the home page of a section, the first level heading should match the menu item.
Page Title Tag
Construct HTML page titles so that they will read well in a search results or favorites list:
Page Name - UXPA Section
or
Page Name - Section - UXPA
Use the exact text of the page title, but use judgement to edit for better readability and findability. For example
"UXPA Official Policies" instead of "Official Policies - About UXPA Leadership"
File Names
- When creating a group of image files, be sure the "group" word comes first, so they will be listed together in the assets list (e.g., "block-green.gif" and "block-orange.gif" not "green-block.gif"
Vocabulary and Spelling
American English vocabulary, spelling and other usage is used on this site, except:
- In direct quotes or web postings of published articles
- In citing the title of a publiction.
Note that this means that the title of the ISO13407 standard is "Human-centred..." but that everywhere else, human- or user-centered is spelled in the American style.
Other common problem words are:
- Internet and Web are normally capitalized, except when "web" is used as a modifier (web organizations). Web site is two words
- Email is a single word, written without a dash.
- Don't forget the apostrophe in "Usability Professionals' Association"
Images
Use of Pictures
Images - photos, drawings and other pictures - are encouraged, especially on opening pages.
- The maximum image width should be 450 pixels. If the image is too wide, it can force the page layout template to push the content area below the menu.
- Be sure that you have rights to use any images and give proper credit.
- Include an informative ALT tag.
Bullets and Icons
There are a number of small images available for use as bullets or icons. Note that the orange triangle is automatically inserted by the stylesheet for a standard list bullet. All of the common images are stored in the assets\images directory, and can be used by selecting "Insert Image From Website" and browsing to this directory.
1. There are four sizes of the UXPA blocks to use to indicate a UXPA event, UXPA-sponsored event, or to identify a UXPA resource in a list of resources:
2. There is a small image with three blocks to use as a divider:
3. There are individual blocks which can also be used to call attention to items.
