Accessible Web Designs
A Bobby Building Portfolio

This portfolio of accessible web designs exemplifies Bobby approved designs powering a practical, pragmatic approach to web accessibility and Internet business performance.

Here are links to our projects done with accessible web designs in mind.

Client Projects. For the most part, all Internet business projects listed are ones we have developed for, and in some cases operate on behalf of, our clients. In some instances, we have provided Internet coaching or web consulting services only. Some web sites are still under construction and becoming accessible web designs. Some Internet businesses are no longer operating. Please contact us for the latest information.

Internal Projects. These web site designs (many of them accessible web designs) are ones we have developed and operate for ourselves. We use these sites to promote our services and to carry out experiments in web site development and promotion. Collecting such data firsthand gives us the facts we need to advise our clients responsibly. Call for details.

Accessible Web Design Services

Our services include small business web site hosting with guaranteed results.

We also provide resources for small businesses, especially the Internet home based business, and nonprofits seeking government aid.

Aid is usually government grants and loans, including disability grants, to help finance accessible web site design.

Appearance of a resource on this site does not imply endorsement by Accessible.Org.

Web Accessibility Initiative (WAI) Guidelines

*   indicates required guideline.

** indicates recommended guideline.

<STRONG> means guideline is Bobby verifiable.

Part 1 of WAI guidelines for accessible web designs

1.1 *   Make pages usable without style sheets.

1.2 ** Use style sheets for positioning.

Part 2 of WAI guidelines for accessible web designs

2.1 *   Provide alt text for images and image maps.

2.2 *   Use long descriptions for complex graphics.

2.3 *   Use client-side image maps instead of server-side.

2.4 ** Provide descriptive titles for images used as links.

2.5 ** Do not use ASCII art.

Part 3 of WAI guidelines for accessible web designs

3.1 *   Provide non-script alternatives for scripts.

3.2 *   Allow user to freeze moving or blinking text.

3.3 *   Provide alternative text for applets.

3.4 *   Provide descriptions for applets.

3.5 *   Provide alternative ways for applets to gather info.

3.6 *   Use accessible applets that require user interaction.

3.7 ** Provide descriptions for OBJECTs.

3.8 ** Make scripts and applets keyboard operable.

Part 4 of WAI guidelines for accessible web designs

4.1 *   Provide an associated transcript for all audio.

4.2 *   Provide an associated audio description for all video.

4.3 *   Provide an associated transcript for all video.

4.4 *   Synchronize transcriptions and audio descriptions.

4.5 ** Links to very short sounds have titles.

Part 5 of WAI guidelines for accessible web designs

5.1 *   Do not use HTML structural elements for presentation.

5.2 *   Do not use HTML presentation elements for structure.

5.3 *   Nest headings properly and do not use for formatting.

5.4 *   Do not use the BLINK and MARQUEE elements.

5.5 ** Provide titles for horizontal rules, acronyms, and abbreviations.

Part 6 of WAI guidelines for accessible web designs

6.1 *   Use list elements correctly for list structures.

Part 7 of WAI guidelines for accessible web designs

7.1 *   Provide explicit row and column labels table cells.

7.2 *   Do not use tables to arrange text documents in columns.

7.3 ** Do not use tables for page layout.

7.4 ** Provide alternative pages for tables of text and numbers.

7.5 ** Abbreviate lengthy row and column labels.

7.6 ** Provide descriptive summaries for tables.

7.7 ** Group information into categories for complex tables.

7.8 ** Ensure alt-text doesn't wrap in tables used to position.

7.9 ** Provide alternative contact information for inaccessible tables.

Part 8 of WAI guidelines for accessible web designs

8.1 ** Provide link text that makes sense when read out of context.

8.2 ** Provide non-link, printable characters between lists of links.

8.3 ** Provide keyboard shortcuts for links.

Part 9 of WAI guidelines for accessible web designs

9.1 *   Provide a no-frames alternative for frame documents.

