Estructura de un sitio web

Back to top

1) Estructura de un lugar 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.

La estructura de un sitio web no tiene nada que vercon 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 perceptible a simple vista. La estructura de un sitio web tampoco se refiere únicamente al menú de navegación, también perceptible. Hace referencia a algo más interno y también invisible para el usuario, mas fácil de realizar por el diseñador web o quien gestiona la página.

Como siempre y en todo momento, hablaré del diseño web en Wordpress, si bien esta estructura de un sitio web es aplicable a todos y cada uno de los diseños, desde adaptados a otros gestores de contenido.

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

Back to top

2)  

Back to top

3) 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, evidentemente, una buena estructura y en consecuencia usabilidad.

3.0.1) Estructura de un sitio web EN RED o LIBRE

A partir de la página de comienzo (home) se puede navegar a otras sin orden aparente. Es una estructura marcadamente libre mas no es recomendable pues 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 conseguir resultados. Desaconsejable.

3.0.2) Estructura de un sitio web LINEAL

Es otra estructura de las más simples. Se asemeja a ir pasando páginas de un libro, mas sin la opción de elegir a qué páginas ir: solamente se puede ir desde una página a la siguiente o bien a la precedente. 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 salvo que se siga esta ruta. Desaconsejableen la mayoría de los casos. Falla en la usabilidad y experiencia del usuario.

3.0.3) Estructura de un sitio web JERÁRQUICA o bien DE ÁRBOL

Estructura en la que hay una página de comienzo o principal desde la que se accede a un conjunto de páginas, en general 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 aconsejableporque no hay total conexión entre páginas y por tanto la experiencia del usuariosigue siendo deficientedesde el punto de vista de la usabilidad y desde el punto de vista del rastreo de páginas que efectúa Google.

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

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

3.1) Mejora ya la estructura de tu sitio.

Descubre losde CITIFACE o

Back to top

4) Número de páginas en la estructura de un lugar web

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

Si se trata de un weblog, el sitio bien puede tener una sola página, donde se exponen todas y cada una de las entradas del mismo. También puede ser una sola página tratándose de páginas de aterrizaje (páginas únicas diseñadas con el único fin de atrapa de subscritores o bien compras).

También mentar la proliferación de un nuevo modelo de páginas web basados en una página dividida en secciones. Sin entrar en detalles técnicos, una estructura de un sitio web como ésta es desaconsejablesi se quiere tratar de posicionar de forma natural puesto que no hay páginas auxiliares que asistan a ello.

Ahora bien, en este artículo hablamos de una web, no de un weblog solamente, ni de páginas de aterrizaje, ni de otros tipos.

Para crear una buena estructura de un sitio enfocado a un negocio onlineno 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 lugar con una expectativa: encontrar una solución, un precio, contactar con nosotros, solucionar 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 lugar, por lo que una estructura clara, intuitiva y fácil de navegar es elemental. De los mejores posts sobre la usabilidad que puedes localizar es.

No es conveniente que la estructura de un sitio web conste de un número mayor de 10 o bien 12 páginas, incluyendo la página de comienzo, la de contacto y el weblog, que también debe ser parte de la estructura y de la web.

Back to top

5) Niveles de estructura de un lugar web

Además de lo anterior, es recomendable que, en el caso de tener muchas páginas, algunas de las menos esenciales vayan en un nivel inferior de la jerarquía. No abusar tampoco de demasiados niveles inferiores. Aconsejo dos o 3 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. Esto es, en lugar de algo así:

Mejor algo así:

Back to top

6) Cómo acotar la estructura de un sitio web casi perfecto (ideal)

Primero veremos cómo fijar la estructurade un sitio web prácticamente a la perfección desde el punto de vista conceptualy, después, en el bloque de “Pasos…” vamos a ver cómo hacerlodesde 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 página web) conceptualmente pues sin ello es imposible crear una buena estructura después. Sería como comenzar a edificar una residencia sin saber qué tipo será, si un chalet, un castillo o una granja, sin saber qué géneros de materiales queremos emplear, 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.

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

