93 posts tagged “accessibility”
2003
Accessibility and DRM
Via Accessify, Joe Clark’s analysis of Accessibility implications of digital rights management. Also, the new issue of Made For All includes an interview with Joe Clark which focusses on web accessibility.
Accessible Python
A post on Bryan Richard’s blog about Safari leads to a query about whether or not Py (a Python print magazine) should move to PDF, which in turn leads to a fascinating discussion about the accessibility of both websites and Python source code itself. Well worth taking the time to read.
Better DHTML navigation
Adrian Holovaty demonstrates how standards compliant code and effectively written javascript can decimate the size of a clunky navigation interface, and make it more usable and accessible to boot: Web standards improve 2theadvocate.com navigation.
Label elements
Peter Van Djick asks why does hardly anyone use LABEL tags?
It’s a very good question—in my opinion label tags, like title attributes on links, are a complete no-brainer. They’re well supported by all modern browsers, completely backwards compatible (in that there are no ill effects for older browsers), great for accessibility and easy to implement. They’re much more than just an accessibility issue—the usability of a form is dramatically increased by the addition of label tags, especially for radio and check boxes where they greatly increase the “target area” for the user to click on.
Using page titles properly
Adrian Holovaty eloquently demonstrates why real page titles (as opposed to titles stuffed with meaningless marketing keywords) are so important, using local entertainment listings as his example. One site that would do well to take his advice (despite not being in the entertainments listings business) is The Register, which has been failing to provide story headlines in page titles for as long as I have been visiting it. This is almost certainly a flaw in their content management system, but in 2003 it is an inexcusable error to make.
2002
Conversations with Joe Clark
Jonathan Delacour is three days in to his Conversation with Joe Clark series (see also parts one and two and the introductory book review). I thoroughly recommend reading the whole series, but here are a few points that stood out for me:
[... 786 words]Joe Clark interviews
On Monday, Slashdot posted an excellent in depth interview with Joe Clark, author of Building Accessible Websites. In a fantastic display of cluelessness they pasted the XHTML document which Joe sent them straight in to the Slashdot template, <html> tags and all. The good news is that there’s more Joe Clark related goodness to come, courtesy of Jonathan Delacour:
Pull quotes and page titles
Adrian Holovaty has followed up his discussion of page titles on news article pages with a look at the oft-abused pull-quote. Adrian points out how pull quotes can lead to poor accessibility for text browsers and screen readers, and suggests that providing a “skip quote” link could help improve things. Adrian’s comments section attracts a number of professional web deverlopers working on all kinds of news sites so the discussion is likely to be well worth watching over the next few days.
Newspaper sites and the link element
Adrian Holovaty advocates the usage of next/previous link elements on newspaper sites to add optional linear navigation. His comments include some interesting discussions on whether or not this feature would really be of use on that kind of site.
Bath University web guidelines
The Bath University Web Standards & Publishing Guide makes interesting reading. They have standardised on HTML 4.01 Transitional and CSS level 2, although the actual page that suggests those standards has an XHTML doctype and fails to validate. The University also aims to support the W3C’s Web Content Accessibility Guidelines, priority level 1.
Randal Rust on accessibility
Randal Rust has posted an updated version of his excellent CSS forms demo. While exploring Randal’s site I stumbled across ALPHABET SOUP: A web designer’s journey to standards and accessibility, an excellent article advocating CSS, web standards and accessibility which includes the following noteworthy quotation:
[... 77 words]IBM accessibility center
IBM’s Accessibility Center has a plethora of useful information and resources, including a free 30 day trial of their Home Page Reader text-to-speech browser software.
Dive into accessibility
Mark Pilgrim’s accessibility series has come to an end, and he has compiled the whole lot in to a fantastic new resource: Dive Into Accessibility. This is going to be required reading for anyone with a conscience and a weblog (or any other kind of site) for years to come. I’ve fallen a bit behind on implementing Mark’s accessibility tips but I am set on using them on this site soon (probably along with the new design) and applying them to any sites I develop in the future. Thanks Mark.
Accessible headers
Mark’s latest accessibility tip concerns header tags (<h1> through <h6>). Mark explains that using headers in the right order helps screen readers to interpret the structure of your pages, and shows how to use CSS to effectively style headers. Mark once again demonstrates the comment hack as a way of bringing Netscape 4 in line with other browsers, a technique that has been criticised by the More Like This Weblog as unnecessary encouragement for NS4 users. Incidentally, Johannes Koch has an excellent summary of CSS hiding techniques.
Accessible fonts
Mark has out-done himself today with his long awaited coverage of relative font sizes. This is a notoriously tough topic (thanks to a whole bunch of strange CSS bugs and browser differences) but Mark carefully and comprehensively explains the various work arounds and CSS hacks needed to get the right effect with maximum accessibility.
Jonathan on longdesc
Jonathan has insider knowledge that Mark will not be covering the longdesc attribute in his accessibility series. This it not because longdesc is not a useful accessibility tool, but simply because it does not fit the “fire and forget” nature of Mark’s series. Jonathan’s post discusses longdesc and the difficulties involved in adequately describing an image.
Image map accessibility
Mark Pilgrim continues to educate with day 24 of his series. Client side image maps need not pose a barrier to accessibility thanks to the helpful way in which alternative browsers use the alt attribute. They still aren’t much use for people using a normal (non-lynx) browser with images turned off though, and server side image maps are a big no.
Alt all the way
Mark says that today is the most important day of his whole accessibility series, and who are we to argue? The topic is the alt attribute for images, and the message is simple: Every image should have one, even if the image is there purely as layout decoration (in which case an empty attribute should be used). Surprisingly Mark does not give advice on chosing text for the attribute but he does provide an excellent further reading list, which includes Hixie’s superb Mini FAQ About The Alternate Text Of Images.
Accessible lists
Today’s tip from Mark informs us that “real” lists are good for accessibility. They are also fantastic for writing maintainable code. Thanks to CSS, a humble unordered list can be transformed with custom bullet points, funky backgrounds, rollover effects and borders—all hidden away in the stylesheet leaving just basic list markup in the HTML. Adding a new item is as easy as <li>item</li>. W3Schools have a good CSS list reference complete with examples, and this earlier post on my blog lists some resources for dealing with unpredictable list margins.
Zeldman on accessibility
Jeffry Zeldman: Many web practitioners still believe that accessiblity is an ugly, no-frills affair. Not true.
An excellent piece on accessibility issues.
Final table tip
A final table tip from Mark: Providing a summary for tables. Mark explains the summary attribute which should be attached to every <table> tag to summarise the purpose of the table. Tables used for layout should include an empty summary attribute to show they are layout tables (in a similar way to empty alt tags for layout images). The summary attribute is only used by text to speech browsers, so I’m slightly confused as to why it should be included for layout tables—surely if the attribute is empty a speech browser will skip tstraight over it as if it wasn’t there?
Accessible tables
Mark has been educating us on the accessible way of marking up tables, with particular reference to calendar tables on blogs. My blog doesn’t have a calendar (yet, I’m considering adding one) but Mark’s articles have brought up some interesting things that I was previously unaware of. Giving your calendar a real caption explains the <caption> tag, which can provide a useful (and easily styled) caption for any table. Using real table headers explains how <th> tags are interpreted by speech browsers and shows how they can be used in conjunction with the abbr attribute to create more accessible table columns.
More tips from Mark
Time to catch up on Mark Pilgrim’s accessibility tips. Four have been added since I last checked, so I’ll go through them in turn.
Skipping over navigation
Day 11’s accessibility tip is Skipping over navigation links, which suggests a compromise for people who did not or could not comply with Presenting your content first. I altered my template to present content first on Friday, but before then I was using a skip-navigation link. I now have a skip-content-to-access-navigation link instead, a technique I borrwed from Mark’s site but which he does not mention in today’s tip.
Presenting your content first
Mark’s accessibility tips are getting harder. Today we are advised to Present our main content first in our source code. This benefits both text based browsers and search engines such as Google. Mark points out the ingenious table trick which allows table based layouts to present the main content before the left hand menu in the source code and provides tips on implementation. Thanks to the benefits of CSS layout my blog only needed a small alteration—I was presenting the div containing the navigation in the source code before the div containing the main content. A quick switch of the order of the divs and the CSS did the rest for me without any further alteration.
Additional navigational links
Today’s accessibility tip: Providing additional navigation aids. Mark explains the concept of “relative” links using the <link> tag, which can be used to provide shortcuts to the next and previous page in a sequence as well as links to a site’s homepage. He also provides instructions for implementing them in Moveable Type, and asks for suggestions as to how it could be done in Radio. These links are not rendered in the actual body of a page but can be used by many browsers to provide additional navigation aids. My blog has these already but only as shortcuts to my categories and a link back to the home page—I haven’t yet implemented them for next/previous buttons while browsing the archives (which is arguably their most useful ability). Time to get hacking...
Day 8: page titles
Day 8: Constructing meaningful page titles—the accessibility tips are flying thick and fast now. I’ve always been conscientious of my page titles (after all, they’re all you get when when you use your browser’s history feature) but it seems I was not quite conscientious enough. My titles now all carry a reference to the name of the blog in addition to a description of the page.
Mark replies
Mark mailed me in response to my query about limiting his accessibility series to weblogs rather than expanding it to cover general sites:
[... 176 words]Day 6: Doctypes
Mark Pilgrim starts his series of weblog accessibility tips today with tutorial on adding a doctype to a blog.