Using SVG to develop web maps for people with visual disabilities




accessibility, web maps, SVG, geographical data


This paper addresses the problem of accessibility in geographical web maps. A person with disability cannot use, nowadays, a web map with the same functionality as other users do. This problem signifies a huge gap in universal usability, since a wide range of people are left out. This contravenes clearly the principles of the Web, which was created to be of the benefit of anyone in any circumstances. Some software projects have tackled this issue by providing an additional version of the program or just by not dealing with it at all. Our stance is to take a step further and integrate completely the accessibility within the user experience. Everything needed to use the web map –with or without disabilities– is deployed on the same view every user interacts with. This means that an accessible web map has been successfully developed, allowing users with disabilities to explore and navigate not in the same way, but with the same results which others benefit from. This solution opens a discussion about good ways of achieving accessibility, the implications of the current state of art in actual software development and the current awareness about this topic in the computer community.



Download data is not yet available.


Accessibility of Google Maps API. (2017, November 20). Retrieved from Google Issue Tracker:
Akasaka, R. (2018, March 15). Introducing “wheelchair accessible” routes in transit navigation. Retrieved from Google -The Keyword:
Brajnik, G. (2009). Validity and reliability of web accessibility guidelines. ACM SIGACCESS conference on Computers and accessibility (pp. 131-138). Pittsburgh: ACM. doi:
Cabrera-Goyes, E., & Ordóñez-Camacho, D. (2018). Posicionamiento en espacios interiores con Android, Bluetooth y RSSI. Enfoque UTE, 9(1), 118-126. doi:
Calle-Jiménez, T., & Luján-Mora, S. (2016). Accessible Online Indoor Maps for Blind and Visually Impaired Users. ACM SIGACCESS Conference on Computers and Accessibility (pp. 309-310). Reno: ACM. doi:
Calle-Jiménez, T., Eguez-Sarzosa, A., & Luján-Mora, S. (2018). Design of an Architecture for Accessible Web Maps for Visually Impaired Users. Advances in Human Factors and Systems Interaction (pp. 221-232). Orlando: Springer, Cham. doi:
Connor, A. (2010, April 2). Perceived Affordances and Designing for Task Flow. Retrieved from Johhny Holland:
Cormen, T. H., Leiserson, C. E., Rivest, R. L., & Stein, C. (2001). Section 24.3: Dijkstra's algorithm. In Introduction to Algorithms (pp. 596-601). McGraw-Hill.
Donoso, M. T. (2018, March 22). El pavimento podotáctil y la accesibilidad, Numbers Magazine. Retrieved from Numbers Magazine:
Ducasse, J., Brock, A., & Jouffrais, C. (2017). Accessible Interactive Maps for the Visually Impaired. Springer.
Ellis, K., & Kent, M. (2017). Introduction: Social Disability. En Disability and Social Media: Global Perspectives (3-4). Routledge.
Ferraz, R. (2017). Accessibility and Search Engine Optimization on Scalable Vector Graphics. IEEE International Conference on Soft Computing and Machine Intelligence, (94-98). Port Louis. doi:
Fisher, C. (2019, January 10). Creating Accessible SVGs. Retrieved from Deque:
Fundación Telefónica. (2018, October). Presentamos Mapcesible. ¡Haz visible lo accesible! Retrieved from Fundación Telefónica:
Instituto Municipal de Desarrollo Económico y Empleo de Córdoba. (2013). Córdoba accesible. Retrieved from
International Organization for Standardization. (2014). Guide for addressing accessibility in standards.
Internet Engineering Task Force. (2016, August). The GeoJSON Format. Retrieved from Internet Engineering Task Force:
Lewis, V. (2018, January 12). Decoding The Colors of Blindness Canes. Retrieved from VERONIIIICA:
Logan, T. (2018, May 24). Accessible Maps on the Web. Retrieved from Equal Entry:
Luján-Mora, S. (2009). Dispositivos adaptados. Retrieved from Accesibilidad Web:
Migliorisi, H. (2016, August 28). Accessible SVGs. Retrieved from CSS-Tricks:
PowerMapper. (2018, May 20). WAI-ARIA Screen reader compatibility. Retrieved from PowerMapper:
PUNTODIS. (2017). Map´s Voice: la información de recorridos y puntos de interés de los planos al alcance de todos. Retrieved from
Tao, Y., Ding, L., Wang, S., & Ganz, A. (2017). PERCEPT Indoor Wayfinding for Blind and Visually Impaired Users: Navigation Instructions Algorithm and Validation Framework. International Conference on Information and Communication Technologies for Ageing Well and e-Health, (pp. 143-149). Porto. doi:
Watson, L. (2014, August 4). Using the tabindex attribute. Retrieved from The Paciello Group:
Watson, L. (2018, July 23). Accessible SVG flowcharts. Retrieved from Tink:
WebAIM. (2016, January 28). Tabindex. Retrieved from Keyboard Accessibility:
World Health Organization. (2001). International Classification of Functioning, Disability and Health. Geneva: World Health Organization.
World Wide Web Consortium. (2008, December 11). Web Content Accessibility Guidelines (WCAG) 2.0. Retrieved from World Wide Web Consortium:
World Wide Web Consortium. (2011, August 16). Scalable Vector Graphics (SVG) 1.1 (Second Edition). Retrieved from World Wide Web Consortium:
World Wide Web Consortium. (2017, December 14). Accessible Rich Internet Applications (WAI-ARIA) 1.1. Retrieved from World Wide Web Consortium:
World Wide Web Consortium. (2018, June 5). Web Content Accessibility Guidelines (WCAG) 2.1. Retrieved from World Wide Web Consortium:
World Wide Web Consortium. (2018, October 1). Web Speech API. Retrieved from World Wide Web Consortium:
Zeng, L., & Weber, G. (2003). Accessible Maps for the Visually Impaired. SVG Open 2003. Vancouver.



How to Cite

Juan-Armero, S., & Luján-Mora, S. (2019). Using SVG to develop web maps for people with visual disabilities. Enfoque UTE, 10(2), pp. 90 - 106.



Computer Science, ICTs