Atributos HTML para Mejorar la Accesibilidad Web
Contenido del curso
Joel Dominguez Merino
Andrés Corral
Jimmy Buriticá Londoño
León Sergio Mora Guerrero
David Solorzano
Yancarlos Ramirez Torres
Ivan E. Batista-Ochoa
Ivan E. Batista-Ochoa
Juan Christopher
Carlos Eduardo Gomez García
Jose Nuñez
emanuel
Eduardo Rodriguez
Juan Sebastián Herrera Carvajal
Eduardo Rodriguez
John Steven Bernal Gonzalez
Julián Ramírez
Reinaldo Mendoza
Anfernee Valera
Gabriela Mabel Mignone
Leonidas Alberto Ubaque Sandoval
Gonzalo Vidal
Joel Dominguez Merino
Jesus Velasco
Pablo Aquino
Gabriel Perilla Rodriguez
Javi Johan Rodríguez Giraldo
Carlos Ramos
Rubén Vega
Kevin Mejia
Juan David Merchán Torres
Robi Henriquez
Natalia Molina
Geraldine Claros
Axel Yaguana
Team PlatziUn punto importante de Accesibilidad no solo hay que pensar en nosotros, hay que pensar en los demás usuarios que podrían incluso tener una capacidad diferente. En este curso me lleve mucho aprendizaje, pero esta lección es la mas importante. Y desde ahora daré lo mejor de mi para ofrecer servicios al alcance de todos.
Genial
Bien dicho 👍
Mis puntos más importantes sobre estas clases de accesibilidad
“La accesibilidad es una acto de democratización al acceso de productos digitales, es la reivindicación del derecho de una persona con ciertas capacidades diferentes a acceder a las mismas plataformas.”
-La semántica jugará un papel importante en la lectura de la plataforma por parte de un software -Es recomendable en cualquier situación el uso de medidas relativas (REM, EM) pues estas modificarán su tamaño en nuestra página cuando un usuario modifique el tamaño de las letras en la configuración de su navegador. -El uso de <label> en los formularios facilita la interacción de las personas y software con ellos. Por ejemplo al apretar la barra de espacio en un input que despligue un submenú, este se mostrará. -alt en las imágenes proporciona una descripción para un lector de contenido. -El atributo title puede ser usado en las etiquetas img y a para dar una descripción de sus contenidos al hacer hover.
gracias por el resumen
muy buen resumen de accesibilidad, muy completo y conciso!!
Para mejorar la accesibilidad:
(<a>) y en la etiqueta imagen (<img>).
.
También me gustaría compartir los siguientes recursos de los que se puede aprender a como realizar auditorias de accesibilidad y alternativas de texto para imágenes:Este recurso también es importante: Creating Accessible Forms
¡Gracias por sus aportes!
La que mas me gusta es el title, sobretodo porque casi nadie lo conoce, lo puse es los aportes de una clase pasada pero es muy importante, deberían usar title cuando quieren dar una descripción al hacer hover sobre un elemento, mejora mucho la accesibilidad y la verdad es que yo como usuario lo uso mucho cuando quiero saber qué hace tal cosa
Hola amigos aquí les comparto algunas extensiones de Chrome para ayudar en el tema de la accesibilidad de nuestro sitio web:
WAVE evaluation tool, evalúa nuestro sitio y nos dice que tan accesible es para personas con discapacidad.
WCAG Color contrast checker, nos ayuda para que el contraste color sea el ideal .
NoCoffee, esta extensión nos ayuda a simular ciertas discapacidades visuales.
Excelente aporte!
Gracias
Si deseas verificar o auditar de forma rápida tu accesibilidad puedes hacerlo de dos maneras:
Buen recurso, gracias
¡El mejor curso de html y css que he tomado! Muy contento por el contenido 😎
Un atributo súper interesante que no conocía y que no vi en el curso es fieldset y es perfecto para contener el form. Otra cosa es que el span no es necesario ya que se puede poner esto mismo entre las etiquetas <label> y </label> como en el ejemplo.
<<form> <fieldset> <div> <label for="firstname">Firstname</label> <input id="firstname" name="firstname" title="Es obligatorio que ingreses tu nombre" required> </div>>
No la había visto antes
Hola Julian, no sé si lo notaste, pero cuando escribes el texto de esta manera dejas el input por fuera del label. ¿Sabrás si afecta en algo dejar el input fuera del label?
Pude ver que en algunos sitios usan la etiqueta title para poner el copyright de la fotografía. ¿Eso es de buena práctica?
Sí, de hecho es casi una exigencia cuando usas material creado por otros.
Si lo dejas en el Alt, también es válido aunque quedará más escondido.
Hay quienes usan tooltips para ello, lo cual es también válido.
La verdad depende del orden que le des a esas descripciones en tu proyecto.
Aquí les dejo mis apuntes sobre puntos nuevos e importantes de este gran curso, espero les sirva como a mi.
Gracias por tu aporte Gonzalo! Muy bien en compartir lo que aprendiste.
SUPER APORTE GRACIAS :)
label ayuda a que se pueda enfocar rápidamente en el input del formulario.alt de la etiqueta img, de debe colocar una descripción rápida de lo que contiene la imagen, ya que esto será leído por el software para accesibilidad auditiva.title, de la etiqueta img, le agrega una descripción a la imagen cuando el cursor se pone encima de ella."Somos responsables que todo lo que construimos sea consumido por cualquier tipo de usuario".
Cierto en pro de que la experiencia se quiera repetir en cada clic y lectura
El buen desarrollador siempre debe ponerse en los zapatos de la persona que usa su herramienta.
Clase 53 - Labels, alt y title
¿Qué elementos y etiqueta nos pueden servir en mejorar la accesibilidad de un producto/proyecto web?
¿Por qué la etiqueta <label> nos ayuda a la accesibilidad de nuestros productos/proyectos web?
¿Para qué nos sirve el atributo alt?
¿Para qué nos sirve el atributo title?
Tras haber estudiado la carrera de UX, creo que la accesibilidad es el puente entre el UX y la programación. No me parece muy difícil de implementar y sin embargo, cambia la vida a muchas personas: perfil técnico-empático
**ACCESIBILIDAD **
La accesibilidad es demasiado importante en un proyecto para ofrecer una mayor experiencia de usuario para aquellos que tienen cierta dificultad con la tecnología, algún tipo de patología o falencia relacionada.
Para mejorar este apartado es bueno hacer uso de la medida relativa ** rem** para adaptar el texto tal como lo visualiza el usuario con la configuración de su navegador.
Usar etiquetas y atributos como las siguientes:
Siempre me pregunte como hacia para darle esa info a mi pagina, gracias a esta clase se que era con title. Cada dia aprendo nuevas cosas, me encanta Platzi 💚
Me parece brutal que se Enseñen este tipo de cosas en Platzi. Yo pasé 20 años de mi vida con discapacidad visual y para poder disfrutar de un contenido web tenía que estar como a 5 cm de la pantalla del computador.
Labels, alt y title
Son atributos que agregamos a las etiquetas para mejorar la accesibilidad. Este tipo de atributos ayudan a las personas con discapacidades a tener un mejor acceso al producto.
El curso es super completo, pero esta unidad es de las más importantes, ya que esto te da herramientas para que todas las personas tenga acceso a contenido digital.
Recuerden que el alt="" les ayudará también a posicionarse mejor en buscadores. 💻