Recomendaciones para un diseño web efectivo

El diseño web es un proceso más complejo de lo que solemos imaginar. Esto no es solo por el aspecto técnico que implica el desarrollo de un sitio web, sino por la necesidad de acertar en los siguientes tres puntos esenciales.

Dardo en el centro de la diana

Objetivos

Una web debe crearse en función de un objetivo principal y uno o varios secundarios. Esto implica un estudio previo de las necesidades del cliente, de su plan de negocio y de lo que desea y le conviene conseguir a través de su sitio web: ventas, visitas al local, consultas, imagen de marca, etc.

Bombilla

Usabilidad

Una página web debe ser fácil de usar. De nada sirve un diseño espectacular si quien visita nuestro sitio no es capaz de identificar la forma de realizar las acciones que desea o tiene problemas para visualizar la información. Debemos asegurarnos de que el diseño cumple con todos los criterios de usabilidad y accesibilidad.

Gráfico de SEO

SEO

Un sitio web que no recibe visitas carece de utilidad, y la principal forma de conseguir tráfico es estar bien posicionado en los buscadores cuando un usuario realiza una consulta relacionada con los productos o servicios que ofrecemos. Tenemos que identificar las palabras clave por las que queremos competir y aplicar acciones SEO.

Fases del diseño web

Todo proceso de diseño y desarrollo de un sitio web implica una serie de pasos bien definidos.

1.- ANÁLISIS

El primer paso es definir el propósito del sitio y los objetivos o acciones que queremos que desarrollen los usuarios en nuestra web. Para ello, estudiaremos las características y necesidades del negocio, su situación actual y la de su competencia, el público objetivo o target al que nos dirigimos y las palabras clave que queremos posicionar en los buscadores. Además, en caso de contar ya con un sitio web, realizaremos una auditoría SEO.

Gráfico de público objetivo

Target

Informe de situación de la página web

Situación actual

Nube de acciones e ideas para SEO

Análisis SEO

2.- PLANIFICACIÓN DE LA WEB Y ARQUITECTURA DE LA INFORMACIÓN

En función de la información recopilada en la fase anterior, decidiremos la información a incluir en el sitio web y su jerarquía, planificaremos la estructura de la web y la navegación a través de la misma, elegiremos la tecnología apropiada para el desarrollo del sitio y presentaremos el árbol de contenidos en un wireframe.

Además, tendremos en cuenta los requisitos legales, como la Ley de Cookies o la Protección de Datos, para incluir las funcionalidades y los contenidos necesarios.

Documentos apilados

Información a incluir

Fases de un modelo

Modelos de casos de uso

Varias páginas de un sitio web

Páginas del sitio

Engranaje

Decisión sobre la tecnología

Jerarquización de páginas

Jerarquía

Árbol de contenidos web sencillo

Árbol de contenidos

Imagen de un GPS

Navegación

Representación de un esquema o wireframe

Wireframe o boceto inicial

3.- USABILIDAD Y ACCESIBILIDAD

Para que una web pueda transmitir su mensaje y cumplir sus objetivos, debe ser intuitiva, sencilla de manejar, con elementos claramente diferenciados, reconocible, visible en cualquier tipo de dispositivo y accesible para cualquier tipo de usuario con independencia de sus capacidades físicas (por ejemplo, una página web con letra muy pequeña puede suponer un problema para personas con algún problema de visión e incómoda para todos en general).

La forma de conseguir esto es seguir criterios de usabilidad y accesibilidad en el proceso de diseño web.

Lupa

Usabilidad

Escaleras

Accesibilidad

No debe perderse…

La importancia de la experiencia del usuario

 

4.- PROTOTIPADO

Comienza aquí la fase de diseño gráfico, en la que se creará un prototipo sencillo pero que permita ver la disposición de los diferentes elementos en cada página, la propuesta de paleta de colores, la tipografía, la presencia de elementos gráficos y las llamadas a la acción, tan importantes para conseguir que el usuario realice las acciones que deseamos.

Esta fase del diseño web deberá tener en cuenta los criterios de usabilidad y accesibilidad adoptados en el punto anterior y transmitir sensaciones positivas relacionadas con el tipo de negocio y los objetivos del sitio (por ejemplo, una web de una asesoría financiera debe transmitir confianza y credibilidad). Aquí entra en juego, entre otros elementos, la teoría de los colores.

Selección de colores

Colores

Ejemplo de tipografía

Tipografía

Imágenes y videos

Elementos gráficos

Megáfono

Llamadas a la acción

5.- VOLCADO DE CONTENIDOS

Aprobado el diseño gráfico, es el momento de introducir los contenidos en la web. No obstante, todavía no se completará la aplicación del diseño, pues antes es necesario comprobar que el sitio web está operativo y que no existen errores. Ocuparse en este momento de los elementos gráficos podría suponer una pérdida de tiempo y recursos si se comprobase a posteriori la existencia de fallos en la estructura y navegabilidad de la web.

