Partes y estructura de una página web ¿Cuál es su importancia?

Tiempo de lectura: 10 min
Partes de una página web y la importancia de la estructura

Contenido

La estructura de una página web es clave para que la navegación por ella sea sencilla para los usuarios. De manera que sea 100% intuitiva y entendible tanto para ellos como para el robot de Google.

Para que entiendas su importancia, imagina que se trata de una vivienda en venta. Si la distribución de las habitaciones no tiene un orden lógico o es necesario dar rodeos para llegar a la otra punta de la casa, es bastante probable que no apuestes por ella dada su complejidad. ¿No te parece?

Pues sucede exactamente lo mismo con la estructura web. Para que tengas claros cuáles son los elementos fundamentales y su importancia, ¡hoy te dejamos las claves principales!

¿Cuáles son las partes de una página web?

Antes de profundizar en la estructura de una página web y sus ramificaciones, es conveniente distinguirla de las partes de una web generales.

Como ya hemos visto nuestro artículo, ¿Qué es una página web y por qué es importante para mi empresa?, estas son exactamente tres:

Cabecera o Header

La cabecera es la parte superior de tu página web. Es lo primero que cualquier usuario visualiza al llegar a una vez.

¿Por qué? Porque nuestro cerebro lee de arriba abajo y de izquierda a derecha. ¡Presta atención a la organización de esta zona!

Lo que se suele incluir aquí es el logo o la identidad corporativa, el menú, los iconos de las redes sociales, un buscador y la información de contacto, principalmente.

Partes de una web Header

Cuerpo o Body

El cuerpo es la parte central. Es aquí donde vas a incluir todos los contenidos que quieres que se visualicen.

Es decir, que cuando alguien pinche en cualquier pestaña, la información se desplegará aquí. Cuanto más ligera sea la presentación y mayor distinción entre sus elementos, más fácil será la lectura.

Partes de una web body

Pie o Footer

El pie o footer es la parte inferior, que como el header, acostumbra a ser una barra con elementos.

Aquí suele aparecer la información de contacto, los iconos de las redes sociales, el logo, la política de privacidad y a veces un mapa del sitio o un menú simplificado.

Partes de una web footer

¿Qué es la estructura web?

Ahora que ya tienes claras las diferentes partes en que se divide un sitio, vamos a pasar a lo que es la estructura de una página web.

La estructura web es la manera en la que la se organizan y se interconectan cada una de las páginas y la información que se quiere mostrar, teniendo en cuenta una jerarquía que irá de mayor a menor importancia en su estructura de árbol. De este modo, ofreceremos tanto a los usuarios, como a los robots de Google u otros buscadores, una perfecta navegación, entendible y con una jerarquía bien marcada.

¿Por qué es importante la estructura de una página web?

La labor a la que se enfrenta un diseñador web es la de crear una página con un diseño acorde con lo que la empresa quiere transmitir, que sea sencilla de usar, 100% entendible y que además ofrezca una experiencia de usuario perfecta.

Cuando la estructura de una página web es la correcta, se mejora la usabilidad o la facilidad para el uso. Esta permite que la información que se busque, se encuentre con rapidez.

¿Y qué se necesita para crear una estructura de una página web? Pues trazar un mapa o un esquema donde se organicen todas las páginas que van a formar la web.

Como podemos ver en la siguiente imagen, la página con una mayor jerarquía suele ser siempre la Home Page, seguida de las categorías, subcategorías y finalmente, las páginas individuales.

Estructura de una pagina web
Estructura web básica

Pero, ¿cómo podemos saber cuál es la correcta?

¿Qué hay que tener en cuenta al crear la estructura web?

El principio por el que se rige la buena estructura web es la llamada Information Architecture o IA.

La arquitectura informacional asegura que todos los contenidos están organizados, estructurados y etiquetados de manera consistente y eficaz.

No obstante, para que suceda así, debes tener en cuenta una serie de aspectos, que son:

