Por norma general, casi todas las webs mantienen la misma estructura, y quizás te preguntes porque ocurre esto. Vamos a crear la estructura que tendría una página web e iremos explicando la razón de cada una.
Esto sería una estructura final:
El tamaño en píxeles de los últimos monitores en Full HD no suele superar los 1920px en su horizontal, por eso esta estructura tampoco los supera. De esta manera un monitor actual vería la web como la imagen anterior, pero ¿y si el tamaño del monitor es de los antiguos CRT? La idea es que el contenido de la web esté en la zona naranja y se coloque al centro del monitor, de esta manera un CRT la vería así:
Como veis la zona naranja sigue estando visible que es la importante porque es la que contiene el contenido de la web, la única pega es que no vería el fondo completo que es la zona gris.
La cabecera (parte azul), siempre debe estar en la posición superior puesto que es la parte más importante de la web, te permite navegar por los diferentes menús y está presente en todas las partes de tu web.
Imaginemos que lo colocamos abajo, si un monitor es corto en cuanto a altura, tendríamos que hacer scroll vertical cada vez que queramos navegar por los menús y no sería una práctica muy favorable.
El fondo (parte gris), como hemos mencionado antes será mejor su visibilidad en monitores grandes, pero como no es una parte fundamental de la web se puede “perder” en monitores pequeños.
El cuerpo (parte naranja), aquí es donde colocamos el contenido e información más importante de nuestro sitio y de cada uno de nuestros menús.
El pie de página (parte rosa), se utiliza para colocar información adicional de la página web, tales como dirección, teléfono, email, etc.
Un dato importante es la visualización en dispositivos móviles, que la estructura se pierde un poco ya que hay que organizar los elementos según el dispositivo.
Nuestro creador web cumple con la estructura que hemos explicado y además adaptado a dispositivos móviles, de modo que no tendrías que preocuparte por este tema.
Ahora que ya conoces como se realiza una estructura te dejo un ejemplo creado con nuestro creador web:
