Thursday, October 5, 2017

Content and Design: Accessibility for Everyone: Long Form Book Review

As seen in my last few entries, for the next undetermined number of posts, I will be reviewing Laura Kalbag's "Accessibility for Everyone". I have discussed with Laura my intention to do this, and she has given me her approval. This is going to be a review of the book and my own personal take on the concepts and ideas. I do not in any way intend for this to be a replacement for the book or otherwise want people to consider that reading my long form review basically means it's a Cliff Notes version of the book. I'm excited that books like this get written and I want to support Laura and other authors out there. If you think this book sounds intriguing, buy the book!!!



Front cover of Laura Kalberg's book "Accessibility for Everyone"
Laura makes an interesting point in that all technology is assistive in some capacity. If we didn't have a keyboard, a mouse, a microphone, or speakers, how would we interact with the device? To that end, it helps to think of each aspect of how we interact and consider ways that we may be hindering the use of these basic tools. To borrow from the book directly here's a nice and succinct way to consider the four primary Accessibility domains:

1. Visual: make it easy to see.
2. Auditory: make it easy to hear.
3. Motor: make it easy to interact with.
4. Cognitive: make it easy to understand.

By contrast, if there is a limitation in one of these areas, we need to be aware of and prepared to make it possible to get the same (or similar) information into the other domains.

Sometimes people want to "shake things up" when it comes to design and approach. We might think it's silly to hold to "outmoded conventions" when it comes to icons and other things (I'm sure that there are many people who look at a Save icon who have never interacted with a floppy disk before). Still, the problem with that is that changing it to something new will potentially alienate and confuse those people who vividly remember what a floppy disk is and that it is nearly universally associated with "Save".

Methods of good accessible design are not that arcane, and many of them are already being implemented and you may not be aware of it. a navigation par that has descriptive listings can be a quick summary of a site's contents. It's tempting to pack sub-navigation bars and sub-sub-navigation bars in as a way to really economise and make information quickly available. For the mouse user, that may be true, but for a keyboard only user, sub-navs can be frustrating. Additionally, using mouse hovers to cause areas to pop out and be selected, again, is both non-intuitive and renders those not using a mouse unable to access the content unless an alternative method is provided. Using breadcrumbs or links to show where you have been previously can be helpful for those with cognitive disabilities as well as being just a nice thing to work with when you have to do several views in a hierarchy. Knowing where you are in that hierarchy shaves time and releases stress.

Links have had a long history on the web and their standard look and feel have helped make it easy for people to determine what tet makes a link, whether you have been there before, and something descriptive to tell you what the link represents. "Click Here" is a terrible linking convention. "Learn more about our services" works a lot better.

Writing for the web and for the greatest possible audience requires a balance. In my personal writing and anytime I try to write for my blog, I make a standard assumption that a sixth grader can read what I type. I don't always succeed, but that is the goal. To that end, breaking up paragraphs, using lists, bullet points, and other conventions to break up the flow is very helpful. Also, when possible, I encourage people to "speak Dude". If it's not possible to get a point across without technical jargon, that is understandable, but most of the time, we don't need to get overly flowery or "express overabundant facility via grandiose verbiage". That example is grammatically correct but bothersome to read.

Fonts can be rendered in a number of ways and it's important to realize that many font styles might look "cool" but could be painful to read. Using standard typesets and making the calling of the print easy for the user goes a long way in making the experience usable by as many people as possible.

Picture carousels, button increments and other cool uses of web "eye candy" can indeed show off your site and its features, but it can also be a chore to navigate through for users who are not able to use a mouse or view the pictures. Forms should allow for conventions that help make the process of filling them out as easy as possible, with prompts when something isn't correct, if possible, to be shown to alert an error before the users try to submit the form. Also, pages and content are able to change without the user doing anything on the page themselves. Dynamically updating copy is a reality, and making ways to alert users to that is important.

Color and color contrast can be a make or break for many people. Not enough contrast can mean it will be very difficult to see what is being displayed for some people. Higher contrast usually is better, but that may "clash" with your overall design aesthetic. Perhaps, but one can argue that your design is flawed if a sizeable population of your users can't even read the site. Also, color swatches by themselves without other identifying details like a text description can also lock users out of making relevant choices.

One of the longest standing and simplest to look for Accessibility issues is not using Alt text for a picture or an image that has significance to the page and the user's experience and reason for interacting with it. Icons such as Open, Save, Copy, Paste, if rendered as pictures, should absolutely have some other indicator of what that picture is. An Alt tag helps with that for those who cannot or choose not to display the pictures. A readable text description is also important, and the more descriptive. The better. "Picture of a girl next to a car" is OK. "Photograph of a woman standing next to a 1985 Alfa Romeo across from the Huntington Beach boardwalk" is even better.

Additional areas to consider are providing alternatives to content. Using the four domain examples, think about anything you are presenting and how that content may be locking people out. Consider alternative ways to provide that information. A video presentation? Provide closed captioning for hearing issues and a transcript for those with vision issues.


We often err on the side of what's easiest for us and we make decisions based on our normative experiences. Therefore, it's not surprising that a lot of design issues happen not because people are being deliberately callous but because they are trying to be expedient. To borrow from the old Larry Wall Perl maxim, we need to make sure "there's more than one way to do it" whenever possible. That's going to require some extra work, certainly, but the increased usability for more people will likely make up for that. Take some time to look at your site or app and think "what could be stopping people from interacting with this? How can I make it easier for them? How can I make it possible for the most people to benefit from my site or app?"

No comments: