Todo rascacielos empieza con unos planos sólidos. En la web, ese plano es el Boilerplate. No importa si estás creando Facebook o el blog de tu perro, todos comparten el mismo ADN.
Las piezas del rompecabezas
-
<!DOCTYPE html>: No es una etiqueta, es una declaración. Le grita al navegador: "¡Oye, prepárate para procesar HTML moderno!". -
<html>: El contenedor raíz. Todo nace y muere aquí dentro. -
<head>: El centro de control. Metadatos, títulos, enlaces a CSS y scripts que el usuario no ve, pero que hacen que la web funcione. -
<body>: El escenario. Aquí es donde vive el contenido real que tus usuarios consumirán.
Código: El "Hola Mundo" Profesional
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mi Gran Proyecto - John</title>
</head>
<body>
<h1>¡Hola desde la estructura maestra!</h1>
<p>Este es el contenido visible que el navegador renderiza.</p>
</body>
</html>
Tip para el Futuro Senior:
Nunca olvides el atributo lang="es" en la etiqueta <html>. No solo ayuda a Google a indexar tu sitio en el idioma correcto, sino que permite que los lectores de pantalla para personas con discapacidad visual usen la pronunciación adecuada. ¡La accesibilidad empieza en la primera línea!
Top comments (0)