Skip to main content

¿Qué es el código de imagen HTML?

En un documento de lenguaje de marcado de hipertexto (HTML), el código de imagen HTML se utiliza para insertar imágenes gráficas en diferentes puntos del diseño. El código generalmente es una serie de palabras clave legibles por humanos a las que luego se les asignan valores asociados, envueltos entre signos mayores y menores dentro del documento HTML. El código de imagen HTML resultante le indica a un navegador web u otro visor de documentos la ubicación del archivo de imagen en línea o en una unidad de disco, las dimensiones de la imagen, cualquier formato especial que tenga la imagen y diferentes opciones de alineación para los otros elementos en el HTML documento que lo rodea. Las imágenes se pueden anidar dentro de otros códigos HTML, a veces conocidos como etiquetas, lo que les permite usarse como enlaces en los que se puede hacer clic, elementos de lista o imágenes de fondo. Mediante el uso de las extensiones de hojas de estilo en cascada (CSS) en HTML, también se pueden modificar muchos otros valores y propiedades de una imagen dentro de un documento, mientras que algunos lenguajes de programación se pueden incrustar en el documento para permitir el procesamiento básico de imágenes.

El código de imagen HTML más común consiste en la etiqueta de imagen, que en HTML está representada por la palabra clave IMG. Esto le indica al navegador web que se va a insertar una imagen en el documento en este momento y que seguirá la información sobre la imagen. La única información requerida que debe estar dentro de la etiqueta IMG se denomina fuente. A la palabra clave SRC se le asigna el nombre o la ubicación del archivo de imagen, lo que permite al navegador cargar la imagen. El valor puede ser un nombre de archivo o una dirección en línea que también se conoce como una ubicación de recurso universal (URL), muy similar a la dirección de un sitio web.

Hay otras propiedades que se pueden definir dentro de un código de imagen HTML. La altura y el ancho de la imagen se pueden proporcionar explícitamente, lo que permite cambiar el tamaño de la imagen para que se ajuste a un diseño determinado. Se puede suministrar texto alternativo para que los usuarios que no pueden ver la imagen puedan escuchar o leer una versión de texto de la misma. También se pueden establecer bordes y espacios alrededor de la imagen, lo que le da a la imagen una apariencia y ubicación distintas en una página web.

Se puede usar una buena cantidad de código de imagen HTML para definir cómo se alinea la imagen y cómo reacciona el resto de la página web a su presencia. El texto se puede configurar para que fluya alrededor de la imagen en los lados derecho o izquierdo, o se puede configurar para omitir la imagen por completo, dejándola sin gravámenes en su propio espacio. Algunas opciones permiten que la imagen se dibuje con texto u otros elementos, o incluso que fluya como parte del diseño para que se incluya en una línea, como cualquier otra letra en una oración.