| Category |
Goals |
Specifications |
| Navigation |
- Quick access to all pages and files
- Multiple paths to a file (hierarchical/web hybrid)
- Easy to update, maintain, restructure, add content
- Titles and footers on every page
- Easy to get back home or to contents pages
- Accessible to browsers without displaying images
- Works for most popular screen resolutions
- Easy access to frequently used information
- Navigation elements take up little screen space
- Details of linked pages
- No independently scrolling frames
- No pull-down menus
- Works on any hosting service or disk
- Distinguish navigation and content
|
- Link to home in upper left corner of every page
- Top-level navigation using iframe height=70 at top of every page
- Second-level navigation using iframe width=120 on left margin of every
group of pages
- Home page contains links to most popular features
(resume, activities, random photo and document, this document)
- Navigation iframes can contain links to both indexes and content pages
- All links to index pages (including Home) should be indicated using
boldface
- All images should use alt attributes
- JavaScript generated headers (titles) and footers, but minimize
JavaScript
- All links in navigation frames use title attributes (Windows tool
tips)
- Use CSS, DHTML and JavaScript to highlight iframe link that matches
current page
- Use JavaScript to hide or show navigational iframes?
- Use a black border around the content
|
| Appearance |
- Consistent look and feel on every page
- Clean, bright, precise, serious, enjoyable
- Look and feel combines Africa and technology
- Easy to read text
- Thumbnails small but identifiable
|
- Stylesheets and relatively clean, standard, browser-independent XHTML
- Page body uses black text on white background
- Navigation frames use black text on gray background
- Link colors blue and purple
(default)
- Borderless table of colored stripes appears in upper left corner
- Headings H1-H4 use bold, wide, sans serif font (e.g. Century Gothic)
- Body text uses sans serif font (e.g. Verdana)
- Use embedded thumbnails to illustrate individual pages
- Images/thumbnails should be 640x480/128x96 or less
- Home page includes a random photo with link to more
|
| Files and Folders |
- Combine hierarchical and web structure
- Broad rather than deep
- Clear, consistent, expandable file and folder naming
- Fit all files on a free web hosting service (<20 MB)
- Keep individual and total file sizes small
- Pages download fast
- Clearly indicate download file sizes and contents
- Keep only the best content
|
- All file and folder names in all lowercase, underscores not spaces
- Index pages named index.htm; inline frames named iframe.htm
- Store all photos in one folder; thumbnails in thumbs folder
- Create a document database with search and sort features
|