6.- TESTEO DEL FUNCIONAMIENTO DEL SITIO WEB

Este punto es vital. Durante un breve periodo de tiempo se procederá a comprobar, una por una, todas las funcionalidades de la página web y sus rutas de navegación.

Entre otros aspectos, nos aseguraremos de que:

  • No existen enlaces que lleven a páginas equivocadas o que no tengan página de destino.
  • No se puede acceder a cada página por más de una URL.
  • La web se muestra correctamente en todos los dispositivos.
  • Los formularios funcionan correctamente y procesan la información de forma eficaz y segura.

7.- APLICACIÓN DEL DISEÑO

Una vez testeada la web y comprobado su correcto funcionamiento, procederemos a aplicar los estilos que den la forma definitiva a nuestro sitio web.

Comprobaremos que todos los elementos gráficos y tipográficos se visualizan correctamente y que no provocan descuadres en los diferentes dispositivos y daremos por concluida la tarea de desarrollo y diseño web.

8.- SEGURIDAD Y MANTENIMIENTO

Aunque las medidas de seguridad necesarias se habrán estudiado desde el primer momento y ya se habrán adoptado, corresponderá a partir de ahora hacer un seguimiento de su efectividad y, en caso de detectar algún problema, corregirlo inmediatamente y aplicar nuevas medidas si se estima adecuado.

Asimismo, se llevarán a cabo periódicamente tareas de mantenimiento del sitio web y de actualización de contenidos.

No debe perderse…

Qué hosting elegir
Certificados SSL
Copias de seguridad
Medidas antispam
Seguridad en WordPress

9.- ANALÍTICA

Como se ha apuntado a lo largo de este artículo, una página web solo tiene sentido si hay unos objetivos detrás.

Por tanto, una vez finalizado el trabajo y el estando el sitio web completamente operativo, es necesario hacer un seguimiento periódico de los resultados.

Para ello utilizaremos sistemas de seguimiento de las visitas. En particular, Google Analytics debe ser nuestro marco de referencia, tanto por su carácter gratuito como por la cantidad de información relevante que proporciona.

Métricas como la tasa de rebote, el número de usuarios únicos que nos visitan y el tiempo medio que pasan en nuestra web se complementarán con tests A/B para testar diferentes versiones de una página (una página de ventas, por ejemplo), mapas de calor que nos muestren dónde fijan su atención los usuarios e informes sobre las palabras clave que utilizan para encontrarnos, las fuentes de referencia, el CTR, las páginas por las que entran a nuestra web y el camino que siguen en ella.

Todo esto, por supuesto, para aplicar mejoras que nos ayuden a optimizar el rendimiento y maximizar los beneficios.

Test de prueba de dos versiones

Tests A/B

Manchas marcando los puntos de calor

Mapas de calor

Punto de entrada a la web

Puntos de entrada y salida

Claves de éxito de un proceso de diseño web

1.- COMUNICACIÓN

La comunicación entre el propietario del negocio y el responsable del diseño web es fundamental y debe mantenerse fluida durante todo el proceso de desarrollo de la web.

Solo él conoce bien sus necesidades y las características de su negocio y de sus clientes. Ese conocimiento y la experiencia del diseñador en su trabajo serán un pilar fundamental en el éxito final del proyecto.

Es vital que se establezca una relación de confianza y que ambas partes colaboren en la consecución del objetivo común, con la mente abierta y con la naturalidad suficiente para transmitir sus consejos e inquietudes.

2.- INVESTIGACIÓN

Si conocemos bien el negocio, las características de sus clientes actuales y potenciales, las acciones de la competencia y el mercado en el que se desenvuelve, tendremos gran parte del camino hacia el triunfo recorrido, porque sabremos responder a las necesidades de los usuarios.

3.- FOCALIZACIÓN EN LOS OBJETIVOS DEL SITIO

Pensar en el usuario de la web y en lo que queremos que haga en ella: esa es la base del éxito de cualquier proyecto de desarrollo web.

Hemos de conseguir, con el diseño de la navegación del sitio y los elementos gráficos, GUIAR AL USUARIO hasta la acción que queremos que complete (rellenar un formulario, realizar una compra o una reserva, llamar a nuestro local…).

Todo esto sin incomodarlo, facilitándole el trabajo y proporcionándole toda la información que necesite, sin engaños.

No debe perderse…

Landing pages: ¿qué son y por qué las necesita?

 

4.- MEDICIÓN Y MEJORA

Una vez nuestro sitio web está en funcionamiento, comienza una nueva etapa en la que debemos centrarnos en la recolección de datos y su interpretación.

Una monitorización continua que nos permitirá detectar posibles errores o carencias y optimizar nuestros puntos fuertes.

Crear una web y olvidarse de ella es el pecado mortal que muchos cometen pero que nosotros no podemos permitirnos.

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies