HTML es el “lenguaje empleado para la elaboración de páginas web, define una estructura básica y un código (denominado código HTML) para plasmar el contenido de la página. Es decir, la estructura, el texto, las imágenes o vídeos, entre otros”, explica el Diccionario Panhispánico de Español 1.
Dicho así, puede resultar un poco confuso, pero lo cierto es que se trata del código más usado en la creación de páginas web. Por lo que, aunque no sepas qué es HTML, para qué sirve o cómo se utiliza, lo estás usando ya, mientras lees estas letras. Sí, es mucho más importante de lo que seguramente pensabas, ¿verdad?
Para ahondar un poco más en su importancia: ¡Vamos a ver un resumen de su historia y evolución con datos que recoge la Agencia de Marketing Serna Group 2! ⬇️
1989
Empieza la historia del HTML
El investigador Tim Berners-Lee inventa este código con la intención de compartir artículos científicos. Esta fue la primera versión.
1993
Nace el World Wide Web Consortium (W3C)
Se trata de un organismo que determinará el funcionamiento del HTML.
1996
Llega la versión HTML 3.2
Un paso más en su profesionalización, con una de las versiones más completas que marcaron la historia del HTML.
1999
Se hace oficial la versión 4
Solucionando los problemas de la versión 3, y agregando el llamado iFrame que permite tener sitios dentro de otros sitios.
2014
Quinta versión
Esta es la versión actual, en la que toman relevancia el vídeo, el audio y la posibilidad de introducir datos en la web.
Las siglas HTML corresponden en inglés a "HyperText Markup Language", cuya traducción sería: lenguaje de marcado de hipertexto.
Solo con esta traducción ya tenemos tres conceptos interesantes que nos van a ayudar a entender qué es el HTML:
1️⃣ Primero, que es un lenguaje.
2️⃣ Segundo, el concepto de hipertexto.
3️⃣ Y tercero, que es un lenguaje de marcado
Todo ello nos ayudará a ir trazando una definición más comprensible. Empecemos por el lenguaje:
El HTML es "el fundamento o lenguaje sobre el que se construye toda página web", explica la Universidad Europea 3. Y se utiliza para "estructurar el contenido de forma sencilla, para que cualquier usuario pueda acceder a la información de forma sencilla y útil".
Continuamos por el Hipertexto, ¿sabes lo que es? ➡️Aunque no conozcas la definición, has utilizado el hipertexto para llegar, literalmente, hasta aquí. Y es que se trata de los enlaces que conectan distintas páginas web. Estos enlaces pueden llevarte a una misma página, o a otra diferente, y son los que facilitan "saltar" de un contenido a otro en internet sin que te des prácticamente cuenta y de manera muy sencilla e intuitiva.
Imagen: Jackson Sophat.
Por último, el lenguaje HTML es un lenguaje marcado. ¿Qué quiere decir? Explicado de forma muy sencilla se podría resumir diciendo que utiliza marcadores o marcas para identificar los elementos que conforman dicha página.
🌐 ¡Mejor con un ejemplo! En este artículo, el título tiene una etiqueta o marcador llamada </mark><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-vivid-cyan-blue-color"> </mark>(título). Las fotos son <mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><img></mark> y, si hubiera vídeos, por ejemplo, sería <mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><video></mark>.</p><h3 class="wp-block-heading">¿Cuál es la diferencias entre un lenguaje de marcado y un lenguaje de programación?</h3><p class="wp-block-paragraph">Especialmente para quienes no conocen estos términos, es fácil confundirlos, pues ambos lenguajes son importantes para el desarrollo de páginas webs, pero tienen funciones y propósitos diferentes.</p><div class="wp-block-media-text has-media-on-the-right is-stacked-on-mobile"><div class="wp-block-media-text__content"><p class="wp-block-paragraph">En primer lugar, explica Antonio Heredia Morante, Docente y desarrollador web <sup>4</sup>, porque un "lenguaje de marcado es una herramienta utilizada principalmente para definir la estructura y presentación de un documento". Es decir, esas marcas o etiquetas sirven para darle un formato concreto al contenido.</p></div><figure class="wp-block-media-text__media"><picture class="wp-image-141668 size-full"><source type="image/webp" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html.jpg.webp 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-700x451.jpg.webp 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-980x632.jpg.webp 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-300x193.jpg.webp 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-768x495.jpg.webp 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1536x990.jpg.webp 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-2048x1320.jpg.webp 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-110x71.jpg.webp 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-220x142.jpg.webp 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-288x186.jpg.webp 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-576x371.jpg.webp 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-340x219.jpg.webp 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-680x438.jpg.webp 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-373x240.jpg.webp 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-746x481.jpg.webp 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-432x278.jpg.webp 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-864x557.jpg.webp 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-600x387.jpg.webp 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1200x774.jpg.webp 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1400x902.jpg.webp 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-973x627.jpg.webp 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1946x1254.jpg.webp 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1060x683.jpg.webp 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1128x727.jpg.webp 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1729x1114.jpg.webp 1729w" sizes="(max-width: 2400px) 100vw, 2400px"><source type="image/jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html.jpg 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-700x451.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-980x632.jpg 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-300x193.jpg 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-768x495.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1536x990.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-2048x1320.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-110x71.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-220x142.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-288x186.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-576x371.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-340x219.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-680x438.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-373x240.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-746x481.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-432x278.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-864x557.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-600x387.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1200x774.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1400x902.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-973x627.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1946x1254.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1060x683.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1128x727.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1729x1114.jpg 1729w" sizes="(max-width: 2400px) 100vw, 2400px"><img src="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html.jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html.jpg 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-700x451.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-980x632.jpg 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-300x193.jpg 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-768x495.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1536x990.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-2048x1320.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-110x71.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-220x142.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-288x186.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-576x371.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-340x219.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-680x438.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-373x240.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-746x481.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-432x278.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-864x557.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-600x387.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1200x774.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1400x902.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-973x627.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1946x1254.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1060x683.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1128x727.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-1729x1114.jpg 1729w" alt="Fondo digital abstracto con coloridos fragmentos de código y números binarios que simbolizan la programación y la tecnología." sizes="(max-width: 2400px) 100vw, 2400px"></picture><figcaption>Imagen: Getty Images.</figcaption></figure></div><ul class="wp-block-list"><li><strong>ℹ️</strong><strong>Ejemplo: </strong>además de los que hemos visto más arriba, también puede ser, según explica el experto, organizar un texto en párrafos, crear una lista, poner un enlace en el contenido, etc. </li></ul><p class="wp-block-paragraph">Sin embargo, el lenguaje de programación, explica la misma fuente, está diseñado "para crear aplicaciones y realizar tareas complejas". Este tipo de lenguaje permite un desarrollador/a "escribir instrucciones que el ordenador ejecutará para realizar ciertas acciones". ¿Ves la diferencia?</p><p class="wp-block-paragraph">📝 <strong>En resumen:</strong> el lenguaje de marcado "define la estructura y el diseño de la página", mientras que "el lenguaje de programación maneja la lógica y el comportamiento", finaliza.</p><h2 id="Sección_para-que-sirve-html" class="chapter">¿Para qué sirve HTML?</h2><p class="wp-block-paragraph">El lenguaje <strong>HTML sirve para organizar de forma estructurada el contenido de una página web. </strong>Es, por así decirlo, lo que hay detrás de la misma para que veamos el aspecto final cuando estamos leyendo, por ejemplo, un artículo como este; o cuando estamos comprando en una plataforma de venta online.</p><div class="wp-block-media-text is-stacked-on-mobile"><figure class="wp-block-media-text__media"><picture class="wp-image-141669 size-full"><source type="image/webp" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-scaled.jpg.webp 2560w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-667x500.jpg.webp 667w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-933x700.jpg.webp 933w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-267x200.jpg.webp 267w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-768x576.jpg.webp 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1536x1152.jpg.webp 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-2048x1536.jpg.webp 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-110x83.jpg.webp 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-220x165.jpg.webp 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-288x216.jpg.webp 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-576x432.jpg.webp 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-340x255.jpg.webp 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-680x510.jpg.webp 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-373x280.jpg.webp 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-746x560.jpg.webp 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-432x324.jpg.webp 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-864x648.jpg.webp 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-600x450.jpg.webp 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1200x900.jpg.webp 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-700x525.jpg.webp 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1400x1050.jpg.webp 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-973x730.jpg.webp 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1946x1460.jpg.webp 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1060x795.jpg.webp 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1128x846.jpg.webp 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1729x1297.jpg.webp 1729w" sizes="(max-width: 2560px) 100vw, 2560px"><source type="image/jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-scaled.jpg 2560w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-667x500.jpg 667w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-933x700.jpg 933w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-267x200.jpg 267w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-768x576.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1536x1152.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-2048x1536.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-110x83.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-220x165.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-288x216.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-576x432.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-340x255.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-680x510.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-373x280.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-746x560.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-432x324.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-864x648.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-600x450.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1200x900.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-700x525.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1400x1050.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-973x730.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1946x1460.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1060x795.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1128x846.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1729x1297.jpg 1729w" sizes="(max-width: 2560px) 100vw, 2560px"><img src="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-scaled.jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-scaled.jpg 2560w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-667x500.jpg 667w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-933x700.jpg 933w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-267x200.jpg 267w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-768x576.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1536x1152.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-2048x1536.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-110x83.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-220x165.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-288x216.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-576x432.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-340x255.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-680x510.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-373x280.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-746x560.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-432x324.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-864x648.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-600x450.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1200x900.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-700x525.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1400x1050.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-973x730.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1946x1460.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1060x795.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1128x846.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/para-que-sirve-html-1729x1297.jpg 1729w" alt="Visual 3D de elementos digitales azules que incluyen un monitor de ordenador, enlaces y paneles de interfaz de usuario sobre un fondo oscuro." sizes="(max-width: 2560px) 100vw, 2560px"></picture><figcaption>Imagen: Allison Saeng.</figcaption></figure><div class="wp-block-media-text__content"><p class="wp-block-paragraph">El HTML es lo que permite que diferenciemos, por ejemplo, el título del resto del texto; o que aparezca el precio de un producto resaltado, etc. Para que quede más claro todavía, vamos a ver cuáles son las <strong>funciones principales de HTML en la estructura web:</strong></p></div></div><ul class="wp-block-list"><li>Definir la estructura de la página web y las páginas que a su vez la conforman.</li><li>Diferenciar y definir también los elementos que forman las páginas, como por ejemplo los títulos, los destacados, la organización de un texto en párrafos, la creación de listas (como la que estamos empleando para explicar estas funciones).</li><li>La creación de enlaces para acceder a otras páginas, tanto dentro de la misma web como hacia otra.</li></ul><p class="wp-block-paragraph">En definitiva, establecer cómo se ve el contenido y permitir a las personas que navegan en internet moverse de un lugar a otro a través de los enlaces. </p><p class="wp-block-paragraph"><strong>Ejemplos prácticos: </strong></p><ul class="wp-block-list"><li>1️⃣ <strong>Organizar la información en tablas: </strong>el lenguaje HTML permite, por ejemplo, <a href="https://www.superprof.co/blog/tablas-html/">crear tablas en tu página web</a>. Utilizando las etiquetas table, <strong>tr, td y th </strong>puedes organizar tu texto de manera más ordenada y estructurada. De este modo, la información aparecerá en encabezados, filas y columnas en un lugar específico de tu web.</li><li>2️⃣ <strong>Integrar imágenes en las páginas web: </strong>cuando <a href="https://www.superprof.co/blog/insertar-imagen-html/">insertamos una imagen en HTML</a>, no solo es importante la imagen en sí, sino la información que aportamos sobre la misma; desde el tamaño hasta una descripción, que nos ayudará a que el contenido sea leído y encontrado por los motores de búsqueda, pero también facilitando la accesibilidad a las personas que tienen problemas de visión.</li><li>3️⃣<strong>Dar formato al texto: </strong>por supuesto, en HTML podemos crear texto, que es la base del contenido web. Y es que, aunque cada vez tenga más peso la imagen, el texto sigue siendo la parte fundamental. Con <a href="https://www.superprof.co/blog/texto-html/">HTML podemos poner negritas</a>, subrayados, cursivas, centrar el texto, y un largo etcétera que nos ayudará a que el contenido sea accesible y legible.</li><li>4️⃣<strong>Diseñar páginas web: </strong>todo lo que hemos visto más arriba sirve, en definitiva, para diseñar el contenido de las páginas webs, como esta que estás leyendo ahora mismo.😉</li></ul><a href="/clases/html/colombia/" class="teachers-cta-link" target="_blank"><div class="teachers-cta-wrapper" id="tracking-cta-teachers-2"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/sp-superprof-logo-pink.svg" class="sp-logo" alt="Superprof logo"><div class="sp-presentation">Los mejores profes de HTML que están disponibles</div><div class="slider-wrapper"><div class="slider"><div class="slide-track teachers-cta-glider"><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/13301455/6938440/300/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg 1x, https://c.superprof.com/i/a/13301455/6938440/600/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg 2x" ><img src="https://c.superprof.com/i/a/13301455/6938440/300/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg" alt="Camilo"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (28 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Camilo</div></div><div class="teacher-info-second-row"><div class="rates">$35.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/25625617/11656912/300/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg 1x, https://c.superprof.com/i/a/25625617/11656912/600/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg 2x" ><img src="https://c.superprof.com/i/a/25625617/11656912/300/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg" alt="Miguel"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (14 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Miguel</div></div><div class="teacher-info-second-row"><div class="rates">$50.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/4693975/2249106/300/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg 1x, https://c.superprof.com/i/a/4693975/2249106/600/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg 2x" ><img src="https://c.superprof.com/i/a/4693975/2249106/300/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg" alt="Laura"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (19 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Laura</div></div><div class="teacher-info-second-row"><div class="rates">$198.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/9627702/5054697/300/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg 1x, https://c.superprof.com/i/a/9627702/5054697/600/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg 2x" ><img src="https://c.superprof.com/i/a/9627702/5054697/300/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg" alt="Juan josé"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (10 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Juan josé</div></div><div class="teacher-info-second-row"><div class="rates">$30.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/31813002/13888454/300/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg 1x, https://c.superprof.com/i/a/31813002/13888454/600/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg 2x" ><img src="https://c.superprof.com/i/a/31813002/13888454/300/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg" alt="Jossy"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (58 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Jossy</div></div><div class="teacher-info-second-row"><div class="rates">$50.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/6811008/3423954/300/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg 1x, https://c.superprof.com/i/a/6811008/3423954/600/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg 2x" ><img src="https://c.superprof.com/i/a/6811008/3423954/300/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg" alt="Julian"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (14 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Julian</div></div><div class="teacher-info-second-row"><div class="rates">$30.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/13410283/15390286/300/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg 1x, https://c.superprof.com/i/a/13410283/15390286/600/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg 2x" ><img src="https://c.superprof.com/i/a/13410283/15390286/300/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg" alt="Isleni"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (8 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Isleni</div></div><div class="teacher-info-second-row"><div class="rates">$60.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/18332150/9071049/300/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg 1x, https://c.superprof.com/i/a/18332150/9071049/600/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg 2x" ><img src="https://c.superprof.com/i/a/18332150/9071049/300/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg" alt="Juan camilo"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (6 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Juan camilo</div></div><div class="teacher-info-second-row"><div class="rates">$35.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/13301455/6938440/300/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg 1x, https://c.superprof.com/i/a/13301455/6938440/600/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg 2x" ><img src="https://c.superprof.com/i/a/13301455/6938440/300/20240702153353/ingeniero-sistemas-con-experiencia-desarrollo-web-empleando-tecnologias-como-php-laravel-postgresql-mysql-bootstrap.jpg" alt="Camilo"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (28 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Camilo</div></div><div class="teacher-info-second-row"><div class="rates">$35.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/25625617/11656912/300/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg 1x, https://c.superprof.com/i/a/25625617/11656912/600/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg 2x" ><img src="https://c.superprof.com/i/a/25625617/11656912/300/20250819042440/aprende-programar-aplicaciones-reales-python-net-desarrollo-web-con-enfoque-practico.jpg" alt="Miguel"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (14 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Miguel</div></div><div class="teacher-info-second-row"><div class="rates">$50.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/4693975/2249106/300/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg 1x, https://c.superprof.com/i/a/4693975/2249106/600/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg 2x" ><img src="https://c.superprof.com/i/a/4693975/2249106/300/20250524191405/recibe-asesoria-tus-proyectos-backend-con-java-sql-mongodb.jpg" alt="Laura"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (19 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Laura</div></div><div class="teacher-info-second-row"><div class="rates">$198.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/9627702/5054697/300/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg 1x, https://c.superprof.com/i/a/9627702/5054697/600/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg 2x" ><img src="https://c.superprof.com/i/a/9627702/5054697/300/20221215010017/fullstack-anos-aprende-domina-php-mysql-html-bootstrap-entorno-web-muy-funcional-para-conseguir-buen-empleo-con.jpg" alt="Juan josé"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (10 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Juan josé</div></div><div class="teacher-info-second-row"><div class="rates">$30.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/31813002/13888454/300/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg 1x, https://c.superprof.com/i/a/31813002/13888454/600/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg 2x" ><img src="https://c.superprof.com/i/a/31813002/13888454/300/20240701172139/analista-desarrollador-software-enseno-logica-programacion-para-estudiantes-estan-empezando-mundo.jpg" alt="Jossy"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (58 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Jossy</div></div><div class="teacher-info-second-row"><div class="rates">$50.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/6811008/3423954/300/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg 1x, https://c.superprof.com/i/a/6811008/3423954/600/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg 2x" ><img src="https://c.superprof.com/i/a/6811008/3423954/300/20250218235534/clases-programacion-java-javascript-python-ruby-excel-bases-datos.jpg" alt="Julian"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (14 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Julian</div></div><div class="teacher-info-second-row"><div class="rates">$30.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/13410283/15390286/300/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg 1x, https://c.superprof.com/i/a/13410283/15390286/600/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg 2x" ><img src="https://c.superprof.com/i/a/13410283/15390286/300/20250111195611/estudiante-ingenieria-electronica-ofrece-tutorias-html-arduino-matlab-con-enfoque-practico.jpg" alt="Isleni"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (8 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Isleni</div></div><div class="teacher-info-second-row"><div class="rates">$60.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div><div class="teacher-slide slide"><div class="teacher-photo" data-responsive-background-image><picture><source srcset="https://c.superprof.com/i/a/18332150/9071049/300/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg 1x, https://c.superprof.com/i/a/18332150/9071049/600/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg 2x" ><img src="https://c.superprof.com/i/a/18332150/9071049/300/20250930183902/tecnico-programacion-software-estudiante-septimo-semestre-ingenieria-informatica.jpg" alt="Juan camilo"/></picture></div><div class="teacher-info-wrapper"><div class="ratings"><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/star.svg" class="ratings-star" alt="5"/><div class="ratings-note">5 (6 opiniones)</div> </div><div class="teacher-info-first-row"><div class="name">Juan camilo</div></div><div class="teacher-info-second-row"><div class="rates">$35.000 <div class="rates-unit">/h</div></div><img src="https://cdn-blog.superprof.com/blog_all/wp-content/themes/sp_blog/dist/images/gift-pink.svg" class="gift-icon" alt="Gift icon"/><div class="first-class">¡1<sup>a</sup> clase gratis!</div></div></div></div></div></div></div><div class="teachers-cta-button">Vamos</div></div></a><h2 id="Sección_el-codigo-html-en-accion" class="chapter">El código HTML en acción</h2><figure class="wp-block-image size-full"><picture class="wp-image-141670"><source type="image/webp" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve.jpg.webp 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-700x394.jpg.webp 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-980x551.jpg.webp 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-300x169.jpg.webp 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-768x432.jpg.webp 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1536x864.jpg.webp 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-2048x1152.jpg.webp 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-110x62.jpg.webp 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-220x124.jpg.webp 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-288x162.jpg.webp 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-576x324.jpg.webp 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-340x191.jpg.webp 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-680x383.jpg.webp 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-373x210.jpg.webp 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-746x420.jpg.webp 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-432x243.jpg.webp 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-864x486.jpg.webp 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-600x338.jpg.webp 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1200x675.jpg.webp 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1400x788.jpg.webp 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-973x547.jpg.webp 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1946x1095.jpg.webp 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1060x596.jpg.webp 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1128x635.jpg.webp 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1729x973.jpg.webp 1729w" sizes="(max-width: 2400px) 100vw, 2400px"><source type="image/jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve.jpg 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-700x394.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-980x551.jpg 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-300x169.jpg 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-768x432.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1536x864.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-2048x1152.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-110x62.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-220x124.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-288x162.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-576x324.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-340x191.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-680x383.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-373x210.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-746x420.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-432x243.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-864x486.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-600x338.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1200x675.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1400x788.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-973x547.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1946x1095.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1060x596.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1128x635.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1729x973.jpg 1729w" sizes="(max-width: 2400px) 100vw, 2400px"><img src="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve.jpg" srcset="https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve.jpg 2400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-700x394.jpg 700w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-980x551.jpg 980w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-300x169.jpg 300w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-768x432.jpg 768w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1536x864.jpg 1536w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-2048x1152.jpg 2048w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-110x62.jpg 110w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-220x124.jpg 220w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-288x162.jpg 288w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-576x324.jpg 576w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-340x191.jpg 340w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-680x383.jpg 680w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-373x210.jpg 373w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-746x420.jpg 746w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-432x243.jpg 432w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-864x486.jpg 864w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-600x338.jpg 600w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1200x675.jpg 1200w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1400x788.jpg 1400w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-973x547.jpg 973w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1946x1095.jpg 1946w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1060x596.jpg 1060w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1128x635.jpg 1128w, https://cdn-blog.superprof.com/blog_es/wp-content/uploads/2025/04/que-es-html-y-para-que-sirve-1729x973.jpg 1729w" alt="Sobre un fondo oscuro y ondulado se colocan tres corchetes de código transparentes que simbolizan la programación y la tecnología." sizes="(max-width: 2400px) 100vw, 2400px"></picture><figcaption class="wp-element-caption">Imagen: Alex Shuper.</figcaption></figure><p class="wp-block-paragraph">Vamos a ver ahora, de forma práctica, cómo se interpreta un fragmento de HTML así como su significado línea por línea: </p><ul class="wp-block-list"><li><mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><!DOCTYPE html></mark> explica que se trata de un documento de HTML en su última versión.</li><li><mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><html lang="es"></mark> indica que el contenido está en español.</li><li><mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><head></mark> aporta información sobre la página.</li><li><mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><meta charset="UTF-8"></mark> sirve para que se lean caracteres especiales como puede ser la letra ñ.</li><li><mark style="background-color:rgba(0, 0, 0, 0);color:#ff6363" class="has-inline-color"><title>Ejemplo de página HTML es el título que se verá en el navegador.
el cierre de head (cerras las etiquetas es fundamental en HTML).
