¿Qué es un enlace de imagen HTML?
Cuando una persona crea una página web que contiene una imagen, la imagen no se inserta en la página con el resto de la información. Para mostrar imágenes en la web, se utiliza un enlace de imagen HTML en lugar de incrustar la imagen dentro de la página. Para usar el enlace de imagen HTML, la etiqueta HTML <img> se usa para proporcionar la información sobre dónde se almacena la imagen y se puede acceder a ella. Esta etiqueta se puede usar con todos los navegadores y se puede usar para cargar todos los tipos de imágenes compatibles con los navegadores.
El uso de la etiqueta <img> por sí sola no proporciona información a la página web que debe contener una imagen. Hay dos atributos necesarios para que el enlace de la imagen HTML se escriba correctamente para que la imagen se cargue cuando se carga la página web. También hay varios atributos opcionales que se pueden incluir para proporcionar más información. Los atributos que se requieren para escribir el enlace de la imagen son src y alt .
El atributo src del enlace de imagen HTML proporciona la dirección web, o URL, donde se encuentra la imagen. La URL puede tomar una de dos formas. Una URL absoluta proporciona una dirección web completa que dirige a una imagen en otro sitio web. Un ejemplo de incluir una URL absoluta para el atributo src sería: src = "http://www.website.com/image.jpg" - donde website.com apunta a otro sitio e image.jpg apunta a un sitio específico imagen.
La otra opción para la URL dentro del atributo src es escribir una URL relativa. En el caso de una URL relativa, la dirección web proporciona un enlace a una imagen dentro del mismo directorio del sitio web. La URL relativa es una versión truncada de una URL absoluta ya que la imagen se encuentra en el mismo lugar que la página web. Ejemplos del atributo src con una URL relativa son: src = "image.jpg" o src = "images / image.jpg". La única diferencia en estos ejemplos es dónde se encuentra la imagen, ya que se encuentra dentro de una carpeta de imágenes en el segundo ejemplo.
El otro atributo requerido es alt , que proporciona texto alternativo para la imagen. Este no es el texto que se muestra si un usuario pasa el mouse sobre la imagen, sino el texto que se muestra si la imagen no se puede mostrar por algún motivo. Hay muchas razones por las que una imagen puede no mostrarse, incluidos los casos en que la URL en el atributo src es incorrecta o está rota, o cuando un usuario con discapacidad visual está usando un lector de pantalla.
El código más básico para un enlace de imagen HTML tendrá un aspecto similar al siguiente: <img src = "URL" alt = "text" />. Como la etiqueta <img> no tiene una etiqueta de finalización, es importante finalizarla con /> para que el navegador sepa que la instrucción ha finalizado. El atributo src apunta a una ubicación para una imagen, por lo que es importante asegurarse de que los enlaces a otros sitios no estén rotos y que las imágenes no se muevan dentro del directorio de un sitio web, y corregir los enlaces cuando surjan problemas.