Please create an account to participate in the Slashdot moderation system

 



Forgot your password?
typodupeerror
×
Programming IT Technology

Designing Websites for Disabled / Elderly? 58

dangerz asks: "I'm in a class right now that gives you a client and you must design a site for them for free. My class was split up into a group, and I am the Project Manager / Lead Programmer in the group. Our client is a group for Disabled and Elderly People. Basically, what we need to do is create a site for them to sell their art work. We had a meeting with the board of the organization today where we explained the basics of a website and what we'd need from them to move on. They learned pretty quick, but there are some things they want that we think aren't aesthetically pleasing. Has anyone ever had to do a site where the target audience was elderly or disabled people, and if so, what steps did you take to make sure everything was simple and accessible?"
This discussion has been archived. No new comments can be posted.

Designing Websites for Disabled / Elderly?

Comments Filter:
  • From w3.org:

    15.2.4 Font size: the 'font-size' and 'font-size-adjust' properties

    This property describes the size of the font when set solid.

    Possible values are:
    [ xx-small | x-small | small | medium | large | x-large | xx-large ]


  • Font size (Score:4, Informative)

    by driptray ( 187357 ) on Friday May 07, 2004 @08:53PM (#9090594)

    Elderly people generally can't read small fonts. It's probably their biggest complaint about web sites.

    The solution is to use a font size of 1em for your normal text. That way your users will get the font size that they have chosen as their comfortable default.

    This is pretty good advice for users of all ages actually.

    • Isn't that what CTRL++ is for?
      • He was saying that you should let them use whatever size they pick rather than using a pixel size:

        That way your users will get the font size that they have chosen as their comfortable default.
      • (Note this doesn't work properly in IE; not at all if you specify fonts in pixels, and they get the scaling factor wrong if you use em. Percents should do the right thing though)
    • You realize that em-sizes are relative to the current font size, right? So if you set your font-size to 1em, you've just said, "Make this font the same size as this font."

      But yeah, I always use relative and named sizes, never pixel or point sizes, unless I have an ornery client (like my current one) who insists that the text must be exactly 7 pixels tall, and he doesn't care what sorts of visual impairments people may have! I just roll my eyes and say, "Sure thing." Since at least he's letting me do it

      • Contract web development would be great if it weren't for the clients

        I think that applies to just about any line of work. It's amazing what we'll put up with from the person paying us :-)
      • I assume you're not in a position to say "I'm the designer, don't tell me how to design"?
        • Yeah, basically, my client went and hired a graphic designer to create the actual layout (while I was building the site), and said "all you have to do is stick his layout code into the site." Of course, what the graphic designer handed me was a low-quality JPEG which was shoved into an HTML file using Fireworks.

          Fortunately, it wasn't too difficult to work with, though the client (who is also insistent that the site MUST work on his Treo 600, and LOOK CORRECT even!) also hated some of my accessibility-fri

          • I don't think I can offer any comfort to you in your current diabolical situation... Perhaps you could go start a new life under the sea?
  • US Govt Section 508 (Score:5, Informative)

    by pease1 ( 134187 ) <bbunge@ladyandtr ... m minus language> on Friday May 07, 2004 @08:55PM (#9090599)
    US Government websites have to conform to Section 508 of the Rehabilitation Act. Sounds sort of silly, but it ensures that US govt sites are accessible to all, including the disabled and elderly. You can learn more here [section508.gov]. You will find some nice guidelines to follow, save some time and have some evidence to back you up.

    Some govt webmasters wine about this, but it's really a good thing, given that all should be able to access govt data.

  • WCAG (Score:5, Informative)

    by JimDabell ( 42870 ) on Friday May 07, 2004 @09:00PM (#9090634) Homepage

    The W3C [w3.org] (the people behind the HTML, HTTP and CSS specifications) have published the Web Content Accessibility Guidelines [w3.org] for exactly this situation.

    The most sensible methodology is to write basic, meaningful HTML, and then use CSS, Javascript, images, etc where they will add to the value of the website where you can do so without constructing barriers for certain groups of people. For the most part, HTML is already accessible, and it takes screw-ups to make it inaccessible. Unfortunately, the types of screw-ups that make websites inaccessible are very common (things like leaving out alt attributes on images, trying to fix font sizes, etc).

    As for it being aesthetically pleasing, accessible websites don't have to be boring, but if you have to choose one or the other (you rarely do), wouldn't it be better that somebody could actually use a website, rather than it being a pretty-looking, but ultimately useless toy?

  • by Unholy_Kingfish ( 614606 ) on Friday May 07, 2004 @09:08PM (#9090689) Homepage
    My father is 59, very bad eyes from diabetes, didn't start using a computer until 2 years ago. Observing him, and dealing with his problems, has shown me that simple is the best. Keep the eye candy on the screen to a minimum. Use fonts like Arial which have clean lines. Make sure the text and background contrast very well. Give them a clean black text on white background, over a blue text on gray background. Use basic colors, no light yellow, light gray, ect ect.

    As far as structure. Simple Simple Simple. Big bold headers. Big separators. Lots of CLICK HERE links. Most people miss the mouseovers and don't really understand hyperlinking. And make those mouseovers VERY different. Invert the colors of the link when there is a mouseover event. Lastly, aim for 800x600, no bigger. My father uses XP at 8x6 on a 19" monitor and it is too small for him.

    • by Anonymous Coward

      Lots of CLICK HERE links.

      The guy has explicitly pointed out that disabled people are a target market for this website. "Click here" links are just stupid when you don't use a mouse because of crippling arthritis, or have a user-agent that reads pages aloud because you are blind.

      Lastly, aim for 800x600, no bigger.

      Ignore this advice and aim for a flexible layout. What happens when the user has 800x600 resolution, but has a sidebar? Or when they don't run the browser maximised? Or when they've in

    • Lots of CLICK HERE links. Most people miss the mouseovers and don't really understand hyperlinking. And make those mouseovers VERY different. Invert the colors of the link when there is a mouseover event.

      I think you miss the point of an accessible website. It's supposed to be written in a way that makes it possible to access the content on any browser, including screen readers, and possible to change user preferences (font size, colors, etc...) without adverse consequences.

      The point is NOT to make a web

      • The point is NOT to make a web site accessible to people who don't understand web sites! This is like the icon caption: "AOL 4.0: DOUBLE CLICK TO START". Don't do that. It's okay to say "Click here to view the page I have written about foo." instead of "I have written a page about foo.", but please don't take all that advice literally.

        Yes, please do not take this advice literally, as it is wrong. The poster is correct that you are not to build a web site to people that don't understand web sites, but W3C [w3.org]

  • Can't we make adequetely advanced software on their end to interpret any site instead of consigning them to only a select few tailored to them?
    • That would involve some pretty spectacular artificial intelligence. When authors of websites don't know what they are doing, and instead of marking up headings as such, they choose to put them in a different colour or something, how is a user-agent supposed to understand the change in context and relay that to the user where colour is not available, for instance?

      It's a problem similar to optical character recognition, except you aren't just recognising a finite set of glyphs, but trying to extract mean

      • Well quite frankly if we can't train an expert system that for humans are simple interpretive situations than I don't see where the hell the billions have gone in researching it.

        Another thing entirely but knowing how one page is coded badly will likley help it in transposing newly found pages into a useable interface if such information is shared by users. Like a P2P config settings for webpage to webpage for people with varying disabilities.

    • by driptray ( 187357 ) on Friday May 07, 2004 @09:25PM (#9090767)

      Congratulations, you've just described a web browser.

      The issue is whether web designers use a sufficiently flexible design so that it allows end-users can incorporate their own style-sheets etc. to make the site just right for them.

      IOW, one site that can appear in many different ways depending on the browser settings. All modern browsers can already do this.

      • So what. I know what a web browser is. What happens when we are talking about flash animation with text in it for the blind, or spoken word for the deaf, or a complex interactive game for the parapalegic? Huh, this is not as simple as making sure that someone can apply their own css.

        All data formats should be made accesible by transposition into a software that can bring the most utlity out of that information for them or should we just allow them to forget about accessing a page because it was ill des

        • What happens when we are talking about flash animation with text in it for the blind,

          Easy, don't use Flash until it has better accessability built in.

          or spoken word for the deaf,

          The deaf can use speaking browsers. Just mark up your page honestly, and they'll have no problem.

          or a complex interactive game for the parapalegic?

          Ridiculous example.

          Huh, this is not as simple as making sure that someone can apply their own css.

          Actually, it is, as long as the web designer has a bit of nous.

        • Actually, the user does have to care about all his viewers. Without some kind of standardization, there would be no WWW. If web designers simply took the time to think about making their sites simple to render in various ways, including screen readers, braille displays and the like, the benefits would flow on to the entire web community as a result of the consistent HTML.

          There are quite a few things that really get on the nerves of disabled clients who I work with, which have all been mentioned previously

  • Some sites (Score:3, Informative)

    by pphrdza ( 635063 ) on Friday May 07, 2004 @09:28PM (#9090780)
    Try seniornet.org [seniornet.org]Made for seniors

    firstgov for seniors [firstgov.gov](although not quite as good as seniornet.)

    There are also several libraries that have very good senior sections, such as Multnomah County Library [multcolib.org], and Vancouver Library [www.vpl.ca]

  • A few suggestions (Score:4, Informative)

    by FlyingOrca ( 747207 ) on Friday May 07, 2004 @09:40PM (#9090836) Journal
    Ahem. I'm no expert, but! I have done commercial web design and coding, and I work with (mentally and physically) disabled people and with disabled seniors. A few thoughts off the top of my head:

    1) Keep the site layout simple. I'd go with as much text and as little graphic content as possible, other than actual thumbnails of the art. Two columns at most (say, navigation on left and content on right), and use percentages rather than fixed column sizes.

    2) High contrast. Bold primary colours in graphics, black text on white bg (or vice versa, but seniors might like the former better).

    3) Use CSS. In fact, use several, and customize them for different types of visual presentation. Like, you could have a high-contrast, white on black, large text version, etc. Make them available in links; it might mean duplicating some HTML if you're not serving it up full of steaming dynamic goodness, but it's worth the effort... and text files are pretty small, relative to graphics anyway.

    4) Label your navigation elements clearly, with descriptive text links rather than inscrutable icons.

    5) You might think about a link to Firefox (you're on /. so I assume you know what that is), making the explicit point that you can vary text size in Firefox just by ctrl+scroll wheel. Tell everyone. It's the better browser. ;-)

    6) TEST it. Find out what people like, what they don't. Using CSS, all you'll have to change (assuming they're OK with the graphics) is the stylesheet(s).

    Good luck, it's nice to see people working to make the web more accessible. Cheers!
    • Re:A few suggestions (Score:2, Informative)

      by josh3736 ( 745265 )
      You might think about a link to Firefox (you're on /. so I assume you know what that is), making the explicit point that you can vary text size in Firefox just by ctrl+scroll wheel. Tell everyone. It's the better browser. ;-)

      Hate to bust your bubble, but you can do the same in IE.

      • I did not know that. Of course, Firefox is still the better browser... but I didn't know IE did that. Thanks for pointing it out, I'll have to remember it for the once a year or so that I am forced to use IE. Cheers!
      • But you can make it larger in firefox (1000% if i remember right) than you can in IE. IE has like 5 settings + and _ from where you currently are.
        • IE also religiously sticks to absolute font sizes, so larger/smaller won't make any difference to fonts specified in px/pt/in/cm/etc. sizes.

          Typical that the one place where IE strictly enforces CSS would have to be the one which impairs usability...

          • IE also religiously sticks to absolute font sizes

            Tools | Options | General | Accessibility. Tick the "Ignore font sizes specified on web pages" box.

            • I didn't know that. Thanks.

              Now do you mind telling this to all of the older people who keep complaining to me about the websites they're unable to read, but don't have the patience or inclination to peruse through the depths of IE's configuration dialogs?

            • Even still, your choices only run from "Smallest" to "Largest", a variance of only about 50% of the size of the font. Need it bigger, and don't know how to write your own style sheet? Sucks to be you, d00d.

              Mozilla and Opera let you run up several multiples of the original size. Opera even zooms images so the page scales.

              Those of you who've been complaining on this thread about why those pesky old people don't take the time to navigate a million preferences should instead be asking why those pesky browser
    • Not that I've ever designed this sort of thing before, but a few things come to mind - expanding/repeating the points made in the parent.

      Keep it simple, and big.

      Also, try and use Text and tables (or some other similar arrangement) rather than Images for titles - text is more flexible when it comes to resizing.

      Internet Explorer *winces* (what I would assume these people are likely to be running, as most of the world does)has settings for overriding the default page settings for font size, I would hope tha
    • Opera includes a load of user togglable CSS files which do things like setting high contrast colours, simplifying layouts and such. It also zooms images as well as text. While Firefox is good, you might like to mention a browser which includes features specifically designed for this target audience.
  • Use Bobby (Score:4, Informative)

    by stevenbdjr ( 539653 ) <steven@mrchuckles.net> on Friday May 07, 2004 @11:27PM (#9091338) Homepage

    I'm surprised that no one has posted this yet, but you should look at Bobby [cast.org]. You feed it a URL, it will spit out ways to help you make the page more accessible. It can be set to use Section 508 rules from the US Government or the W3's own recommendations on web accessibility.

    I'd also recommend Zeldman's Designing with Web Standards [amazon.com]. I provides excellent details for using CSS to control the entire appearance of your site and better support modern web standards. In addition, it has a whole chapter devoted to designing websites with accessibility in mind.

  • you can start with this study [useit.com]

    I came across it on stumbleupon [stumbleupon.com] a few weeks ago.

  • Big fonts - light and pleasing colours - useful/necessary content
    The three fundamental rules for a website. Since it's for they elderly, you might want to use a bigger font. Keeping in mind that many of them could be visually challenged, use good colour combinations and finally, make sure you have all the important content easily accessible. HTML Hell Page [catb.org] might help ya
  • It may be a little late to post this, but this book (which was mentioned on Slashdot, partly because of the 'goatse'-like cover), 'Building Accessible Websites' [joeclark.org] is really great. It's available free on-line, and the whole site is a great example of accessibility. (Turn CSS on and off it your browser allows it, Opera does, change the font sizes, etc. It works great by screen reader too.) Fairly practical, much more so than certain 'reccommendations' from accessibility standards groups.
  • U have had heaps of good tips coming through

    Looking from the start of the project

    When doing stakeholder interviews it is a good idea to also interview the end users of a site. Speak to elderley and disabled users if they are a main target group and get a feel for the problems they experience on other sites. If this is not possible read up the users - W3C has good overview on the probs they have and the type of Assistive Technologies (ATs) they may use to surf the web. To give you a bit of feel for how y
  • The gubment has set up a site for web site design...

    www.usability.gov [usability.gov]

    could be useful
  • Elderly Targets? (Score:3, Interesting)

    by TastyWords ( 640141 ) on Sunday May 09, 2004 @09:54AM (#9099558)
    My grandmother is eighty-six and uses a reguar monitor and keyboard. She doesn't seem to have any problems using a standard monitor and keyboard. If you send her email, you'll get some back and in a pretty short period of time. She spends a lot of time surfing the web for some research she's working on.

    And before she goes on her 3-mile walk every morning, she sends my mom email to tell her she was still alive and made it through another night.

    Oh, she has had some knee pain problems so she's had one replaced and the other is due soon. The doctor said if all of his patients would walk that far before surgery, the physical therapy would be a lot less painful and much shorter.
  • You don't mention what they want that you don't think is aesthetically pleasing, but remember that in your position you have *two* distinct sets of customers - the elderly group you're building the web site for, and anyone purchasing from them. Your primary responsibility, provided that everything is ethically sound, is to those that 'hired' you.

    Ask them why they want features that you think are aesthetically unpleasing - they're artists, right? Shouldn't that mean they have some aesthetic sense and migh

A morsel of genuine history is a thing so rare as to be always valuable. -- Thomas Jefferson

Working...