{"id":28459,"date":"2022-06-23T14:54:48","date_gmt":"2022-06-23T12:54:48","guid":{"rendered":"https:\/\/www.mtp.es\/?p=28459"},"modified":"2022-06-23T14:54:48","modified_gmt":"2022-06-23T12:54:48","slug":"pautas-de-accesibilidad-web","status":"publish","type":"post","link":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/","title":{"rendered":"Pautas de accesibilidad para adaptar las p\u00e1ginas web a personas ciegas o con baja visi\u00f3n"},"content":{"rendered":"

El acceso al contenido digital en los sitios web<\/strong> depender\u00e1 de las necesidades y caracter\u00edsticas propias de los usuarios. Existen diferentes mecanismos de entrada, como teclado, voz, lector de pantalla, conmutadores, …<\/p>\n

En el caso de los usuarios con diversidad funcional de tipo visual,<\/strong> necesitar\u00e1n de un lector de pantalla para poder acceder a los contenidos de un sitio web. El lector de pantalla<\/strong> es un software<\/em> que \u2018traduce\u2019 a \u00a0voz todos los textos y elementos que aparecen en una pantalla de un dispositivo, tal como un ordenador o m\u00f3vil.<\/p>\n

Buenas pr\u00e1cticas de accesibilidad web<\/h2>\n

Con objeto de mejorar la accesibilidad web<\/strong><\/a> a los contenidos\u00a0existen una serie de buenas pr\u00e1cticas<\/strong> que podemos seguir:<\/p>\n

Atributo “lang”<\/h3>\n

Definir el idioma<\/strong> principal y de las partes con el atributo \u201clang\u201d. Gracias a este atributo el lector de pantalla podr\u00e1 interpretar los textos de una p\u00e1gina web<\/em> con la pronunciaci\u00f3n y entonaci\u00f3n propia del idioma indicado.<\/p>\n

Etiquetas HTML5 y roles de la WAI-ARIA<\/h3>\n

Estructurar el contenido mediante las etiquetas sem\u00e1nticas de HTML5 o roles de la WAI-ARIA<\/strong>. Se recomienda incluir todo el contenido de una p\u00e1gina dentro de las diferentes etiquetas sem\u00e1nticas de HTML5 o roles de la WAI-ARIA. De esta forma, los usuarios de tecnolog\u00edas de apoyo como el lector de pantalla pueden utilizar los puntos de referencia (landmarks<\/em>) para navegar por la p\u00e1gina siguiendo su estructura.<\/p>\n

\"\"<\/a><\/p>\n

Encabezados<\/h3>\n

Empleo de encabezados<\/strong> por cada secci\u00f3n del sitio web. Al igual que los puntos de referencia, permiten al usuario del lector de pantalla navegar r\u00e1pidamente por bloques saltando contenido sin tener que leer toda la p\u00e1gina para conocer su estructura.<\/p>\n

\"\"<\/a><\/p>\n

Incluir descripciones precisas en todos los elementos<\/h3>\n

Descripciones precisas <\/strong>en las im\u00e1genes, enlaces, botones y elementos de formulario. Se debe tener en cuenta que cada elemento que se a\u00f1ada en una p\u00e1gina debe tener una descripci\u00f3n asociada e indicar su tipo. Se deben evitar las descripciones que no indiquen la funcionalidad o finalidad del elemento<\/strong>. Por ejemplo, si un usuario invidente lista los enlaces de una p\u00e1gina mediante los atajos de teclado del lector de pantalla, podr\u00e1 seleccionar directamente un enlace determinado. Si todos los enlaces tienen como descripci\u00f3n \u201cM\u00e1s informaci\u00f3n\u201d, el usuario del lector de pantalla no sabr\u00e1 cual es la p\u00e1gina de destino de cada enlace.<\/p>\n

\"\"<\/a><\/p>\n

Todos los elementos de interacci\u00f3n operables<\/h3>\n

Acceso por Todos los elementos de interacci\u00f3n deben ser operables tanto con rat\u00f3n como con teclado.<\/p>\n

Regla de oro en accesibilidad web: ojo con el orden de la lectura y tabulaci\u00f3n<\/h3>\n

Orden de lectura y tabulaci\u00f3n<\/strong> La alteraci\u00f3n del orden de lectura y tabulaci\u00f3n puede afectar significativamente a la compresi\u00f3n del contenido de una p\u00e1gina. Una buena pr\u00e1ctica que llevar a cabo es hacer coincidir el orden de DOM con el orden visual de la p\u00e1gina.<\/p>\n

Incluye tablas simples para asegurar la accesibilidad web<\/h3>\n

Inclusi\u00f3n de tablas simples<\/strong>. Las tablas complejas con m\u00faltiples encabezados o celdas de datos combinadas dificultan su interpretaci\u00f3n con un lector de pantalla. Si una tabla es muy compleja se recomienda dividirla en tablas m\u00e1s simples sin celdas combinadas. Cada tabla debe tener su propio t\u00edtulo en la etiqueta <caption> y especificar si una celda es un encabezado de columna o fila mediante el atributo \u201cscope\u201d. Con ello facilitamos la identificaci\u00f3n y orden de lectura de cada tabla.<\/p>\n

Atributos WAI-ARIA<\/h3>\n

Uso de atributos de la WAI-ARIA<\/strong> Cuando hablamos de dise\u00f1o de experiencia de usuario<\/a> dirigido a la accesibilidad web necesario informar al usuario de todos los cambios que se produzcan en la p\u00e1gina. Para ello, nos podemos ayudar de los atributos de la WAI-ARIA. Por ejemplo, una notificaci\u00f3n del cambio de estado de una tarea de forma din\u00e1mica sin la intervenci\u00f3n del usuario. Estos cambios suelen evidentes visualmente, pero pasar por desapercibidos para los usuarios de tecnolog\u00edas de apoyo.<\/p>\n

 <\/p>\n

Delia Casta\u00f1o<\/strong>
\nConsultora Accesibilidad MTP<\/p>\n","protected":false},"excerpt":{"rendered":"

La accesibilidad universal a todo tipo de soportes y contenidos digitales es uno de los objetivos que diferentes normativas tratan de asegurar. MTP, como empresa especializada en experiencia de usuario (UX), ofrece tambi\u00e9n ayuda a empresas y todo tipo de organizaciones p\u00fablicas y privadas a conseguir productos o servicios digitales accesibles para todos. Una experta de MTP explica hoy en este post algunas pautas para que las personas ciegas o con baja visi\u00f3n puedan disfrutar de esos contenidos.<\/p>\n","protected":false},"author":9,"featured_media":28451,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[204],"tags":[],"class_list":["post-28459","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-archivo"],"acf":[],"yoast_head":"\nAccesibilidad web para personas con baja visi\u00f3n | MTP<\/title>\n<meta name=\"description\" content=\"Una experta de MTP explica hoy en este post algunas pautas de accesibilidad web y apps para personas ciegas o con poca visi\u00f3n..\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Accesibilidad web para personas con baja visi\u00f3n | MTP\" \/>\n<meta property=\"og:description\" content=\"Una experta de MTP explica hoy en este post algunas pautas de accesibilidad web y apps para personas ciegas o con poca visi\u00f3n..\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/\" \/>\n<meta property=\"og:site_name\" content=\"MTP Espa\u00f1a\" \/>\n<meta property=\"article:published_time\" content=\"2022-06-23T12:54:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1080\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"MTP\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"MTP\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Accesibilidad web para personas con baja visi\u00f3n | MTP","description":"Una experta de MTP explica hoy en este post algunas pautas de accesibilidad web y apps para personas ciegas o con poca visi\u00f3n..","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/","og_locale":"es_ES","og_type":"article","og_title":"Accesibilidad web para personas con baja visi\u00f3n | MTP","og_description":"Una experta de MTP explica hoy en este post algunas pautas de accesibilidad web y apps para personas ciegas o con poca visi\u00f3n..","og_url":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/","og_site_name":"MTP Espa\u00f1a","article_published_time":"2022-06-23T12:54:48+00:00","og_image":[{"width":1920,"height":1080,"url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","type":"image\/jpeg"}],"author":"MTP","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"MTP","Tiempo de lectura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#article","isPartOf":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/"},"author":{"name":"MTP","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/1186350db6f59e8360dd481150654813"},"headline":"Pautas de accesibilidad para adaptar las p\u00e1ginas web a personas ciegas o con baja visi\u00f3n","datePublished":"2022-06-23T12:54:48+00:00","mainEntityOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/"},"wordCount":696,"publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","articleSection":["Archivo"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/","url":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/","name":"Accesibilidad web para personas con baja visi\u00f3n | MTP","isPartOf":{"@id":"https:\/\/mtp.global\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#primaryimage"},"image":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#primaryimage"},"thumbnailUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","datePublished":"2022-06-23T12:54:48+00:00","description":"Una experta de MTP explica hoy en este post algunas pautas de accesibilidad web y apps para personas ciegas o con poca visi\u00f3n..","breadcrumb":{"@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#primaryimage","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","width":1920,"height":1080,"caption":"accesibilidad web y app"},{"@type":"BreadcrumbList","@id":"https:\/\/mtp.global\/es\/blog\/archivo\/pautas-de-accesibilidad-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mtp.global\/es\/home\/"},{"@type":"ListItem","position":2,"name":"Pautas de accesibilidad para adaptar las p\u00e1ginas web a personas ciegas o con baja visi\u00f3n"}]},{"@type":"WebSite","@id":"https:\/\/mtp.global\/es\/#website","url":"https:\/\/mtp.global\/es\/","name":"MTP Global","description":"","publisher":{"@id":"https:\/\/mtp.global\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mtp.global\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/mtp.global\/es\/#organization","name":"MTP Global","url":"https:\/\/mtp.global\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/#\/schema\/logo\/image\/","url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-global.png","contentUrl":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2024\/07\/MTP-global.png","width":1200,"height":400,"caption":"MTP Global"},"image":{"@id":"https:\/\/mtp.global\/es\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/1186350db6f59e8360dd481150654813","name":"MTP","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/mtp.global\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9f80fcebb065607a1066a38846083841707346cf76ca0c1df24aea7a0c5d4047?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9f80fcebb065607a1066a38846083841707346cf76ca0c1df24aea7a0c5d4047?s=96&d=mm&r=g","caption":"MTP"},"url":"https:\/\/mtp.global\/es\/blog\/author\/marketing\/"}]}},"fimg_url":"https:\/\/mtp.global\/es\/wp-content\/uploads\/2022\/06\/Blog_MTP-accesibilidad-web-ciegos.jpg","_links":{"self":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/28459","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/comments?post=28459"}],"version-history":[{"count":0,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/posts\/28459\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media\/28451"}],"wp:attachment":[{"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/media?parent=28459"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/categories?post=28459"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mtp.global\/es\/wp-json\/wp\/v2\/tags?post=28459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}