Estructura de un sitio web

Estructura de un sitio web: si no está bien, mal.

La estructura de un sitio web hace referencia a la forma en que sus páginas están relacionadas entre sí y la experiencia de navegación del usuario. En este post vamos a explicar cómo crear una buena estructura de un sitio web.

La estructura de un sitio web no tiene nada que ver con la ubicación de los elementos de diseño web como he visto en algunos sitios. No se refiere a las “partes de una página web”, que se refiere más a la apariencia y es algo visible a simple vista. La estructura de un sitio web tampoco se refiere solamente al menú de navegación, también visible. Hace referencia a algo más interno e invisible para el usuario, pero fácil de llevar a cabo por el diseñador web o quien gestiona la página.

Como siempre, voy a hablar del diseño web en WordPress, aunque esta estructura de un sitio web es aplicable a todos los diseños, desde personalizados a otros gestores de contenido.

Desde aquí puedes acceder directamente a la sección que más te interese, aunque recomiendo hacerlo en orden.

1. Tipos de estructura de un sitio web
2. Número de páginas en la estructura de un sitio web
3. Niveles de estructura de un sitio web
4. Cómo definir la estructura de un sitio web casi perfecto (conceptual)
5. Pasos para estructurar el sitio (técnico)
   1. Paso 1: Hacer el árbol de la estructura de un sitio web
   2. Paso 2: Hacer estructura de un sitio web amigable para SEO
   3. Paso 3: Enlaces internos para mejorar la estructura de un sitio web
6. Anexo: Yo he venido a hablar de mi libro, oiga

 

Tipos de estructura de un sitio web

Antes de ver los pasos para crear una buena estructura de un sitio web, te explico muy brevemente los distintos tipos. No dejes de prestar atención a esto porque es la base de un buen diseño web, además de, obviamente, una buena estructura y por tanto usabilidad.

Estructura de un sitio web EN RED o LIBRE

A partir de la página de inicio (home) se puede navegar a otras sin orden aparente. Es una estructura marcadamente libre pero no es aconsejable porque desorienta al usuario al no saber dónde se encuentra ni dispone de recursos para ir al lugar que desea. Básicamente, un caos sin orden ni concierto. Las webs con esta estructura se impiden a sí mismas su posicionamiento y fulminan las posibilidades de obtener resultados. Desaconsejable.

Estructura de un sitio web LINEAL

Es otra estructura de las más simples. Se asemeja a ir pasando páginas de un libro, pero sin la opción de elegir a qué páginas ir: solamente se puede ir desde una página a la siguiente o a la anterior. Es útil si lo que deseamos es que el usuario siga un recorrido dirigido al lugar que queremos; sin embargo, la sensación de obligación es evidente pues no hay posibilidad de acceder a otras páginas a menos que se siga esta ruta. Desaconsejable en la mayoría de los casos. Falla en la usabilidad y experiencia del usuario.

Estructura de un sitio web JERÁRQUICA o DE ÁRBOL

Estructura en la que hay una página de inicio o principal desde la que se accede a un conjunto de páginas, generalmente a través de un menú de navegación. Desde ese conjunto de páginas se puede acceder a otras y así sucesivamente. Pese a ser la más común, es también poco aconsejable porque no hay total conexión entre páginas y por tanto la experiencia del usuario sigue siendo deficiente desde el punto de vista de la usabilidad y desde el punto de vista del rastreo de páginas que realiza Google.

Estructura de un sitio web LINEAL CON JERARQUÍA o MIXTA

Estructura mixta que saca provecho de las ventajas de las dos estructuras anteriores. Las páginas y subpáginas se organizan de forma jerárquica pero también es posible navegar de forma lineal y transversal. Esta es la estructura de un sitio web bien hecho, la más óptima, para casi todos los casos, puesto que todas las páginas están “conectadas” entre sí y de este modo Google es capaz de rastrearlas antes y la experiencia del usuario mejora notablemente.

Mejora ya la estructura de tu sitio web para lograr un mejor posicionamiento

Descubre los Precios de Diseño Web en WordPress de Coach2Coach o Contacta

Número de páginas en la estructura de un sitio web

No existe un número mínimo ni máximo para un sitio o página web. Puede tener una sola página o cientos. Ahora bien, por lo general, la estructura de un sitio web al uso ni tiene una sola página, ni tiene 100.

