A Type of Accessibility
•
4 likes•1,018 views
This document discusses email accessibility and typography. It is authored by Paul Airy, an email designer and developer. The document discusses the challenges of applying web accessibility guidelines like WCAG to email. However, it argues that focusing on guidelines we can implement, like using semantic HTML tags and ensuring adequate color contrast, can make email more accessible. It provides tips for email designers like using minimum font sizes, line heights, and including text alternatives for images. The goal is to make email accessible to more people, including those with disabilities, while recognizing the technical limitations of the medium.
Recommended
More Related Content
Similar to A Type of Accessibility
Similar to A Type of Accessibility (20)
Recently uploaded
Recently uploaded (20)
A Type of Accessibility
- 1. Beyond the Envelope™@Paul_Airy A Type of Accessibility.
- 3. Beyond the Envelope™@Paul_Airy Paul Airy. Email Designer and Developer
- 4. Beyond the Envelope™@Paul_Airy Beyond the Envelope™ Research, Design and Development
- 7. Beyond the Envelope™@Paul_Airy Side Projects. Typography in Email
- 8. Beyond the Envelope™@Paul_Airy Beyond the Envelope™
- 9. Beyond the Envelope™@Paul_Airy Type E: beyondtheenvelope.co.uk/type-e.php
- 10. Beyond the Envelope™@Paul_Airy Beyond the Envelope™ A Type of email. A handbook for working with HTML typography in email Paul Airy Foreword by Justine Jordan, Marketing Director, Litmus. EEC Email Marketer Thought Leader of the Year, 2015.
- 14. Beyond the Envelope™@Paul_Airy A Type of Accessibility.
- 15. Beyond the Envelope™@Paul_Airy 3 ‘Things’.
- 16. Beyond the Envelope™@Paul_Airy 1. Recognise the challenges.
- 17. Beyond the Envelope™@Paul_Airy 2. Look beyond the challenges.
- 18. Beyond the Envelope™@Paul_Airy 3. Typographic Tips.
- 19. Beyond the Envelope™@Paul_Airy “To empower you, to empower people, to use email.” Paul Airy.
- 20. Beyond the Envelope™@Paul_Airy Who are they?
- 21. Beyond the Envelope™@Paul_Airy “There are 9.4 million disabled people in England, accounting for 18% of the population.” 2011 Census.
- 22. Beyond the Envelope™@Paul_Airy “About 56.7 million people — 19% of the population — had a disability in 2010.” United States Census Bureau.
- 28. Beyond the Envelope™@Paul_Airy My friend, Ben…
- 31. Beyond the Envelope™@Paul_Airy Reading and writing age of around 14-16 Uppercase and lowercase hard to distinguish What challenges does Ben have? Words jump around Misses context when scanning text Tiring and embarrassing experience
- 32. Beyond the Envelope™@Paul_Airy The ability to ‘highlight’ text so he can hear it How can Ben be helped? Hasn’t yet found a flawless solution He’s always looking for something better We can help him The solutions that do exist, rely on ‘live’ text
- 33. Beyond the Envelope™@Paul_Airy Who else?
- 34. Beyond the Envelope™@Paul_Airy The BIG picture.
- 38. Beyond the Envelope™@Paul_Airy Everyone benefits.
- 39. Beyond the Envelope™@Paul_Airy The Challenges.
- 40. Beyond the Envelope™@Paul_Airy Challenge 1: Our thinking.
- 41. Beyond the Envelope™@Paul_Airy Web Accessibility Initiative (WAI)
- 42. Beyond the Envelope™@Paul_Airy Web Content Accessibility Guidelines
- 43. Beyond the Envelope™@Paul_Airy WCAG 2.0 Web Content Accessibility Guidelines
- 44. Beyond the Envelope™@Paul_Airy A, AA, AAA
- 46. Beyond the Envelope™@Paul_Airy Good News!
- 47. Beyond the Envelope™@Paul_Airy “The idea that an accessible email is one that ticks all the WCAG boxes – is a myth!!!” Paul Airy.
- 48. Beyond the Envelope™@Paul_Airy Myth No. 5: If You Fail One of the WCAG Techniques, Then You Fail WCAG 2.0; FALSE. http://www.w3.org/WAI/GL/wiki/WCAG_Myths
- 49. Beyond the Envelope™@Paul_Airy P.O.U.R. Four Principles
- 53. Beyond the Envelope™@Paul_Airy Guideline 1.4.6 (WCAG) “Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 4.5:1;” Paraphrased from http://webaim.org/standards/wcag/checklist
- 54. Beyond the Envelope™@Paul_Airy Guideline 1.4.6 (WebAIM) “Large text (over 18 point or 14 point bold) has a contrast ratio of at least 4.5:1.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 55. Beyond the Envelope™@Paul_Airy Challenge 2: Putting it into practice.
- 56. Beyond the Envelope™@Paul_Airy Guideline 1.3.1 “Tables are used for tabular data. Where necessary, data cells are associated with their headers.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 57. Beyond the Envelope™@Paul_Airy In email we use tables for structure, not data We don’t use the table heading, <th> tag Challenges to the Guidelines
- 58. Beyond the Envelope™@Paul_Airy Guideline 1.3.1 “Semantic markup is used to designate headings, lists, emphasized or special text, etc.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 59. Beyond the Envelope™@Paul_Airy Semantic markup is often sacrificed for consistency <span> instead of <h1>, <h2>, <h3> Challenges to the Guidelines Text ‘loose’ within a <td> rather than using a <p> So called ‘Get To Fixing Outlook’
- 60. Beyond the Envelope™@Paul_Airy “We can implement ‘a level of accessibility’ if we look beyond the challenges.” Paul Airy.
- 61. Beyond the Envelope™@Paul_Airy Beyond the Challenges.
- 62. Beyond the Envelope™@Paul_Airy “Focus on what you CAN do, not what you can’t do.” Paul Airy.
- 63. Beyond the Envelope™@Paul_Airy Guideline 1.1.1 “All images … have appropriate, equivalent alternative text.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 65. Beyond the Envelope™@Paul_Airy Guideline 1.1.1 “Images that do not convey content… are given null alt text (alt="").” Paraphrased from http://webaim.org/standards/wcag/checklist
- 67. Beyond the Envelope™@Paul_Airy Guideline 1.3.2 “The reading and navigation order (determined by code order) is logical and intuitive.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 70. Beyond the Envelope™@Paul_Airy Use HTML text.
- 71. Beyond the Envelope™@Paul_Airy Guideline 1.4.5 “If the same visual presentation can be made using text alone, an image is not used to present that text.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 73. Beyond the Envelope™@Paul_Airy Guideline 1.3.3 “Instructions do not rely upon shape, size, or visual location (e.g., "Click the square icon to continue".” Paraphrased from http://webaim.org/standards/wcag/checklist
- 74. Beyond the Envelope™@Paul_Airy Minimum bodytext size font-size:14px;
- 75. Beyond the Envelope™@Paul_Airy Webkit resize? -webkit-text-size- adjust:none;
- 78. Beyond the Envelope™@Paul_Airy Apply 1.5x line-height on bodytext.
- 79. Beyond the Envelope™@Paul_Airy Guideline 1.4.8 “Have adequate line spacing (at least 1/2 the height of the text) and paragraph spacing (1.5 times line spacing).” Paraphrased from http://webaim.org/standards/wcag/checklist
- 82. Beyond the Envelope™@Paul_Airy Include ‘Alt’ text on images.
- 83. Beyond the Envelope™@Paul_Airy Guideline 1.1.1 “All images … have appropriate, equivalent alternative text.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 84. Beyond the Envelope™@Paul_Airy ‘Alt’ Text
- 85. Beyond the Envelope™@Paul_Airy style=“font- family:Courier, monospace; font-size: 20px; line-height:30px; color:#ffffff;”
- 86. Beyond the Envelope™@Paul_Airy Styled ‘Alt’ Text
- 87. Beyond the Envelope™@Paul_Airy Use semantic tags.
- 88. Beyond the Envelope™@Paul_Airy Guideline 1.3.1 “Semantic markup is used to designate headings, lists, emphasized or special text, etc.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 89. Beyond the Envelope™@Paul_Airy <h1>, <h2>, <h3>, <p>, <li>
- 92. Beyond the Envelope™@Paul_Airy <h1 style=“margin:0; font-weight:lighter;
- 94. Beyond the Envelope™@Paul_Airy Blue Links.
- 95. Beyond the Envelope™@Paul_Airy Blue Links
- 96. Beyond the Envelope™@Paul_Airy .appleBlueLinks a {color:#000000 !important; text-decoration:none;}
- 97. Beyond the Envelope™@Paul_Airy <span class= “appleBlueLinks”> 01234 567890</span>
- 99. Beyond the Envelope™@Paul_Airy Guideline 1.4.3 “Text and images of text have a contrast ratio of at least 4.5:1.” Paraphrased from http://webaim.org/standards/wcag/checklist
- 105. Beyond the Envelope™@Paul_Airy Create a ‘Text Only’ version. Screen Readers and Wearables
- 106. Beyond the Envelope™@Paul_Airy Accessibility benefits everyone W3C WCAG are just that – guidelines In summary Failure to comply with all the guidelines is not failure There’s levels of accessibility we’re already implementing We can do more, such as use semantic tags There’s tools out there to help
- 107. Beyond the Envelope™@Paul_Airy One more thing…
- 108. Beyond the Envelope™@Paul_Airy “The truth is, you’re never going to be able to cater for every disability. But, that’s no reason to disregard accessibility.” Paul Airy.
- 110. Beyond the Envelope™@Paul_Airy Thank you.