Skip to main content

¿Cuál es la forma correcta de usar una etiqueta de imagen HTML?

Las imágenes a menudo se agregan a las páginas web para que se vean más atractivas e interesantes en comparación con una página de texto sin formato. Con la etiqueta de imagen HTML, es fácil agregar imágenes a cualquier página web. Esta etiqueta también tiene una serie de atributos o características que puede especificar.

Al agregar imágenes a una página web, es importante recordar que una imagen no es realmente parte del archivo que constituye la página web en sí. Los archivos utilizados para la página web son archivos separados de todos los archivos de imagen. La etiqueta de imagen HTML hace referencia al navegador web al archivo de imagen específico para la imagen que desea mostrar. Cuando la página web se muestra en un navegador, el archivo de imagen se muestra junto con cualquier otro archivo que forme esa página.

El código para la etiqueta de imagen HTML es: <IMG SRC = "ubicación de imagen" />. La ubicación de la imagen es el nombre del archivo de la imagen que desea que se muestre y dónde se almacena la imagen. Es importante que obtenga esta información correcta para asegurarse de que la imagen se muestre correctamente. La organización y el almacenamiento de imágenes que desea utilizar en su página web son consideraciones importantes.

Algunas personas almacenan sus imágenes en el mismo directorio que todas las otras partes de sus páginas web. En este caso, cuando se refiere a la imagen, solo incluiría el nombre de archivo en la etiqueta de imagen HTML. Cuando una página web tiene varias imágenes, es común crear un subdirectorio, a menudo llamado imágenes . En este caso, el nombre del subdirectorio también se incluiría en la etiqueta.

Como ejemplo, esto es lo que haríamos para insertar una imagen de un árbol, nombre de archivo tree.jpg, en una página web. Si hubiéramos almacenado la imagen del árbol en el mismo lugar que nuestros otros archivos de página web, la etiqueta de imagen HTML sería <IMG SRC = "tree.jpg">. Si el archivo de imagen se almacenó en un subdirectorio dentro del directorio de nuestra página web, la etiqueta se cambiaría a <IMG SRC = "images / tree.jpg">. Es importante recordar que la etiqueta de imagen HTML proporciona una referencia, o ruta, al archivo de imagen. Básicamente, le dice al navegador dónde buscar el archivo.

La etiqueta de imagen HTML tiene una serie de atributos que se pueden especificar para la imagen que desea incluir. Los atributos son características de la propia etiqueta y, por lo tanto, se usan dentro de la etiqueta, o entre <y>. Los atributos que se usan con la etiqueta de imagen HTML son:

  • ALINEAR: especifica cómo se alinea su imagen en relación con el texto de su página (IZQUIERDA, DERECHA, SUPERIOR, MEDIA, INFERIOR)
  • ALT: se refiere a texto alternativo. Este es un atributo muy importante y debe incluirse para todas sus imágenes. Especifica el texto que se muestra en lugar de la imagen.
  • FRONTERA: agrega un borde a su imagen, con el grosor especificado en píxeles
  • ALTURA Y ANCHURA: se puede utilizar para definir el ancho y la altura de la imagen que desea mostrar, lo que le permite cambiar el tamaño de la imagen. Tenga cuidado al usar estos atributos, ya que puede cambiar la calidad de la imagen y las proporciones, lo que resulta en imágenes de baja calidad.
  • VSPACE y HSPACE: se utilizan para agregar espacios en blanco alrededor de su imagen.