CoffeePowered

Font sizes and accessibility

There’s been a common query pushed my way recently, asking whether the font size used on a recent project was too small, and may pose an accessibility issue. From what I gather, each person who posed this query had good eyesight, and could read the text perfectly, they simply believed it may be an issue for other people.

The fact that I’m hearing more of this type of query shows that there’s an increased awareness of accessibility issues, which is fantastic, the problem is that while people are aware there *could* be an issue, most people aren’t sure *if* there is an issue. So the question i’d like to answer is “when does font size become an accessibility issue?”.

The Large Font Myth

It is a myth that all websites must have large font sizes in order to be accessible, possibly fueled by increasing screen sizes and resolutions, the (arguable) death of 800×600 resolutions and the recent “web 2.0″ design trend where sites commonly feature supersized text, forms and buttons, we’ve seen this big-type trend on a multitude of sites. Early versions of the recent BBC Redesign featured even larger fonts than the relatively large ones that currently feature.

The useage of small fonts can cause problems for certain users when they are too small to be reliably read, most of the time we’re concerned that the user may suffer from some form of visual impairment, wether through naturally poor eyesight, disability or old age, but there is also the users context to cater for, where the user may not be sat at a regular desktop computer, but viewing the site on a handheld mobile device, or the site may be projected onto a large screen at a distance to the user, or through a games console on a regular TV set at a lower resolution than a computer monitor.

The main accessibility issue for small fonts comes with the use of fixed font sizes, where the size is specified as an exact pixel size. If the text is set to a pixel size, older browsers cannot enlarge this text. To ensure text can be resized within the browser, we specify fonts as ‘relative’ sizes either in EM’s or percentage sizes (there’s also point sizes and size keywords, but we rarely use those due to inconsistent sizing across browsers).

The ISS Web Team conforms to various accessibility standards, such as WCAG (at a AA compliance level) and SENDA neither of which place any restrictions on minimum font sizes, but do specify that the text must be resizeable upto 200% without loss of functionality*. This, of course, is perfectly possible through the users browser.

*I refer to the 2.0 version of the WCAG guidelines, which at the time of writing has moved to final recommendation status, and should be in effect towards the end of 2008.

Resizing text

All browsers provide functionality to easily change the font size to the users preference, the common shortcut for this function is to hold down the CTRL key and scroll the mousewheel or press the +/- keys (command & scroll or +/- on Mac). While this is a common feature, there are differences in this functionality across the browser range.

Older browsers such as Internet Explorer 6 and Firefox 2 scale the text only, leaving images and page layout in their normal sizes, the site has to have been designed to cope with expanding text so as not to break the layout or destroy the content. This is commonly referred to ‘elastic’ layout. Elastic layouts are crucially important in modern web design and a deciding factor in how accessible pages are once the text has been resized, referring back to the 1.4.4 guideline of the WCAG2.0 specification.

The latest releases of most modern browsers now support ‘full page zoom’ technology, this causes the whole website to be scaled based on user preferences. Including layout and imagery meaning that in these browsers the layout no longer has to be elastic as the whole site is enlarged, or reduced to suit, however layouts and content containers should always be designed to be elastic, as older browsers such as IE6 and various mobile browsers do not, and will never support full page zoom.

Is there an accessibility issue?

The mechanisms I’ve detailed allow any user to resize webpage text to suit their preferences, whether visually impaired or not. Through our design work here in the Web Team we always set the default font to a suitable size in order to be readable by the vast majority of users, ensuring than the content can be easily modified to suit user needs, rather that attempting to second-guess every user scenario.

To answer my earlier question of “When does font size become an accessibility issue” My answer is that as Web Designers we must deliver the content through a design which will accomodate the preferences of our users, and be flexible enough to cope with whatever they decide to throw at it, wether they require larger fonts, higher contrast layouts or for the content to be read out loud through a screen reader, or provided via a tactile interface such as a brail printer. There is no clear rule which defines the “best minimum font size” as that’s a question only our users can answer for themselves, as long as it can be changed to suit their preferences, there is no accessibility issue.