In my experience dealing with Accessible Web Design concepts has been to think carefully of the real meaning of "Universal Design = Universal Access". What I discovered is that to make a web site accessible essentially means moving the stress from how to make a pleasant HTML document to how to project useful HTML document in which structure and presentation are well distinguished and conveying contents is layout independent.

As Mr. Chuck Letourneau (Starling Access Services c 1998, 2000 - last update February 29, 2000) wrote in his article concerning how to make a site inaccessible, "... it makes a great deal of sense to maximize the accessibility of any site to ensure that no potential customer, client, or visitor is going to be excluded."

And he wrote also "...By "any Web browsing technology", I refer to the complete range of current and legacy technology, such as mainstream graphical browsers (such as Microsoft Internet Explorer and Netscape Navigator), text-only browsers (such as Lynx), and specialty browsers (like pwWebSpeak for people with blindness). The Web can also be browsed with emerging technologies like mobile computing systems (used hands-free and eyes-free), pocket-size display units (like cell-phone and pager displays), or other small, non-graphical input and output devices."

So, another aspect of making Web we have to pay attention to is the interaction with the most recent technologies.

Authors who design pages with accessibility issues in mind will not only receive the blessings of the accessibility community, but will benefit in other ways as well: well-designed HTML documents that distinguish structure and presentation will adapt more easily to new technologies. ( Introduction to HTML 4.0 W3C Technical Report pages) .

In my speech, I'll try to state some remarks, that from my point of view, could be useful to obtain accessible web pages.

• Use only standard HTML elements and attributes and validate them after creation (e.g. Blink or Marquee tags are NOT standard elements)
• Don't use HTML elements like H1-6, TABLE, UL, OL, BLOCKQUOTE, CITE, etc. to enhance the visual display of your page instead of using a style sheet. (e.g. Don't put everything in a table just because you're trying to control widths. Tables are for tabular data, not for layout and don't forget there are special markup to use for displaying large complex data tables - spreadsheets).
• Don't use colors and fonts as unique way to convey information.
• Avoid misuse or forget to use attribute like alt-text and title. All <IMG> tags must have USEFUL ALT-text, and be navigable even without pictures.
• If it is possible don't include text in more than one language in one given page and use appropriate lang attribute where it is necessary (e.g. Used in an appropriate way, the Lang attribute could allow speech synthetizers to switch from a language to another)
• Don't use Frames. Pages that are designed with HTML frames without special markup to open a series of fixed or varying information windows often cause substantial navigation difficulties not only to the users without frames-capable browsers (as text browser, WAP and WML technology or WebTV users) but also to the users with visual disabilities. If you cannot move from a frame based architecture to a better solution, you should anyway include an alternative layout inside a NOFRAMES element (e.g. To help blind users and not Netscape or IE last version user navigate between frames, it is worthwhile to create a separate text file that describes the layout and purpose of the FRAME or IFRAME element. This should be in addition to the TITLE attribute on each FRAME and using the LONGDESC attribute of both elements or a D (descriptive) link. )

CSS benefits accessibility primarily by separating document structure from presentation. Style sheets were designed to allow precise control - outside of markup - of character spacing, text alignment, object position on the page, audio and speech output, font characteristics, etc. CSS allows users to override author styles. This is very important to users who cannot perceive a page with the author's chosen fonts and color. CSS allows users to view documents with their own preferred fonts, colors, etc. by specifying them in a user style sheet. CSS provides support for automatically generated numbers, markers, and other content that can help users stay oriented within a document. Long lists, tables, or documents are easier to navigate when numbers or other contextual clues are provided in an accessible manner. CSS supports aural style sheets, which specify how a document will sound when rendered as speech. Aural style sheets (or "ACSS" for short) allow authors and users to specify the volume of spoken content, background sounds, spatial properties for sound, and a host of other properties that can add effects to synthesized speech analogous to those achieved with styled fonts for visual output. CSS provides more precise control over the display of alternative content than HTML alone. CSS2 selectors give access to attribute values, often used to provide alternative content. In CSS2, attribute values may be rendered in a document along with an element's primary content. ( How Style Sheets Benefit Accessibility WAI - W3C Notes) .

• Organize documents in order to make them readable without style sheets. For example, when HTML document is rendered without associated style sheets, it must still be possible to read and to understand the document.
• Use style sheets instead of HTML markup, to control colors, fonts, and the position of text, images, and objects (e.g. you shouldn't have FONT, or ALIGN, etc. markup in your document)
• Use standard HTML element name to create your main Style Sheet definition: e.g. define your specific value for element H1 and call it H1 instead of "maintitle" or other invented name. In this way you will write the appropriate HTML element H1 (main header) as it has to be in the web page, accessible to everyone with identical meaning, but at the same time, you will obtain the wanted layout effect.
• Don't use absolute pixel widths for anything that isn't in pixels, for instance, pictures.
• Don't use absolute widths for tables, table elements, frames, or anything textual.
• Choose font family name widely supported (e.g. as Apple and IBM compliant Sans Serif and not Sans Serif are rendering them differently)
• Don't use color `names' instead of RGB values (e.g. use #666600 instead of "olive green")
• Do not rely upon subtle color shadings to convey information. Color is not absolute so if one has to use lots of colors, it would be necessary to invest some time in choosing a `web-safe color palette'. Combinations of 00 33 66 99 CC FF in RGB values (e.g. #CCFFFF) provide the widest platform compatibility for color but even so you have to validate your choice using specific tools through which determining what color combinations are most suitable and how to combine efficiently for everyone three perceptual attributes of color: hue, lightness and saturation.

Following these few remarks could be, of course, a new approach to web sites making and, again thinking in terms of universal design could be, at the beginning, harder than working in the usual manner. Maybe we should spend some of our time on refreshing our HTML concepts knowledge but after that we could offer our information to a really enlarged public.

Some editor for HTML and CSS

• Amaya. W3C's Editor/Browser Amaya is a browser/authoring tool. It is used to demonstrate and test many of the new developments in Web protocols and data formats. Given the very fast moving nature of Web technology, Amaya has a central role to play. It is versatile and extensible and is available on both Unix and Windows '95/NT platforms.
• A-Project Accessibility Prompt Toolkit. It is not a complete program by itself but rather a module that is embedded within an HTML editor program.
• Balthisar Cascade. a Style Sheet CSS2 editor including ability to work with different media, from the normal computer monitor to a loud-speaker.

Some references about how to combine well fonts and colors

• Lighthouse International - Making text legible
• Lighthouse International - Effective Color Contrast
• ATRC Toronto University - Color readability test
• RGB Hex Triplet Color Chart

Some tools to validate HTML pages and CSS

• W3C HTML Validator
• W3C CSS Validator
• WDG - CSSCheck

WAI List of Checkpoints and some evaluation and repairing tools

• W3C -WAI List of Checkpoints
• W3C - list of tools
• Lynxview
• CAST - Bobby
• W3C Tidy
• NCSA - TOM The Text-Only Maker

About the new generation of Java API and tools developed by SUN, IBM, etc

• SUN - Java Accessibility
• IBM - Java Accessibility toolkit
• Microsoft Web Accessibility Guidelines

Bobby Approved Symbol. A friendly uniformed police officer wearing a helmet displaying the wheelchair access symbol. Words "Bobby Approved v3.2" appear to his right. Links to "http://www.cast.org/bobby".