¡Hola, programador en formación! Hoy vamos a dar nuestros primeros pasos en el mundo del desarrollo web. Al final de este ejercicio, habrás creado tu primera página web en HTML desde cero. Sigue cada paso con atención y no dudes en experimentar. 🚀
📌 ¿Qué necesitas?
- Un editor de texto (como Notepad++ o Visual Studio Code).
- Un navegador web (como Chrome, Firefox o Edge).
- ¡Ganas de aprender!
👣 Paso 1: Crea un archivo HTML
- Abre tu editor de texto favorito.
- Crea un nuevo archivo y guárdalo como
mi_primera_pagina.html
.
👣 Paso 2: Escribe la estructura básica
Copia y pega este código en tu archivo:
<!DOCTYPE html>
<html>
<head>
<title>Mi Primera Página</title>
</head>
<body>
<h1>¡Hola, Mundo!</h1>
<p>Esta es mi primera página web creada con HTML.</p>
</body>
</html>
💡 Guarda el archivo y ábrelo con tu navegador para ver el resultado.
👣 Paso 3: Añade subtítulos y texto
Debajo del párrafo, añade estos elementos:
<h2>Sobre mí</h2>
<p>Me llamo [tu nombre] y estoy aprendiendo HTML.</p>
<h3>Mis hobbies</h3>
<ul>
<li>Leer</li>
<li>Escuchar música</li>
<li>Programar</li>
</ul>
👣 Paso 4: Agrega una línea divisoria y un salto de línea
Justo después de la lista, añade:
<hr>
<p>Esto es un nuevo párrafo.<br>¡Está separado con un salto de línea!</p>
👣 Paso 5: Muestra tus conocimientos
- Crea una sección usando
<h2>
con el título:Lo que he aprendido hoy
. - Dentro, haz una lista ordenada (
<ol>
) de las etiquetas HTML que ya sabes usar.
✅ Resultado final esperado
Tu página debería mostrar:
- Un título grande.
- Información personal.
- Una lista de hobbies.
- Una línea divisoria.
- Texto con salto de línea.
- Una lista ordenada con las etiquetas que has aprendido.
🧪 Reto adicional
¿Te animas a ir un paso más allá? Añade una imagen de internet usando la etiqueta <img>
y un enlace a tu sitio favorito con <a>
.
🗨️ Comentarios y dudas
Si tienes alguna duda o quieres compartir cómo quedó tu página, ¡déjalo en los comentarios!