Si se trata de un blog, el sitio bien puede tener una sola página, donde se exponen todas las entradas del mismo. También puede ser una sola página cuando se trata de páginas de aterrizaje (páginas únicas diseñadas con el único fin de captura de suscriptores o compras).

También mencionar la proliferación de un nuevo modelo de páginas web basados en una sola página dividida en secciones. Sin entrar en detalles técnicos, una estructura de un sitio web como ésta es desaconsejable si se quiere tratar de posicionar de forma natural ya que no hay páginas adicionales que ayuden a ello.

Ahora bien, en este post hablamos de una web, no de un blog solamente, ni de páginas de aterrizaje, ni de otros tipos.

Para crear una buena estructura de un sitio web enfocado a un negocio online no debemos excedernos en el número de páginas. Cuantas más páginas tengamos, más complicamos la vida al usuario, que llega al sitio con una expectativa: encontrar una solución, un precio, contactar con nosotros, resolver su problema, lo más rápido posible. Recordemos que el típico usuario de internet suele ir con prisa y no se detiene demasiado en ningún sitio, por lo que una estructura clara, intuitiva y fácil de navegar es elemental. Uno de los mejores posts sobre la usabilidad que puedes encontrar es Cómo mejorar la usabilidad web para impulsar tu negocio online.

No es recomendable que la estructura de un sitio web conste de un número mayor de 10 o 12 páginas, incluyendo la página de inicio, la de contacto y el blog, que también debe formar parte de la estructura y de la web.

Niveles de estructura de un sitio web

Además de lo anterior, es aconsejable que, en caso de tener muchas páginas, algunas de las menos importantes vayan en un nivel inferior de la jerarquía. No abusar tampoco de demasiados niveles inferiores. Aconsejo dos o tres niveles de navegación como máximo.

De este modo el menú de navegación no quedará demasiado extenso estéticamente, ni agobiará al usuario visualmente. Es decir, en lugar de algo así:

Mejor algo así:

Cómo definir la estructura de un sitio web casi perfecto (conceptual)

Primero veremos cómo fijar la estructura de un sitio web casi a la perfección desde el punto de vista conceptual y, después, en el bloque de “Pasos…” veremos cómo hacerlo desde el punto de vista técnico.

Quiero primero centrarme en el tema de tener muy clara la idea de negocio y sus partes (representadas en la web) conceptualmente porque sin ello es imposible crear una buena estructura después. Sería como empezar a construir una vivienda sin saber qué tipo será, si un chalet, un castillo o una granja, sin saber qué tipos de materiales queremos usar, sin saber el número de habitaciones, etc. (Aunque, también te lo digo, la mayoría de las webs están hechas así. Y así les va…).

Se trata “simplemente” de hacer un ejercicio de análisis y reflexión.

1º. ¿Cuál es el objetivo que pretendo cumplir con este diseño web?

Identifica esto muy bien y de forma muy clara, porque en ello está basado todo tu negocio. Si vas a montar una tienda de calzado en la calle, seguro que tienes clarísimo que tu objetivo es vender calzado. Sin embargo, cuando se trata de negocios online, no sé por qué, la gente se hace pajas mentales con este tema y piensa que su objetivo es tener miles de visitas, o posicionarse en el número 1 de Google. Sí, eso está muy bien, pero PARA QUÉ. ¡Pues para vender zapatos! Bueno, pues esta cosa que parece tan simple, mucha gente no la pilla.

2º. ¿Quiénes son tus clientes objetivo? Y ¿quién eres tú para merecerlos?

Otro de los graves errores que se cometen al diseñar un sitio web es no tener claro, cristalino, el tipo de cliente que queremos atraer a nuestra web, y qué tipos de problemas tiene que nosotros podamos solucionar. No es lo mismo tener esa tienda de calzado en la Gran Vía de Madrid o en el Pº de Gracia de Barcelona, que tenerla en un lugar por donde no pasa nadie, ¿verdad?

En internet es clave saber quién es tu audiencia para dirigirte a ella. De lo contrario, podrás conseguir miles de visitas de paso, pero muy pocos clientes interesados. Ahí radica la diferencia que supone recibir tráfico cualificado, interesado realmente en lo que ofreces: en definir a tu público o cliente ideal o no. Si escribes un post sobre cómo mejorar tu postura con los zapatos tal, tal vez consigas miles de visitas de curiosos, pero nada más. Pero si te diriges a una audiencia específica, que sabes que sufre de la espalda, que no le gustan los tacones y sí la comodidad, etc., seguramente tendrás alguna venta garantizada.

