Accessibility
- The business case for web accessibility

31-10-13

@SiteimproveUK #Siteimprove13

1
Why is it important?

31-10-13

2
By numbers
• Worldwide 750 million people
have a disability
• Surveys show that these users
spend even more time logged
on...
Benefits
•
•
•
•
•
•
•
•

Accessible sites are generally more usable to everyone
It helps viral marketing when all custome...
CASE: UK Legal and General Online Application Company
Added accessibility features:
•Search engine traffic: 50% increase
•...
Accessibility is a right
The Equality Act came into force in
October 2010
” A person ... concerned with the
provision of a...
”Google is also blind”
•

Page titles

•

Alternative text for images

•

Headings

•

Link texts

– Unique and containing...
Consider also
•
•
•
•

Avoiding text in images
Transcripts for audio / video
Avoid JavaScript in menus
Programmatic order ...
Small changes with a big effect
Label for=”Search”

c
alt=”Go”

Image: SmallCart400.jpg
alt=”Add to cart”

31-10-13

Sign ...
Whom and what?
• Designers

– Accessible colours and structure

• Vendors / developers

– A CMS supporting accessible
publ...
The good case – start at day 0
• As soon as you talk about a new
website – think accessibility
• Accessibility is a proces...
Make requirements
• When doing requirement
specifications include
accessibility
– State individual WCAG
requirements
– Pic...
Remember CMS editor
•
•
•
•
•
•
•

Handle alternative texts for images
The use of headings
The ability to create accessibl...
Design Phase
•
•
•
•

Navigation
The use of headings
Colours and contrasts
Link texts and descriptions where
the user is t...
Development
Most criteria are relevant
•Important that the people developing
the solution have a solid
understanding of ac...
Publishing Content
• Training web editors to publish
content the 'accessible way‘
– helps improve your website's
accessibi...
Media Players, Forms and Old Content
Areas often being neglected are where
3rd party solutions are used
•Media players
•Fo...
Accessibility Top 5
Text for everyone
Versatility
Association
Colour for everyone
Robustness

31-10-13

19
Text for everyone
• Make sure all text can be
highlighted and read aloud so that
screen readers and reading tools
can acce...
Text for everyone II
• Give alternative text for
images for those (screen
readers and search
engines) that cannot see
an i...
Versatility
Create a website that can be used
by as many as possible, in as many
ways as possible according to user
needs....
Association
• Text, headings, buttons, fields
etc. that are logically connected
must also visually be connected.
• Make su...
Colours for all
•

•

Make sure that the colour of the
background and colour of the text is in
sufficient contrast to each...
31-10-13

25
Robustness
• Have a consistent design
throughout the website
• Follow known conventions
• Follow the standard for the
form...
Documents
• Structure documents
–
–
–
–
–

Headings
Lists
Tables
Alternative text for images
Columns

• Ensure reading ord...
More information
• Webinars
• Blog Posts
• Whitepaper

31-10-13

@SiteimproveUK #Siteimprove13

28
Upcoming SlideShare
Loading in...5
×

Siteimprove - Accessibility business case

216

Published on

Siteimprove - Accessibility business case

Siteimprove Customer Workshop October 2013