– Contenido: La estructura de una página web viene determinada por el tipo y la cantidad de contenido que incluya. La diferencia más evidente se produce entre las tiendas electrónicas y las páginas informativas.

– User journey: Se refiere al camino o caminos que toman los usuarios dentro de nuestra página web hasta llegar a su objetivo y se cumplan sus expectativas o, de lo contrario, abandone nuestra web descontento por no encontrar lo que desea.

– Contexto: Aquí entran tus objetivos de negocio, los recursos disponibles o el contexto cultural.

Elementos de una buena estructura web

Ya de lleno en lo que nos atañe, debes saber que la estructura web más común, o la que se recomienda, es jerárquica. Es decir, que se parte una página principal la Home, y desde ahí fluyen otras páginas secundarias, como las categorías y las subcategorías, hasta llegar a páginas individuales. ¡Vamos a ver cada una en detalle!

Home page

La página principal es el punto más alto de la jerarquía; el central, y desde ahí partirá toda navegación. Para ello, todas las páginas importantes deben ir enlazadas a esta siguiendo un menú u otras partes de la misma.

Dicho menú debe ser visible, ya que es una especie de esquema, que permite al usuario identificar con rapidez lo que busca.

¿Y cómo debe ser el menú? En primer lugar, ordenado. Otras claves son el uso de frases cortas o palabras descriptivas de cada elemento y de lenguaje comprensible.

La home page debe tener toda la información necesaria para que a los usuarios les quede claro cuál es la finalidad de tu página web, que sea estéticamente perfecta y quieras seguir navegando por ella.

Categorías y subcategorías

Las categorías agrupan a una serie de páginas con características similares. Por ejemplo, las temáticas dentro de un blog o los tipos de productos en una tienda.

Páginas individuales

Las páginas individuales son aquellas que cuelgan de las categorías o las subcategorías, con la finalidad de dar toda la información que necesita el usuario sobre un producto, servicio o sobre una temática concreta del blog.

Es decir, estas deben contener todo lo que el usuario desea encontrar para satisfacer su búsqueda.

Vamos a poner un ejemplo para ver cada uno de estos elementos en la página de Apple.

Esta sería la home page o página principal de Apple España. Como categorías, tendríamos páginas de producto como la de iPhone. Seguiríamos con las subcategorías en las que podemos ver los modelos de este producto como ahora el iPhone 13 Pro. Y finalmente, al darle a comprar, encontraríamos la página individual.

Sencillo, ¿verdad?.

Para estructurar la información en estas se utilizan las rutas de navegación con migas de pan o breadcrumbs. Esto, muestra al usuario el camino exacto que se ha seguido hasta llegar hasta esa página en concreto y muestra en qué lugar de la web estás exactamente.

Ejemplo breadcrumbs o migas de pan
Ejemplo breadcrumbs de este mismo artículo

La estructura de una página web es la que te ayudará a que la información se muestre organizada y enlazada entre sí y permita facilitar tanto el uso como la experiencia del usuario. Para lograrlo, la clave está en apostar por diseños creativos, pero también llevados a cabo por diseñadores web profesionales que dominen este campo.

Artículos relacionados
10 min
Digitalizar una empresa consiste, en primer lugar, en migrar de los soportes físicos a los digitales. Sin embargo, el concepto puede llevarse más allá y enlazarlo con la transformación digital.
20 min
¿Tienes una empresa, un proyecto o una marca que te gustaría dar a conocer? ¿O quizás una pequeña idea que podría ser digna de tener un sitio web? Si tu respuesta es sí, quiero contarte el paso a paso necesario para que puedas crear una página web desde cero.
17 min
Si ha llegado el momento de desarrollar la web de tu proyecto y estás valorando opciones de diseño, te habrás dado cuenta de que las opciones son casi ilimitadas. Hoy te contamos cuáles son las mejores plantillas WordPress del 2022, tanto gratuitas como de pago.