Alligator at Savannah Wildlife Refuge

Accessible Hidden Text

I just ran across an excellent article entitled Why “left: -9999px;” is Better For Accessibility Than “display: none;”. It discusses the two primary means by which web developers try to hide text (usually to allow for accessible logos or titles), and why using an offset is (often) better than just simply making it invisible. The author also explains why this is better, using some documentation from Microsoft on Internet Explorer accessibility. Looks like I need to fix my websites!

3 Reader Comments

  1. kip says: July 10, 2007 at 4:06 pm

    When I read the subject of this post, I thought you were talking about how to make accessible, to which I was going to have to ask why in the world one would want or need to do that. :)

  2. kip says: July 10, 2007 at 4:07 pm

    that should read:

    When I read the subject of this post, I thought you were talking about how to make HTML comments accessible, to which I was going to have to ask why in the world one would want or need to do that.

    I had the phrase “HTML comments” in an HTML comment, so it hid it.

  3. Jonah says: July 10, 2007 at 4:32 pm

    I probably could have come up with a better title, had I given it a little more thought.

    It’s funny that the comment parser in WordPress doesn’t catch HTML comments (and escape them appropriately). Although, I do see the comment characters in the HTML source of your comment. It’s odd that the characters didn’t get converted properly (a WordPress bug?).

Comment on this post:

The following XHTML tags are allowed:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>