Qué son los comandos HTML: algunos ejemplos

Por Felipe

Publicado en:

Los comandos HTML son las etiquetas con las que se estructura y se da forma a una página web: definen títulos, párrafos, enlaces, imágenes, listas o tablas. Conocer las etiquetas básicas es imprescindible para crear cualquier blog, web corporativa o tienda online, ya que constituyen el esqueleto sobre el que después trabajan las hojas de estilo CSS y el lenguaje JavaScript.

Qué son los comandos HTML

El lenguaje de marcado HTML (HyperText Markup Language) es una de las tecnologías sobre las que se sustenta el desarrollo y el diseño web. Cualquier blog, página web o comercio electrónico utiliza código HTML para mostrar su contenido y sus funcionalidades a los usuarios, y lo hace a través de una serie de comandos o etiquetas. Conocer los comandos básicos de HTML resulta fundamental en la programación web, porque las páginas creadas con este lenguaje se conectan con otras tecnologías clave, como el lenguaje de programación JavaScript o las hojas de estilo CSS.

Los comandos HTML son, por tanto, una serie de etiquetas que permiten estructurar una página y añadir en ella todo tipo de elementos: encabezados, imágenes, enlaces, formularios y muchos más. Cada etiqueta cumple una función concreta y, combinadas entre sí, dotan a la web de una arquitectura ordenada y comprensible tanto para el navegador como para los motores de búsqueda.

Conviene recordar que HTML evoluciona de forma constante. La versión actual, HTML5, incorporó etiquetas semánticas como <header>, <nav>, <section>, <article> y <footer>, que describen el significado de cada bloque de la página. Estas etiquetas ayudan a los buscadores y a las tecnologías de accesibilidad a interpretar mejor el contenido, por lo que se recomienda usarlas en lugar de recurrir únicamente a contenedores genéricos.

Cómo funcionan las etiquetas: apertura, cierre y atributos

La mayoría de las etiquetas HTML utilizan un sistema de apertura y cierre. Primero se escribe la etiqueta de apertura, a continuación va su contenido y, por último, la etiqueta de cierre, que se distingue por la barra inclinada. Un ejemplo sencillo es <title>Título de la web</title>. Algunas etiquetas, como el salto de línea <br> o la imagen <img>, no necesitan cierre y se conocen como etiquetas vacías.

Además, las etiquetas disponen de atributos que permiten personalizar o configurar con más precisión su comportamiento. Un atributo se escribe dentro de la etiqueta de apertura con la forma nombre igual a valor; por ejemplo, el atributo que indica el destino de un enlace o la ruta de una imagen. Gracias a los atributos, una misma etiqueta puede comportarse de maneras muy distintas según lo que necesite tu proyecto.

Comandos HTML fundamentales con ejemplos

En una página HTML existe un conjunto de comandos que se repiten en prácticamente todos los proyectos. A continuación verás los más importantes agrupados por su función, con una breve explicación de cada uno para que puedas reconocerlos y empezar a utilizarlos.

Estructura básica del documento

  • <html>: etiqueta raíz que engloba todo el documento.
  • <head>: cabecera con la información que no se ve, como los metadatos y las referencias a las hojas de estilo.
  • <title>: define el título de la página que aparece en la pestaña del navegador y en los resultados de búsqueda.
  • <body>: contiene todo el contenido visible de la web.

Texto y encabezados

  • <h1> a <h6>: encabezados ordenados por importancia, donde h1 es el principal de la página.
  • <p>: delimita un párrafo de texto.
  • <strong> y <em>: resaltan texto en negrita y en cursiva, además de aportar valor semántico.

Enlaces, imágenes y multimedia

  • <a>: crea un enlace o hipervínculo hacia otra página o recurso.
  • <img>: inserta una imagen mediante el atributo que indica la ruta del archivo.

Listas, tablas y contenedores

  • <ul>, <ol> y <li>: listas sin numerar, numeradas y los elementos que las componen.
  • <table>, <tr> y <td>: tablas, filas y celdas para mostrar datos ordenados.
  • <div> y <span>: contenedores que agrupan elementos para darles estructura y estilo.

Si combinamos algunas de estas etiquetas obtenemos la estructura mínima de una página: dentro de <html> se incluyen <head> y <body>; en la cabecera se define el <title> y, en el cuerpo, un encabezado <h1> seguido de uno o varios párrafos. A partir de ese esqueleto se van añadiendo enlaces, imágenes y listas hasta construir la página completa. Practicar escribiendo documentos sencillos es la mejor forma de asimilar para qué sirve cada comando.

Buenas prácticas al escribir comandos HTML

Escribir un HTML limpio facilita el mantenimiento de la web y favorece su posicionamiento. Conviene cerrar siempre las etiquetas que lo requieren, anidarlas en el orden correcto y utilizar los nombres de atributo en minúsculas. También es recomendable separar el contenido (HTML) de la presentación (CSS) y del comportamiento (JavaScript), en lugar de mezclar estilos dentro de las etiquetas. Por último, añadir el texto alternativo a las imágenes y emplear los encabezados de forma jerárquica ayuda a la accesibilidad y a que los buscadores entiendan la estructura de la página.

HTML, CSS y JavaScript: cómo encajan

HTML aporta la estructura, pero rara vez trabaja solo. Las hojas de estilo CSS se encargan del aspecto visual —colores, tipografías, márgenes y diseño adaptable a móviles—, mientras que JavaScript añade interactividad y comportamiento dinámico, como menús desplegables, validación de formularios o carga de contenido sin recargar la página. Esta separación de responsabilidades facilita el mantenimiento y mejora el rendimiento del sitio.

Cuando tu página HTML está lista, el siguiente paso es publicarla en internet, y para ello necesitas un alojamiento web donde guardar los archivos y servirlos a los visitantes. Un servidor estable y rápido garantiza que tu código HTML se cargue correctamente en cualquier navegador y que tanto los usuarios como los buscadores accedan a tu contenido sin esperas innecesarias.

Preguntas frecuentes

¿Es lo mismo una etiqueta que un comando HTML?

Sí. En la práctica, los términos “etiqueta” y “comando HTML” se utilizan como sinónimos para referirse a los elementos, escritos entre los símbolos de menor y mayor, que estructuran y dan forma a una página web.

¿Necesito saber programar para usar HTML?

No. HTML no es un lenguaje de programación, sino de marcado, y su sintaxis es sencilla de aprender. Con conocer las etiquetas más habituales y entender cómo funcionan ya puedes crear y editar páginas básicas sin experiencia previa en programación.

¿Cómo puedo comprobar si mi HTML está bien escrito?

Puedes utilizar el validador oficial del W3C, que revisa el código y señala errores o etiquetas mal cerradas. Además, las herramientas para desarrolladores que incluye cualquier navegador permiten inspeccionar y depurar el HTML de una página en tiempo real.

¿Tu web necesita un hosting que vuele?

Hosting en España con soporte real en español, migración gratis, SSL incluido y 30 días de garantía. Sin líos y sin costes ocultos.

Ver planes de hosting →