paginas webHace un par de días estaba cenando con unos amigos cuando llegó a mis manos el libro Don't make me think, de Steve Krug. El libro está enfocado a la usabilidad de los sitios web: cómo hacer que una página sea facil de navegar, agradable y útil para los visitantes.

Mientras esperábamos que llegara la pizza, me tiré en el sillón a leer algunos capítulos. Me llamó particularmente la atención la sección dedicada a la página de inicio de los sitios web ("home page" que le dicen en inglés).

Y es que, justamente, la portada es la página más importante de cualquier sitio, el primer punto de encuentro visible para los visitantes. ¿Cómo hacer entonces una buena página de inicio? ¿Qué información debe contener? Mientras leía al Sr. Krug, iba aplicando mentalmente sus consejos al diseño actual de Dos Ideas... veamos qué pasó.

Me pregunto, ¿cómo hacer una buena página de inicio?

Tenemos entonces en claro que la portada es, por lejos, la página más importante de nuestro sitio web. Es la primer página que ven nuestros visitantes... y en muchos casos, la única y última para irse a navegar a otros sitios.

Por otro lado, la portada es donde todos quieren poner contenido, ya que será inmediatamente visible y su publicación en la página principal asegura un mayor flujo de tránsito al link en cuestión. Asi, toda el área de la página de inicio se transforma en zonas muy "cotizadas", que son más valiosas mientras más arriba se encuentren.

Está claro entonces que debemos entonces prestar mucha atención a nuestra portada. Pero, ¿qué tener en cuenta al momento de prepara la página de inicio? ¿cómo saber si es adecuada?

diseño webUna buena página de inicio debe permitirle al navegante responder estas preguntas:

  1. ¿de qué es el sitio?
  2. ¿cómo puedo buscar contenido?
  3. ¿cómo puedo navegar por el contenido?
  4. ¿dónde está el contenido más importante?
  5. ¿por qué debo quedarme aquí?

1. ¿de qué es el sitio?

Esta es la pregunta más importante que debe responder una página principal. ¿De qué es nuestro sitio? ¿Qué se puede encontrar aquí?

El logo del sitio y su nombre es una parte esencial del diseño, y debe estar presente siempre. En general, el nombre del sitio se ubica en la parte superior de la página, por la izquierda. Es, de hecho, una de las primeras cosas que ve un navegante, y se traduce en la identidad que tendrá nuestro sitio para le usuario.

Acompañando al nombre suele ir una pequeña frase descriptiva, conocida como tagline. Un buen tagline es tan importante como un buen nombre. El tagline es la frase que responde a la pregunta "¿de qué es el sitio?", y suele ubicarse debajo del logo principal.

La mayoría de los sitios tienen un tagline, aunque no siempre sea bueno. Un buen tagline debe:

  • ser consiso: debe tener pocas palabras para describir la idea, no tiene que ser un párrafo completo.
  • ser claro: debe expresar claramente el contenido del sitio y su objetivo.
  • diferenciar: debe diferenciar al sitio de otros similares. ¿qué es único en este lugar?

Algunos sitios muy conocidos no tiene un tagline, ya que su marca es automáticamente reconocida y asociada por los visitantes. Este es el caso de Amazon, Google, CNN y otros tantos. Sin embargo, para llegar a este nivel de reconocimiento, muchos de estos sitios usaron un tagline en sus orígenes (como ser el caso de Amazon, que en el mismo logo usaba el tagline "Earth's Biggest Bookstore", o "La librería más grande del mundo").

Y en Dos Ideas...

Al leer esa sección del libro me golpié la cabeza contra la pared (mentalmente al menos). Y es que justo estamos en búsqueda de un nuevo tagline.

Al día de hoy el tagline de Dos Ideas es "Ideas para el mundo real". Y si bien suena bonito, realmente no responde a la pregunta "¿de qué es el sitio?". De hecho, nada en la página principal responde a esta pregunta.

Así que estamos pensando un nuevo tagline, que pronto compartiremos con todos.

2. ¿cómo puedo buscar contenido?

Nuestros visitantes entran al sitio a buscar algo, ya sea sabiendo lo que quieren o no. Así, un usuario puede saber exactamente lo que necesita, o puede querer simplemente navegar por el contenido hasta encontrar aquello que le llame la atención.

Para el caso de los usuarios que buscan contenido en particular, que son además los más apurados, es necesario un buscador. La página principal tiene que dejar en claro cómo buscar contenido en el sitio. Idealmente, este mismo mecanismo debería estar compartido para el resto de las páginas.

