There Is No Cat

Making WordPress Page Titles accessible

I don’t use WordPress here, but I did as the basis for the site of the North American Shortwave Association when I recently overhauled the site. By default, WordPress uses the » character as a separator between the blog name and the page title. But Roger Johansson over at 456 Berea Street, in part three of his series on evaluating web site accessibility, mentions the use of this character and how it sounds to screen readers ("right pointing double angle quotation mark" to at least one, and "right double angle bracket" to JAWS, the most popular screen reader). Now, shortwave radio has a significant number of blind listeners, and the realization that they would have to sit through this lengthy bit of speech for one lousy character startled me, as I’ve tried my best to make the site as accessible as possible.

Roger points to a page on Peter Krantz’s Standards schmandards that has sound files for how a number of possible separator characters would appear to JAWS. I decided that the · character (·) would be the most appropriate. It’s short to read, yet still provides a clear visual delimiter for sighted users. The fix was fairly easy; in my template, I found two instances of wp_title() in the header.php file used to define the header of all pages on the site. wp_title() can take a parameter to set the separator character, so in the <title> and <h1> tags, I replaced the bare wp_title() call with wp_title(’·’). Voila! The site is now ever-so-slightly less annoying for users accessing the content with screen readers. Thanks, Roger and Peter.

Now I just have to look through the rest of the site and see if the » character appears elsewhere, and if so, if it’s important enough to change. I noticed quote a few of them sprinkled throughout the source code of the core files....

Tags: JAWS wordpress accessibility screen readers shortwave

Posted at 4:03 PM