Mostrando entradas de septiembre, 2020

Experiencia equivalente

Muy interesantes, llenos de ejemplos, los artículos  Equivalent Experiences: What Are They? y  Equivalent Experiences: Thinking Equivalently publicados en Smashing Magazine. El resumen dice: An equivalent experience is one that has been deliberately conceived of and built to be able to be used by the widest possible range of people. To create an equivalent experience, you must understand all the different ways people interact with technology, as well as common barriers they experience.  Constructing an equivalent experience may mean changing the way you think about development and design, and potentially reevaluating your existing work. In this article, we’ll address common accessibility issues, and how to best go about improving them so everyone can effortlessly access your content.

¿Qué son las características accesibles de un sitio web?

En  What Are Accessibility Features of a Website? explican qué son las características accesibles que ofrecen algunos sitios web: Website accessibility features are the elements of a site designed to improve the ability of people with disabilities to independently use it. Sometimes websites include extra options specifically to enhance some people's use, but usually accessibility features are integrated into a well-coded website that is accessible by default. Aunque normalmente estas características que se añaden con muy buenas intenciones, a veces pueden causar problemas a ciertos usuarios: Sometimes, extra accessibility features are added with the best of intentions, but in practice can actually cause new problems. For example, some websites or digital tools will include their own screen reading technology with the goal of providing easy access to people who are blind, have low vision, or otherwise benefit from hearing content instead of or in addition to seeing it. However, man

Los enlaces "saltar a" son importantes

Muy interesante la explicación y el código que se ofrece en  Skip links are important : "Skip links" are important. They allow keyboard-only users, sighted or not, to bypass large or repetitive blocks of content. You may have heard of them and wondered what the big deal is. Or your design team may have refused to implement one because they look “ugly”. But they are important, and they don’t have to break the design.  Lots of links Many sites have a lot of links at the top of the page. The mega menu isn’t dead! It seems like news websites are particularly bad with this. The Montreal Gazette has over 175 links before reaching the main content. CNN does better, with only 19 links. The Austin Statesman “only” has 18 or so, but the very first link isn’t keyboard-friendly, and it’s the “navigation menu”. The navigation menu has nearly 60 links! Perhaps it’s just as well it’s not keyboard accessible? Stuff has a couple dozen links (and no focus visible - but that’s a story for anoth

Accesibilidad en Android

Para los usuarios ciegos o con baja visión: Talk Back   Braille Back Color Inversio n Magnification Para los usuarios con problemas de movilidad: Switch Access Voice Access  Para los usuarios sordos o con problemas de audición: YouTube Captions (including YT Live) Live Transcribe Sound Amplifier Play Movie Captions Live Captions for slides Mono audio support Para los usuarios con problemas cognitivos o de aprendizaje: Select to Speak Material Design (consistent, clean User Interface)

16 cosas que se pueden hacer para mejorar la accesibilidad de un sitio web

16 Things to Improve Your Website Accessibility está escrito por Bruce Lawson, un gurú de la accesibilidad web. Las 16 cosas que propone son: 1) Too Much Content In brief: break up text into sections with headings and bulleted lists. Use simple language. 2) ReCAPTCHA In brief: don’t make your users jump through potentially impossible hoops in order to save developer time. 3) Poor Legibility In brief: make sure text has adequate contrast, is readable and isn’t justified. 4) Distracting Images and Graphics In brief: allow users to stop any movement; respect their operating system settings; don’t auto-play video. 5) Poor Link Information In brief: make links identifiable, with unique link text. Warn users if a link will open a new tab or a file. 6) Another Design Error: Removing the Focus Ring In brief: make sure a keyboard user can always see where they are currently focused. 7) Form Filling In brief: design form fields that look like form fields, each associated with a label. Don’t dis

El atributo placeholder no es una etiqueta, no sustituye a label

En  Placeholder Attribute Is Not A Label! : Just so we’re all clear on this, the HTML5 placeholder attribute in a text input is not a replacement for the label element. Period. The placeholder should only be used as a brief example of the text to be entered.  Besides inconsistent support for screen readers, using a placeholder as an input label can create usability problems and issues for those with cognitive impairments. For example, how does one review the information entered if the placeholder is now gone?  The placeholder should be used like a title attribute (tooltip); it provides only supplementary information. If the information is required for the user (such as a strict text format) then this should be conveyed in the main content of the page, not in an attribute.

Pautas de diseño para personas mayores

En  4 Tips for Designing Apps for Older Users se dan estos cuatro consejos: Haz el texto fácil de leer Agranda el tamaño de los elementos interactivos Divide las tareas y haz una cosa cada vez Mantén los textos claros y simples

Novedades de WCAG 2.2

 El 11 de agosto de 2020 se publicó una nueva versión de WCAG 2.2 . Todavía sigue siendo "working draft", pero el documento ha avanzado bastante respecto la versión anterior. Las principales  diferencias respecto a WCAG 2.1 son nueve nuevos criterios de éxito: Accessible Authentication Dragging Findable Help Fixed Reference Points Focus Appearance (Minimum) Focus Appearance (Enhanced) Hidden Controls Pointer Target Spacing Redundant Entry