En este tutorial vamos a explicar las partes de una estructura básica de una página hecha en HTML. Como veremos, la sección del body (donde va toda la información que se muestra al usuario), puede y debe hacerse más compleja, conteniendo capas y estructuras que conformes los menús, el contenido y el pie de página, entre otros.
Junto con esta guía, te recomiendo que leas los siguientes documentos:
- Conceptos básicos de HTML.
- Normas elementales en HTML.
- Videotutoriales de HTML y HTML básico.
- Como hacer buenas páginas en HTML.
- Todos los capítulos del subapartado Crear una página web de este manual.
Introducción
Cada página HTML debe constar de dos secciones:
- El HEAD o cabecera, donde está la información sobre la página web, como el título, una breve descripción y algunas palabras clave. También puede contener información de estilos (CSS) y librerías JavaScript.
- El BODY o cuerpo, donde está todo el contenido que el usuario va a ver en su navegador.
Las siguientes etiquetas HTML se utilizan para construir la estructura básica de una web:
- <html> significa el inicio (y final) del documento.
- <head> significa el inicio (y final) de la sección de cabecera del documento.
- <title> Es el título del documento. Esto se muestra por la mayoría de los navegadores como título de la ventana, cuando agregas una web a favoritos, etc. Los motores de búsqueda como Google suelen utilizarlo también como título en los resultados de búsqueda, por lo que es muy importante para la optimización de la página web y el SEO en general. Por todo esto, debes escoger muy bien el título de cada página de tu sitio web y procurar que todos sean únicos y descriptivos.
- <body> significa el inicio (y final) del contenido visible del documento (lo que ve el usuario final).
Estructura básica en HTML
Un ejemplo completo de un documento HTML sería (ojo, sólo la estructura básica):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Título de ejemplo</title>
</head>
<body>
<p>¡Esta es mi web!</p>
</body>
</html>
modificado el 4 octubre, 2013 1:31
Ver comentarios (2)
hola buenos ejemplos
Gracias por tu tiempo y explicar a las personas que no sabemos. Espero seguir aprendiendo más en esta Web.