Estructura de una página web estructura del diseño

Estructura del sitio web

Además de definir partes individuales de su página (como “un párrafo” o “una imagen”), HTML también cuenta con una serie de elementos a nivel de bloque que se utilizan para definir áreas de su sitio web (como “la cabecera”, “el menú de navegación”, “la columna de contenido principal”). Este artículo analiza cómo planificar la estructura básica de un sitio web y escribir el HTML que represente esta estructura.

Secciones básicas de un documentoLas páginas web pueden tener y tendrán un aspecto bastante diferente entre sí, pero todas suelen compartir componentes estándar similares, a menos que la página muestre un vídeo o un juego a pantalla completa, forme parte de algún tipo de proyecto artístico o simplemente esté mal estructurada:

Enlaces a las secciones principales del sitio; suelen estar representados por botones de menú, enlaces o pestañas. Al igual que la cabecera, este contenido suele ser consistente de una página web a otra: tener una navegación incoherente en tu sitio web sólo hará que los usuarios se sientan confundidos y frustrados. Muchos diseñadores web consideran que la barra de navegación forma parte de la cabecera en lugar de ser un componente individual, pero esto no es un requisito; de hecho, algunos también argumentan que tener las dos separadas es mejor para la accesibilidad, ya que los lectores de pantalla pueden leer las dos características mejor si están separadas.

Generador de la estructura de árbol del sitio web

Los sitios web se construyen en torno a temas estructurales básicos. Estas arquitecturas fundamentales rigen la interfaz de navegación del sitio web y moldean los modelos mentales del usuario sobre cómo está organizada la información. Se pueden utilizar tres estructuras esenciales para construir un sitio web: secuencias, jerarquías y redes.

La forma más sencilla de organizar la información es colocarla en una secuencia. La ordenación secuencial puede ser cronológica, una serie lógica de temas que van de lo general a lo específico, o alfabética, como en los índices, enciclopedias y glosarios. Las secuencias rectas son la organización más adecuada para los sitios de formación, por ejemplo, en los que se espera que el lector recorra un conjunto fijo de material y los únicos enlaces son los que apoyan la ruta de navegación lineal:

Los sitios web más complejos pueden seguir organizándose como una secuencia lógica, pero cada página de la secuencia principal puede tener enlaces a una o más páginas de digresiones, información parentética o información de otros sitios web:

Las jerarquías de información son la mejor manera de organizar los cuerpos de información más complejos. Dado que los sitios web suelen organizarse en torno a una única página de inicio, los esquemas jerárquicos son especialmente adecuados para la organización de sitios web. Los esquemas jerárquicos son muy familiares en la vida corporativa e institucional, por lo que la mayoría de los usuarios encuentran esta estructura fácil de entender. Una organización jerárquica también impone una disciplina útil en su propio enfoque analítico del contenido, porque las jerarquías son prácticas sólo con material bien organizado.

Jerarquía del sitio web

Además de definir partes individuales de su página (como “un párrafo” o “una imagen”), HTML también cuenta con una serie de elementos a nivel de bloque que se utilizan para definir áreas de su sitio web (como “la cabecera”, “el menú de navegación”, “la columna de contenido principal”). Este artículo analiza cómo planificar la estructura básica de un sitio web y cómo escribir el HTML para representar esta estructura.

Secciones básicas de un documentoLas páginas web pueden tener y tendrán un aspecto bastante diferente entre sí, pero todas suelen compartir componentes estándar similares, a menos que la página muestre un vídeo o un juego a pantalla completa, forme parte de algún tipo de proyecto artístico o simplemente esté mal estructurada:

Enlaces a las secciones principales del sitio; suelen estar representados por botones de menú, enlaces o pestañas. Al igual que la cabecera, este contenido suele ser consistente de una página web a otra: tener una navegación incoherente en tu sitio web sólo hará que los usuarios se sientan confundidos y frustrados. Muchos diseñadores web consideran que la barra de navegación forma parte de la cabecera en lugar de ser un componente individual, pero esto no es un requisito; de hecho, algunos también argumentan que tener las dos separadas es mejor para la accesibilidad, ya que los lectores de pantalla pueden leer las dos características mejor si están separadas.

Estructura del sitio Html

Los mapas del sitio web son diagramas estructurales que se utilizan para planificar el propósito, la navegación y la organización general de un sitio web. También se utilizan para experimentar con un nuevo diseño del sitio web, probar nuevas rutas de navegación y reorganizar las estructuras existentes.

Un mapa del sitio es una herramienta que puede utilizarse para visualizar la estructura de un sitio web. Al mismo tiempo que enumera las páginas web o el contenido de un sitio web, le ayuda a identificar la información de la que debe constar su sitio web, eliminar…

Elaborar un mapa del sitio es como cocinar un plato perfecto. Ya dijimos hace tiempo que un mapa del sitio tiene más que ver con la idea que hay detrás de un sitio web, mientras que un esquema y una maqueta son…

Cuando se trata de idear el diseño de un sitio web, el modus operandi habitual para la mayoría es conjurar un mapa del sitio (que puede definirse como un conjunto de páginas de un sitio web, que es accesible tanto para los rastreadores como para los usuarios) antes de proceder al diseño de un wireframe…

La mayoría de la gente asume que para construir un gran sitio web, su prioridad debe ser en los aspectos técnicos o ser bueno en las cosas de diseño. Sin embargo, no estamos de acuerdo. Los grandes sitios web no se construyen por capricho. Se planifican y luego se construyen (y se actualizan con frecuencia). Así que esta guía le ayudará a establecer…