El template HTML
Lección 5 / 29
HTML Html5
La estructura de un documento HTML se compone de un contenedor <html> y dos secciones distintas, a saber, el <head> y el <body>.
Imaginemos nuestra página HTML simple como un ser humano: está compuesta por la cabeza (head) y el cuerpo (body). Más concretamente en la metáfora, la cabeza representa el cerebro de nuestro ser, el conocimiento interno o externo que le daremos a nuestro documento HTML; por lo tanto, contendrá toda la metainformación que una hoja html necesita para funcionar (por ejemplo, enlaces a archivos y fuentes externas, metaetiquetas, etc.). El cuerpo, por su parte, representa todo lo que veremos de forma tangible en el navegador.
Todos estos elementos, por supuesto, necesitan su etiqueta de cierre: </html>, </head> y </body>.
Veámos juntos un ejemplo de estructura HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
El DOCTYPE es la primera declaración de una página web escrita en lenguaje HTML y siempre debe preceder a la etiqueta de apertura <html> del documento.
El DOCTYPE, a diferencia de los demás, no es una etiqueta sino una declaración que le dice al navegador qué versión de HTML estamos usando en este documento.
En la <head> sin embargo, encontramos los “tag especiales”, definidos Meta Tag que no necesitan un cierre.
Las Meta Tag, también llamadas metadatos, son etiquetas HTML que describen el contenido de la página para los motores de búsqueda y los visitantes del sitio web.
Siempre es en el <head> donde se insertará el otro conocimiento que respalda la creación de nuestros sitios (como el enlace a marcos/bibliotecas externas o enlaces a nuestra página de estilo CSS).
Por último, la etiqueta de título es la etiqueta que representa el título de nuestra página web, el mismo título que aparecerá en la página de resultados del buscador.
Pero, ¿dónde creamos nuestros trabajos? Como ya se mencionó, las buenas herramientas para un desarrollador web son los editores de texto.
No tengas duda sobre cuál usar, en Aulab ya te hemos recomendado uno: Visual Studio Code.
Anterior
4 Los mejores editores..Siguiente
6 Tag y atributos