Tutorial: Building Accessible Static Navigation with CSS

STC member, Frank M. Palinkas, has developed a new Fast Track tutorial, which is free to the technical writing, user assistance, accessibility and web design communities. The tutorial was presented at the 2008 WritersUA Annual Conference in March at Portland, Oregon. This tutorial demonstrates how to create the accessible, static Navigation section on the left side of each web page in the tutorial using Microsoft Visual Studio 2005 Source Code Editors. The objective is to build
* a valid, semantic, navigation Structure layer according to current web standards;
* a valid navigation Presentation layer to accompany the structure layer;
* full accessibility for all users in the structure and presentation layers;
* static navigation without employing the Behavior (unobtrusive DOM/JavaScript) layer (i.e., expand/contract).

View the tutorial, which is available on the eServer TC Library: http://tc.eserver.org/dir/Design/Web-Design/Accessibility/CSS

Frank authors all markup, presentation, behavior code and content using Microsoft’s Visual Studio 2005 Team System IDE source code editors for XHTML, CSS, and Unobtrusive DOM/JavaScript. The CSS is the CSS 2.1 Liquid Box Model for layout/presentation. Frank built fully accessible static navigation for mouse and keyboard into every web page. Each Web page illustrates the complete separation of Structure/Content (XHTML), Presentation (CSS), and Behavior (Unobtrusive DOM/JavaScript), the semantic nature of the content/markup relationship, and the application of accessibility attributes and values according to the U.S. Govt. Section 508 Rules of the ADA and the W3C Web Content Accessibility Guidelines 1.0 – Level Double A.

Frank is an American, working in South Africa as a Senior Technical Communicator/Web Standards and Accessibility Designer, and holds the following concurrent Microsoft Certifications: MCP, MCT, MCSE and MCDBA. He also holds the Microsoft Most Valuable Professional (MVP) award in the Windows Help product area. His technical writing incorporates web standards, accessibility, and semantics. He uses Helpware FAR HTML for the creation of MSHelp1 and MSHelp2 documentation packages and executables.

More of Frank’s Fast Track tutorials are available on his Opera Developer’s website and on the Dev Opera site.

Print Friendly, PDF & Email

Fellow of the Society for Technical Communication. STC member since 1974.