Diseño web con sentido. Aspectos básicos a tener en cuenta.

Índice de contenido

Sí, esto que parece algo tan lógico, en muchas ocasiones no es lo que realmente se hace. Pero no quiero utilizar este artículo sobre qué es lo que much@s diseñador@s no hacen. Quiero aportarte valor, así que te voy a explicar lo que yo creo que es diseñar una web con sentido.

Conocer tu negocio, conocerte a ti y entender lo que quieres transmitir

Sí, esto es algo obvio ¿verdad? Para mí sí. Creo que lo primero que un diseñador debe hacer es comprender el negocio de su cliente y sus particularidades. Entender los detalles es lo que hará que sea capaz de crear una web diferente al resto de webs de la competencia que existen en internet.

Una de las cosas más importantes para mí, cuando empiezo un nuevo proyecto es conocer a las personas que están detrás de él.

Pongamos como ejemplo el despacho de una abogada: nuestra abogada, Macarena Lorenzo. No solo se trata de entender el negocio, si esto fuera así, todas las webs de abogados serían iguales. Lo más importante es conocer la idea que esa abogada, Macarena Lorenzo, quiere transmitir, cómo es ella, cómo trabaja y conseguir plasmar esa filosofía y esa visión en cada rincón de la web.

Ejemplo:

Macarena Lorenzo es una abogada que se dedica a derecho de inmigración. Es decir, se dedica a ayudar a inmigrantes a formalizar su situación en España y a resolver los posibles problemas legales que pueden tener. Su filosofía es tratar a sus clientes de una forma cercana y amistosa, intentando hacerles entender cuál es el problema y qué va a hacer para solucionarlo. Además, sus tarifas, aunque varían dependiendo del servicio, son bastante asequibles para gente con pocos recursos.

¿Cómo plasmar la esencia y la filosofía del negocio en la página web?

Me da mucha rabia cuando entro en una web que es un absoluto despropósito pero tienen una sección de filosofía y valores que reza todo lo contrario de lo que respira su web.

Y me da rabia porque es muy probable que realmente esa sea su filosofía real y de verdad trabajen de esa manera, pero esa esencia no está reflejada en su web.

Ejemplo:

Siguiendo con la página web de nuestra abogada. En nuestra primera reunión, ella me comentó que es muy consciente de que las leyes y los procesos legales, pueden ser muy complicados para las personas corrientes, y más si no conocen del todo la cultura española, así que, uno de sus objetivos es que sus clientes entiendan de una forma sencilla, lo que les está pasando y lo que deben hacer. Es una abogada de personas, no de grandes corporaciones.

Estupendo. Entonces, ¿cómo se plasma esto en una web? ¿Creamos una sección en la que cuente todo este rollo? Pues sí, pero también debe estar reflejado en el lenguaje y en la forma en la que los usuarios interactúan con la web.

  • Los textos tienen que ser claros y concisos.
  • Utilizaremos un lenguaje que las personas entiendan
  • Usaremos frases cortas y entendibles, nada de párrafos enormes con jerga legal.
  • Cercanía en el tono
  • Palabras y mensajes clave
  • Secciones claramente diferenciadas

¿Cómo definir las secciones y páginas de tu web?

Una vez que tenemos clara la base del tono y comunicación de la nueva web, pasamos al contenido. ¿Qué vamos a contarles a nuestros usuarios? ¿Qué información vamos a ofrecer en nuestra página web?

Hay que poner especial énfasis en este aspecto porque:

  1. Tendrá que ser una información útil para los usuarios
  2. Tendrá que ser una información con sentido para Google

Sí, lo que los robots de Google opinen sobre tu contenido y sobre cómo está estructurado, también importa.

