Accessibility

Hiding inline SVG icons from screen readers

How to hide inline SVG used for decorative icons from screen readers.

Posted on September 30, 2016

Hiding visible content from screen readers with aria-hidden

If you want to hide visible content only from screen readers in order to give users a better experience, aria-hidden may be an option.

Posted on May 31, 2012

Skip links and other in page links in WebKit browsers

In page links do not work as expected (or as in other browsers) when activated by keyboard in WebKit browsers like Safari and Chrome.

Posted on March 9, 2012

Screen readers and CSS

Some CSS intended for visual media types only has unexpected and semantic effects on screen readers.

Posted on November 17, 2011

An accessible, keyboard friendly custom select menu

A way of styling the closed state of select elements without sacrificing accessibility.

Posted on November 3, 2011

Using display:table has semantic effects in some screen readers

When you use the table-related display properties of CSS to get the display properties of a table, some screen readers will treat the non-table markup as a real table.

Posted on October 11, 2011

Screen readers, list items and list-style:none

Many developers expect screen readers to ignore visual styling of semantic HTML elements. They mostly do, but with list items their behaviour is hit-or-miss.

Posted on September 14, 2011

Block level links and accessibility

HTML5 allows links to contain block level elements instead of just inline elements. This can be useful but there are currently potential usability issues with screen readers.

Posted on September 6, 2011

Do not use display:none to visually hide content intended for screen readers

Hiding content with display:none hides it from all users, including those who use screen readers. Be aware of this when deciding how to hide content visually.

Posted on August 16, 2011

Accessibility in Mac OS X 10.7 Lion

A quick walkthrough of the accessibility improvements in Mac OS X 10.7 Lion that stood out most to me.

Posted on July 30, 2011

The iOS Zoom setting disables maximum-scale=1 and user-scalable=no

Enabling the Zoom setting (in Settings > General > Accessibility) on iOS makes it possible to zoom normally on web pages that use a meta viewport element to prevent zooming.

Posted on June 7, 2011

Do unobtrusive, accessible social media sharing widgets exist?

No social media sharing widgets that I know of are keyboard friendly, and most use obtrusive markup. Anyone know of an accessible, unobtrusive option?

Posted on May 23, 2011

Accessibility checklists can be helpful if used right

Some people argue that checklists should not be used when evaluating accessibility. I think they work fine when used right.

Posted on May 18, 2011

Keyboard accessibility (again)

Keyboard accessibility really is not that hard to get right, but many, many web developers do not seem to think about it. Here are some simple guidelines that may help.

Posted on April 14, 2011

Why do drive-through ATMs have Braille keypads?

It may not seem obvious why drive-through ATMs would have Braille keypads to enable blind persons to use them. But once you know the answer it’s quite simple.

Posted on January 12, 2011

Is hiding text with CSS to improve accessibility bad for SEO?

Does using CSS to hide text—any text, for whatever reason—result in an automatic search engine penalty?

Posted on October 11, 2010

Accessibility improvements in Apple iOS 4 for iPhone/iPod Touch

iOS 4 for Apple’s mobile products have improved accessibility features, including support for navigating by WAI-ARIA landmark roles.

Posted on September 16, 2010

No longdesc attribute in HTML5

The longdesc attribute, which can be used to provide a longer description of an image, is currently not included in the HTML5 specification.

Posted on August 20, 2010

Accessibility does not prevent you from using JavaScript or Flash

Many people mistakenly believe that in order to make a website accessible you have to completely abstain from using technologies like JavaScript or Flash.

Posted on May 31, 2010

If you use the accesskey attribute, specify unique values

If you use the accesskey attribute and specify the same value more than once, browser behaviour is unspecified and varies a lot. Make sure values are unique if you use accesskey.

Posted on May 26, 2010

Built-in or bolt-on accessibility in HTML5? How about a bit of both?

Having built-in semantics and accessibility in HTML5 is great, but I think we also need specifications like WAI-ARIA that let us add accessibility to less than ideal markup.

Posted on April 26, 2010

Using the lang attribute makes a difference

Specifying the natural language of complete and partial HTML documents really does make a difference to users of screen readers that support language switching.

Posted on April 5, 2010

A selection of VoiceOver keyboard commands

A selection of keyboard shortcuts used to control the VoiceOver screen reader in Mac OS X 10.6 (Snow Leopard).

Posted on March 29, 2010

Remember the Authoring Tool Accessibility Guidelines (ATAG)

ATAG addresses software that is used to create websites or manage the content of websites, but is unfortunately ignored by many creators of such software.

Posted on February 18, 2010

Unobtrusive JavaScript is not necessarily accessible JavaScript

There is no guarantee that a JavaScript that is unobtrusively implemented is also keyboard and screen reader accessible.

Posted on January 26, 2010

Telling organisations that their websites are inaccessible

By contacting organisations with inaccessible websites about the problems you encounter, you increase the chances of them fixing their sites. W3C’s WAI has created a document intended to help you do this.

Posted on January 13, 2010

W3C HTML Accessibility Task Force

The W3C HTML Accessibility Task Force will help ensure that HTML 5 provides features to enable Web content to be accessible to people with disabilities.

Posted on January 12, 2010

If you must use a dropdown menu, make sure it’s keyboard friendly

Many dropdown/flyout/DHTML menus are not keyboard friendly. Next time you implement a dropdown menu, make sure it can be used without a mouse.

Posted on December 21, 2009

JAWS has a weird way of recognising data tables

The heuristics used by the JAWS screen reader to determine whether a table is used for layout or data are quite strange.

Posted on December 17, 2009

Do you find table summaries helpful?

Looking for input from screen reader users with regards to the usefulness of the summary attribute for data tables and the information provided in it.

Posted on November 17, 2009

Headings and document structure conclusions

There appears to be no single solution to heading structure in HTML that fits all situations, but as I see it there are two choices.

Posted on November 10, 2009

New accessibility overview on the W3C website

The new W3C website has a new and very good summary of the why, what, and how of Web accessibility.

Posted on November 3, 2009

Results from WebAIM’s screen October 2009 screen reader user survey

The results from WebAIM's October 2009 screen reader user survey have been posted. Some results are expected while others can be a bit surprising.

Posted on November 2, 2009

Design patterns and examples for colour blindness

We are Colorblind contains good and bad examples of designing for people who are colourblind along with design patterns, tips and tricks, and colour checking tools.

Posted on October 26, 2009

Lightboxes and keyboard accessibility

All Lightbox clones that I have tested have issues with keyboard accessibility, making it unnecessarily difficult or confusing to use them without a mouse.

Posted on October 20, 2009

Remove the outline from links on :active only

Completely removing the outline from links makes it very difficult for people who do not use a mouse to see where the keyboard focus is. But there is a better way.

Posted on October 13, 2009

Improve your keyboard accessibility

Many web designers and developers forget about or ignore keyboard-only users when building web sites. Here is some advice on what to avoid and what to do.

Posted on October 12, 2009

Gesture-based VoiceOver on the iPhone and iPod touch

Apple has made the iPhone and iPod touch accessible to visually impaired people by shipping them with the new, gesture-based version of the VoiceOver screen reader.

Posted on October 6, 2009

Opera adds support for the longdesc attribute

Very few visual browsers support the longdesc attribute, but now there are at least two: iCab and Opera.

Posted on September 14, 2009

HTML 5 and the summary attribute

The current HTML 5 Working Draft lists the summary attribute as an obsolete but conforming feature and tells authors to provide table information to all users.

Posted on September 7, 2009

Accessibility improvements in Mac OS X Snow Leopard

Mac OS X 10.6 has plenty of accessibility improvements, several of which will be useful not only to people with disabilities. No mention of WAI-ARIA, though.

Posted on June 17, 2009

Using the Web with a refreshable Braille display

Roger Hudson has posted a video of Bruce Maguire using a refreshable Braille display to browse the Web.

Posted on June 11, 2009

Building accessible forms with WCAG 2.0

Examples, with references to relevant WCAG 2.0 Success Criteria, of how screen reader users can successfully interact with forms that use JavaScript.

Posted on May 21, 2009

Making accessibility more real

Even if you do not have a disability, there are some things you can do to gain a better understanding of the obstacles some people with disabilities run into on the web.

Posted on April 14, 2009

Accessibility is more than “possible to access”

Making web sites and web applications accessible is more than making them possible to access - it also means making them usable.

Posted on April 9, 2009

NVDA – a free, open source screen reader

Testing your web sites and web applications with a screen reader is good. Screen readers can be expensive, but NVDA is a completely free alternative that has WAI-ARIA support.

Posted on March 26, 2009

WCAG 2.0 Checklist by WebAIM

WebAIM’s WCAG 2.0 Checklist condenses the guidelines into an easy-to-use and understandable checklist that will help you get started with WCAG 2.0.

Posted on March 25, 2009

Screen reader testing

