SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    High fives all round! bradley317's Avatar
    Join Date
    Jan 2004
    Chester, UK
    0 Post(s)
    0 Thread(s)

    make me accessible

    I think I'm starting to get to grips with this accessibility stuff. My XHTML and CSS skills are ok these days, and I've done some work for a few clients that involve this kind of work. So, I thought it's about time I started to practice what I preach with my own website.

    I don't own a computer, which makes updating the thing a bit of a problem. I plan to deal with that in the near future, but in the mean time, I thought I should get a few problems sorted out in my head so when it comes to a reshuffle, I won't make the same mistakes again.

    Conceptually, I like the way my site works, and I really don't want to get away from that if I can help it. Trouble is, in terms of accessibility it falls over pretty badly. I plan to bin the splash page, fix the code and use a CSS layout but the central idea of the site will get lost if I don't keep this as the homepage...

    So I thought I'd put it to the floor. How can I keep the map metaphor and tick all of the accessibility boxes? Suggestions on a reply in this thread please.
    Hello, hello, what's all this shouting?
    We'll have no trouble here

    (Helping a pal...

  2. #2
    SitePoint Enthusiast 2kool2's Avatar
    Join Date
    May 2001
    0 Post(s)
    0 Thread(s)
    Homepage, it might be inaccessible currently but I quite like it.
    Here's a few things that'll improve it from an accessibility point of view:

    Add a doctype, charset and lang:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
    <html xmlns="" xml:lang="en" lang="en">
      <title>Welcome to Bradley</title>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    Sorry that's in XHTML strict but you get the idea?

    Add alt and title attributes to each of the map areas.

    <img src="bradley.gif" width="750" height="450" usemap="#Map" border="0" alt="the map of Bradley">
    <area shape="rect" coords="62,83,74,95" href="" target="_blank" title="Chester University" alt="Chester">
    Validate the code with the W3C.
    Next thing I'd suggest is purely optional but a text only repeat of the nav at the top of the page.
    Put the text in the same colour as the background so it's not visible.
    Add: a:focus {color:red} so a keyboard user can activate it too.

    hope that helps.
    mike 2k: )2
    <work> </work>
    <rest> </rest>
    <play> </play>


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts