Contenido del Curso
HTML Definitivo
HTML Definitivo
Desafío: Estructura del Documento
🏁 Objetivo
Construir la página web correcta mediante la creación de una estructura básica del documento HTML. Esta estructura es la columna vertebral de cada página HTML y se compone de elementos esenciales navegadores necesitan para renderizar su contenido correctamente.
Nota
No se deje engañar por la aparente sencillez del diseño de la página web. Aunque pueda parecer sencillo, sigue siendo primordial mantener la estructura correcta del documento. Esto garantiza que el sitio web conserve su legibilidad y funcionalidad en todos los navegadores.
📝 Step-by-Step Guide
Step 1: Start the HTML Document
Begin by typing the HTML doctype declaration, which tells the browser that the document is written in HTML. The declaration should be the first line of your HTML document:
Paso 1: Iniciar el Documento HTML
Comience escribiendo la declaración doctype HTML, que indica al navegador que el documento está escrito en HTML. La declaración debe ser la primera línea de su documento HTML:
Paso 2: Añadir las Tags HTML de Apertura y Cierre
Después de la declaración doctype, añada las tags HTML de apertura y cierre. Toda la estructura del documento HTML estará contenida en estas tags. Además, incluya el atributo lang
para especificar el idioma del documento:
Paso 3: Crear la Sección Head (Encabezado)
Añada las tags de apertura y cierre <head>
dentro de las tags HTML. La sección head contiene meta-información sobre el documento HTML, como el título y enlaces a hojas de estilo externas:
Paso 4: Añadir el Título
Dentro de las tags <head>
, añada las tags de apertura y cierre <title>
. El texto que introduzcamos entre estas tags se mostrará como título de la página web en la barra de título o pestaña del navegador:
Paso 5: Crear la Sección Body
Después de la sección <head>
, añada las tags de apertura y cierre <body>
. La sección body contiene el contenido visible de la página web:
Paso 6: Añadir Contenido al Body
Podemos añadir elementos dentro de las tags <body>
, como encabezados, párrafos, imágenes, enlaces, etc. He aquí un ejemplo de cómo añadir un encabezado y un párrafo:
🔍 ¡Inténtalo tú mismo!
index
index
index
¡Gracias por tus comentarios!