Antes de hablar de su origen, es importante entender qué es el HTML y cuáles son sus partes.
En primer lugar debemos mencionar que el HTML tiene un significado que es la de HyperText Markup Language, que traducido al español significa el Lenguaje de Marcado Hipertexto. Pero debemos saber que no es un lenguaje de programación como por ejemplo conocemos el JavaScript o también el Phyton. Este es un lenguaje marcado lo cuál significa que solamente se usa para poder estructurar los contenidos de las páginas web.
Las Partes de un Código HTML
Un archivo HTML básico está formado por elementos como:
Etiquetas: como , , , que definen el tipo de contenido.
Atributos: que dan información adicional, por ejemplo, href en un enlace.
Contenido: el texto, imagen o elementos que verás en la web.
Comentarios: como , que no se muestran en la web.
Un ejemplo muy simple de HTML sería este:
Mi primera página
Hola, mundo
Este es mi primer sitio web.
El Origen de HTML: ¿Dónde y cómo comenzó todo?
El Inicio: CERN y Tim Berners-Lee
El origen de HTML se remonta aproximadamente a los finales de los 80, cuando en aquella ocasión Tim Berners-Lee de nacionalidad británica que trabajaba en el CERN (Centro Europeo de Investigación Nuclear), venía buscando alguna manera de poder compartir informaicón entre muchos Investigadores de diferentes países.
En 1989, Berners-Lee propuso un sistema de "hipertexto" que permitiría enlazar documentos entre sí a través de una red: la World Wide Web. En 1991, desarrolló la primera versión de HTML, que contenía solo unas pocas etiquetas como </code>, <code data-start="2294" data-end="2299"><p></code>, <code data-start="2301" data-end="2307"><h1></code>, <code data-start="2309" data-end="2314"><a></code> y <code data-start="2317" data-end="2323"><ul></code>.</span></p>
<p style="text-align: justify;" data-start="2326" data-end="2504"><span style="color: #000000;">La idea era simple: un lenguaje que estructurara la información y permitiera <strong data-start="2403" data-end="2434">enlazar documentos entre sí</strong>. </span></p>
<blockquote data-start="2506" data-end="2630">
<p data-start="2508" data-end="2630"><span style="color: #000000;"><strong data-start="2508" data-end="2525">Dato curioso:</strong> El primer sitio web de la historia aún está disponible y fue creado por Tim Berners-Lee en info.cern.ch.</span></p>
</blockquote>
<h2 style="text-align: center;"><span id="Que_significa_incorporar_HTML"><span id="que_significa_incorporar_html_">¿Qué significa incorporar HTML?</span></span></h2>
<p style="text-align: justify;" data-start="2673" data-end="2847"><span style="color: #000000;">Cuando hablamos de <strong data-start="2692" data-end="2711">incorporar HTML</strong>, nos referimos a <strong data-start="2729" data-end="2779">incluir este lenguaje dentro de otros entornos</strong> para que los navegadores puedan mostrar contenido web. Por ejemplo:</span></p>
<ul style="text-align: justify;" data-start="2849" data-end="3008">
<li data-start="2849" data-end="2884">
<p data-start="2851" data-end="2884"><span style="color: #000000;">En un sitio web hecho desde cero.</span></p>
</li>
<li data-start="2885" data-end="2919">
<p data-start="2887" data-end="2919"><span style="color: #000000;">Dentro de un CMS como WordPress.</span></p>
</li>
<li data-start="2920" data-end="2972">
<p data-start="2922" data-end="2972"><span style="color: #000000;">En correos electrónicos con contenido enriquecido.</span></p>
</li>
<li data-start="2973" data-end="3008">
<p data-start="2975" data-end="3008"><span style="color: #000000;">En aplicaciones híbridas móviles.</span></p>
</li>
</ul>
<p style="text-align: justify;" data-start="3010" data-end="3166"><span style="color: #000000;">Incorporar HTML permite que los navegadores entiendan <strong data-start="3064" data-end="3100">cómo debe mostrarse el contenido</strong>: si es un texto, una imagen, un botón, un formulario o un enlace.</span></p>
<p style="text-align: justify;" data-start="3010" data-end="3166"><span style="color: #000000;"><a style="color: #000000;" href="https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1.png" target="_blank" rel="noopener"><img decoding="async" loading="lazy" class="aligncenter wp-image-46435 size-full" src="data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20600%20400'%3E%3C/svg%3E" alt="origen de html" width="600" height="400" data-lazy-srcset="https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1.png 600w, https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1-300x200.png 300w, https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1-400x267.png 400w" data-lazy-sizes="auto, (max-width: 600px) 100vw, 600px" data-lazy-src="https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1.png" /><noscript><img decoding="async" loading="lazy" class="aligncenter wp-image-46435 size-full" src="https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1.png" alt="origen de html" width="600" height="400" srcset="https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1.png 600w, https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1-300x200.png 300w, https://www.codigosinformaticos.com/wp-content/uploads/2025/05/2-1-400x267.png 400w" sizes="auto, (max-width: 600px) 100vw, 600px" /></noscript></a></span></p>
<h2 style="text-align: center;"><span id="Como_se_inicia_el_codigo_HTML"><span id="como_se_inicia_el_codigo_html_">¿Cómo se inicia el código HTML?</span></span></h2>
<p data-start="3209" data-end="3360"><span style="color: #000000;">Todo el código <strong>HTML</strong> siempre comienza con una estructura base, que por ejemplo le dice al navegador que se trata justamente de un docuemtno HTML. A continuación te dejamos como ejemplo una plantilla básica:</span></p>
<p style="text-align: justify;" data-start="3209" data-end="3360"><span style="color: #0000ff;"><!DOCTYPE html></span><br />
<span style="color: #0000ff;"><html></span><br />
<span style="color: #0000ff;"><head></span><br />
<span style="color: #0000ff;"><title>Mi sitio web
