🧠Ejercicio paso a paso: ¡Crea tu primera página web con HTML!
¡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!