Identifica esto realmente bien y de forma muy clara, porque en ello está basado todo tu negocio. Si montarás 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 on-line, no sé por qué, la gente se hace pajas mentales con este tema y piensa que su objetivo es tener miles de visitas, o bien posicionarse en el número 1 de Google. Sí, eso está realmente bien, mas PARA QUÉ. ¡Pues para vender zapatos! Bueno, puesto que esta cosa que parece tan simple, mucha gente no la pilla.

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

Otro de los graves erroresque se cometen al diseñar un sitio es no tener claro, cristalino, el tipo de clienteque deseamos atraer a nuestra página 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 sitio por donde no pasa nadie, ¿verdad?

En internet es clave saber quién es tu audienciapara dirigirte a ella. En caso contrario, podrás lograr miles y miles de visitas de paso, mas poquísimos clientes interesados. Ahí reside la diferencia que supone recibir tráfico cualificado, interesado verdaderamente en lo que ofreces:en delimitar a tu público o bien cliente del servicio ideal o bien no. Si escribes un artículo sobre cómo mejorar tu postura con los zapatos tal, tal vez consigas miles de visitas de curiosos, mas nada más. Pero si te diriges a una audiencia específica, que sabes que sufre de la espalda, que no le agradan los tacones y sí la comodidad, etc., seguramente tendrás alguna venta garantizada.

En el próximo blog post te explico más sobreporque no es sencillo, mas sí es posible hacerlo.

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

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

Quizá, ya antes de hacer esos ejercicios, creías que tu palabra clave primordial era calzadoo tienda de zapatos onlinepor poner unos ejemplos. Pero probablemente cuando hagas el ejercicio pensarás diferente. Habrás añadido algo que haga referencia, bien a tu cliente del servicio ideal, bien a tu especialidad o bien 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 usar. Las palabras clave son el alimento del que se nutretu weblog y tu página web. Tienes que tenerlas claras.

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

¿Necesitas ayuda para hacer lo anterior?y mejora ya la estructura de tu sitio.

Back to top

7) Pasos para estructurar el sitio (técnico)

7.1) Paso 1: Hacer el árbol de la estructura de un lugar web

Para hacer la estructura de un sitio web, sin entrar todavía en detalles demasiado técnicos en comparación con posicionamiento web en buscadores, etc., es parcialmente fácil. Se trata de identificar en primer lugar las páginas (lo que bastante 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 debes escribir un libro sobre el negocio online que deseas, y para el que quieres crear la estructura de un sitio web. ¿Qué pondrás en el índice?
3. Estructura el índice de contenidosde tu negocio. Consigue un libro con índice de contenidos que te sirva de ejemplo si es preciso. Los libros de no-ficción suelen servir. Yo voy a proseguir 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 bien no la atención del lector. De la introducción (o bien del resumen de la contraportada) depende que te compren o bien no. Es lo más importantey lo que decidirá que sigan leyendo o dejen el libro donde estaba. Esta intro será tu página de comienzo.
5. Después pensaría en tres o cuatro áreas(o bien quizá hay más en la temática de mi libro) más importantes sobre las que va a girar la página web por lo general. En el caso de los zapatos, se me ocurre: historia del calzado, géneros de calzado, diferencias de calzado en hombres y mujeres, marcas españolas de calzado y mi tienda de calzado.Por ejemplo.
6. Ahora debo meditar si hay a su vez otros temas importantesque deseo mentar en 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 charlar sobre calzado deportivo, calzado de seguridad y calzado anatómico, que son en los que me especializo. En diferencias de calzado en hombres y mujeres,tampoco quiero detallar, así que no hay nada debajo. En marcas españolas de calzadoquizá me interese hablar de marcas internacionales o bien no. Pongamos que deseo hablar de marcas que no son competencia directa como Campery Panama Jack. Y en mi tienda de calzadotendré que poner las categorías que me interese y que probablemente estarán relacionadas con las clases que he citado 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 lugar 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 un caso así calzado, quedando así, calzado deportivo, etc…):

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

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

7.2) Paso 2: Hacer estructura de un sitio afable para SEO

7.2.1) 2.1. URLs amigables para la estructura de un lugar web

