Slashdot Mirror
Large Print Graphics for Older Eyes?
random_nickname asks: "My lovely wife is a Graphic Designer with a small company which specializes in custom-made wine labels. She is re-designing the current site, to bring the code up-to-date and a little more shnazzy. Her boss is insisting that, due to their primary market - the elderly - she needs to create overly 'large-print' graphics, to make the site easier to browse for that demographic. My wife feels that this is unnecessary due to resolution control and monitor sizes, etc.. Are there sites out there that currently employ over-sized graphics for the elderly and has it made a difference in business? Is there a real need for this kind of solution?"
Instead of using
p { font-size:11px; }
Use
p { font-size:size; }
Where size takes any of the following values:
xx-small, x-small, small, medium, large, x-large or xx-large
That way visually impaired users can alter their browser's text setting to enlarge the fonts. This does not work with fonts set to pixel heights.
Try it out on this site:
http://www.georgiancourt.com.au/
Mike
The other thing you have to remember is that the vast majority of the elderly users don't have 21" monitors. Most probably have 14-15" CRTs, because that's what came with their $300 computer that their kids gave them for Christmas/Channukah/Kwanzaa/whatever. Also, most don't know how to change the default font sizes, and large print could really make your site stand out. If they struggle to read your competitors' sites, but find yours easy to read, and intuitive to navigate, they will visit your site more often.
Design on a 15" monitor, with 1024x768 resolution, and make the site easy to read from about 6' away, and you should be just about right. It will make a difference, and as long as the layout is intuitive, it will bring more people to your site. Web design for most sites out there is horrible, and many elderly find it hard to understand (hell, many of college kids have trouble with some).
In other words, increase the print size a little, but don't forget that the #1 thing that will help the older members of the population (and in fact younger people, too) is an intuitive interface and navigation. Also, no matter what you do, some people are going to need help, so make sure that the contact information is easy to find, and be sure to list a customer service phone number. A person that has trouble with a good web page will be more likely to also have trouble emailing a question, so why force them (like too many other sites do)?
--That's the point of being root, you can do anything you want, even if it's stupid.
Though my vision problems usually occur while drinking the wine, not when buying it. :)
But seriously, as a wine lover I really don't like these new-fangled labels the wine makers are coming up with. Give me something classic, you know, something with fonts that take a while decipher. And don't get me started on artificial corks. They might be better in all ways, but they are still wrong! And the next guy who tries to sell wine in a novelty bottle is going to need help from a proctologist to remove that bottle from his person.
OK, so that was completely off-topic and doesn't address your question at all, but at least it'll give you an idea of the level of logic you can expect from your target audience.
People couldn't type. We realized: Death would eventually take care of this.
First look at this stuff:/ www.w3.org/WAI/
http://diveintoaccessibility.org/
http:/
People already gave some advice on fonts. Here's some additional advice:
- provide an alternate stylesheet with increased font-sizes (specified in em), high contrast colors and if needed increased graphics sizes.
- specify sizes of other stuff in em as well (e.g. margins and paddings). This will make sure that the content will still look good if the fonts are resized.
- do not 'optimize' your site for a particular resolution.
Jilles
Hehe, Slashdot's not really a shining example of web accessibility, but it's a good place to ask for help none-the-less.
The first stops for help (as someone's no doubt pointed out already) should be:
Section 508
Mark Pilgrim's excellent "Dive Into Accessibility"
The W3C's web accessibility guide
The UK Disabled Rights Commission website, paying particular attention to the superb Interactive Demos (e.g. Inaccessible Website Demo).
Buy these books:
Constructing Accessible Websites
Building Accessible Websites
Oh, and a copy of Zeldman's Designing With Web Standards for good measure.
Write your pages using validating HTML or XHTML, and style the pages using CSS.
Validate your webpages using the W3C Validator and your CSS using the W3C CSS Validator. Use Watchfire's Bobby to validate your pages, and aim for AAA rating (also note that Bobby has some helpful hints when it does find errors).
Other excellent resources (in no particular order):
http://www.webstandards.org/
http://www.w3.org/WAI/References/QuickTips/
http://www.mezzoblue.com/
http://www.meyerweb.com/
http://www.simplebits.com/
http://www.whatdoiknow.org/
http://www.stopdesign.com/