Y en Dos Ideas...

Todas las páginas en Dos Ideas, incluso la portada, tienen un buscador arriba a la derecha. Es facil de usar, está siempre visible y no se entromete en el diseño general del sitio. Mejor todavía, aparece en la primer "pantalla" de cualquier página, sin ser necesario tener que usar la barra de desplazamiento vertical para ubicarlo.

3. ¿cómo puedo navegar por el contenido?

Los usuarios que no saben exactamente lo que buscan suelen querer navegar por el contenido. Es decir, alguna forma de poder ir pasando por las diferentes secciones que tiene nuestro sitio.

Para esto se suele utilizar una barra de navegación. Las barras de navegación suelen contener las secciones del sitio, y posiblemente sub-secciones dentro de cada área. Además, tiene que ser posible para el usuario volver rápidamente a la portada.

Es conveniente que las barras de navegación estén siempre disponibles a través de todo el sitio, idealmente en el mismo lugar.

Y en Dos Ideas...

Tenemos una barra de navegación junto al logo, con las secciones principales del sitio. Además, dentro de la sección noticias aparece una segunda barra de navegación sobre el lateral derecho, permitiendo al visitante navegar por distintos tipos de noticias.

Sin embargo, esta barra de navegación no se mantiene en la sección Wiki y Cursos. Estamos viendo cómo remediar esta situación.

4. ¿dónde está el contenido importante?

Cuando un visitante entra a nuestro sitio generalmente quiere ver el contenido más importante. De hecho, esto es lo que busca un visitante que regresa a nuestro sitio. ¿Qué hay de nuevo hoy?

Las portadas suelen así ser refrescadas habitualmente, ubicando allí el contenido más relevante y novedoso.

Otra opción muy usada son las áreas de contenido destacado. Estas áreas contienen información sobre eventos o contenido que queremos destacar por sobre el resto, incluso dentro de la misma página principal. Muchas veces se ubica arriba de todo, inmediatamente debajo del logo o barra de navegación.

Las áreas de contenido destacado suelen estar visibles al acceder al sitio por primera vez, ofreciéndole al visitante promociones o contenido de interés destacado.

Y en Dos Ideas...

La pizza no llegaba, y mientras Gianu jugaba con la PlayStation le comenté orgulloso: "Viste, en Dos Ideas también tenemos una sección de destacados". A lo que me contestó: "¿dónde está ahora? ¿es el área que antes tenía el link a la wiki y ahora no está más?".

Ups, error nuestro. De hecho, tenemos un área de contenido destacado donde, por ejemplo ahora, promociona una nota sobre Planificación de Poker. Pero esta sección la vamos alternando: a veces aparece arriba, a veces abajo, a veces no aparece.

Definitivamente es confuso. En los próximos días vamos a decidirle un lugar más "definitivo" (seguramente arriba), sin tanto paseo por la página principal.

5. ¿por qué debo quedarme aquí?

Y esta es una pregunta dificil de responder. ¿Qué hace de nuestro sitio algo único? ¿Qué nos diferencia de los demás?

Ante todo, tenemos que hacer del sitio algo útil para el visitante. El usuario tiene que sentirse a gusto, con contenido que le sirva de manera simple. Debe poder sentir que el sitio evoluciona, que siempre podrá encontrar algo novedoso y de utilidad.

Tenemos que invitar a nuestro visitante no sólo a quedarse, sino también a regresar y recomendar el sitio a más personas. Y eso se logra, en gran parte, con el contenido que ofrecemos.

Y en Dos Ideas...

¡Dificil de decir! Somos un sitio muy joven todavía; por nuestro lado, estamos avanzando y mejorando constantemente. Tratamos de compartir noticias y experiencias que vivimos todos los días en nuestro trabajo; no sólo noticias general (que las tenemos), sino también aplicaciones prácticas y concretas.

Ding-Dong. Ding-Dong. Justo entonces llegó la pizza (una de provolone, una de jamón y morrones). Cerré el libro, lo dejé de lado y me puse a pensar en comparitr esta nota.

Inspiración.

"Si tú tienes una manzana y yo tengo una manzana e intercambiamos las manzanas, entonces tanto tú como yo seguiremos teniendo una manzana cada uno. Pero si tú tienes una idea y yo tengo una idea, e intercambiamos las ideas, entonces ambos tendremos dos ideas"

Bernard Shaw