DevHive

👋 ¡Bienvenido al mundo del desarrollo web!

Si estás dando tus primeros pasos como desarrollador web, es normal que te preguntes:

“¿Por dónde empiezo? ¿Cómo se construye una página web desde cero?”

La respuesta está en aprender la estructura básica en HTML5, el lenguaje fundamental para construir cualquier sitio web.
En esta guía te explico paso a paso cómo crear tu primera página web, usando HTML5 moderno, con ejemplos sencillos y conceptos clave para que aprendas rápido.

✅ ¿Qué es HTML5?

HTML5 es la quinta versión del Lenguaje de Marcado de Hipertexto (HTML).
Este lenguaje sirve para dar estructura al contenido web, es decir, para definir qué es un título, un párrafo, una imagen, un video o un formulario dentro de tu sitio.

🔧 ¿Cómo se estructura una página en HTML5?

Toda página web comienza con una estructura base compuesta por varias etiquetas esenciales. Aquí te muestro cómo se ve una estructura mínima y te explico cada parte.

✨ Código base:

html
Copiar

Editar<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Mi primera página web</title>
</head>
<body>
  <h1>¡Hola Mundo!</h1>
  <p>Esta es mi primera página web creada con HTML5.</p>
</body>
</html>

🧠 Explicación clara de cada parte

1. <!DOCTYPE html>

Esta línea le dice al navegador que estás usando HTML5. Es muy importante y siempre va al principio del archivo.

2. <html lang="es">

Aquí comienza tu documento HTML. El atributo lang="es" indica que el contenido está en español.

3. <head>

Dentro de la etiqueta <head> colocas información interna o “de fondo” de tu página web:

<meta charset="UTF-8">: Permite que los acentos y caracteres especiales se muestren correctamente.
<meta name="viewport">: Hace que tu página sea responsive, es decir, que se vea bien en celulares, tablets y computadoras.
<title>: El título que aparecerá en la pestaña del navegador.

4. <body>

Aquí va el contenido visible de tu página web: textos, imágenes, videos, botones, etc.

Por ejemplo:

html
Copiar

Editar<h1>¡Hola!</h1>
<p>Bienvenido a mi primer sitio web</p>
<img src="mi-foto.jpg" alt="Foto personal">

🚀 ¿Qué puedes hacer ahora?

Copia el código base y crea tu primer archivo .html
Ábrelo en tu navegador para ver el resultado
Guárdalo como plantilla para futuros proyectos

📣 Conclusión

Aprender la estructura básica de una página web en HTML5 es el primer paso hacia convertirte en un desarrollador web profesional. Con solo unas pocas líneas de código, puedes empezar a construir tu presencia en la web.

Y lo mejor es que no necesitas herramientas complicadas ni experiencia previa. Solo ganas de aprender.

Estructura básica de una página web en HTML5: Guía clara para principiantes