Articles

A Web For Everyone: Creating Accessible Planning Websites


Figure 2
Planetizen's home page when viewed using Lynx.

Figure 3
Planetizen's home page when viewed using IBM's Home Page Reader.

Is your website accessible to people with disabilities?

If you're like most of us, you're not sure if your website is accessible or what it means to have an accessible website.

Effective June 21, websites run by federal agencies must be accessible to individuals with disabilities. This new law, commonly called Section 508, is expected to be the technology equivalent of the 1990 Americans With Disabilities Act (ADA). The ADA legislation authorized the Department of Justice to certify that local building codes and ordinances meet accessibility requirements for new construction and alteration; it has had a dramatic impact on the built environment and the role that planners play in ensuring that physical structures are accessible.

Section 508 of the Rehabilitation Act of 1998 requires that all federal agencies that develop and use information technology ensure that "members of the public with disabilities have access to and use of information and data, comparable to that of the … members of the public without disabilities." [Italics added]. The legislation also extends this requirement to all private contracts for technology products and services for the federal government. The assumption is that state and local governments will eventually adopt, either through statute or informally, the requirements of the federal Section 508 for their own websites and technology.

Five Technologies

Planners are increasingly using information technology to provide information and engage citizens in the planning process. Consider how the five fastest-growing and important urban planning technologies would be delivered to someone with impaired vision.

  • Web-based mapping. Many planning departments are creating web-based geographic information systems to enable citizens to research parcels and land-use patterns. For example, the Neighborhood Knowledge, Los Angeles (nkla.ucla.edu) project at the UCLA Advanced Policy Institute maps code violations, liens, and other community indicators on a web-based map so community residents can evaluate early-warning signs of neighborhood deterioration.
  • Online community plans. Planning departments are providing planning documents and general plans on their websites to facilitate online discussion. Lenexa, Kansas, used the web as the primary vehicle to publish its comprehensive plan, saving money and increasing citizen participation.
  • Virtual reality. This technology allows participants to see-in three dimensions-what a proposed place will look like. For example, the Urban Simulation Lab at UCLA has mapped much of downtown Los Angeles so realistically that you can see graffiti on the walls as you drive through in a live computer simulation.
  • Planning support systems. This new and rapidly growing area of planning uses land-use modeling to allow planners and citizens to make assumptions about land-use goals and visualize the development of these alternatives over time. Examples include CommunityViz (www.orton.org), Index (www.crit.com), and WhatIf? (www.what-if-pss.com).
  • Handheld devices. With more than 12.5 million handhelds, such as Palm, Handspring, and Windows CE, in use by the end of 2001, handhelds are becoming a popular way to collect and distribute information. The Los Angeles Housing Department is testing a handheld system that allows inspectors to collect building inspection data on a handheld device.

Building a website and making information available online is the equivalent of building a technology infrastructure. It is every bit as real as building physical infrastructure like roads and bridges.

What would happen if you permitted and built City Hall with no elevators, ramp access, or other features to allow access for the disabled? Had these features been designed into the building from the start, the costs would have been nominal. However, the cost to go back and retrofit the building will be significant.

If we continue to build websites without considering whether and how the information we are publishing is accessible to people with disabilities, there will be dramatic costs to retrofit our technology infrastructure in the future.

Who needs accessible websites?

About 20 percent of the U.S. population has some kind of disability. Visual, hearing, mobility, and cognitive impairments can affect web usage. About 10.4 million people in the U.S. are blind or have a significant visual impairment, another 9.2 million people have limited vision, and one in 10 males are color-blind. A growing number of senior citizens are using the Internet, and have their own unique needs for web accessibility.

Assistive technologies already exist that provide web access to persons with disabilities. For example, people who are blind can access the web using "screen-readers" that convert the text on a webpage into synthesized speech. But persons with disabilities are not the only ones to benefit from accessible websites. In addition to removing barriers to information for those with disabilities, a website designed for accessibility results in a better overall design. Persons using older computers or software, slow Internet connections, or newer handheld devices can also benefit from accessible websites. For example, a transcript can make an online video or audio accessible to a person with a hearing impairment while also allowing those with slow Internet connections or inadequate software to access the same information.

Is my website accessible?

If your organization already has a website, you may be wondering if it is accessible. A quick way to check this is by using CAST's convenient online tool, "Bobby." Visit the Bobby website (www.cast.org/bobby/) and type in the web address of your website. Bobby will scan your webpage for accessibility issues and compile a report, which you can use as a checklist to make your site accessible.

Another test is to check if your website is put together using standard HTML- the computer language that used to create webpages. Webpages written using non-standard HTML usually do not display well on alternate browsers and can confuse assistive technologies. The World Wide Web Consortium (W3C) is the international body that decides web standards. Visit W3C's HTML Validator (validator.w3.org) and type in the address of your website to see if your web pages use valid HTML.

