We’re starting the process of rebuilding and redesigning this site (E-consultancy.com) and would like to make the future version as accessible as possible. This current version isn’t bad but it certainly isn’t best practice in terms of accessibility.
The reason is that I understand that ideally, fonts should all be resizable, screen readers should be able to skip to the main content of a page, and that the design should be available in different contrasts.
Assuming that the coding and design allows these things to be done, what I’m not clear on though is what is best practice in how you actually display these options (or not).
For example, do you actually need to show a font resizing option visibly on the web page or can you rely on the user knowing how to do this via the browser? Presumably if the user wants the fonts to be much bigger then you’d either have to rely on them knowing how to do this or you’d have to make this option very big and visible or they might not even see this in the first place? The same would be true of different contrast options?
I don’t know enough about how screen readers work (or how the latest browsers, or underlying HTML code work together) to know whether the ‘skip to content’ link needs to be actually shown on the page? And, if so, where should it to (presumably right near the top if you are using a screen reader?) And could it be shown as very small text (even ‘hidden’ text e.g. grey on grey) given that the user isn’t ‘seeing’ it anyway but hearing it? For normally-sighted users a big ‘skip to content’ link at the top might appear like the dreaded ‘skip intro’ link?
The different sites I’ve looked at don’t appear to have any consistent guidance on the above…? Any thoughts from the experts out there?
We'd always recommend supplying a visible font resizer as most users don't know they can resize text in the browser (we see this time and time again in user testing). Yes, you could argue that it's not your problem if they don't know this (which ultimately it isn't) but if it benefits your users then it's in your interests to do it. This is especially true if your redesigned site has the same small text you've got now - many of your users (regardless of disability) will likely find it difficult to read. Three A's of different sizes (as on our site) seems to work well as it's intuitive and easy to understand its function at a glance.
Providing further viewing options (e.g. different contrasts) is really optional and depends on how accessible you want to make the site. Alternate viewing options is most beneficial for sites that people regularly return to (which they will on yours) as they'll be more likely to spend the time to configure the site to suit their needs. High contrast versions work well for people with very limited vision but many of these users will have a screen magnifier that does this for them anyway. Dyslexic users can benefit from certain colour combinations too (e.g. dark blue on cream).
You should definitely supply a skip to content link as this is very beneficial for screen reader and keyboard only users. This will only work for the latter group if it's visible, but so as to not compromise the design you can make it invisible and then appear when tabbed on. To see this in action go to our website, start tabbing and you'll see it.
Our site does have guidance on all of this scattered throughout our accessibility articles section.
Hope that helps & looking forward to seeing the new design!
Great. Thanks Trenton - seems to make eminent sense. I was amazed to see that giant 'Skip to Content' button magically appear on your site when I tabbed... ;)
Ha ha! Actually, it's very important that the skip link is very noticeable and even gaudy - otherwise people could easily miss it when tabbing on to it (which obviously defeats the purpose of having it). Trenton
One advantage of using relative font sizes is that the users who have pre-set their browsers to display fonts at a larger size do not have to to anything when they arrive at the site. For example, a user that has chosen the 'larger' text size in IE7 under the Page>Text Size menu will always see text at an increased size on sites with relative text sizes, as the setting persists even if the browser restarts. To my knowledge it is possible to have on-screen controls without using relative text sizes (I am open to correction on this), and this would mean users that do pre-set IE7 would have to take an extra click to regain control.
Perhaps the best solution is to implement both systems - use relative font sizes and also provide on-screen controls.
Head of intranet team at Foriegn and Commonwealth Office
22 October 2007 10:14am
I don't disagree with anything Trenton has said, of course. However, I find resizing and options for changing appearance very cluttering if on every page. My preferred option is to have a separate page with all this information and setting options on and link to it. On that page you can explain the options fully, give them their appropriate context and link to other helpful resources, such as the rather good BBC's My web my way.
Good luck with your project. Don't forget your user testing - a little, often is better than a lot, but only occasionally IMHO.
There is an argument that skip links should be visible anyway. Currently I am doing the same as Trenton and providing skip links that are fully accessible by screen reader software but only visible on screen when tabbed to. To me this is more of a usability issue, and I think in future it will become an adopted convention (I'm not putting my money on which way it will go), in the same way that the > symbol has become a convention for breadcrumbs, or the trolley icon has become a convention for shopping basket (which has suddenly struck me as a bit wierd that a trolley should be the metaphor for a basket. Wierd, but of course not unusual in this strange world we live in).
Most people who need to change the font sizing in a browser will already have done so in their own browser settings or will be using screen magnifying software. There has been a lot of talk around this recently and WAI do it differently by showing how to change your broswer setting to increase the font size (known argument for this "give someone a fish and you can feed them for a day, teach them how to fish and they can feed themselves for the rest of their lives etc). They also have a really tidy visible skip to content link http://www.w3.org/WAI/
CEO at Econsultancy
19 October 2007 10:42am
We’re starting the process of rebuilding and redesigning this site (E-consultancy.com) and would like to make the future version as accessible as possible. This current version isn’t bad but it certainly isn’t best practice in terms of accessibility.
Not being an expert in accessibility, I’ve been looking around various other sites that should represent best practice (e.g. W3C’s Web Accessibility Initiative (WAI) or RNIB or Segala or Webcredible etc.).
The reason is that I understand that ideally, fonts should all be resizable, screen readers should be able to skip to the main content of a page, and that the design should be available in different contrasts.
Assuming that the coding and design allows these things to be done, what I’m not clear on though is what is best practice in how you actually display these options (or not).
For example, do you actually need to show a font resizing option visibly on the web page or can you rely on the user knowing how to do this via the browser? Presumably if the user wants the fonts to be much bigger then you’d either have to rely on them knowing how to do this or you’d have to make this option very big and visible or they might not even see this in the first place? The same would be true of different contrast options?
I don’t know enough about how screen readers work (or how the latest browsers, or underlying HTML code work together) to know whether the ‘skip to content’ link needs to be actually shown on the page? And, if so, where should it to (presumably right near the top if you are using a screen reader?) And could it be shown as very small text (even ‘hidden’ text e.g. grey on grey) given that the user isn’t ‘seeing’ it anyway but hearing it? For normally-sighted users a big ‘skip to content’ link at the top might appear like the dreaded ‘skip intro’ link?
The different sites I’ve looked at don’t appear to have any consistent guidance on the above…? Any thoughts from the experts out there?
Thanks
Ashley Friedlein
CEO
E-consultancy.com
Director at Webcredible
19 October 2007 17:42pm
Hi Ashley
My two cents...
- We'd always recommend supplying a visible font resizer as most users don't know they can resize text in the browser (we see this time and time again in user testing). Yes, you could argue that it's not your problem if they don't know this (which ultimately it isn't) but if it benefits your users then it's in your interests to do it. This is especially true if your redesigned site has the same small text you've got now - many of your users (regardless of disability) will likely find it difficult to read. Three A's of different sizes (as on our site) seems to work well as it's intuitive and easy to understand its function at a glance.
- Providing further viewing options (e.g. different contrasts) is really optional and depends on how accessible you want to make the site. Alternate viewing options is most beneficial for sites that people regularly return to (which they will on yours) as they'll be more likely to spend the time to configure the site to suit their needs. High contrast versions work well for people with very limited vision but many of these users will have a screen magnifier that does this for them anyway. Dyslexic users can benefit from certain colour combinations too (e.g. dark blue on cream).
- You should definitely supply a skip to content link as this is very beneficial for screen reader and keyboard only users. This will only work for the latter group if it's visible, but so as to not compromise the design you can make it invisible and then appear when tabbed on. To see this in action go to our website, start tabbing and you'll see it.
Our site does have guidance on all of this scattered throughout our accessibility articles section.Hope that helps & looking forward to seeing the new design!
Trenton, Webcredible
CEO at Econsultancy
19 October 2007 17:55pm
Great. Thanks Trenton - seems to make eminent sense. I was amazed to see that giant 'Skip to Content' button magically appear on your site when I tabbed... ;)
Ashley
Director at Webcredible
19 October 2007 18:07pm
Ha ha! Actually, it's very important that the skip link is very noticeable and even gaudy - otherwise people could easily miss it when tabbing on to it (which obviously defeats the purpose of having it).
Trenton
Lead Researcher at The Customer Respect Group
20 October 2007 13:16pm
One advantage of using relative font sizes is that the users who have pre-set their browsers to display fonts at a larger size do not have to to anything when they arrive at the site. For example, a user that has chosen the 'larger' text size in IE7 under the Page>Text Size menu will always see text at an increased size on sites with relative text sizes, as the setting persists even if the browser restarts. To my knowledge it is possible to have on-screen controls without using relative text sizes (I am open to correction on this), and this would mean users that do pre-set IE7 would have to take an extra click to regain control.
Perhaps the best solution is to implement both systems - use relative font sizes and also provide on-screen controls.
Mark Crowley
Head of intranet team at Foriegn and Commonwealth Office
22 October 2007 10:14am
I don't disagree with anything Trenton has said, of course. However, I find resizing and options for changing appearance very cluttering if on every page. My preferred option is to have a separate page with all this information and setting options on and link to it. On that page you can explain the options fully, give them their appropriate context and link to other helpful resources, such as the rather good BBC's My web my way.
Good luck with your project. Don't forget your user testing - a little, often is better than a lot, but only occasionally IMHO.
Director at QM Consulting Ltd
23 October 2007 10:46am
There is an argument that skip links should be visible anyway. Currently I am doing the same as Trenton and providing skip links that are fully accessible by screen reader software but only visible on screen when tabbed to. To me this is more of a usability issue, and I think in future it will become an adopted convention (I'm not putting my money on which way it will go), in the same way that the > symbol has become a convention for breadcrumbs, or the trolley icon has become a convention for shopping basket (which has suddenly struck me as a bit wierd that a trolley should be the metaphor for a basket. Wierd, but of course not unusual in this strange world we live in).
Richard Morton
http://www.qm-consulting.co.uk/
blaa at blaa
25 October 2007 14:02pm
Most people who need to change the font sizing in a browser will already have done so in their own browser settings or will be using screen magnifying software. There has been a lot of talk around this recently and WAI do it differently by showing how to change your broswer setting to increase the font size (known argument for this "give someone a fish and you can feed them for a day, teach them how to fish and they can feed themselves for the rest of their lives etc). They also have a really tidy visible skip to content link http://www.w3.org/WAI/