Para tener una Estructura de Páginas Web Básica es necesario que este escrita en HTML5 ya que HTML define el contenido de cada página web en Internet. Al “marcar” su contenido en bruto con etiquetas HTML, puede decirle a los navegadores web cómo desea que se muestren las diferentes partes de su contenido. Crear un documento HTML con contenido marcado correctamente es el primer paso para desarrollar una página web.

Estructura Básica de un Sitio Web con HTML5

Agregue el siguiente marcado HTML a nuestro archivo basics.html. Esto es con lo que comenzará por cada página web que produzca. Por lo general, usaría un motor de plantillas de algún tipo para evitar volver a escribir las partes redundantes, pero para este tutorial, nos centraremos en el HTML sin formato.

<!DOCTYPE html>
<html lang="es-MX">
  <head>
    <!-- Metadata  -->
  </head>
  <body>
    <!-- Contenido -->
  </body>
</html>

Primero, necesitamos decirle a los navegadores que esta es una página web HTML5 con la línea.

 <! DOCTYPE html> 

Esta es solo una cadena especial que los navegadores buscan cuando intentan mostrar nuestra página web, y siempre necesita verse exactamente como se muestra arriba.

Luego, toda nuestra página web debe estar envuelta en etiquetas <html>. El <html>.texto real se denomina “etiqueta de apertura” </html> ., mientras que se denomina<html>. “etiqueta de cierre”. Todo lo que se encuentra dentro de estas etiquetas se considera parte del “elemento” , que es esta cosa etérea que se crea cuando un navegador web analiza sus etiquetas HTML.

Etiquetas de Páginas Web Básicas con HTML5


Dentro del elemento  <html> tenemos dos elementos más llamados <head> y <body>. El encabezado de una página web contiene todos sus metadatos, como el título de la página, las hojas de estilo CSS. La mayor parte de nuestro marcado HTML vivirá en el elemento <body>, que representa el contenido visible de la página. Tenga en cuenta que abrir nuestra página en un navegador web no mostrará nada, ya que tiene un <body> vacío..


El propósito de esta división <head> / <body> se aclarará en unos pocos capítulos después de comenzar a trabajar con CSS. Observe también la sintaxis de comentarios HTML en el fragmento anterior. Todo lo que comienza con <! – y termina con -> será completamente ignorado por el navegador. Esto es útil para documentar su código y tomar notas para usted mismo.

Títulos

En la Estructura Básica de Páginas Web una de las piezas de metadatos más importantes es el título de su página web, definida por el elemento llamado acertadamente. Los navegadores muestran esto en la pestaña de su página, y Google lo muestra en los resultados del motor de búsqueda.</p> <p>Intente actualizar el <head> de nuestro archivo basic.html para que coincida con lo siguiente:</p>

<!DOCTYPE html>
<html lang="es-MX">
  <head>
    <title>Planetario Web</title>
  </head>
  <body>
    <p>Primero, necesitamos aprender algo de HTML básico.</p>
  </body>
</html>

REFERENCIA: Estructura básica de HTML5