Codigos Html De Una Pagina Web Creada

Written by Clara Martínez
Updated at: 06 April 2026

Entendiendo el Código HTML: La base de tu página web.

El HTML (HyperText Markup Language) es el lenguaje que usamos para construir la estructura de una página web. Piensa en él como el esqueleto que define dónde van los textos, imágenes, enlaces y demás elementos. Sin HTML, tu navegador no sabría cómo mostrar el contenido.

Anatomía básica del código HTML

Un documento HTML básico tiene esta estructura:

Must Read


<!DOCTYPE html>
<html>
<head>
  <title>Título de la página</title>
</head>
<body>
  <h1>Encabezado principal</h1>
  <p>Este es un párrafo de texto.</p>
</body>
</html>

Vamos a desglosarlo paso a paso:

<!DOCTYPE html>: Declara que el documento es HTML5 (la versión más moderna).
<html>: La etiqueta raíz que engloba todo el código HTML.
<head>: Contiene información sobre la página, pero no se muestra directamente en el navegador. Aquí se define el título (<title>), enlaces a hojas de estilo (CSS) y metadatos importantes para el SEO.
<title>: Define el título que aparece en la pestaña del navegador.
<body>: ¡Aquí está la chicha! Contiene todo el contenido visible de la página web: texto, imágenes, videos, etc.
<h1>: Una etiqueta para los encabezados (títulos). <h1> es el más importante, <h2> es un subtítulo, y así sucesivamente hasta <h6>.
<p>: Define un párrafo de texto.

Etiquetas y Atributos: Los ladrillos del HTML

Las etiquetas HTML (como <p>, <h1>, <img>) son las instrucciones que le dicen al navegador cómo mostrar el contenido. Casi todas las etiquetas vienen en pares: una de apertura (<p>) y una de cierre (</p>). El contenido va entre ellas.

Creacion de paginas web con html (Diana Lopez)

Los atributos añaden información adicional a las etiquetas. Por ejemplo:


<img src="imagen.jpg" alt="Descripción de la imagen">

En este caso, `src` es un atributo que especifica la ruta de la imagen, y `alt` proporciona un texto alternativo que se muestra si la imagen no se carga.

Cómo hacer una página web en HTML (paso a paso)

Ejemplos prácticos

Imágenes: Usa la etiqueta <img>. Recuerda el atributo `src` para indicar la ruta de la imagen.


<img src="mi_foto.jpg" alt="Mi foto de perfil" width="200">

Enlaces: Usa la etiqueta <a> (anchor). El atributo `href` indica la URL a la que apunta el enlace.


<a href="https://www.ejemplo.com">Visita Ejemplo.com</a>

Listas: Hay dos tipos principales: ordenadas (<ol>) y no ordenadas (<ul>). Cada elemento de la lista se define con la etiqueta <li>.


<ul>
  <li>Primer elemento</li>
  <li>Segundo elemento</li>
</ul>

Entender el código HTML es el primer paso para crear tus propias páginas web. ¡Practica con ejemplos y experimenta! Verás cómo rápidamente le coges el truco. Recuerda que internet es una fuente inagotable de recursos y tutoriales para aprender más.