En el siguiente post te explico más sobre cómo identificar tu nicho de mercado porque no es sencillo, pero sí es posible hacerlo.

Además de identificar tu nicho de mercado, también es importante que hagas un ejercicio de reflexión sobre qué tienes tú o tu producto o tu servicio que te haga diferente del resto: ¿por qué habría yo de elegirte a ti y no al de al lado? Y a continuación, identifica los beneficios que obtendrá la persona que te compre, contrate o lo que sea. Parecen dos cosas iguales, pero no lo son.

3º. ¿Cuáles son, ahora que tienes claro lo anterior, tus palabras clave?

Quizá, antes de hacer esos ejercicios, pensabas que tu palabra clave principal era calzado o tienda de zapatos online por poner unos ejemplos. Pero seguramente cuando hagas el ejercicio pensarás distinto. Habrás añadido algo que haga referencia, bien a tu cliente ideal, bien a tu especialidad o lo que te hace diferente, bien a algún beneficio que acarrea tu producto. Por ejemplo: calzado anatómico (que evita el dolor de espalda en mujeres de mediana edad). Esto último es fruto de identificar beneficios y nicho de mercado (claro, lo he hecho en dos segundos, ¡no me exijas demasiado!)

Hombre, a ver. Ese pedazo de palabra clave no puedes ponerla como título de página. Ya. Pero igual a raíz de ella se te ocurre una más corta que puedas utilizar. Las palabras clave son el alimento del que se nutre tu blog y tu web. Tienes que tenerlas claras.

Esos 3 pasos son muy importantes ANTES de empezar a poner en papel la estructura de un sitio web. Vamos con ello.

Hacer bien lo anterior es imprescindible para que tu web tenga alguna oportunidad de éxito. Si necesitas ayuda para ello, contacta y mejora ya o construye conmigo la estructura óptima para tu web.

Pasos para estructurar el sitio (técnico)

Paso 1: Hacer el árbol de la estructura de un sitio web

Para hacer la estructura de un sitio web, sin entrar todavía en detalles demasiado técnicos respecto al SEO, etc., es relativamente fácil. Se trata de identificar en primer lugar las páginas (lo que mucha gente llama pestañas) que queremos incluir en el menú de navegación. Mejor dicho, no sus páginas, sino los títulos de esas páginas, así como su jerarquía y orden.

Primero lo haremos sobre el papel y utilizando un símil.

1. Coge papel y un boli.
2. Imagina que tienes que escribir un libro sobre el negocio online que quieres, y para el que quieres crear la estructura de un sitio web. ¿Qué pondrás en el índice?
3. Estructura el índice de contenidos de tu negocio. Consigue un libro con índice de contenidos que te sirva de ejemplo si es necesario. Los libros de no-ficción suelen servir. Yo voy a seguir con el tema del calzado. A ver qué tal se me da.
4. Primero escribiría una introducción, donde explicaría de qué va el libro en general. También puede ser tomado como una especie de resumen o como la contraportada, que captura o no la atención del lector. De la introducción (o del resumen de la contraportada) depende que te compren o no. Es lo más importante y lo que decidirá que sigan leyendo o dejen el libro donde estaba. Esta intro será tu página de inicio.
5. Después pensaría en tres o cuatro áreas (o quizá hay más en la temática de mi libro) más importantes sobre las que va a girar la web en general. En el caso de los zapatos, se me ocurre: historia del calzado, tipos de calzado, diferencias de calzado en hombres y mujeres, marcas españolas de calzado y mi tienda de calzado. Por ejemplo.
6. Ahora tengo que pensar si hay a su vez otros temas importantes que quiero mencionar dentro de cada una de esas áreas. Por ej., bajo historia del calzado, no necesito contar demasiado ni ser tan específica, así que lo dejo tal cual. En tipos de calzado, me interesa hablar sobre calzado deportivo, calzado de seguridad y calzado anatómico, que son en los que yo me especializo. En diferencias de calzado en hombres y mujeres, tampoco quiero concretar, así que no hay nada debajo. En marcas españolas de calzado quizá me interese hablar de marcas internacionales o no. Pongamos que quiero hablar de marcas que no son competencia directa como Camper y Panama Jack. Y en mi tienda de calzado tendré que poner las categorías que me interese y que seguramente estarán relacionadas con los tipos que he mencionado bajo el epígrafe de tipos de calzado.
7. Pues ya está. Tenemos el índice de contenidos de nuestro libro sobre el calzado. Ahora tendríamos que “traducir” ese índice a la estructura de un sitio web. Quedaría más o menos así (he abreviado títulos en la imagen, pero en la estructura real deberíamos incluir las palabras clave, en este caso calzado, quedando así, calzado deportivo, etc…):

