SitePoint Sponsor

User Tag List

Page 1 of 2 12 LastLast
Results 1 to 25 of 35
  1. #1
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Accessibillity and Blind users

    I'm aiming for 100% accessibility to my site. To this end, as well as the usual conventions I am creating an entirely text based version, compatible (hopefully) with ANY browser that supports tables (and perhaps even those that don't, just not as prettily).

    I don't have any speech browsers to hand at the moment, and no sound card at work to use them if I did - and my problem is with navigation.....

    Consider the following:

    Code:
    Home :: Where To Stay :: Farm Accomodation
    
    Northamptonshire Farm Accomodation
    
                 Castle Farm Guest House Peterborough 
                 Dairy Farm              Kettering  
                 Drayton Lodge           Daventry 
                 East Haddon Lodge       Northampton 
                 The Elms                Northampton
    
    Heritage :: Countryside & Waterways :: Out & About :: Events :: Where to stay
    Is how I considered laying it out. The top line representing a "breadcrumb" trail and the bottom representing "jumps" to other key parts of the site.

    I have also considered having the bottom links on a side menu (left), but thought that may present problems when being read.

    (ie, it may read out "home(link), Castle farm guest house(link), Peterborough; Countryside & Waterways(link), Dairy Farm(link), Kettering.. etc etc).

    Anyone know best practice for this sort of thing?
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  2. #2
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I haven't yet bulit a sight specifically with blind people in mind but I've read a fair bit about the theory recently. First of al, using XHTML with CSS rather than tables for the layout is strongly recommended - it allows you to give your document a logical structure seperate from the presentation (important soncidering blind users couldn't care less about your presentation).

    Using CSS for layout also allows you more flexibility over the order of text in your document. The best order is probably header, main content text then navigation at the end (as blind users will not want to have to sit and listen to your navigation before getting to the real content). Of course by using divs and CSS for layout your visual presentation can put the navigation wherever you want it - screen readers ignroe CSS layout code and rely on the structure of the underlying document.

    Finally it is worth adding a #target style link to "jump" over any big chunks of navigation (or to jump over your main content and go straight to the navigation). Some screen readers apparently allow users to use this kind of link and it will make your page far more usable.

  3. #3
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Great answer Skunk, thanks. While I am considering blind users for the text only section (hence the speech browser concern), it is also there to ensure users of just about any device can view it (old browser's, pda's etc etc). I am currently working to xhtml1.0 (Transitional) standard, but perhaps it's time to look at strict.

    I haven't messed much with css positioning - I guess it's time to play a little more. My key concerns are that it'll look ok still using small devices, and that it will degrade nicely in older browsers (and still look ok in Lynx etc).

    I am really looking at this as a model for future development of all my sites, so wanna get it spot on. All advice gratefully received
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  4. #4
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The beauty of CSS positioning is that it elimates the need for two versions of a site (the flashy one and the text only one) - you can have both at the same time. You design a document using standard XHTML tags such as <h1>, <li> and <div>. The result is a document that will be perfectly readable in virtually any browser you could care to mention (although it will look visually very uninteresting). Then you use CSS to add layout and visual interest to the page. The end result is a document that will look nice in modern browsers and look boring but readable (and completely accessible) in older browsers that do not support CSS or "cut down" browsers that deliberately ignore CSS (such as those on PDAs).

    I started work on my first ever CSS-only layout last week, and I'm tempted to never go back to the table based way of doing things. See here: www.bath.ac.uk/~cs1spw/nemesis/

  5. #5
    SitePoint Wizard
    Join Date
    Jul 1999
    Location
    Chicago
    Posts
    2,629
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Re: Accessibillity and Blind users

    Well, I'm no usability expert, but I personally would use this template.

    Code:
    Site Name > Where To Stay > Farm Accomodations
    
    Northamptonshire Farm Accomodations
                 
                 Inn                     Town
                 Castle Farm Guest House  Peterborough 
                 Dairy Farm               Kettering  
                 Drayton Lodge            Daventry 
                 East Haddon Lodge        Northampton 
                 The Elms                 Northampton
    
    Heritage - Countryside & Waterways - Out & About - Events - Where to stay
    Coincidentally, I just remade my homepage to be more in keeping with the current trendy standards. It's got some tables, but all of the formatting is CSS. I think I'm gonna experiment a bit with an all-layers design next.

  6. #6
    Don't get too close, I bite! Nicky's Avatar
    Join Date
    Jul 1999
    Location
    Lancashire, UK
    Posts
    8,277
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Accessibility is all about Universal Design as muhc as possible. I would be interested in hearing why you feel the need to provide a text only version.

  7. #7
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Nicky
    Accessibility is all about Universal Design as muhc as possible. I would be interested in hearing why you feel the need to provide a text only version.
    The site is about tourism in Northamptonshire. It needs to be accessible to ANYONE interested in visting the county, including the visually impaired.

    The reason text only/pda compatibility is also important is the functionality on the site - basically providing up to the minute info on events, and accomodation guides - the sort of thing a mobile internet user is going to find useful.

    It is the "oficial" Northamptonshire tourism site. so it's gotta be spot on.

    While the "main" site is graphic rich to demonstrate how purty N'pton is, the info is of more import and needs to be available to all.
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  8. #8
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    btw, thanks again for advice guys. Like both the .css revisions (not reviewing *cringes*), but I LURVE the new graphics on your site Quinn - simple and effective
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  9. #9
    SitePoint Wizard
    Join Date
    Jul 1999
    Location
    Chicago
    Posts
    2,629
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks! I just redesigned my site this past weekend.

    Instead of using pure CSS for this, I would have two separate interfaces to your site. This can be done easily as long as all of your content is in a database.

    Make your normal site as usual, then set up some scripts that take the info from the DB normally, but format them with a text-only template. Put the scripts in text.yourname.com or www.yourname.com/text and redirect text-only browsers, screen readers, and PDA proxies to this version.

    Check out Slashdot for example. They have a text-only version at slashdot.org/palm. It works really well with AvantGo!

    IMO, CSS isn't completely ready yet. I doubt that any of the PDA HTTP proxies can format pages using supplied stylesheets, so if I were you, I would just provide two versions of the site.

  10. #10
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    heh, that's almost precisely what I'm doing , except that the text only is on www.visitnorthants.info and the flash and images one at www.visitnorthamptonshire.info .

    -both driven from the same db. I'm actually coding the functionality in the text one, and then splicing the code into the pretty one - it's quite a nice way of working, wish I'd done it before
    Last edited by TheOriginalH; May 14, 2002 at 19:07.
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  11. #11
    Don't get too close, I bite! Nicky's Avatar
    Join Date
    Jul 1999
    Location
    Lancashire, UK
    Posts
    8,277
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Well, I disagree with out on this one. I know not much about PDAs, but I do know about accessibility for blind users, and one thing I can tell you is that not only is there not need for a text only version, but blind users for the most part resent that and wish to make use of the same version as everyone else.

    The fact that blind users cannot use a visually rich and dynamic website is a misconception and frankly one that only someone who is misinformed on the topic would make. You seem to be pushed by your employer to create an accessible version of a website, but they don't seem to understand the rationale behind this. Tell them to spend some money researching this topic, Ic an suggest several good books and website on the topic, plus training courses if you are interested. Ask them to put their money where their mouth is.

  12. #12
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Actually it was my decision . I'd be interested in the training courses nonetheless.

    The rational behind the text site was not just for visually impaired users, it was so that all devices can get at the info. I decided that on the "main" site (ie that catering to the majority browser/technology audience), I would depart a little from some usual rules (viewable in all res's, no javascript, full 4.x compatibility), to leave room for possible future media rich features.

    I still need to have the site info accessible to all, especially considering the prolific growth of internet "booths" in and around the county. These display at a res similar to web tv, or at best 640*480 minus a couple of toolbars for advertising.

    I decided the best way to cater for all would be to have the "showy" site and an "info only" version. There are of course the added benefits that will bring to search engine ranking.

    Book recommendations always welcome, I'm something of a book geek
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  13. #13
    Don't get too close, I bite! Nicky's Avatar
    Join Date
    Jul 1999
    Location
    Lancashire, UK
    Posts
    8,277
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Well, if you are free next Tuesday...
    http://www.uclan.ac.uk/ldu/events/access/index.htm

  14. #14
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    That looks quite interesting Nicky. Not sure if the notice isn't too short, but I'll have a word with personel tomorrow.
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  15. #15
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Anyway, bearing in mind that this development is not all about blind users, your input on the best layout for the mentioned information would be greatly appreciated, as I'd like to ensure that if they do choose to use this version, it will be the best possible experience.
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  16. #16
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Can't do next Tuesday, but please keep me informed of any future courses. That advice would still be appreciated...
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  17. #17
    SitePoint Enthusiast
    Join Date
    Jun 2002
    Posts
    69
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    access

    100% access is a tall order... if you mean to include both physical and cognitive disability... this is where you attempt to target your user group and follow those basic usability rules.

    As many have suggested... xhtml/css pages greatly increase access when done correctly (make sure to vailidate your code and run it by bobby - http://www.cast.org/bobby).

    if you do use tables in your site consider how it would be read if it were linearized... and also make sure to use table summaries and labels.

    another key aspect is the actual language used... (link names, alt text and title tags to name just a few)...

    anyway... i think your best bet is to code one page and use css media types to work around the short comings of none 5.0 browsers... i could go one for days... so i guess i should stop...

    i written a thesis on the designers role to universal accessibility... so if you want me to babble let me know and maybe i can answer a few questions... or at least set you up with some linlks to the info you need...

    ps. don't for get those color blind folks... or those that need to make the type 72pt to read it...

    good luck.

  18. #18
    SitePoint Enthusiast
    Join Date
    Jun 2002
    Posts
    69
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    "i written a thesis" ok... so maybe i am over tired... i sound like someone that can barely write my name. maybe i should sleep...

  19. #19
    SitePoint Enthusiast mymamasaid's Avatar
    Join Date
    Sep 2000
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    can comment on pda browsing

    I'll jump in with my 2 cents!

    I use my pda quite a bit and browse the Internet on it as well. A text-only version of your site would be of great benefit to those like me! pda browsers currently do not support css, and most references to building pda-friendly sites recommend keeping the formatting to an extreme minimum.

    Graphics that consist of a few colors can present nicely on b/w screens. I don't know offhand the size recommendation for wap-enabled phones, but for pdas, it's generally no more than 160 px wide.

    I'd also place a link to the pda-friendly pages as close to the top of your main site as possible so those who find you on their pdas and such can quickly find the more appropriate pages for them.

    hth!
    Kristine
    silly boy, web design is for girls
    MyMamaSaid.com :: MomsPDA.com :: iDotDesigns.com

  20. #20
    SitePoint Enthusiast rreames's Avatar
    Join Date
    Jun 2002
    Location
    Iowa
    Posts
    33
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My personal site is a text-only site with CSS used to add the visual stuff. No tables were used in the layout. If you can set your browser to ignore CSS or use NN4x you can see the diffs. reames.org

    Also take a look a the Perkins School for the Blind It is an excellent example of a site designed for accessibility.

    One more link, this guy has an excellent use of CSS. ~cac6982
    Use the Style Switcher.
    Apathetic Activist.
    reames.org

  21. #21
    SitePoint Wizard
    Join Date
    Aug 2002
    Location
    N.Ireland
    Posts
    1,046
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm researching the subject of accessibility at the moment for a site I'm working on and after reading through this thread I thought I'd bring it to the top.

    TheOriginalH, from what I have learned so far there are a couple of issues you need to be aware of with your site. Firstly you have spacers but provide no alt tags. What will happen here is screen readers will read the entire tag so what you need to do is simply put in alt="" and a screen reader will ignore the tag and image.
    Also you have not provided a method of skipping past your navigation on every page, imagine the poor person having to listen to the same nav links on every page and not being able to skip past to go to the main content. Try the this page for some tips - link

  22. #22
    SitePoint Wizard silver trophy TheOriginalH's Avatar
    Join Date
    Aug 2000
    Location
    Thailand
    Posts
    4,810
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Heh, thanks Daz.

    This site was completed a while ago, and ended up being a rush job. They vetoed the text-only version, but I plan on re-visiting it in January and updating it - this time hopefully adding the text-only version.
    ~The Artist Latterly Known as Crazy Hamster~
    922ee590a26bd62eb9b33cf2877a00df
    Currently delving into Django, GIT & CentOS

  23. #23
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Have you considered using XHTML Basic; theoretically it was desgned for mobile devices, I have only ever used it once on a live website.

    The motivation for XHTML Basic is to provide an XHTML document type that can be shared across communities (e.g. desktop, TV, and mobile phones), and that is rich enough to be used for simple content authoring. New community-wide document types can be defined by extending XHTML Basic in such a way that XHTML Basic documents are in the set of valid documents of the new document type. Thus an XHTML Basic document can be presented on the maximum number of Web clients.

  24. #24
    SitePoint Wizard
    Join Date
    Aug 2002
    Location
    N.Ireland
    Posts
    1,046
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I visited this site link yesterday and basically I think if you go through the table of contents and make the necessary changes then you will go a long way to making your site as accessible as possible.

  25. #25
    SitePoint Addict Kakarot720's Avatar
    Join Date
    Feb 2001
    Location
    Washington DC
    Posts
    219
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Section508.gov is an excellent resource for accessibility using CSS.


Bookmarks

Posting Permissions

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