Entries Tagged as “Accessibility”
Accessibility 101 Defining Disabilities
I am still amazed when I talk to people about accessibility on the web and their response is typically "Blind people can surf the web?" This says two things. People think of only blind people when discussing accessibility, and second being people assume that if a person has a disability that they should not be using the web. This can't be further from the truth. Because this ignorance still exists, and I still encounter it I thought I would go back and write an accessibility 101 article.
→ Respond NowTags: Accessibility
Applications to help you create more accessible designs
Back in May, I wrote an article on tips for improving your web design. One small piece of that article discussed converting your design to greyscale so that you can get an idea of your color contrast ratio. Though I believe this is important to do, it is a bit time consuming when your in a design grove, and speed is of importance. Sometimes I just want a quick preview to see where I was going or how I was doing thus far in my process.
I remember seeing an online contrast analyzer and decided to look it up to see what it was about. My search turned up quite a few helpful tools that I just had to share with the rest of you. Before I get to the tools, let me take a minute to explain why we would want tools for testing contrast ratios in our designs.
→ Respond NowTags: Accessibility · CSS · Design · Freebies · Software · usability
Accessibility Abuse
Now that I have been spending a fair amount of time behind a screen reader, I have noticed a few things we as developers can do to make our sites better for all visitors. Some of the ideas that I am about to share are not meant to be a guideline but rather a topic for discussion. I hope that I can meet with other people on this soon and get more feedback but I wanted to post at least an intro here on my site for some initial feedback.
What I have noticed recently, with all the talk and hype about accessibility and usability, developers are going a bit overboard with trying to make our sites accessible. I include myself in this category as I first noticed the problem while surfing my own site. Not a good thing for someone that honestly wants to make the web a better place for everyone.
I think sometimes we developers get so caught up in the rules that we don't always stop to consider the use and whether it is appropriate or not. Knowing when to break the rules is what makes a good artist great so why can't the same philosophy apply to web design?
Get to the point
There are html attributes that are available to allow developers to add meaning to particular piece of markup. Take for example the alt attribute. It is meant to provide an alternate text version for an image. Often times what I see happen is that a huge amount of text get's placed into the alt tag and it becomes way to verbose to be useful. Also, not every image requires alt text. Images like spacer gif's or presentational only graphics don't need an alt text. Simply having an empty space in the alt attribute is enough to make a screen reader skip right over it, and it still validates. If the graphic needs a detailed description, use the appropriate longdesc attribute. Don't abuse the alt attribute and keep your text short.
I personally don't use this, but the tabindex is another tag that is often misunderstood. I have seen it discussed on other sites as a good practice, but I am not so sure that it is. I have never needed it on my own sites. The default tab order has always been correct. The problem occurs when you place a tab index on a page below the main content. The tabindex over rides any other tab order that you have on a page. I see this most often on web blogs when the comment form has a tabindex set on the form items. When a user hit's the tab key, they are whisked away to the comments area instead of tabbing through the navigation links or the content of a page. It gets really wonkey when the tab order goes back to the top of a page again. Yikes! My advice: Forget tabindex unless you absolutely must use it.
The last tag that think gets abused is the title attribute. Many of the javascript libraries make use of the title attribute as a hook for something else. Scripts like lightbox that use the title attribute for the description are often abused as entire paragraphs are sometimes placed into the title attribute. Perhaps the developers of these libraries can figure out a way to use the longdesc attribute instead. Another offender for the title attribute is repeating words already used as the link text. The title should tell the user something else about the destination assuming the link text does not already do so.
For the most part I believe developers mean well and want to make their sites more accessible, but sometimes knowing when to break the rules will go along ways towards making a site more accessible for everyone.
→ Respond NowTags: Accessibility · usability
Form Mark-Up: Are Lists Appropriate?
Recently Mike Robinson of www.akamike.net posted a response to another article on noupe.com asking for opinions on using list with forms. I'm not trying to single anyone person out. Mike is not alone in his thoughts, and I am simply using his post Form Mark-Up: Are Lists Appropriate? as a "for example" on the kinds of articles that I am reading more frequently on various blogs. I'm not trying to pick on Mike but rather raise awareness to an increasing problem that I see.
One of the trends that I see more frequently, is to place all your content in a list. Ordered Lists, Unordered Lists, and Definition Lists. It doesn't seem to matter anymore. This "all inclusive tag" is being packaged and sold as semantic markup. Frankly I feel it's just bad marketing. Yes it does validate. So does a table. Validating is not a true measure of semantics. A list of any kind is meant for one thing. Listing content. It's not semantic to use a list for layout. This is still bending the rules for layout purposes. In fact I would say it's worse in some cases, and less semantic than using a table. I'm not saying "use tables" I am merely saying it's not any better. Lets take a look at the two practices and compare them to plain old HTML. I have laid out three forms below with the same elements. One is in an ordered list, the other uses a table, and the last one is plain old html.
See how these three choices stack up against one another.
→ Respond NowTags: Accessibility · CSS · usability
List Abuse or Best Practice
I am researching the practical use or abuse of unordered/ordered lists on web pages. I have started using the JAWS screen reader to assist me in producing better solutions for my websites. I have also spent some time surfing other peoples websites with JAWS to get a feel for what works well.
I made an alarming discovery that I felt was not acceptable. It seems that the latest trends for semantic markup is to place the entire website in a huge unordered list. One term to describe this approach is called "divless" and is quoted as:
"DIVless is W3C friendly and was designed to give developers another method to create website layouts in a standards-friendly fashion."
Divless means very piece of content is in a list. Everything from navigation menus, sidebar content, paragraphs, to footers. In my experience this made JAWS read out every list level and nested lists level on a page. This process took a long time to go through. This also had a side effect of causing JAWS to progressively slow down it's speech rate. Items near the bottom of the page were reading back so slow that I stopped the screen reader and went to another site. It was just plain painful.
The argument I read most often in favor of this method is that older browsers understand the unordered list element and therefore render better. I have tested this theory and the older browsers do not support the level of css required to render a layout of this complexity and will simply render a massive list of items that don’t belong in a list.
I feel that the degraded visual appearance of a div based layout looks vastly better to a user of an older browser. It also does not adversely effect a screen readers ability to parse your pages content.
During my research, I found an article that says just about everything I wanted to say in this article. Rather than restating what’s already been said, I urge you to read this article titled "Are Lists Becoming the New Tables?" by Mike Cherim He goes into other issues with this methodology that I had not yet discovered. His argument is better than mine and has more facts to support up his philosophy.
I think that lists are better served to do what they were intended. Make lists. Not replace tables.
So my question to you all. Are divless websites the best method for presenting content? just because it's semantic and validates does that make it more accessible or more usable? Until I can see evidence that points to the contrary, I am in the camp that divs are better suited for markup than a list.
→ Respond NowTags: Accessibility · CSS · usability