9.2 *   Do not allow an image or object to appear directly in a frame.

9.3 *   Provide titles for all frames.

9.4 ** Describe the layout and purpose of frames.

Part 10 of WAI guidelines for accessible web designs

10.1 ** Do not use image maps to create graphical submit buttons.

10.2 *   Associate a label explicitly with its control.

10.3 *   Provide alternative text for images used as submit buttons.

10.4 ** Specify a logical tabbing order for forms.

10.5 ** Group related controls.

10.6 ** Label groups of controls.

10.7 ** Group menu options.

10.8 ** Provide default, place-holding characters for edit boxes and text areas.

10.9 ** Provide alternative information for submitting forms.

10.10 ** Provide keyboard shortcuts for form elements.

Usable Website Design Services

1. Make a Good First Impression
1.1 Simple address URL
   • A domain name simple enough to tell a person at the bus stop
1.2 See title immediately
   • see something almost immediately
   • show the selling message now
   • show objective or Unique Selling Proposition
1.3 See substantial text content in eight seconds
   • avoid using images for text
1.4 Attractive
   • make each visit a pleasurable experience

2. Present a Friendly Image
2.1 Show key info above the fold
   • only 30% of visitors will scroll down the page
2.2 Easy to read
   • avoid lines of text too long for easy reading
   • ensure contrast between text and background
   • appropriate fonts and sizes
2.3 Images are useful
   • Images should contribute to the content and not be just decoration
2.4 Images to have ALT= and be sized
   • in case the visitor has his images turned off
   • or the internet is slow
   • explain what this picture supposed to tell
   • images must be sized for speed of loading and avoid juddering of the page
2.5 640-display friendly
   • horizontal scrolling is a no-no
   • must contract elegantly for visitors with small browser windows
   • or computers with small displays
   • or visitors who have opted for larger fonts
   • ensure frames allow enough space for meaningful text
2.6 Printer friendly
   • 640-friendly applies here too.
   • mixed text light-on-dark on same page as dark-on-light will not print
   • if printing is important, use tables so that page breaks will occur correctly
   • avoid frames unless absolutely appropriate as they are deficult to print
2.7 Technically Sound
   • works with IE and with Netscape
   • avoid spelling mistakes, poor punctuation, poor grammar
   • no broken or missing links
   • no 'under-construction' pages

4. Provide Useful Content
4.1 Clear Objective
   • what is the website trying to sell me
   • how will it make money for the owner
4.2 Clear target audience
   • who will want to look at this site
   • what age group
   • appropriate tone for the target audience
4.3 Clear target area
   • what geographic area are we talking about
4.4 Quality content
   • there is some meat in there
   • Educational, Entertaining, or Expedient way of presenting the product
   • something which will encourage visitors to come back
   • a source of reference information or useful links
4.5 Good Organisation of content
4.6 Regularly updated
   • it must be current
   • no out of date items
4.7 Useful links
   • links to useful information add credibilty

5. Offer Content Appropriate for the Audience
5.1 Appropriate style and tone
5.2 Access for disabled
   • if appropriate, according to Bobby rules
5.3 Easy order-processing
   • E-Commerce sites to obey accepted rules
   • provide clear security for On-Line Payment

6. Provide Clear Contact Information
6.1 Branding on every page
   • consistent headings to give brand image
   • consistent layout of pages for each topic
   • show domain name URL to reinforce image
6.2 Contact Email on every page
6.3 Name, address, phone
   • why have a website if it is difficult for your visitors to contact you?
6.4 Name, Address, Telephone, Fax, Email all on the homepage
   • or if complex, very clear links to the contact page

7. Be Search-Engine Friendly
7.1 Good META statements
   • useful and descriptive TITLES on all pages
   • correct METAs at least on the first (index) page
7.2 Clear text with keywords
   • text on the homepage shows key words
7.3 Clear text links
   • clear links to other pages

Return to the home page from
this "accessible web designs" page.