Ahora se trataría de pasar este dibujo a la plataforma en que estamos gestionando nuestra web. Si trabajas con WordPress, que es la que aconsejo y con la única que trabajo yo, simplemente se trata de crear las páginas y después añadirlas al menú principal de navegación.

De esta forma ya tendríamos hecha la primera tarea de la estructura de un sitio web.

Paso 2: Hacer estructura de un sitio web amigable para SEO

2.1. URLs amigables para la estructura de un sitio web

En realidad, esto en WordPress es muy fácil. Si utilizas otro tipo de CMS (gestor de contenidos) o estás haciendo una web personalizada en HTML, lee esto también, porque te servirá igual.

Al crear las páginas de tu web, lo que estás creando son diferentes URLs o “direcciones” dentro de la misma, partiendo de un dominio común. En el caso del ejemplo, el dominio que he puesto en la imagen es:

especialistas-calzado-anatomico.es (los dominios no llevan tilde).

Cada nueva página creada tendrá su dirección (URL) única e irá detrás del dominio. Ej.

especialistas-calzado-anatomico.es/pag-1;

especialistas-calzado-anatomico.es/pag-2, etc…

(Siempre con el http:// delante, claro).

Detrás de la barra/, sin embargo, necesitamos poner palabras indicativas de lo que estamos hablando. Lo primero que ve Google al rastrear la estructura de un sitio web es la URL. Si pusiésemos cosas como las de esos ejemplos, Google nos tendría menos en cuenta porque cosas como “pag-1” no le revelan nada de información. Es mejor que vea que en la página que versa sobre calzado anatómico, la URL (o dirección única) sea:

especialistas-calzado-anatomico.es/calzado-anatomico.

Parece lógico, ¿verdad? Bueno, pues esto no ocurre así por defecto. Ni siquiera en WordPress. Pero no te preocupes, se soluciona muy fácil. Si tienes una web personalizada tendrás que hacerlo manualmente. Y con referencia a otros gestores de contenido como Joomla, Drupal, Prestashop, etc., tendrás que consultar cómo hacerlo.

En WordPress es muy fácil cambiar esto para que las URLs se conviertan a amigables por defecto y para siempre. Tendrás que entrar en tu escritorio de WordPress, ir a Ajustes>Enlaces Permanentes y seleccionar la opción Nombre de la Entrada (asegúrate también que en el campo rellenable de la opción Estructura Personalizada aparece /%postname%/).

Ya está. A partir de ahora, cada vez que crees una nueva página o entrada (post), WordPress trasladará todas las palabras del título de tu página a su URL directamente. (Aconsejo eliminar palabras que no añaden información como a, de, del, la, las, los, etc.).

2.2. Títulos de la web también amigables

Parece algo obvio, pero para mucha gente no lo es tanto y en lugar de poner títulos como los que hemos dicho en el Paso 1, ponen cosas como:

INICIO – QUIENES SOMOS – SERVICIOS – TIENDA – CONTACTO – BLOG

Un menú de navegación y sus URLs correspondientes como lo de arriba no está orientado al posicionamiento, ni a la usabilidad, ni a una buena estructura.

Sí, hay títulos que normalmente no incluyen las palabras clave, como contacto, blog o quiénes somos. Pero ¿y las otras? Servicios, tienda, y cosas así pueden ser más amigables, como lo hemos hecho arriba.

Yo incluso a veces en las webs de mis clientes pongo, en lugar de quién soy, un título de página que incluye la palabra clave, como: tu coach. O en vez de blog, pongo noticias de coaching; o en lugar de servicios, pongo servicios de coaching. Todo depende de la extensión de la barra del menú y del número de páginas que muestra. (También es posible hacer que en la URL conste algo distinto de lo que figura en el título visible de la “pestaña” del menú de navegación, al menos en WordPress).

Lo mismo ocurre con los títulos de tus entradas del blog (posts). Aunque tengas la tentación de escribir un título genial que se te ha ocurrido, pero no tiene que ver con ninguna de tus palabras clave, intenta darle la vuelta para que así sea.

Por ej., en el tema del calzado. Aunque vayas a escribir un post sobre las marcas más internacionales de calzado y quieras poner como título “Camper lidera la industria”, por ejemplo, ese título no te beneficia en tu posicionamiento. Dale la vuelta para que incluya una de tus palabras clave (Calzados Camper lideran…).

Ten esto en cuenta porque es muy importante para el SEO.

Paso 3: Enlaces internos para mejorar la estructura de un sitio web

Los enlaces internos son el colofón para hacer una estructura casi perfecta. La estructura de un sitio web no lo podría ser sin ellos.

Cuando hablaba de la estructura de jerarquía y lineal (mixta) más arriba, la que recomiendo, es todavía mejorable mediante estos enlaces. Se trata de conectar todas las páginas entre sí de forma que mejore la navegabilidad y la experiencia del usuario, o sea, la usabilidad.

El usuario va con prisa. Quiere una solución ya. Se lo tienes que poner a huevo. Por eso no debemos ampararnos únicamente en el menú superior de navegación, sino añadir enlaces internos entre páginas. Enlaces internos que tienen dos funciones:

1. Lo dicho, ponérselo a huevo al usuario. Orientarle o seducirle, dependiendo del caso, poniéndole algunos enlaces y llamadas a la acción.
2. Que Google sea capaz de rastrear todas y cada una de las páginas de nuestra web de forma más rápida.

De esta forma Google nos calificará mejor porque le facilitamos el trabajo de navegación al usuario y el trabajo de indexación a Google mismo.

La usabilidad y la estructura están íntimamente relacionadas dentro del diseño web. He escrito muchísimo al respecto, así que no me entretengo más aquí. Uno de los posts de más éxito sobre ellos es Cómo mejorar la usabilidad web para impulsar tu negocio online y, por supuesto, el Tutorial de diseño web inteligente.

Yo he venido a hablar de mi libro, oiga

Como añadido en la usabilidad y la estructura de un sitio web, quiero hablar de algunos contenidos inútiles, y de su colocación.

Hay una mala práctica, sobre todo, entre quienes se diseñan si propia web. Se trata de contenidos que no añaden valor para el usuario.

Una de estas páginas suele ser la página de Quiénes Somos. En primer lugar, mucha gente comete el error de colocarla de las primeras en el menú de navegación. Veo a diario sitios web cuya primera página es INICIO, bien. Y la segunda: YO. También he visto YO-YO-YO ¡¡en la página de inicio!! No. La página YO-YO-YO, a menos que se trate de un blog personal que no tengas un interés especial en posicionar, relégala a los últimos puestos. El usuario quiere saber cómo tu producto o servicio va a resolver su problema o necesidad, lo antes posible.

Otro error, generalmente unido al anterior, es poner en esa página un texto interminable que en realidad es una castaña y NADIE SE LEE. Esto es un error.

A tu usuario le importa muy poco, en principio, cuándo estudiaste diseño de calzado, cómo te dio por ahí, ni dónde naciste. Solamente pasará por esa página si ha habido previamente algo que “le ha hecho tilín”. Entonces sí, el tren de pensamiento puede resultar en un “A ver, quién este tipo o esta empresa, si hay opiniones de clientes”, etc. Pero para eso, tienes que haberle interesado por otro lado más enfocado en su problema o consulta.

Estamos de acuerdo en que la web es tuya, y si quieres, desde luego que puedes hablar de tu libro, pero piensa si lo que quiere tu usuario es que le cuentes tu vida en verso o si lo que quiere es comprar tus zapatos especiales. ¿Y tú, qué quieres que haga, que se lea tu biografía y todos tus títulos o que compre los zapatos?

Por mucho que te apetezca serlo, o que pienses que tienes que demostrar todas tus habilidades, lo siento, pero el protagonista, no eres tú. Es tu usuario y cliente potencial. Dale alas para que sea él o ella quien se sienta protagonista (muéstrale los beneficios de tu producto, que te preocupas por él, etc.).

Así pues, encuentra un equilibrio. En primer lugar, colocando esa página hacia el final en la estructura del sitio web. Y, en segundo lugar, siendo breve, directo y claro. Esto no quiere decir seco ni antipático.

Aunque te parezca un post largo, esto es solamente la base para crear una estructura de un sitio web con fundamento. Hay factores que van vinculados a la estructura en referencia a la usabilidad, al propio diseño web, a la funcionalidad, al marketing, etc., pero ya formarían parte de otras patas del diseño web.

Espero que te haya sido útil y espero con ilusión tus comentarios.