Slides from my presentation at DSAI 2015: Exploring web attributes related to image accessibility and their impact on search engine indexing

1. Exploring web attributes related
to image accessibility and their
impact on search engine indexing
Reinaldo Ferraz – CEWEB.br

2. Objective
• Facilitate the participation of Brazilian community in global Web development
enviroment
Mission
• Promote activities that encourage the use of open technologies and
standardized on the Web.
Web Technologies Study Center

3. • Accessible images on the web
• ALT and TITLE attributes
• Search Engine Optimization
• The experiment
• Exploring the ALT attribute
• Exploring the TITLE attribute
• Conclusion
Summary

4. • Images on the web needs alternative text, for screen readers users
Accessible images on the web
Picture of
keyboard
keys W, 3
and C

5. • ALT attribute is used to show alternative content in images
• <img src=“pic.jpg" alt=“Picture of keyboard keys W, 3 and C">
• TITLE attribute is used to provide complementary information
• <img src=“pic.jpg" title=“Credits: John Lord">
ALT and TITLE attributes

6. ALT and TITLE attributes
<img src="ULjpB0be_400x40.jpg"
alt="Ceweb.br "
title=“Web Technologies Study Center">

7. • The technique of developing websites in a way that they are search-
engine friendly is called Search Engine Optimization (SEO).
• This technique consists of a group of technical strategies used to
increase the number of visitors to a website by obtaining a high-
ranking position in the search engine results page
• Search engine optimization is based on making small modifications
to parts of websites (including image descriptions).
Search Engine Optimization

8. • Alternative texts are important for Web Accessibility but how this
texts are indexed by search engines on the Web?
• Three images were published in a post in my personal blog.
• Images were published without ALT/TITLE attribute declared. The
page was updated later with the attributes filled.
• The tests were made using Google, Bing, DuckDuckGo and Yahoo
search engine and the SEO verification tools Site Analyser,
WooHank and SEO Works
• The SEO verification tools were chosen at random and there was no
intention of promoting or recommending their use.
The experiment

9. During the first phase of testing, three images were published on the
blog http://www.reinaldoferraz.com.br, without ALT or TITLE attributes.
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/tr47ujhtt767.png">
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/aswe98jdk93.png">
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/yjjl9675yp.png">
Exploring ALT attribute

10. The content was indexed by search engines.
Exploring ALT attribute

11. The page was scanned by three automatic SEO checker tools.
Exploring ALT attribute

12. Exploring ALT attribute

13. Exploring ALT attribute

14. Second part: The images had their ALT attributes properly declared (in
portuguese).
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/tr47ujhtt767.png"
alt="Foto de um pão francês em um prato branco" >
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/aswe98jdk93.png"
alt="Foto de uma ampulheta" >
<img src="http://www.reinaldoferraz.com.br/wp-
content/uploads/2014/02/yjjl9675yp.png"
alt="Foto de uma placa com o mapa do
zoológico de São Paulo" >
Exploring ALT attribute

15. The tests were repeated using the same tools as in the previous phase.
Exploring ALT attribute

16. Repeating the tests using the same SEO tools
Exploring ALT attribute

17. Exploring ALT attribute

18. Exploring ALT attribute

19. Exploring ALT attribute

20. Exploring ALT attribute

21. Exploring ALT attribute

22. Exploring ALT attribute

23. The second experiment verified how the content of the TITLE attribute
affected search results and if it is important to web accessibility.
Exploring TITLE attribute

24. Exploring TITLE attribute

25. • TITLE attribute is not indexed by search engine
• TITLE attribute has no weight for SEO verification tools
• TITLE attribute tooltip is only available via mouseover
• TITLE attribute is not implemented in the same way in three different
screen readers:
• JAWS does not read TITLE by default. It is necessary to set
the screenreader to read ALT or TITLE attributes of the page
• NVDA reads the attribute but does not identify which is ALT or
TITLE content
• VoiceOver reads TITLE attribute after a few seconds of
silence after read the ALT attribute
Exploring TITLE attributes

26. • The ALT attribute plays an important role in describing images on a
web page.
• ALT attribute content is indexed by Google Search Engine
• Only Google indexed the ALT attribute content: Yahoo, DuckDuckGo
and Bing did not show the attribute content in their search results.
• The TITLE attribute in images is not useful for SEO. The content in
images is not indexed.
• In terms of accessibility, the TITLE attribute is not keyboard-
accessible, and has not been implemented in a standardized
manner by screen readers.
Conclusions

27. Thank you
www.ceweb.br
reinaldo@nic.br @reinaldoferraz
June, 11th, 2015