President Barack Obama’s approach to information transparency is admirable. His connection to the public through the major media channels of the digital age: the White House web site, Facebook, Twitter, YouTube, and other social media methods is impressive. It’s a great way for the public to keep up to date on the activities of their government.
Unfortunately, the accessibility level of these web resources is — all in all — not really up to the levels one would hope for.
Obviously, the government has no control over the accessibility of the external resources they’re using to help promote their agenda and communicate with the public. These social media sharing sites are what they are, and regardless of their independent accessibility levels, I agree with the administrations choice to use them — to connect with their strong user bases — rather than attempt to build an expensive and potentially abandoned project to imitate the functionality.
However, the government does have direct and complete control over their own web presences, and would truly have wished to see a more thorough approach to web accessibility from the extensive network of new information-bearing web sites created by the Obama administration.
Obama’s network of web sites includes The White House and Recovery.gov as of May 2009. These sites exhibit a common set of problems; indicating a fairly straightforward set of issues which have been overlooked by the development team.
What’s Right?
In many respects, the accessibility of the Obama web resources is actually quite strong — the basics are well covered:
- Headings use appropriate HTML (HyperText Markup Language) markup, providing strong navigation cues for visual and screen reader navigation.
- Most images provide appropriate and useful alternate text.
- Videos are captioned and transcribed.
- Parts of the web site are available in Spanish. (Only a very small part, however — this is definitely not equivalency.)
In other respects, however, the site is wretched.
What’s Wrong?
The principle offender — hands down — is keyboard accessibility. (Yes, that was an intentional pun. Sorry.)
According to Section 508 of the Rehabilitation Act, which covers the accessibility of government web properties, keyboard accessibility is a requirement, and one which neither of these web sites actually pass successfully.
In my accessibility consulting business, I rarely address Section 508, since these rules are relatively feeble compared to their more modern standards covered in the Web Content Accessibility Guidelines, but in the case of a government entity, Section 508 of the Rehabilitation Act applies specifically and is legally binding, unlike other accessibility standards. As such, it’s critical to address the specific points of Section 508 when considering government web sites.
Subpart B — Technical Standards
ยง 1194.21 Software applications and operating systems.
(a) When software is designed to run on a system that has a keyboard, product functions shall be executable from a keyboard where the function itself or the result of performing a function can be discerned textually.
(c) A well-defined on-screen indication of the current focus shall be provided that moves among interactive interface elements as the input focus changes. The focus shall be programmatically exposed so that assistive technology can track focus and focus changes.
Official Section 508 web site (emphasis added)
Who are keyboard users?
Keyboard-only navigators tend to include people with conditions such as Cerebral Palsy or Parkinson’s, which can make mouse use very challenging. In general, any condition which limits the use or maneuverability of the hands is likely to result in an in
The White House and Recovery web sites are particularly offending in the area of keyboard focus. When navigating either of these sites, there is no indication outside of the browser default available at any point; and in some areas, not even this indicator is present.
In addition, the drop down navigation menus throughout both sites are unavailable to a keyboard operator. Although these navigation elements have been duplicated in an area in the footer, that footer is not readily available to a keyboard navigator — a skip link has been provided to skip from the top of the page to the main content, but not to jump to the navigation, requiring keyboard users to manually tab all the way through the main content.
With no keyboard focus, this is a very difficult task, requiring you to observe very, very carefully to attempt to identify where you are on the page — let alone distinguish which link you’re activating when you finally do reach this footer area.
On the home page of WhiteHouse.gov, there is a set of featured items; usually in a video format. Using a keyboard, it is only possible to trigger the initially featured video, since the links to trigger other features are completely inaccessible to a keyboard user.
Once a video has actually been reached, the keyboard user will be unable to play the video without downloading it (although these options are available, fortunately.) The video player used has a very common accessibility problem: although the player itself can be navigated using a keyboard, this is only true if you can successfully navigate focus into the player, which is not actually possible using standard keyboard navigation — it requires mouse activation to move focus to the video player.
All in all, a disappointing experience for the keyboard-only internet visitor.
Other Problems
Although I haven’t conducted a complete accessibility survey of these sites, there are a few other issues which stand out immediately. I’m just going to mention these in passing, but this doesn’t make them any less important:
- Links in some contexts are not highlighted (no differentiation by color or by decoration.) Figure 1
- Because some links aren’t highlighted, anything placed in a position which seems like a link might be; this causes some difficulty with breadcrumbs, since there is an area towards the top of each document which looks like breadcrumbs Figure 2, although the actual breadcrumbs are found below the content area. Figure 3
- Footer links have insufficient contrast (2.73 according to the WCAG (Web Content Accessibility Guidelines) 2 luminosity contrast ratio.) These links include key references not represented elsewhere, including the link to the Spanish language version of the site and, ironically, the link to accessibility information. Figure 4
- Comment forms are woefully inadequate — there are no
label
,legend
, orfieldset
elements. Although some fields are required, the only indication of this requirement is shown using a background image, and that information is therefore not available to anybody except a normal visual user. Figure 5 - With images disabled, some additional color contrast problems are shown. The contrast level in some text-bearing images (including the header graphic) is well below acceptable accessibility levels.
How much work is this to solve?
None of these problems are really challenging to solve; there are web video players which offer much stronger accessibility than the default YouTube player currently in use (Easy YouTube by Christiann Heilmann or Accessible JW Player (no longer available) for self-hosted video, for example.)
Solving the keyboard accessibility issue is easy, as well. Including some basic CSS (Cascading Style Sheets) to provide a strong indicator for keyboard focus will immediately render keyboard navigation significantly easier. Something like the following will provide all that’s really needed:
a:focus {
outline: 2px solid #58b;
background: #9cf!important;
color: #000!important;
}
Though the drop down navigation isn’t keyboard accessible, the web sites have already included all the links within the drop down set up at the bottom of the page. Adding a simple skip link which links to the bottom of the page (“Skip to keyboard-accessible navigation,” or something to that effect,) would quickly remove the bulk of that challenge.
This is the core of the accessibility problem on both web sites: a few very simple changes could eliminate a significant array of accessibility problems. Taking into consideration the change process in a government entity, it’s probably not a one hour solution; but it’s certainly not something that will cost taxpayers a significant sum.
Supplementary Figures
Navigation is not indicated by color or decoration.
Figures which appear to be breadcrumb navigation.
These are the real breadcrumb navigation links.
Low contrast text.
Comment form on WhiteHouse.gov
Joe Dolson
Thanks for your comments, Jean-Francoise! That’s definitely another good point to touch on, since it’s harmful to any non-visual user of the site.
Jf Naud
Hi,
I’ve done almost the same analysis on whitehouse.gov a few weeks ago.
Yet, I have added a very bad practise : links are very badly labelled ! Either they have a very unprecise label (“watch the video”, “read this post”, “clicking here”), either lots of them have the same label but point to different web pages (“learn more…”).
The result is bad (especially for a governmental website).
JF
Joe Dolson
I hadn’t seen that! (I’m shamefacedly inattentive to podcasts. Do you have a transcript?)
Thanks for the link, Dennis!
Dennis Lembree
Another fair and insightful article, Joe. I like how you provided suggestions on how to solve particular issues. Also, for those who missed it, Web Axe reviewed Recovery.gov in a podcast a couple months ago.
Joe Dolson
Thanks for your comments, Jim! Like you, I didn’t conduct a complete investigation of the accessibility flaws – and you’re right, I did miss some things. Nonetheless, in the broader scheme of accessibility problems I would consider both web sites to have accomplished modest accessibility.
The headings are awkward, certainly – overuse of headings isn’t any better than underuse. Since this problem primarily applies to the home page, however, I downgraded it in severity.
I think we definitely agree on the overall problem: the accessibility of these two web sites is grossly insufficient. (In re-reading my text, I do have to agree that “actually quite strong” is an overstatement of the accessibility of the site.)
Jim Thatcher
Good work Joe. Thanks for joining what I hope will be a chorus. I have written about both whitehouse.gov and about recovery.gov.
I am very disappointed with the administration web site accessibility. These should be models of accessibility. I certainly agree with your comments about keyboard access. And there is a humdinger you overlooked. When you leave the site, like going from whitehouse.gov to recovery.gov, you are presented with a light box exit panel which is near impossible to find with the keyboard. You gotta find it to exit!
But I disagree with you about general accessibility. As discussed in the references above, there are very serious issues. For example, you mentioned headings for reasonable in-page navigation with screen readers. Well http://whitehouse.gov has about 28 headings; most of the text that should be a heading is a heading, but so are most of the links, basically negating the value of headings navigation. And more!
Thanks again!