If you are undertaking a new web project, it is a good idea to discuss accessibility early in the project, as it can be expensive to retrofit an existing website later. Make accessibility a project requirement and discuss the standards and levels of accessibility that you need to aim for. For example, you may decide that all webpages on your site should pass the "Priority 1" accessibility test by Bobby and validate against W3C's HTML 4.01 standard.

Ten Techniques and Tips

  1. Images embedded in web pages can be annotated with alternate text. When accessed through devices that do not display images such as a screen-reader, this alternate text is used to describe the image. Add alternate text to all images.
  2. If you have audio or video on your website, be sure to provide captioning, transcripts, and descriptions.
  3. Edit your content so that it makes sense when read out of context. Avoid using phrases like "Click Here."
  4. HTML provides a means for conveying structure in a document. Use "headings" and "lists" in a document instead of just varying the font size.
  5. Use Cascading Style Sheets (CSS). CSS is a web standard that allows more control over how a page looks while preserving its information structure. Web pages that use CSS also tend to create smaller files that transfer faster over slow Internet connections.
  6. If your website uses scripts, applets, plug-ins, pop-up navigation menus, or animated introduction pages, provide the content or navigation in an alternate format. If your website employs technologies such as Flash, Portable Document Format (PDF), Javascript, or Java, ensure that users without these technologies can still navigate your website and get to the content.
  7. Offer a way to skip over large lists of navigation links.
  8. Summarize tables, charts, and graphs.
  9. Do not depend on color to convey meaning.
  10. Ensure that the code you use in your website follows current W3C standards and use tools to check your website for accessibility issues. Always test your website using different browsers, on different operating systems, and using a text-only browser or simulator.

Consider the example of Planetizen (www.planetizen.com) - an information exchange for the planning and development community developed by the authors of this article. We have made efforts to make Planetizen more accessible using many of the techniques described above.

Figure 1 shows this website when viewed using a regular Web browser. Figure 2 shows the same page when viewed using Lynx, a text-based Web browser. Note how the alternate text for images is displayed and the "Skip Navigation" feature becomes visible in a text-based Web browser. At this time the website passes Bobby's Priority 1 check and most pages comply with W3C HTML 4.01 standard. Figure 3 shows how the site is presented using IBM's Home Page Reader, which quite literally "reads" a website to a user. Finally, Figure 4 shows a version of the website available in a format optimized for handheld computers. Ensuring accessibility is an ongoing process, and we continue to refine Planetizen for accessibility.

Open to All

Accessible websites need not be visually boring. The visually oriented website, "Living Independently in Los Angeles" (LILA; lila.ucla.edu), was designed by the Advanced Policy Institute at the University of California, Los Angeles. LILA uses a GIS-based, resource database created by local residents with disabilities using their personal "expert knowledge" to identify and map local independent living resources. The design of the website offers features for visitors with visual impairments; users can change the size of the text, the width of the window, or page colors (Figure 5). It is possible to create a functional and attractive website that is also accessible. The key is to make sure that accessibility is not an afterthought.

Abhijeet Chavan is the Chief Technology Officer for Planetizen, a web-based information exchange for the urban planning community, and Urban Insight, Inc. a Los Angeles-based web development and Internet consulting firm. Chris Steins is Chief Executive Officer of Urban Insight.

Resources

  • The WebAIM website (www.webaim.org) features introductory materials and a Section 508 checklist.
  • The University of Wisconsin-Madison's Trace Center (trace.wisc.edu/world/web/) lists readings, tools, and projects related to web accessibility.
  • W3C's Web Accessibility Initiative website (www.w3c.org/WAI) contains detailed technical information.
  • The Federal IT Accessibility Initiative website (www.section508.gov) provides details about Section 508.
  • Bobby, Center for Applied Special Technology (www.cast.org/bobby).
  • HTML Validation Service, World Wide Web Consortium (validator.w3.org).
  • Vischeck, Tiny Eyes, Inc. (www.vischeck.com) Check readability of images and pages for persons with color blindness.
  • Lynx Viewer (www.delorie.com/web/lynxview.html) A text-only browser simulator.
  • Accessibility at Macromedia, Macromedia, Inc. (www.macromedia.com/accessibility). Accessibility information for Macromedia's popular Dreamweaver web development software.
  • Adobe Systems Incorporated (access.adobe.com). Accessibility information for Adobe's Acrobat software and Portable Document Format (pdf) files.
  • Microsoft's Accessibility Center (www.microsoft.com/enable/) for accessibility features built into Microsoft products, and how to take advantage of them.