While it is important for all web developers to have access to a screen reader for testing, setting one up may prove a little tricky. Fortunately there are instructions that will help.

Posted on March 10, 2009

Check your design with text size increased to 200 percent

To make sure that people who need larger text can use your size, increase text size to 200 percent and check that the content is still readable and functional.

Posted on March 2, 2009

IE 8 still does not resize text sized in pixels

Internet Explorer's text resizing behaviour is different from that of other browsers since IE does not allow the end user to (easily) resize text whose size has been specified in pixels.

Posted on February 23, 2009

WCAG 2.0 recommends using luminosity contrast ratio to check colour contrast

With WCAG 2.0 now being a W3C recommendation it is time to check that the tool you use to check colour contrast supports the luminosity contrast ratio algorithm recommended by WCAG 2.0.

Posted on February 18, 2009

Results from the WebAIM screen reader survey

WebAIM’s screen reader survey provides some interesting results. Most are expected, but there are some surprises.

Posted on February 10, 2009

Headings, heading hierarchy, and document outlines

What do you do when an HTML document’s main heading is not the first text that should be marked up as a heading—insert a dummy heading or give up on having a perfect document outline?

Posted on January 26, 2009

WCAG 2.0 finally a W3C Recommendation

Today the W3C announced that Web Content Accessibility Guidelines 2.0 (WCAG) has finally been declared a W3C Recommendation.

Posted on December 11, 2008

Making Google Maps more accessible

You can make the Google Maps you put on your site more accessible by providing a static image fallback for users without JavaScript and hacking in keyboard accessibility.

Posted on December 1, 2008

Writing good alt text

It is quite common to come across images with missing alternative text or alternative text that does not properly describe the image’s content or function.

Posted on November 11, 2008

Going from WCAG 1.0 to WCAG 2.0

It is time to start reading up on WCAG 2.0. It may be a lot to digest, but there are documents available that compare the checkpoints in WCAG 1.0 to WCAG 2.0.

Posted on November 6, 2008

Reading up on WAI-ARIA

WAI-ARIA, the Accessible Rich Internet Applications Suite, helps developers make their web applications more accessible to people who rely on assistive technology. Start reading up on it.

Posted on November 3, 2008

Multiple form labels and screen readers

If screen readers reliably supported multiple labels for the same form control, it would be easier to make error messages and instructions fully accessible.

Posted on September 30, 2008

Turn Firefox into a screen reader with Fire Vox

Fire Vox is a free, open source, cross platform screen reader extension for Firefox. If you create websites you need it.

Posted on September 23, 2008

Helping others understand web accessibility

Accessibility is sometimes harder to get into than it should be. The documentation is hard to read and we can all do a little bit more to help each other.

Posted on February 5, 2008

Manual for Apple VoiceOver in Mac OS X 10.5 Leopard

A Getting Started guide for VoiceOver is available for download in a number of formats, including audio, PDF, and Braille.

Posted on November 23, 2007

Videos of people using assistive technology

A set of fantastic videos that show how people with various disabilities use computers with the help of assistive technology.

Posted on October 15, 2007

Scrap text resize widgets and teach people how to resize text

Instead of wasting time and resources on building JavaScript widgets that resize the text on your site, teach people how to resize text in their browser.

Posted on September 21, 2007

10 colour contrast checking tools to improve the accessibility of your design

A list of tools that help make your design readable to all users by checking if text has sufficient contrast against its background.

Posted on September 12, 2007

Can the alt attribute be omitted without hurting accessibility?

In the current editor’s draft of the HTML 5 specification, the alt attribute for images is no longer required. I am not convinced that this is a good idea.

Posted on September 7, 2007

Provide an accessible alternative if you must use a CAPTCHA

Visual verification of distorted characters displayed in an image is a major accessibility barrier to people who are visually impaired, blind, or dyslexic.

Posted on September 4, 2007

Introduction to screen readers and screen magnifiers

See how people who are experienced screen reader or screen magnifier users interact with their computer desktop and the Web.

Posted on July 17, 2007

London 2012 Olympics branding film causes epileptic seizures

A segment of a film that promotes the London 2012 Olympic Games brand has triggered epileptic seizures in at least thirty people.

Posted on June 29, 2007

Adding vs. not removing accessibility

Only sites that are badly constructed to begin with or have had too many accessibility-removing additions grafted on need to be made accessible.

Posted on April 11, 2007

International RSI Awareness Day 2007

