¿Qué es el texto alternativo y por qué importa en html??

Las imágenes juegan un papel importante en cualquier aplicación. Se utilizan para mejorar el atractivo y el atractivo del sitio web. ¿Qué pasa si su conexión a Internet se ralentiza y la imagen deseada no puede subir?? Entonces, ¿qué se debe mostrar en la pantalla en lugar de la imagen?? En tal escenario, HTML nos permite usar el atributo "alternativo"En el elemento HTML.

Este estudio lo guiará sobre qué es el texto alternativo y por qué importa en HTML.

¿Qué es un texto alternativo en html??

A veces, cuando nos desplazamos por un sitio web, aparece un pequeño texto cuando la imagen no se descarga. Este componente HTML se conoce como "alternativo"Texto, descripción o texto alternativo. Es un atributo asociado con la etiqueta de HTML.

Sintaxis

Para utilizar el texto ALT en HTML, siga la sintaxis dada:

La descripción de la sintaxis mencionada anteriormente se enumera a continuación:

• "SRC": Este atributo se usa para especificar la ruta de la imagen de origen.
• "alternativo": Es el texto alternativo.

¿Por qué es importante el texto alternativo en HTML??

El texto alternativo es importante por muchas razones. Algunos de ellos se enumeran a continuación:

• Para una mejor accesibilidad de la página web, es mejor usar el texto alternativo, ya que ayuda a los usuarios que tienen discapacidad visual a escuchar la descripción de la imagen mediante el uso de aplicaciones de terceros.
• En lugar de la imagen, se mostrará el valor del atributo de texto alt. Esto es beneficioso cuando los usuarios experimentan conexiones de bajo ancho de banda.
• El texto alternativo también contribuye al rango de página web a los ojos de Google. No solo proporciona una descripción, sino que también le agrega significado, lo que puede ser útil para el tráfico general del sitio web.

¿Cuáles son las mejores prácticas de texto alt en html??

Algunas de las mejores prácticas para usar el texto alternativo para su sitio web se enumeran a continuación:

• No comience el texto alternativo con "foto de" o "imagen de" palabras.
• Limitar el texto alternativo a 130 caracteres o menos.
• Tenga en cuenta el SEO.
• Se preciso.

Ejemplo 1: texto alternativo bueno y malo en HTML

Tomemos un ejemplo y verifiquemos qué tipo de texto alternativo se debe mostrar en lugar de la imagen:

Aquí hemos declarado el texto alternativo malo y bueno para el HTML:

• Mal texto alternativo: Pasos de montaña Flores moradas.
• Buen texto alternativo: Pasos rodeados de flores moradas hacia la montaña cubierta de nieve.

Se puede observar que el texto Alt malo no es una descripción; más bien, es solo una lista de palabras. En comparación, el buen texto alternativo describe la información sobre la imagen.

Ejemplo 2: Cómo agregar texto ALT al elemento HTML?

Demostremos el concepto de agregar texto alternativo con la ayuda de un ejemplo.

Html

En el archivo HTML, primero, agregue un contenedor que contiene el elemento. Este elemento está asociado con los atributos SRC y ALT:

Guarde el archivo HTML, y la página web mostrará la imagen de la siguiente manera:

Digamos que esta imagen no ha podido cargar, o hemos agregado por error la ruta incorrecta de la imagen en nuestro archivo HTML. Luego, se mostrará el texto ALT especificado en lugar de la imagen:

Así es como puedes agregar texto alternativo a nuestra imagen usando el "alternativo"Atributo en la etiqueta.

Conclusión

HTML nos permite usar imágenes para nuestra aplicación web. Pero a veces, el usuario experimenta una conexión baja de ancho de banda, y la imagen no puede cargar en la aplicación. En tal situación, el "alternativoEl atributo con la etiqueta muestra texto alternativo cuando la imagen no ha podido mostrar. Este artículo explicó el atributo ALT del elemento HTML.