Home

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:

upa25.gif    upa35.gif     upa50.gif    upa100.gif

2. There is a small image with three blocks to use as a divider:

upadivider.gif

3. There are individual blocks which can also be used to call attention to items.

block-green.gif

Usability Resources UPA Store UPA Chapters UPA Projects UPA Publications Conferences and Events Membership and Directories About UPA