Accessible Web Typography an Introduction for Web Designers
Total Page:16
File Type:pdf, Size:1020Kb
Accessible Web Typography An introduction for web designers Jim Byrne, 2003 Welcome and thanks Publisher and copyright information About the author Section One: Making good font choices Increase accessibility by making informed font choices Why would you want to control the text on a Web page? Issues that can make it difficult to control how your text looks to your site visitors. The difference between screen fonts and printer fonts Readable on-screen fonts web fonts in practice Why not use images instead? Is it a good idea to use embedded fonts? What is the best font to use for accessibility? Summary of section one Section Two: Text size Accessible web text - sizing up the issues. How do we get out of the way of the user? Are you sure the unit of measurement used is that important? Why can't I use points to set text size? Controlling text size with relative units Using Cascading Style Sheets Em units in practice Increase accessibility and readability by making informed font choices 10/28/03 8:49 PM Alternative relative units - relative keywords Should you use X-height? Using absolute size keywords Why not use pixels? What relative unit is best? Problems with the use of relative units What about using BIG and SMALL tags? Setting the size of text with the Font tag Say goodbye to pixel perfect layouts, and embrace flexible design principles Section Three: Usability Usability and readability issues Useful links Links by chapter for printing file:///Macintosh%20HD/Documents/Accessible%20Web%20Typography/PDF%20source/index.html Page 2 of 2 Welcome and thanks Thanks for purchasing 'Accessible Web Typography - an introduction for web designers'. This book contains all the important 'stuff' I ever wanted to know about creating accessible text on my own web pages; and now that I have figured it out myself, I am happy to pass it on to you. Don't hesitate to get in touch with your comments, or suggestion about how I could improve future editions of this book. Email me at, [email protected]. I look forward to hearing from you. I'd also like to take this opportunity to thank my wife Pat for encouraging me to publish this book, and for reading it over and correcting all my grammer and spelling mistakes. :-) Pat would not forgive me if I did not tell you about the great local community website all about the West End of Glasgow which she spends much of her time updating. Please pay a visit to http://www.glasgowwestend.co.uk, and tell Pat I sent you. I would like to thank Gez Lemon, and Dr Andrew Arch for their valuable feeback on the contents of this eBook. Gez runs the web developers information website Juicy Studio, and Andrew is the Manager of Online Accessibility Consulting, National Information & Library Service, and is a member of W3C Education & Outreach Working Group. All the best, Jim Accessible Web Typography An introduction for web designers Published by ScotConnect Copyright © 2003 by ScotConnect ScotConnect 2/L 23 Glasgow Street Hillhead Glasgow G12 8JW web: http://www.scotconnect.com email: [email protected] ISBN: 0-9545375-1-3 Published by ScotConnect - the web accessibility training company. About the author Jim Byrne has been programming computers and involved in the technical issues of computing since the late 1970s. He has been promoting the benefits of accessible web practices since 1996, when he founded the accessible web design consultancy 'The Making Connections Unit' with his colleague David Donald. He has written and spoken widely on the subject of accessible Web design, including on national radio and television. He also develops and delivers accessible web design training programmes for the private, public, and voluntary sector. Jim is a former Disability Information Officer and Trainer with The Wellbeing Initiative, and Lecturer at Glasgow Caledonian University. In 2001 he was identified as one of Scotland's 'movers and shakers in e-commerce in Scotland' for his work in the area of Web accesssibility (NB Magazine, June, 2001). Other publications Standards for Disability Information and Advice Provision in Scotland: Making Websites Accessible (November 2002) published by The Scottish Accessible Information Forum. ISBN 0-9543408-0-9 Towards a Communications and Information Technology Intensive Learning Environment: Supplementing a Political Economy Module: (2000) David Donald, Alan Hutton and Jim Byrne in Innovative Approaches to Learning and Teaching in Economics and Business Higher Education. Stafford University Press ISBN 1 897898 82 7 Extracurricular activities Photography (see Jim's West End Photo Diary at http:// www.glasgowwestend.co.uk/gallery/index.html). Writing songs and playing guitar. Assists his wife Pat run Pat's Guide to the West End of Glasgow; doing all the technical duties, including maintenance of a Linux Webserver. Author of a number of Web applications: QuicknEasyImage Pro - for making it easy to add photographs and other images to web pages in an accessible way. CommentIt - for adding comments to the bottom of web pages (now maintained by David Bayly as a plugin for Manila). FlathuntingPHP - for adding a flathunting service to a community website. BusinessListPHP - for adding a business listing service to a community website. PropertyListPHP - for adding a property sales service to a community website. EditIt - for simple forms based editing of web pages (for use with Frontier content management). AutoNews - for creating a simple news page (for use with Frontier content management). Accessible Web Typography Section One: Increase accessibility by making good font choices Text is your flexible friend; it can be transformed into audio or braille; used to describe non-text elements; and be presented visually in an infinite number of sizes. In the world of accessible design 'goodies' and 'baddies', text is a 'goodie'. Unfortunately, text also has the potential to be very bad; bad text is: unable to be changed to suit the preferences of the end user difficult to read due to font incompatibilites. so small it is unreadable inaccessible due to inadequate contrast between text and background or due to 'busy' backgrounds presented in inpenetrable blocks that make it difficult to read presented as an image - that can't be resized or read by people using screen readers. difficult to read because it is moving or blinking. This eBook provides simple strategies to ensure that visitors to the web pages you create, will not be taking up your valuable time by complaining that they couldn't access the content on your web pages. In sections two and three, we will explore the issues related to 'text size' and usability. In this first section, the emphasis will be on understanding how to choose fonts that are accessible, usable and appopriate to the aims of your site. The two roads to accessible web text As a Web designer committed to accessible Web design there are - in general - two approaches. You can take the easy route, summed up in the following phrase: It is better not to set a font size or type at all - but instead leave this decision to the user. Or the more difficult route - which involves learning about the vagaries of online typography and taking an active role in designing the text on your pages. For many designers control of web text is essential for reasons of branding, house style, subject appropriateness, or just plain old ego. Control of Web text can also realise usability gains; Cascading Style Sheets (CSS) provide limited control over margins, line width, line height, colour and font choice and size - all of which can help layout text in a way that makes it easier to read. And a Web page that is easier to read is a more accessible Web page. If you are happy to follow the first route (i.e. do nothing), you can stop reading now. Assuming readability is not compromised by inaccessible colour schemes, you already know enough to create accessible text for the Web. Visitors to your Website will be presented with the default font and font size they have set in their Web browser preferences - and they will be able to change these properties to suit their own needs. (There is one problem with this particular solution and that is that the majority of people probably do not know that they can change the default font in their browser preferences, or, indeed, how to do it.) If you decide that you need to, or want to, have some control over the size, colour, layout and typeface of the text on your Web pages, then you also need to 'buy into' the idea that you will never be able to completely control how a user will see your text. HTML was never designed to provide sophisticated typographic or layout capabilities. On the contrary its main job was to enforce the logical structure of documents; leaving the presentation of the page up to the individual capabilities of the computers and devices that would display the page. Although you can, with the help of CSS or the deprecated FONT tag, provide your own set of 'suggestions' about how a Web page should look - and we will examine what those are later in this book - users can override practically all of your choices by setting their own browser preferences. And on an accessible Website, that is how it should be. "you can't always get what you want, but if you try, sometimes you get what you need", Mick Jagger. file:///Macintosh%20HD/Documents/Accessible%20Web%20Typography/PDF%20source/intro.html Page 2 of 2 Accessible Web Typography Why would you want to control the text on a Web page? The typeface used on a Web page, or indeed any document, affects the way we feel about the content.