# 4.1 Pautas para generar contenido WEB accesible

##### ***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">¿Qué son las Pautas de Accesibilidad para crear contenido web?</span></span>***

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Las </span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">pautas de accesibilidad</span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> para el contenido web, conocidas como WCAG por sus siglas en inglés (Web Content Accessibility Pautas) son las NORMAS diseñadas por el W3C para garantizar la accesibilidad de cualquier contenido en la web, incluidos documentos ofimáticos como Word o PowerPoint, documentos de diseño e impresión como PDF o documentos multimedia.</span></span>

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">La </span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">última versión</span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> de las WCAG es la </span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">2.1,</span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> aunque se está trabajando en una próxima versión 3.0; </span><span style="vertical-align: inherit;">dada su universalidad, promoviendo normas desligadas a una tecnología en concreto, también se han convertido en el estándar para el diseño de cualquier producto o servicio digital.</span></span>

<div id="bkmrk--0"><div><iframe allowfullscreen="allowfullscreen" frameborder="0" height="443" scrolling="yes" src="https://view.genial.ly/638f77c7da181d0019eb4924" style="width: 788px; height: 443px;" title="LISTA TRIÁNGULOS" width="788"></iframe>

</div></div>*<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Elaboración propia. </span></span>[<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">CC BY-NC-SA </span></span>](https://creativecommons.org/licenses/by-nc-sa/4.0/)[<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">.</span></span>](https://creativecommons.org/licenses/by-nc/4.0/)*

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Las WCAG 2.1 son equiparables a la Norma Europea EN 301 549 de Accesibilidad para productos y servicios de Tecnologías de la Información y Comunicación (TIC). </span><span style="vertical-align: inherit;">Sus </span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">características</span></span>***<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> son las siguientes:</span></span>

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">1- </span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Perceptible</span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> : La información y los componentes de la interfaz de usuario deben ser presentados a los usuarios de manera que puedan percibirlos.</span></span>

- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Ofrece alternativas textuales para contenidos no textuales.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Facilita que los usuarios puedan leer y oír el contenido.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Presenta el contenido de diferentes formas, incluidas las tecnologías de apoyo.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Distinguible, separa el fondo del primer plano.</span></span>

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">2- </span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Operable</span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> : Los componentes de la interfaz de usuario y la navegación deben ser operables. </span></span>

- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Manejable por teclado, no olvides a los usuarios sin ratón</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Da tiempo suficiente para leer.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">No uses contenido que pueda causar reacciones físicas y psíquicas negativas.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Céntrate en la Arquitectura de la Información para que sea fácilmente navegable.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Fáciles métodos de entrada diferentes al teclado.</span></span>

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">3- </span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Comprensible</span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> : La información y el funcionamiento de la interfaz de usuario deben ser comprensibles. </span></span>

- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Proporciona el texto fácil de leer y de comprender.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Haz tu página predecible, no reinventes los estándares de navegación.</span></span>
- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Ayuda en la introducción de datos.</span></span>

<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">4- </span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Robusto</span></span>**<span style="vertical-align: inherit;"><span style="vertical-align: inherit;"> : El contenido debe ser lo suficientemente robusto como para ser interpretado por una amplia variedad de agentes de usuario, incluidos los productos de apoyo. </span></span>

- <span style="vertical-align: inherit;"><span style="vertical-align: inherit;">Respeta el código para que sea compatible con el mayor número de dispositivos y programas.</span></span>