In honour of the RSI Awareness Day, here is a nice tip for reducing the risk of getting wrist, arm, and neck pain from using a mouse.

Posted on February 28, 2007

Seven accessibility mistakes you don’t want to make

Seven accessibility mistakes that even well-intentioned developers make, and some advice on how to avoid them.

Posted on January 16, 2007

Apple iPhone is cool, but where is my keypad?

Apple’s new iPhone looks like a fantastic PDA/mobile Web browser, but what about its lack of keys with tactile feedback?

Posted on January 9, 2007

Click here and other meaningless link phrases

Many sites use link phrases that are anonymous and meaningless. Help improve the Web by making yourself and your clients think before you link.

Posted on November 28, 2006

Accessibility statements or Site help pages?

Perhaps it is time to replace accessibility statements with site help pages that are less technical.

Posted on October 31, 2006

Inline quotations: use q elements or not?

Should Web designers and Web authors use q elements to mark up inline quotations or not? Opinions differ.

Posted on October 3, 2006

Light text on dark background vs. readability

The recent design trend of light text on dark backgrounds is reducing the readability and usability of many sites for certain people.

Posted on August 21, 2006

Web accessibility to become mandatory in Europe

On 12 June 2006, ministers of 34 European countries signed the Riga Ministerial Declaration, which requires that all public websites are accessible by 2010.

Posted on June 21, 2006

AJAX, JavaScript support and screen reader accessibility

Making websites and web based applications that use a lot of JavaScript accessible isn’t as easy as just making sure that there is a non-JavaScript fallback.

Posted on May 18, 2006

Alt text is an alternative, not a tooltip

Alternative text should never be displayed at the same time as the image it provides an alternative for.

Posted on April 10, 2006

Luminosity contrast ratio

WCAG 2.0 suggests calculating the luminosity contrast ratio between foreground and background colours to ensure readability.

Posted on January 6, 2006

How to write a useful accessibility statement

If you don’t have an accessibility statement on your site, this article explains how to write one. If you already have one, here’s how to make it better.

Posted on December 16, 2005

Accessible DHTML: two different approaches

Examples of different approaches to making dynamic web content more accessible: WAI’s dynamic web content accessibility and Web Forms 2.

Posted on December 7, 2005

CAPTCHA is bad for accessibility

Using a bitmap image containing distorted text to verify that the user is human prevents several groups of disabled people from using web based services.

Posted on December 3, 2005

Accessibility and usability for interactive television

Accessibility and usability for ITV have a lot in common with accessibility and usability for the web. There are also many differences, some of which are highlighted in this article.

Posted on December 1, 2005

Colour blindness simulator for Mac OS X

A very handy little application that provides a real-time simulation of various types of colour blindness.

Posted on October 25, 2005

VoiceOver and Safari: Screen reading on the Mac

Examining VoiceOver, the built-in screen reader in Mac OS X 10.4.

Posted on May 9, 2005

The alt and title attributes

When browser vendors bend the standards and implement something in a different way than what the specification states, they may cause prob…

Posted on December 8, 2004

Bring on the tables

Avoid using tables for layout, but make sure to use them, and use them properly, for tabular data. This article explains how to make HTML data tables accessible.

Posted on October 27, 2004

Accessibility vs Branding

The other day I came a cross a pretty strange discussion, at least from my point of view, in a web related forum. Some people were arguing…

Posted on September 22, 2004

Municipal Web Accessibility

Alt Tags have tested 408 Californian city websites for accessibility and usability, with disappointing results. 89 % of the websites did n…

Posted on May 23, 2004

A List Apart

Issue 163 of A List Apart contains two articles. How to Save Web Accessibility from Itself is a long article in which Joe Clark asks the w…

Posted on November 15, 2003

Accessible != Boring

For some reason a common belief is that an accessible web site has to be “boring” and that it has to contain mostly text and very few imag…

Posted on November 4, 2003

Skipping links

For accessibility reasons it is considered good practice to put a “skip navigation” link at the top of each page (In this case, “top” mean…

Posted on September 13, 2003

Building Accessible Websites

Accessibility expert Joe Clark has now made his entire book Building Accessible Websites available online. For your own good, read this bo…

Posted on July 17, 2003

WCAG 2.0

W3C just published the Web Content Accessibility Guidelines 2.0 Working Draft. I haven’t had the time to read it yet, but out of both inte…

Posted on June 25, 2003

Access this

I just noticed that Joe Clark has made chapter 6 of his great book Building Accessible Websites available online. Read it online or buy it…

Posted on April 8, 2003