Browser Toolbars You
Shouldn’t Do Without
How the WAT and WDT Can
Help You Design Accessible
Websites
Overview
• What are the WAT and WDT?
• Where can you get them?
• How can they help?
• How do they work?
What Are the WAT and WDT?
• Both are web browser toolbars
•
•
designed to make developing
websites easier.
The Web Accessibility Toolbar (WAT)
runs on Internet Explorer and Opera.
The Web Developer Toolbar (WDT)
runs on Firefox and Chrome.
Where Can You Get Them?
• Web Accessibility Toolbar:
www.paciellogroup.com/resources
• Web Developer Toolbar:
chrispederick.com/work/webdeveloper
How Can They Help?
• They CAN make it easier to evaluate
the accessibility of a web page.
• They CAN’T make subjective
judgments.
How Do They Work?
Let’s look at how each toolbar can
help you evaluate the most important
accessibility checkpoints.
Title and Headers
• WAT
o Doc Info, Page Information
o Structure, Headings/Heading
•
Structure
WDT
o Information, View Page Information
o Information, View Document Outline
Cascading Style Sheets (CSS)
• WAT
o CSS, Disable CSS
o CSS, Disable inline styles
• WDT
o CSS, Disable Styles
o CSS, Display CSS By Media Type
Skip Nav and Hyperlink Text
• WAT
o Doc Info, List Links
• WDT
o No equivalent feature. Information,
View Link Information only displays
a list of URLs.
Alternative Text
• WAT
o Images, List Images
o Images, Show Images
• WDT
o Images, Display Alt Attributes
o Images, View Image Information
o Images, Replace Images With Alt
Attributes
Color
• WAT
o Colour, Greyscale
o Colour, Juicy Studio Contrast
•
Analyser, Contrast Analyser – all
tests
WDT
o Disable, Disable Page Colors
Font Size
• WAT
o IE, Text Size
• WDT
o No equivalent feature
Tables
• WAT
o Tables, Table Headers
o Tables, Table Cell Order
• WDT
o Information, Display Table Information
o Information, Display Element
Information
Scripts
• WAT
o Doc Info, JavaScript / New Window
•
Links
o Doc Info, List Applets / Scripts
WDT
o Information, View JavaScript
Plug-ins and Multimedia
• WAT
o Doc Info, List Downloadable Files
o Doc Info, List Multimedia Files
• WDT
o Information, Display Object
Information
Forms
• WAT
o Structure, Fieldset / Labels
• WDT
o Forms, View Form Information
o Forms, Display Form Details
Questions?