En realidad, esto en Wordpress es muy fácil. Si utilizas otro género de Content Management System (gestor de contenidos) o estás haciendo una web personalizada en HTML, lee esto también, por el hecho de que 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) únicae irá detrás del dominio. Ej.

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

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

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

Detrás de la barra/, no obstante, precisamos poner palabras indicativasde lo que hablamos. La primera cosa 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 pues 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 tan siquiera en WordPress. Pero deja de preocuparte, 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 Trademark, Prestashop, etc., tendrás que consultar cómo hacerlo.

En Wordpress es muy fácil mudar estopara que las URLs se conviertan a amigables por defecto y para siempre. Tendrás que entrar en tu escritorio de WP, ir a Ajustes>Enlaces Permanentesy elegir la opción Nombre de la Entrada(asegúrate también que en el campo rellenable de la opción Estructura Personalizadaaparece / por cien postname por ciento /).

Ya está. De ahora en adelante, cada vez que crees una nueva página o bien entrada (blog post), WP trasladará todas y cada una de las palabras del título de tu página a su URL de forma directa. (Recomiendo quitar palabras que no añaden información como a, de, del, la, las, los, etc.).

7.2.2) 2.2. Títulos de la página web también amigables

Parece algo obvio, pero para bastante gente no lo es tanto y en vez 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 pertinentes como lo de arriba no está orientado al posicionamiento, ni a la usabilidad, ni a una buena estructura.

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

Yo incluso a vecesen las webs de mis clientes pongo, en vez de quién soy, un título de página que incluye la palabra clave, como: tu coach. O bien en lugar 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áginasque muestra. (También es posible hacer que en la URL conste algo diferente de lo que figura en el título perceptible de la “pestaña” del menú de navegación, cuando menos en WordPress).

Lo mismo ocurre con los títulos de tus entradas del weblog (posts). Si bien tengas la tentaciónde escribir un título genial que se te ha ocurrido, mas 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. Si bien vayas a redactar un post sobre las marcas más internacionales de calzado y desees poner como título “ Camper lidera la industria”, por poner un ejemplo, ese título no te beneficia en tu posicionamiento. Dale la vuelta a fin de que incluya una de tus palabras clave ( Calzados Camper lideran…).

Ten esto en cuenta pues es muy importante para el posicionamiento web en buscadores.

7.3) Paso 3: Links internos para progresar la estructura de un sitio web

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

Cuando charlaba de la estructura de jerarquía y lineal (mixta) más arriba, la que aconsejo, es todavía mejorable mediante estos links. Se trata de conectar todas las páginas entre sí de manera que mejore la navegabilidad y la experiencia del usuario, es decir, la usabilidad.

El usuario va con prisa. Desea una solución ya. Se lo debes poner a huevo. De ahí que no debemos protegernos únicamente en el menú superior de navegación, sino más bien añadir links internos entre páginas. Links internos que tienen dos funciones:

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

De esta forma Google nos calificará mejorporque 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 a este respecto, así que no me entretengo más aquí. Uno de los posts de más éxito sobre ellos esy, como es natural, elinteligente.

Back to top

8) Yo he venido a charlar de mi libro, oiga

Como añadido en la usabilidad y la estructura de un sitio web, quiero hablar de ciertos 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 acostumbra a ser la página de Quiénes Somos . En primer lugar, mucha gente comete el error de ponerla 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 comienzo!! No. La página YO-YO-YO, salvo 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 solucionar su problema o necesidad, lo antes posible.

Otro error, en general unido al precedente, es poner en esa página un texto interminableque realmente es una castaña y NADIE SE LEE. Esto es un fallo.

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 anteriormente algo que “le ha hecho tilín”. Entonces sí, el tren de pensamiento puede resultar en un “ A ver, quién este género o bien esta empresa, si hay opiniones de clientes”, etcétera Mas para eso, tienes que haberle interesado por otro lado más enfocado en su inconveniente o bien consulta.

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

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

Así puesto que, encuentra un equilibrio. En primer lugar, poniendo esa página cara el final en la estructura del sitio web. Y, seguidamente, siendo breve, directo y claro. Esto no desea decir seco ni antipático.

Aunque te parezca un artículo 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étera, pero ya formarían una parte de otras patas del diseño web.

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

Back to top