Published in: Design, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
216
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • {}
  • Transcript of "Siteimprove - Accessibility business case"

    1. 1. Accessibility - The business case for web accessibility 31-10-13 @SiteimproveUK #Siteimprove13 1
    2. 2. Why is it important? 31-10-13 2
    3. 3. By numbers • Worldwide 750 million people have a disability • Surveys show that these users spend even more time logged on • Example: 95 % of blind people shop online – they share their experiences on mailing lists 31-10-13 3
    4. 4. Benefits • • • • • • • • Accessible sites are generally more usable to everyone It helps viral marketing when all customers find it usable You protect your brand Benefits from enabling people with disabilities and older users to interact with them online instead of more costly ways Reducing risk of legal action, high legal expenses, and negative image A more robust website (works on many platforms and with assistive technologies) Reduce resources – using standards-based production techniques CSR benefits 31-10-13 4
    5. 5. CASE: UK Legal and General Online Application Company Added accessibility features: •Search engine traffic: 50% increase •Site Maintenance: £200k savings per year •Completed applications: 90% increase •Conversion rate: 4% to 9% - SSB BART GROUP 31-10-13 5
    6. 6. Accessibility is a right The Equality Act came into force in October 2010 ” A person ... concerned with the provision of a service to the public or a section of the public (for payment or not) must not discriminate against a person requiring the service by not providing the person with the service”. 31-10-13 6
    7. 7. ”Google is also blind” • Page titles • Alternative text for images • Headings • Link texts – Unique and containing key words for the web page – Where the image conveys important information – Using H-tags and not just large text or bold text – ‘Click here’, ‘Read more’ and such should be avoided 31-10-13 7
    8. 8. Consider also • • • • Avoiding text in images Transcripts for audio / video Avoid JavaScript in menus Programmatic order of content 31-10-13 8
    9. 9. Small changes with a big effect Label for=”Search” c alt=”Go” Image: SmallCart400.jpg alt=”Add to cart” 31-10-13 Sign up for newsletter 9
    10. 10. Whom and what? • Designers – Accessible colours and structure • Vendors / developers – A CMS supporting accessible publishing – A technical solution comforming with the requirements • Web editors – Use CMS in a way that maintains accessibility – Upload accessible content 31-10-13 10
    11. 11. The good case – start at day 0 • As soon as you talk about a new website – think accessibility • Accessibility is a process and not a project and it is relevant throughout the lifetime of a website • Include design guides and communications guides 31-10-13 11
    12. 12. Make requirements • When doing requirement specifications include accessibility – State individual WCAG requirements – Pick from ATAG and make requirements 31-10-13 12
    13. 13. Remember CMS editor • • • • • • • Handle alternative texts for images The use of headings The ability to create accessible data tables How to make quotes (<q> and <blockquote>) How to enter page titles How the HTML code created by the CMS complies with the W3C standards How to tag change of language in the text entered 31-10-13 13
    14. 14. Design Phase • • • • Navigation The use of headings Colours and contrasts Link texts and descriptions where the user is to click on, fill out or choose content on web pages Have the design looked at with accessibility in mind 31-10-13 14
    15. 15. Development Most criteria are relevant •Important that the people developing the solution have a solid understanding of accessibility •Make sure you thoroughly test the solution at various points throughout the process •It's especially important that the templates for different pages are tested as early as possible 31-10-13 15
    16. 16. Publishing Content • Training web editors to publish content the 'accessible way‘ – helps improve your website's accessibility rather than introducing new issues • Have policies on what and how to publish 31-10-13 16
    17. 17. Media Players, Forms and Old Content Areas often being neglected are where 3rd party solutions are used •Media players •Forms •Social Media links Remember to consider old content being migrated from the old system 31-10-13 17
    18. 18. Accessibility Top 5 Text for everyone Versatility Association Colour for everyone Robustness 31-10-13 19
    19. 19. Text for everyone • Make sure all text can be highlighted and read aloud so that screen readers and reading tools can access them – Turning off style sheets – Try it with reading tools / test with real users • Avoid images of text where possible. Where not, make sure that text alternatives are equivalent 31-10-13 20
    20. 20. Text for everyone II • Give alternative text for images for those (screen readers and search engines) that cannot see an image. An alternative text must reflect the purpose of the image. 31-10-13 Decorative / creating visual context: no alternative text Having a function: describe the function Linking: Describe destination 21
    21. 21. Versatility Create a website that can be used by as many as possible, in as many ways as possible according to user needs. •All functionality can be used with a mouse •All functionality can be used without a mouse – from the keyboard alone. 31-10-13 22
    22. 22. Association • Text, headings, buttons, fields etc. that are logically connected must also visually be connected. • Make sure it is also connected in the code. 31-10-13 23
    23. 23. Colours for all • • Make sure that the colour of the background and colour of the text is in sufficient contrast to each other. That way people with low vision can also read it. Make sure you do not give information to the user only by use of colour (such as saying ‘In the green box you will find…’). Otherwise it can create problems for both users with low vision or no vision, or people with colour blindness. 31-10-13 Can you read this? Can you read this? 24
    24. 24. 31-10-13 25
    25. 25. Robustness • Have a consistent design throughout the website • Follow known conventions • Follow the standard for the format you are publishing in (for example xhtml 4.1 syntax) – this will optimise your website for many different platforms and user agents 31-10-13 26
    26. 26. Documents • Structure documents – – – – – Headings Lists Tables Alternative text for images Columns • Ensure reading order • Save as pdf – do not print as pdf 31-10-13 27
    27. 27. More information • Webinars • Blog Posts • Whitepaper 31-10-13 @SiteimproveUK #Siteimprove13 28

    ×