Ejemplo:

  1. Página principal (con contenido resumido y accesos directos a las principales páginas)
  2. Página sobre Macarena Lorenzo (es importante que los usuarios conozcan a la persona que podría ayudarles a resolver sus problemas legales)
  3. ¿Servicios? ¡SÍ Y NOOOO! Por servicios tendemos a pensar en qué es lo que hacemos, pero lo que realmente le importa al usuario es lo que él quiere conseguir los servicios de Macarena. Puede parecer lo mismo pero es muy diferente:
    No es lo mismo decir «arraigo laboral, familiar y social» que «legalización de nacionalidad española» o «obtención de permiso de nacionalidad española». No es lo mismo. Y Macarena es clara y quiere que sus clientes entiendan lo que está diciendo y no cegarles con tecnicismos. ¡Ojo! Esto no quiere decir, que dentro de esta página, expliquemos que para obtener el permiso de nacionalidad española, tenemos tres métodos: arraigo laboral, familiar o social.
  4. Tarifas (aunque no sea un imperativo hacer públicas las tarifas, deberíamos tener una página en la que se hable sobre nuestros precios o sobre nuestra filosofía de precios)
  5. Contacto

¿Cómo diseñar una navegación clara que muestre de un vistazo el contenido de tu web?

Ya tenemos nuestro contenido, ahora, ¿cómo vamos a ordenarlo para que los usuarios tengan una estructura con sentido y una forma lógica de acceder a cada página?

Muchas veces nos encontramos con webs en las que hemos llegado a un contenido interesante, hemos hecho clic en otro enlace para seguir navegando y ya no sabemos cómo volver a esa página tan interesante. Esto no puede pasar.

El contenido de la web tiene que ser accesible desde cualquier sección y desde cualquier dispositivo de forma rápida y sencilla.

Ejemplo:

Cosas que podemos hacer en la web de la abogada Macarena Lorenzo para que sus clientes entiendan fácilmente todo lo que puede hacer por ellos y, además, acceder a los contenidos y realizar las acciones principales como «llamar» o «hacer una consulta», de forma super sencilla.

  1. Menú de navegación con enlaces claros.
  2. Submenú o megamenú para la sección de «Servicios». Que un usuario pueda acceder con un click al segundo nivel de navegación, es decir, que no tenga que hacer clic en «servicios» y ahí buscar el servicio y volver a hacer clic.
  3. Botones con acceso directos a «contactar», «llamar» o «hacer una consulta» siempre visibles, tanto en versión ordenador como en versión móvil.

¿Cómo hacer un diseño web responsive y optimizado para móvil? Si quieres que hagan clic, ponlo a la vista.

El móvil, ese dispositivo que no para de crecer pero que en el diseño web se tiene un poco olvidado.

Sí, aunque no lo creáis, es verdad, aunque ahora todas las webs (o casi todas) son responsive, la mayoría no tienen su contenido optimizado para móvil, es decir, no está adaptado y mejorado para el momento de uso.

Algo principal para mí en mis diseños es: Si quieres que hagan clic, ponlo a la vista. Facilita ese clic. Por lo tanto

Ejemplo:

En la versión de ordenador de Macarena, el botón de Contacto está integrado en la navegación superior. Al convertir este menú en responsive, el botón de contacto queda dentro del menú y no se ve hasta que no abres el menú.

¿Qué haría yo aquí? Pondría unos botones flotantes fijos (solo visibles en versión móvil), en la parte inferior de la pantalla (cerca del pulgar) con un icono para llamar, para escribir un mensaje e incluso para mandar un Whatsapp.

Si quieres saber más sobre qué es el diseño web responsive y cómo conseguirlo, puedes ver mi artículo en el que explico ejemplos y trucos para adaptar tu contenido a móvil según lo que queramos conseguir.

Conclusión.

Por supuesto hay muchas cosas que influyen en un diseño web con sentido pero para mí, las que cito en este artículo son las que forman una base sólida para un diseño web potente y que cumple con su cometido: transmitir nuestra filosofía, que nuestros usuarios vean y entiendan lo que tenemos que ofrecerles de un solo vistazo sin tener que investigar mucho y, por supuesto, que terminen realizando una acción: llamando, mandando un formulario, contactando por whatsapp, suscribiéndose a la newsletter, comprando, etc…

Si tú lo tienes claro y quieres una página web con sentido para que tus usuarios y clientes tengan claro cómo puedes ayudarles y puedan contactar contigo fácilmente, escríbeme y nos pondremos manos a la obra. PD: Si estás viendo este artículo desde tu móvil, puedes mandarme un Whatsapp directamente 😉

Otros enlaces interesantes…

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *