A diferencia de hace muchos años, cuando con que nuestros usuarios estuvieran satisfechos bastaba en el diseño web, las cosas han cambiado. Ahora, necesitas complacer a dos factores por igual: el usuario y los robots de Google.
La pregunta, sin embargo, es a cuál debo complacer primero?
Experiencia de usuario vs optimización de búsqueda en Google
No hay necesidad de dar prioridad, porque tienes que complacer tanto a Google como a tus usuarios.
Con la adopción de estos dos requisitos, serás capaz de ocupar el rango más alto en Google y la gente será capaz de encontrar tus contenidos mucho más fácil que antes. Con una correcta experiencia de usuario en tu web, ellos van a querer que recomendaría a otros.
Parte 1. Inicia con el usuario
No hay necesidad de dar prioridad, como mencioné anteriormente, pero hay que empezar por algún sitio. Centrarse en la experiencia que das a tus usuarios es un buen punto de partida para tu solución web tanto si se trata de una simple página web, una aplicación web, o un complejo software de back-end.
En la base de cada uno de tus proyectos, tienes que considerar al usuario. Sin el usuario, no te moverás hacia adelante sin importar lo mucho que intentes. Has oído hablar de la Experiencia de usuario (o UX) antes, pero ¿qué significa para tu producto? Por mucho que me guste tener que decirte esto, depende. Los usuarios pueden valorar de manera diferente su experiencia en dos soluciones web diferentes. Además de esto, tu público también reacciona de manera diferente a lo que tu competidor tiene aunque su producto haga básicamente lo mismo.
Averiguar porqué tu público reacciona positivamente o no a es un asunto tan complejo como para discutirlo en un artículo; por lo tanto, no vamos a bucear demasiado en lo que está en la mente de tus usuarios. Sin embargo, sea cual sea tu negocio, la falta de inversión en la experiencia del usuario será siempre contraproducente. ¡Siempre!
!Ser adaptable ya! – !Debes tener un sitio web Responsive!
Probablemente has escuchado esto miles de veces. Por desgracia, todavía veo muchos ejemplos de sitios web que aún no son adaptables. Han pasado más de tres años desde que las consultas de los medios de comunicación se han convertido en estándares de la W3C, pero ¿por qué no todas las personas los han adoptado todavía?
Diseño de la tipografía
La tipografía es una parte tan importante de un sitio web que ignorarlo marcará algunos puntos negativos con sus lectores. A menudo es fácil leer texto en el escritorio del ordenador pero he entrecerrado los ojos mucho en los últimos años tratando de decodificar texto simple en el móvil. No me gusta eso, no me hagas hacerlo ! Voy a salir de tu sitio más rápido que un Ferrari en la pole-posición sin ninguna posibilidad de volver nunca más.
La mejora de la tipografía para los dispositivos móviles no es tan grande de un acuerdo. Si no tienes una formación básica en tipografía, es siempre una apuesta segura aumentar el tamaño de la fuente y la altura de la línea. Nunca utilices una fuente más pequeña de 14px en el móvil (acostumbrarse a la idea de tener al menos 16px y no más de 8-9 palabras por línea) y altura de la línea que es al menos 18px. Esto hará que el texto sea más fácil de leer. Haz titulares cortos y claros. los titulares necesitan el tamaño de letra grande y en negrita, con un máximo de cuatro palabras por línea.
Al escribir tu texto, asegúrate de romper en pedazos más pequeños los párrafos de texto. Echa un vistazo a la imagen de abajo y piensa en lo que prefieres leer.
El arte del espacio negativo
Este artículo no es un curso intensivo de diseño gráfico, pero hay tantas cosas que un buen diseñador gráfico puede hacer para mejorar la experiencia del usuario de un sitio web… Uno de ellos es el uso de espacio negativo, ya que esto permite al ojo humano descansar. Tu página web no será tan pesada si manejas esto bien y yo te aconsejo que un buen diseñador gráfico para le eche un vistazo a tu página web, si piensas que en la actualidad tu web es «demasiado pesada» en un análisis rápido.
Tener contacto y formularios que funcionen.
Los formularios web pueden variar de formularios de registro a formularios de contacto o incluso un cuadro de búsqueda. Asegúrate de que funcionan. Es probable que ya lo hayas probado más de diez veces y lo funciona. Pero, ¿realmente funcionan?
No tengo dudas de que tu código no sólo hace lo se supone que debe hacer, pero esto no es sólo back-end. El usuario no se preocupa por tu código. El usuario quiere que los formularios den información cuando se necesita retroalimentación y se puedan rellenar lo más rápidamente posible.
Por el número de sitios web que hacen que mal, la manipulación de formularios de usuario con error debe ser uno de los problemas más difíciles que hay -junto con el aterrizaje en Marte y la teletransportación. Déjame que te cuente un secreto: en realidad no es tan difícil.
Una cosa que puedes hacer para asegurarte que funciona es crear validación en vivo de los campos de entrada. Esto significa que si necesitas un número de teléfono mío, asegúrate de que no se pueda enviar el formulario si existe cualquier tipo de texto en el campo que no son dígitos. Además, si necesitas un número en un formato específico, no me digas como lo debo escribir. No me importa si necesitas el número en formato de EE.UU., pero si me deja escribir una serie de diez caracteres. Puede ser tan difícil?
Si relleno el formulario y hay un error, es necesario que me hagas saber el error exacto y lo que puedo hacer para solucionarlo. No – repito, no! – Pedirme que rellene todos los campos de nuevo. Ahí es donde pierdes un cliente potencial.
Evitar la confusión en los formularios mediante el uso de un lenguaje claro, la colocación clara y colores claros. El ejemplo anterior es una casi perfecta. No hay duda acerca de lo que hay que corregir y cual es el mensaje de error.
Sería perfecto si el mensaje de error también nos solucionara el error: Introduzca una dirección de correo electrónico válida. Desafortunadamente «.xom» no es un dominio válido.
Si quieres mejorar en el manejo de los mensajes de error en los campos de entrada, Christian Holst escribió un gran artículo hace tres años sobre este que sigue siendo relevante hoy en día.
Shorter forms are always more successful.
Es bien sabido que las tasas de retorno de los formularios largos son pequeñas, pero son evitables. Si un usuario comienza a rellenar un formulario, es porque quiere. Si se detiene antes acabar, tu eres el culpable. La mayoría de las veces se debe a su solicitud de una demasiado grande de datos – más grande que su retorno.
¿Te suscribirías a un boletín, si el formulario que requiere para completar la información son el nombre, correo electrónico, dirección y tarjeta de crédito? !No!. Pero le darías toda esta información de inmediato si compras algo en línea. Todo es cuestión de mantener un equilibrio entre lo que se pide y lo que se da a cambio.
De hecho, los estudios muestran que los formularios más cortos pueden convertir más de un 150% mejor que los más largos. Piensa en esto por un tiempo antes de añadir un nuevo campo al formulario.
Utiliza formato SVG siempre que puedas
Algunos de vosotros no sabéis lo que una imagen SVG es, así que lo explicaré muy brevemente. SVG es el acrónimo de gráficos vectoriales escalables y, como su nombre indica, representa una imagen del vector que se pueden ampliar hasta una en función de la pantalla que se ve en.
SVG funciona muy bien con CSS y es perfecto para el diseño web responsive. Junto con la tipografía adaptable y diseños adaptables crea una experiencia visual para el usuario independientemente del dispositivo que se utilice. Las imágenes SVG son mejores que las imágenes normales, rasterizadas e incluso mejor que los iconos de fuente simplemente porque pueden adaptarse rápidamente al medio al mismo tiempo que parece grande. Por otra parte, los archivos SVG son mucho más adaptables a la hora de los colores.
Puedes utilizar gráficos SVG en casi todo: logotipos, elementos de interfaz de usuario, gráficos, iconos y muchos otros. SVG es realmente el futuro y merece un artículo propio.
Comprueba On Design .. Ahora qué más?
Déjame ponerlo para ti: UX no es sólo el diseño. Recuerda esto. El diseño es sólo una parte de esta gran variedad de elementos. Hay muchas cosas que puedes hacer para mejorar la UX, que no necesariamente tiene que ver con el diseño.
Diseño de menú de navegación eficaz
El menú de navegación tiene que ser, sin lugar a dudas, los primero que los visitantes vean. La navegación y el logotipo. Los usuarios necesitan saber dónde están y dónde pueden ir.
Como punto de partida de una página web, la navegación tiene que ser simple y limpio. No meter mucha información innecesaria en ella y, al mismo tiempo, no seas vago al respecto. No puede permitirte el lujo de confundir a tus usuarios.
A veces no es tan fácil de mantener la navegación sencilla; (busca en Amazon). Sin embargo, la mayoría de los diseñadores web no tienen la oportunidad de trabajar en un sistema tan complejo, por lo tanto, ten en cuenta: la navegación sencilla es la mejor navegación que hay. Algunos consejos muy simples son:
- Mantener la navegación principal en la parte superior derecha (logo a la izquierda)
- Limitar el número de opciones a no más de 6
- Usa palabras cortas y descriptivas («Contacto» en lugar de «Contacta con nosotros»)
- Mantén la navegación en footer si las páginas son largas.
Otras cosas que puedes hacer son bastante sencillas. Te aconsejo que no hagas uso de cualquier tipo de tácticas o redireccionamientos con el fin de obtener algo que desea el usuario. Se va a mosquear y no recomendará tu web.
Los Pop-ups mal implementados son también algo que molesta. Hace unos días estuve leyendo este artículo en mi iPhone de una revista online conocida en todo el mundo. A una ventana emergente se le ocurrió avisarme sobre el uso de cookies. Esto está bien. Pero no había ningún botón para aceptar o cancelar. No había manera de salir de esa ventana emergente. He hecho clic en él, pulsé, me pellizqué, hice todo lo que hay que hacer.
En realidad, lo hice más de lo que debería, ya que debería haber salido de la web y el pop-up desapareció en 10 segundos.
¿Hubiera sido tan difícil para ellos para hacerme saber desde el principio que esta superposición se desvanecerá en 10 segundos? No mucho más difícil que una sola línea de código.
Dependiendo de quién es su audiencia, probablemente hay algunos otros consejos que podría escribir sobre pero sería largo. Así que si dominas estos primeros consejos, estarás a medio camino de una solución web de éxito.
(Continuará)