Accessibility Archives

Oh The Irony (Maybe)

Though I am somewhat like Alanis Morissette in that my understanding of what makes something ironic can be faulty, I do find it amusing that I just tried to comment on an LJ written by a person who is blind, and I got hit with a visual CAPTCHA, and I failed it.

Yes, Another Blog

Hey kids, I'm launching another blog: All Access Blogging.

If you are a blogger and you'd like to make your blog more accessible to people with disabilities, or if you want to know why you should, check it out.

And let me know if that background color is just WAY too bright. It's pretty, but it kind of hurts my eyes.

(And while you're at it, you know about Heroine Content, right?)

Everyone Should Be Reading Your Blog! (a.k.a. Making Your Blog Accessible)

How do you make your blog more accessible? This post contains some advice and specific instructions, related to a presentation that I am giving at BlogHer 2006.

The following information is culled from multiple sources. Big hat tips to Knowbility, an organization promoting barrier-free IT; to Mark Pilgrim for Dive into Accessibility; to the American Foundation for the Blind for their articles on blogging; and to Crabby Old Lady for her post Blogging for Older Readers on Time Goes By.

If you have any corrections, questions, or other feedback, leave a comment or send email to princess@lizardkingdom.org.

Break Up Your Post into Paragraphs

This one is easy. Just break long blog posts into paragraphs, and make sure white space shows up between paragraphs. It helps people with low vision, concentration difficulties, and many older people (whose eyes may tire out more easily) read all the way through what you have to say.

If you don't listen to me, you should listen to your elders. Crabby Old Lady says:

Crabby is sure you know that screens flicker and eyes, even young ones, tire faster reading on a screen than on a paper page. It is impossible to read paragraphs that go on and on without breaks.

Crabby first realized this when she was managing editor at cbsnews.com in 1996 and early on, she made a New Rule: no paragraphs longer than six or seven lines for ease of reading. She would be a less crabby blog reader if she could as easily enforce this rule for the entire blogosphere.

Make Your Link Text More Explanatory

Good example: I love this blog about vegan cooking.

Bad example: I've seen several articles about this.

Many people with disabilities who use screen reader software or text-only browsers either extract a list of links from a web page or tab through the links to get a sense of what's on the page. "Click here" is just not that informative. When the words you use as links are really small, it can be hard for users with mobility impairments (or anyone else) to click on the links. Blogs already have a lot of repetitive link text - comments and permalink, for example - so why add to the clutter?

In general, it takes a little more work for users with some disabilities to open a new link or back out of an unwanted page. It helps them to know if it's really something they're interested in before they go to that effort.

Sometimes it's fun to do a link like How Beautiful! or What a Jackass! and create a little mystery for your readers. Just don't overdo it.

Don't Open New Windows Without Warning People

The Back button is your friend. The Back button is always there, it doesn't move around, and it always does the same thing. It's big, which makes it easy to click on. So don't "break" it by opening new windows without warning people! A new window doesn't let you go backwards, which can be confusing. People with mobility impairments have to work to close an unwanted new window. Low-vision folks may have the screen zoomed to another area and not even know a new window has opened. For people who are blind, only the most recent versions of screen reader software gives any indication that a new window has been opened.

So warn them! And while you're at it, warn them if the link goes to any content that isn't just another web page, such as a Quicktime movie, PDF, or a YouTube video of your hamster in its little plastic hamster ball.

Further Reading: Give Back the Back Button and Dive Into Accessibility Day 16: Not Opening New Windows

Change the Style of Visited Links

A link should look different after you've followed it and come back to the original page. Users with short-term memory problems may have trouble remembering what they've clicked without a visual representation. Think about big collections of links like Blog Carnivals - if your boss walked by and you had to close your browser, would you really want to rely solely on your memory to pick up where you left off?

You can bold it, not bold it, underline it, highlight it, not highlight it, whatever. Just make sure people can tell them apart. But if you're thinking "Hey, I know, I'll just change the color!" then check out the next section.

Further Reading: Links That Don't Change Color When Visited

Use More Than Color Cues for Links

If your links are only designated by using a different color than your text, people who have trouble distinguishing colors may not be able to tell what's a link. Most common is red-green color blindness, which means the person sees green and red as greyish and can't tell them apart. Elders may also have difficulty distinguishing colors.

Further Reading: Dive Into Accessibility Day 12: Using Color Safely

Fun Tool: Colorblind Web Page Filter lets you plug in your website and see what it would look like to someone who is color blind.

Use Color and Value Contrast

We've all seen the sites that must have been designed by 21 year olds who eat a lot of carrots. Grey text on a black background just isn't legible to the rest of us. Use colors that are easily distinguishable from each other for the background and text of your site.

P.S. I hate to tell you this, but dark background with light text is just not as easy to read as the reverse. It's true. Yes, it's a bummer, and it doesn't mean you can't do it, but consider your audience before you decide on a color scheme.

Fun Tool: Juicy Studio Colour Contrast Analyzer lets you plug in the text and background colors for your blog and get an idea of how much they contrast.

Label Your Images

If you're using an image to tell a story or replace text, you need to add an "alt attribute" to label the image. Then users with screen readers or who browse with the images turned off can see the label you've created and they know what's going on.

The alt attribute is a part of the HTML code for your image. Depending on your blogging tool (see below), you will need to add it in or change the default. The text typed into the alt attribute inside a set of quotes is called "alt text."

Your alt text should be brief, but informative. If an image is being used to replace text, put all of the words in the alt text. Check your spelling, since screen readers will misread a word that is misspelled. Some people also use the title attribute to convey verbal information about an image, but not all screen readers provide the title to the user.

If an image is being used for purely decorative purposes, you can not enter any words. If it's a photo gallery or an artistic image, it's your call on whether to use words or not. But include the alt attibute itself anyway, because if it's missing, screen reader software will read the filename of the image, and that's not pretty. Just put in the quotes with nothing in between them and your image will become "silent."

To learn how to add or change alt attributes:

Blog Tool Specific Instructions:

  • If you're using Movable Type, there isn't a field in File Upload for alt text. Edit your image tag once it's placed in your post.
  • If you're using TypePad, upload your image into your post and then switch into the HTML tab. The alt attribute will be filled in with the photo's filename, so find that and replace it with your alt text.
  • If you're using Blogger, upload your image into your post, then switch to the Edit HTML tab. The alt attribute will be there but blank, so if you don't need a label you can leave it alone. Or fill in your label in between the quotes.
  • If you're using WordPress, "when you upload an image through the WordPress interface, there is a field to add a description - this comes through into the code as the alt text." (Thanks for explaining this, Candace!)

Resist Visual CAPTCHAS

CAPTCHA stands for Completely Automated Public Turing Test to Tell Computers and Humans Apart. Visual CAPTCHAs are those little boxes with the squiggly text you can barely read, and they are impossible to solve for people with vision impairment or those using text-only web browsers, and may be frustrating or impossible for people with dyslexia. Use all the other comment spam control tools your blogging tool offers before resorting to visual CAPTCHAs.

Put Your Sidebar/Navigation on the Right

If you don't care whether your sidebar goes on the right or left, put it on the right! Otherwise, people using screen readers may have to listen to everything in your sidebar (recent posts, blogroll) before they get to your main content.

OR, Add a Skip Navigation Link

Or, you can add a "skip navigation" link attached to a small transparent image which screen reader users and Braille output users can select to jump to your latest post. This requires editing your template a little, but it's not too hard.

For instructions, see #7 - Provide Skip Links and Using Skip Nav Links.

Use Relative Font Sizes

When you select View > Text Size in Internet Explorer 6, it does not let you make the text larger if the stylesheet has the text set in pixels (px). Users of other browsers are fine, but this is a very popular browser. Set your font sizes using percentages, ems, or keywords instead.

Blogger folks are fine, yours are already like that. For everyone else, this probably requires getting down and dirty with your templates. MT/TypePad/LJ users can adapt or borrow from the Miniml style from The Style Contest, which is in percentages.

For a little help on this tip, check out Dan Cederholm's Bulletproof Web Design for a method using keyword and percentages.

Tags: |

Only Consumers, Not Creators?

A recent post on Movable Tweak listed a few things the author would like to see changed in Movable Type. All well and good, until I read the following comment by Su:

Ajax: Meh. It's possible to avoid buzzwords while still buying into the hype, you know. AJAX has serious usability(and accessibility) issues that haven't even all been discovered yet. While I wouldn't particularly object(actually, even care) if more software made use of it, I can think of many reasons to avoid it for the time being.

And the follow-up by Jesse Gardner:

Su, I completely I agree that accessibility is important! That's one of the mantras of my design business. And I am familiar with many of the AJAX accessibility issues, but we're talking about using it to power an application. Perhaps others would disagree with me, but I think sacraficing accessibility in an application for the sake of enhancing the UI is an acceptable loss. For instance, have you ever tried to use MT with javascript off? Many of it's features depend on javascript (try to rebuild!) but I would consider than an acceptable risk, considering all of the benefits we draw from it. Also, keep in mind, AJAX accessibility problems are usually issues like working with screen readers, using the back button and clean urls, most of which don't really matter as much in an application setting (again, see Google Maps).

I get the distinct impression that in this comment, accessibility is treated as an important consideration only in OUTPUT, and not in the TOOLS that are used to create that output.

Do people with disabilities not want to create content? Would they consider it an acceptable loss to sacrifice accessibility and render the tool unusable for them just so the rest of us could have an enhanced UI? Would they think it "doesn't really matter"?

Do you?

(I've never given much thought to whether people with disabilities would be able to use Movable Type to create websites, and that reflects poorly on me since I have often promoted its virtues to others. Time to ask more questions.)

Blogging Against Disablism Day

I always miss blogging days. I have the best of intentions, I even create draft posts as placeholders, but then I blow it. For example, Blogging Against Disablism Day was yesterday, May 1st.

I would like to point out, though, that Blogger has announced they now offer an audio option for those nasty CAPTCHAs they have offered as a way to guard against comment spam. Well done, y'all!

A tiny, tiny remedy to the condition that one commenter to the Diary of a Goldfish post on language and disability finds himself/herself in because stuff isn't built right:

F***ing Inconvienced.

Thanks to UnwiredBen for the tip on the Blogger announcement. This gets me even more inspired to prepare tips on accessible-izing blogs for BlogHer.

Prepping for BlogHer 2006

I'm speaking at BlogHer 2006

My topic is blogs and accessibility, as some of my faithful six readers may have guessed. If you're reading this, please let me know if you have any thoughts on the following:

  • Any things you've heard you are or aren't supposed to do to make your blog/site accessible or just plain easier for people to read, and whether you understand why you're supposed to be doing those things.
  • Any experience you've had trying to make a blog/site more accessible or compliant with accessibility standards, and how that went for you.
  • Any of your friends or family who aren't currently using technology because the technology they can access doesn't meet their needs, or any friends and family who are using adaptive technology (including even simple things like larger fonts, lower screen resolution).

I'll not only get a chance to speak, but to post materials to the BlogHer site and prepare handouts for conference attendees, so I'd like to do this well.

Those of you in Austin may be forced to sit through me practicing my remarks.

Louis Braille's Birthday

Anyone who has used Google today has probably seen this already, but it is Louis Braille's birthday. What a wonderful tribute:

the word google in Braille

My BlogHer Thoughts On Accessibility

I went to BlogHer logo

Let me tell you a story. It will wrap back around to BlogHer at the end.

Once upon a time, I started building websites. I used Netscape Navigator. I had no idea what I was doing. The only people who were building websites at that time were geeks. I got bored with it and quit.

Then I went to graduate school in public policy. I took a class focused on community technology centers. I was dating a guy who built websites, so he told me a few things. I picked up Macromedia Dreamweaver and learned how to use templates. I built a website for the class. We also organized a conference.

At that conference, I met Sharron Rush of Knowbility, John Slatin of the Accessibility Institute of the University of Texas at Austin, and Jim Allan of the Texas School for the Blind and Visually Impaired. After their presentation, they volunteered to open up my website source code and tell me what I could improve as far as accessibility and usability for people with disabilities. I expected a huge list of highly technical changes. What I got back was so easy:

  • Dark text, light background.
  • Use a style sheet for your fonts and colors.
  • Add alt attributes to your image tags.
  • When you create a link, use text that shows what the link is: "This story about the Volga" rather than "click here."
  • Don't launch new windows or new document types (PDFs, etc) without warning your reader in the link text.

Do just this much, and you knock it out of the park.

I was lucky that I had only been building websites on an amateur basis for six months when I was told these things. I get the impression that people who have been building websites professionally for longer than that are not always open to these things. And now that using tables for layout has been deprecated, it's a little more of a challenge for old dogs to learn new tricks.

Since then, I have moved from building websites primarily with Dreamweaver to building them primarily with Movable Type. I've gotten lazy. I use dark text on light backgrounds, meaningful link text, and always use alt attributes on my images. But my design sense and skills are so poor in this medium that I'm relying primarily on style sheets made by others, which do not usually include relative sizing on text and other elements as is also recommended by usability folks. My current blogs use fixed-width layouts and fixed font sizes, and since I've always been a little fuzzy on why that's a problem when one is using a style sheet (or if I've just misunderstood the issue), I've just ignored it. I don't know if my current drop-down menus for archive navigation are accessible. I am a new dog who is lapsing into old tricks.

I've evangelized plenty of web designers on the topic of accessibility in the past few years, and I do get into the mix on certain issues that really punch buttons for me. For example, CAPTCHAs. Elisa Camahort talked about them, and I had to get involved. But when Koan Bremner blogged about a variety of accessibility topics, I let it go even though I could have contributed to the conversation. Crabby Old Lady laid out some great points about usability for readers who aren't 18 and have 20/20 vision, but I didn't link to it.

I think it's time to get back on the train.

As I was writing the post about comment spam linked above, I was actually thinking about BlogHer. Many of the bloggers there were non-technical. They don't have a clue in the world what I mean when I say "alt attribute." They don't have to. That's the beauty of it. They don't need a copy of Macromedia Dreamweaver and a live-in consultant in order to make a website and share their thoughts, photos, and more with the rest of the world. I am now in the middle of the geekiness scale for people who make websites, because a whole group of people now has access to a technology that lets them make websites without being geeky. But they may need to learn a few more things so their thoughts and photos can be enjoyed by all their readers.

I've gotten lazy, and I need to re-teach myself, and I need to figure out how some of the generic rules apply to blogs (see for example in parenthese below). But if I do that, I'm in a good position to help my blogging peeps.

(For example, the rule about meaningful link text is meant to allow people using screen readers to pull up a menu that just has a list of the links included in the page. This can speed up navigation on a text-heavy page when they are looking for a particular link. This makes sense to me for a corporate or information site, where someone may be looking for the link "about" or "contact" or "weather" or what have you. I'm not sure it's necessary in blog posts, where readers aren't necessarily showing up just to extract information or find a particular destination. And sometimes the author may be hiding the destination as a surprise, in which case non-descriptive link text gives the same experience to sighted folks and those using screen readers.)

I'd like to revisit some of the classic guides, such as Dive Into Accessibility, make sure I'm up to standards, and figure out an easy and quick way to share that information with BlogHers and other bloggers. I'd also like to do the series that the American Foundation for the Blind should have done: evaluate the popular blog creation software and see how well it does out of the box.

'Cause if I lose all or part of my sight someday and I can't read my favorite blogs anymore, I'm gonna be mad!

Something I Never Thought About

If you're deaf, how do you let the police know you can't hear them when they stop you?

Late one stormy night you are driving home alone. Suddenly red and blue flashing lights punctuate the darkness behind you. You don't know whether you are being pulled over for speeding, for having a broken tail light, or because you are driving a car that looks suspiciously like the get-a-way vehicle seen fleeing from the scene of a nearby convenience store robbery.

You immediately pull over to the side of the road and stop. You can't see a thing as you are blinded by the headlights behind you. You don't hear the police officers ordering you to get out of your car and walk backwards towards them. Because you do not follow their directions, the police officers treat you as a threat to them, and in your case, storm your car, drag you from your vehicle, throw you to the ground and handcuff you.

This never should have happened—but did—because the police officers thought you were deliberately disobeying them, and therefore must be hiding something. It never crosses their minds that you neither heard nor understood them because you have a hearing loss.

Hearing Loss Help has signs that people can download, print out, laminate, and attach to their visors that show police officers whether they're hard of hearing or deaf and gives the officers tips on communicating.

Comment Spam Sucks

[Updated 10/23/05: Elisa has updated her post to make a few additional points, so I've updated the URL to her post here.]

Elisa Camahort and Sour Duck have both recently had trouble with comment spam, but responded in very different ways. First, Elisa in "Bloggers getting more and more restrictive with comments...And it's definitely not good for blogging business":

I recently implemented the word verification tool on this blog after a weekend spam attack (over 400 comment spams within 24 hours.) When I encounter such a tool I consider it to be a minor inconvenience, but a small price to pay for posts free of comment spam. [...] It seems like most spam-fighting tactics focus on creating barriers that impact spammers and non-spammers alike.

Commenter Angel followed up:

On the word verification, I don't mind it as much. However, a recent study by the American Foundation for the Blind found that obstacles like word verification create a hindrance to people who are visually impaired since tools like JAWS cannot cope with the squiggly words. It was something I had not even thought about when I turned on my word verification after the spam was getting unbearable. However, I am not planning on turning the word verification off.

Elisa replied:

I did think about that. I've noticed that when you buy tickets online, for example, there's always a link to click in case you can't "read" the verification word. I'm sure we're not meeting the requirements of the Americans with Disabilities Act by not providing an alternate. (But since were not government contractors I don't think it matters.)

Sour Duck reacted differently to her comment spam:

I'm turning off the comments facility until I figure out a way to filter spam comments. (I don't like to use the word verification option that Blogger offers, because blind people and others with vision difficulties can't join in.)

However, she has now turned comments back on and is using the word verification option.

This "word verification" option they are discussing is what's called a CAPTCHA. Six Apart describes CAPTCHAs like this:

Perhaps the most famous Turing-style test in use as an anti-spam technique is the CAPTCHA (a cutesy acronym that stands for "Completely Automated Public Turing test to tell Computers and Humans Apart"). CAPTCHAs frequently come in the form of images of fuzzy or distorted letters and numbers, which humans can read and parrot into a text field, but which automated optical character recognition software has trouble identifying.

[...] an image-based CAPTCHA is impossible to solve for people with impaired vision, those with reading difficulties (e.g. dyslexia), or those using text-only web browsers. If the only way to comment on your site is by solving an image-based CAPTCHA, you have a serious accessibility problem.

Anyone who knows me well would expect me to start yelling when I read Elisa's comment that she doesn't think it matters whether users with disabilities can comment on her site, or when Angel and Sour Duck recognized the problem but decided to use the CAPTCHA. But since I'm trying to grow as a person, I'm more interested in this question:

WHY CAN'T THE GENIUSES WHO MAKE THIS SOFTWARE FIGURE OUT A BETTER SOLUTION?

Continue reading "Comment Spam Sucks" »

About Accessibility

This page contains an archive of all entries posted to Flooded Lizard Kingdom in the Accessibility category. The newest entry is at the top.

Ethical Consumption is the next category.

Many more can be found in the archives, listed in the sidebar on the home page.

Subscribe