“I want to do the right thing and make my blog accessible to people with disabilities, but I have so much to do. I just don’t have the time.”
Nonsense!
Start with the area you have the most control over: the piece that you write regularly – the post.
Consider the ingredients of a basic post: an image, an acronym or two, a few hyperlinks, maybe a couple of headings and even a list.
I challenge you to make those ingredients accessible in 75 seconds or less.
Are you up for the challenge?
The following instructions are for WordPress 3.3. Other blogging platforms are likely vaguely similar.
Adding an alternate text to an image
After uploading the image, delete the file name from the Title field (that is utterly useless!) and type a succinct description into the Alternative Text field. Providing additional information about the image in the Title field is optional.
Time: 30 seconds
Making hyperlinks meaningful
When writing a text hyperlink – text that is clickable – word it in such a way that the text makes sense when read alone.
For example, rather than writing:
I wrote about hyperlinks here.
Consider:
I cautioned against using consecutive one-worded links.
Of course, the wording is somewhat of a subjective call and will take some practice, one hyperlink at a time.
Time: 20 seconds
Opening links in the same window
When inserting a hyperlink in the Visual View, leave the Target set at “Open in This Window/Frame”:
When working in the HTML View, leave empty the “Open link in a new window/tab” checkbox:
Time: 0 seconds
Expanding acronyms
When using an acronym, write out the complete term and place the acronym in parentheses for the first use and then use the acronym for the remainder of the post. For example:
…the internationally-recognized Web Content Accessibility Guidelines (WCAG) 2.0….the WCAG…
Time: 15 seconds
Using a list
Rather than indicating list points with asterisks, dashes or other typed characters, use the list buttons on the WordPress toolbar to create unordered (bulleted) and ordered (numbered) lists:
Alternatively, use the keyboard shortcuts:
- Unordered list: for PC users, Alt + Shift + U; for Mac users, Option + Shift + O
- Ordered list: for PC users, Alt + Shift + O; for Mac users, Option + Shift + O
Time: 5 seconds
Adding headings
Rather than using bold, italic or font size to indicate a heading, use heading levels:
Alternatively, use the keyboard shortcuts:
- For PC users: Ctrl + [number]
- For Mac users: Cmd + [number]
Ideally,heading levels should be in sequential order. To determine the heading level of your post title, enter your blog URL into the Web Accessibility Evaluation Tool, for example:
Headings within the post would be the next heading level. In the example above, the post title is <h3>, headings would be <h4>, and any sub-headings would be <h5>
Time: 5 seconds
The Left Thumb Blogger Challenges You!
Total time: 75 seconds
These timings are estimates, based on how long these tasks take me using only my left thumb and guessing how long someone with ten fully functional digits might take.
Take the challenge and leave a comment with your total time.
I dare you to do it faster than the Left Thumb Blogger!
Thanks for posting this! The information is quite helpful, and I didn’t know some of these things made a difference for accessibility.
Questions: How does opening links in the same window help? Do visibility impaired users have difficulty using multiple tabs/windows?
Twitter: GlendaWH
Thank you, Derek. I am glad the post was helpful.
Yes, links opening in different windows can cause problems. Check out http://blogaccessibility.com/sin-6-opening-links-in-new-windows/
What a great list with some great tips that I’ll have to do for my own blog. I should have thought of these too. I’d like to add a couple of other helpful hints that also don’t take long:
- when using embedded videos, include a link above/below/beside/somewhere so that people using screen readers can play them. That flash player controls are invisible to screen readers
- an overall tip – if you want comments from people using screen readers, stop requiring captchas. They pretend to be accessible, but rarely are.
Thanks for these tips….I’m doing most of them but not realizing that it made a difference. I usually use “Heading 2″…..how is that helpful?
Twitter: GlendaWH
Catherine, documents need structure, which headings provide. Using heading levels for your headings allow individuals using screen readers to identify all headings in a post, much like a sighted person can skim them.
Great checklist, Glenda. I’m happy to say I think I do most of these consistently (I realise I may be imagining that but I’m confident a check would confirm that). The one I have a challenge with is the hierarchy of headers because I’ve found that with some WordPress themes the font settings can lead to some disproportionate results and interfere with the flow. I tend to use a bit and otherwise just bolding with , but I’ll do some more checking on that.
Twitter: GlendaWH
Des, that is when tweaking your style sheet might be needed. The key here is the good old “structure versus presentation”.
Twitter: GlynisJolly1
I’m disabled from a stroke. My limitations include memory loss. For this reason, I do not agree with your one fix of opening a link in the same window. I prefer the link opening in a second window so that I have access to the blog entry.
Twitter: GlendaWH
Glynis, good point. Yes, some people do prefer having links open in new windows, in which case right-clicking on the link gives you the option to open in a new window. By bloggers not setting where links open, then readers have that choice.
excellent checklist. do question one thing tho: your convention for “Expanding acronyms.” HTML already has
acronymandabbrtags just for this purpose. in many ways these tags are better than your method:* most browsers will show or speak a tool-tip of the full name, e.g., on a mouseover.
* most web-agents can machine-read the acronym, and then, for instance, speak it out to users. don’t now if any user-agents can do the same for you’re method (i.e., later in article, when just the abbr. is used.)
* do you really want to have to spell out USA in every article that you use it?
to illustrate point, notice you’re use of “HTML”, “PC”, and “Mac” above. you didn’t feel need to mess up article by expanding all of them. but had you used acronym and abbr tags, it would have done that for you behind-the-scenes, while keeping article clean.
Twitter: GlendaWH
Barrett, yes, good point. However, in the interest of ensuring bloggers do expand acronyms, I was aiming for the simplest solution possible. A compromise, perhaps. And a sound writing practice for many kinds of writings.
With using the and , my concern is: how friendly are they to people with limited mobility? Mousing over isn’t always easy or possible.
Sometimes a subjective call is needed in determining what to expand; for example, expanding common acronyms like USA and TV might not be necessary, depending upon your audience.
[...] Reminder: An agency, your own development team or a freelancer can build a website to these guidelines. If you want to add your own content, which is a good idea, it’s important to make your blog posts and news items accessible. [...]