11 consejos de diseño web muy eficaces respaldados por investigaciones

En Internet, los consejos de diseño web abundan. Muchas personas tienen opiniones sobre cómo debe ser un sitio web perfecto. Esto se debe a que, hasta cierto punto, el diseño es subjetivo. Lo que a una persona le gusta, a otra puede parecerle horrible.

Al mismo tiempo, el diseño es uno de los factores más importantes para el éxito de un sitio web. De hecho, casiLa mitad de todos los usuariosDicen que el diseño del sitio web es el factor principal para juzgar la credibilidad de una empresa. Por lo tanto, también influye en las conversiones.tasa de rebote, y mucho más.

¡Qué sorpresa! Si tan solo hubiera una manera de encontrar datos objetivos sobre cómo crear un diseño web exitoso. ¡Espera, la hay! Y hemos recopilado una gran cantidad de ellos en este artículo. Quédate para conocer algunos consejos de diseño web respaldados por la ciencia. Deja de confiar en tu intuición y comienza a hacer cosas que han demostrado funcionar.

Consejos de diseño web basados ​​en la ciencia para triunfar en su próximo proyecto web

A continuación, encontrará algunos consejos y trucos basados ​​en investigaciones sobre cómo mejorar el diseño de su sitio web.

1. Haga de la velocidad del sitio una prioridad absoluta

Probablemente sea uno de los hechos menos debatidos en el ámbito del diseño web: la velocidad de carga de la página importa.

Las investigaciones han demostrado que influye en todo, desdetasa de rebotesobre la satisfacción del usuarioConversiones e ingresos.

Esto es especialmente cierto en el caso de la velocidad de los sitios móviles. Según un estudioEstudio de Google deActualizadoUna mejora de solo 0,1 segundos puede mejorar las tasas de pago, conversión y rebote.

Teniendo en cuenta el hecho de queLa mayoría de los usuarios de Internet navegan en dispositivos móviles.y que Google ha cambiado a unaíndice móvil primero, eso es definitivamente algo a lo que debes prestar atención.

Si su sitio es lento, los visitantes no se quedarán en él. Punto. Además, los motores de búsqueda lo penalizarán en sus clasificaciones. Por ese motivo, es fundamental que invierta en hacer que su sitio sea lo más rápido posible.

¿Cómo? Los artículos que aparecen a continuación le ayudarán a seguir el camino correcto:

• 10 razones por las que el rendimiento del sitio web es importante para su negocio
• 14 formas de acelerar WordPress y reducir el tiempo de carga de la página
• 13 consejos para mejorar la velocidad del sitio web en WordPress
• 10 formas sencillas de acelerar su sitio web de WordPress [Estudio de caso]

2. Aprovecha el Fold

Si todavía existe o no el pliegue es un tema de intenso debate. Algunos dicen que, debido a la multitud de tamaños de pantalla que hay hoy en día, el pliegue ya no importa. Otros tienen una opinión diferente.

En ese sentido, según un estudio deActualizado realizado por Nielsen Norman Group,La gente pasa el 57 por ciento de su tiempopor encima del pliegue con una fuerte caída después. El 74 por ciento de su tiempo se dedica a las dos primeras pantallas.

Parece que el pliegue sigue siendo importante. Para tu sitio web, eso significa que debes priorizar el contenido y utilizar el espacio disponible para atraer a los usuarios y que continúen. A continuación, te ofrecemos algunos consejos sobre cómo hacerlo:

• Utilice un título claro y descriptivo— Explique lo que su sitio puede hacer por los visitantes y destaque los beneficios. Sea breve y utilice palabras que evoquen emociones. Para obtener más consejos, consulte nuestraConsejos de redacción publicitaria.
• Incluya su llamada a la acción principal— Para mejorar sus posibilidades de convertir a sus visitantes, el pliegue es el momento de comenzar.recorrido del usuarioAsegúrate de que tu CTA sea clara y visible. Usa nuestros consejos paraCómo escribir una gran llamada a la acciónSi estás luchando.
• Incluir medios— Las imágenes, los vídeos o el audio ayudan a enfatizar el mensaje. Hablaremos más sobre el contenido visual más adelante.

Además, para alentar a los usuarios a continuar desplazándose, asegúrese de evitar elilusión de completitudo “falsos fondos”. Se refiere a un diseño que puede dar la impresión de que se ha llegado al final de la página, lo que disuade a los visitantes de continuar.

3. Aprovecha la Ley de Hick

Ley de HickAfirma que cuantas más opciones tenga un individuo, más tiempo tardará en tomar una decisión.

En realidad hay unaestudio fascinanteEn este fenómeno, en el que a los clientes de un supermercado se les daba a probar más o menos variedades de mermeladas, los que tenían más opciones tenían muchas menos probabilidades de terminar comprando alguna mermelada que los que tenían menos variedad para elegir.

¿Qué importancia tiene esto para tu sitio web? Bueno, significa que podrías aumentar tus conversiones simplemente limitando la cantidad de opciones que ofreces a los usuarios. A continuación, se muestran algunos ejemplos de cómo podría ser esto:

• Reducir el número de elementos del menú
• Limitar campos de formulario
• Centrarse en una llamada a la acción
• Muestra únicamente los botones sociales de las redes en las que estás realmente activo
• Cíñete a un objetivo por página

Hay muchas otras formas de reducir la sobrecarga en su sitio y llevar a los usuarios hacia las opciones que realmente desea que elijan. De hecho, tenemosUn libro electrónicode esto.

4. Mantenlo simple

Siguiendo con el tema de menos, esto también se aplica a tu diseño en general.Gran estudio de GoogleHa demostrado que a los visitantes no les gusta la complejidad visual. La idea es que cuanto más complicado sea el diseño, menos bello lo percibirán.

¿Qué significa esto para su sitio? Además del punto anterior sobre limitar las opciones en su sitio, aquí le presentamos algunas ideas:

• Repensar esa barra lateral— Cada vez más sitios web están abandonando la barra lateral en favor de un diseño de una sola columna (por ejemplo, el que estás viendo ahora mismo). Esto implica menos distracciones y pone el foco claramente en el contenido.
• Mantenerse fiel a los diseños estándar— A la gente le encanta lo familiar y puede sentirse extraña ante diseños de sitios no estándar. Por lo tanto, puede ser una buena idea seguir los esquemas y diseños habituales. Aún puede encontrar formas de destacarse a través de otros medios.

Hablando de diseños estándar, Orbit Media hizo unEstudio sobre estándares de diseño webActualizado. A partir de una muestra de las páginas de inicio de 500 sitios web B2B, encontraron que los siguientes son los estándares y convenciones más y menos comunes a los que se adhieren estos sitios web:

Utilice la información anterior para mejorar su propia página de inicio. Además, lea el artículo adjunto para obtener consejos adicionales sobre cómo perfeccionar cada parte, desde el encabezado hasta el final.pie de páginaNorman Nielsen hizo unaestudio similarcon hallazgos similares a los de Orbit Media.

5. Evite carruseles, controles deslizantes, pestañas y acordeones

A los propietarios de sitios web les encantan los carruseles. Es probablemente una de las funciones más solicitadas por los clientes y un compromiso común cuando diferentes equipos exigen el mismo espacio en el sitio web de la empresa. Lamentablemente, la investigación dice que son bastante inútiles, al menos en la página de inicio.

Uno de los datos más sorprendentes proviene deUniversidad de Notre DameEl webmaster se dio cuenta de que la primera diapositiva de un carrusel recibía casi el 90 por ciento de los clics, mientras que el resto eran en gran medida ignorados.

¡El 90 por ciento! Parece que las demás diapositivas no valen la pena, ¿no? Parece que los diseñadores web que convencen a sus clientes de que no utilicen un control deslizante tenían razón desde el principio.

Hallazgos similares se obtienende la Universidad de York.

Sin embargo, el caso puede ser diferente para las imágenes de productos móviles.Este estudio publicado en Smashing Magazinemuestra.

En este caso, la interacción en las diapositivas posteriores fue mayor que en los estudios anteriores. Por lo tanto, para proporcionar información adicional en un contexto particular, las presentaciones de diapositivas parecen tener su utilidad. Sin embargo, parecen menos adecuadas como herramienta de navegación del sitio.

Las pestañas y los acordeones tienen el mismo problema que los controles deslizantes y los carruseles:A menudo son ignoradosEsto se ve agravado por el hecho de que pocos visitantes leen realmente la página completa.La mayoría de la gente simplemente escaneay, por lo tanto, no es muy probable que hagan clic adicional para ver su contenido.

Sin embargo, ¿qué sucede si necesitas incluir la información que se encuentra en esas áreas de alguna manera? Estamos llegando a eso exactamente ahora.

6. Priorice el desplazamiento sobre el clic

Si no se debe comprimir la información en controles deslizantes o acordeones, ¿cómo se presenta? La respuesta: simplemente se coloca todo en una página larga, incluido el material que normalmente se esconde. En serio, funciona.

Hay una fascinanteEstudio de caso de Crazy EggPara demostrarlo, pasaron de tener una página de ventas simple y corta a una que eraActualizadoeces más larga que la original.

El resultado: ¡las conversiones aumentaron un 30 por ciento! No es algo para despreciar.

Parece que a los usuarios les gusta desplazarse mucho más que hacer clic. Por lo tanto, si actualmente distribuye la información sobre su producto en muchas páginas diferentes, es hora de reconsiderarlo.

7. Atención directa con señales visuales

Una de las principales funciones del diseño web es guiar a los usuarios. Puedes hacerlo asignando un peso diferente a los distintos elementos, dirigiendo así la atención hacia donde quieres que vaya.

Sin embargo, también puedes utilizar señales visuales más directas para lograrlo. Una de ellas es aprovechar el hecho de queLos humanos tienden a mirar en la misma dirección.Como las personas que ven en los anuncios.

¿Observa cómo en la imagen de arriba, más personas leen el texto que el bebé está mirando que cuando el bebé estaba mirando a la cámara? Esto es algo real y puede usarlo para dirigir la atención hacia su sitio donde más lo desee.

Sin embargo, no es necesario ser tan sutil a la hora de atraer la atención de los visitantes. A veces resulta útil ser directo al respecto. Por ejemplo, enUn estudioLos investigadores probaron los efectos mencionados anteriormente frente a una simple flecha que apuntaba a los elementos a los que querían llamar la atención.

Curiosamente, el método más directo superó a la señal sutil.

Que esto te sirva de lección.

8. Utilice personas en las fotografías (pero evite las fotografías de archivo)

Además de utilizarlas para dirigir la atención, incluir a otras personas en las imágenes de tu sitio suele ser una buena idea. A los humanos les gusta conectarse con otras personas, tanto en la vida real como en la web. Por eso, por ejemplo, tenemosAcerca de las páginasen los blogs.

Puedes ver esto en acción en unoEstudio de caso de BasecampLograron aumentar sus conversiones en un 102,5 por ciento al cambiar de una página de destino basada en texto a una con una foto grande de una persona en el fondo.

Sencillo pero eficaz. Sin embargo, hay una salvedad: el efecto general se ve fácilmente anulado por las fotografías de archivo.Un estudio del grupo Nielsen NormanDescubrimos que somos muy hábiles para reconocer estas imágenes genéricas y hacer caso omiso de ellas.

Por eso, si vas a utilizar imágenes de personas en tu sitio, asegúrate de que sean auténticas y reales. Incluye a tu personal o a tus clientes.

Dos estudios de caso que muestran esto en acción provienen deExperimentos de marketingyOptimizador visual de sitios webEn ambos casos, cambiar las imágenes de archivo por imágenes auténticas y relevantes mejoró las tasas de conversión entre un 35 y un 45 por ciento.

Si no hay forma de evitar el uso de fotografías de archivo, al menos siga algunas prácticas recomendadas:

• UsarOjo de hojalatayImágenes de GooglePara averiguar quién más usa la misma imagen. Evite imágenes que aparezcan en muchos otros sitios web y sitios con los que no desea estar asociado.
• Usarfotos de archivoSólo como base para crear tus propias imágenes. Ajusta su color, añade texto, tipografía y otros efectos para hacerlas más atractivas y únicas.

9. Utilice el orden correcto de listas

El uso de listas, tanto ordenadas como desordenadas, es una excelente manera de hacer que la información sea más accesible yaumentar la legibilidadPero resulta que también aquí la atención humana es voluble.

Esto se debe a la llamadaefecto de posición serialBásicamente dice que en una lista, lo más probable es que recuerdes tanto los elementos del principio como los del final. La sección del medio, por otro lado, se olvida en gran medida.

La lección aquí es esta: al enumerar los atributos de su producto o servicio, asegúrese de colocar los más importantes donde es probable que tengan un impacto.

10. Sin embargo, olvídate del orden de tu menú de navegación

La excepción a la importancia de ordenar tus listas parece serNavegación del sitio web. UnEstudio de seguimiento ocular deActualizadoQueríamos averiguar si el orden de los elementos del menú influye en la rapidez con la que los usuarios encuentran lo que buscan. En cuanto a los resultados, permítanme citar simplemente el estudio en sí, porque no podría ser más claro:

• Al diseñar un menú web o asesorar sobre su diseño, no dedique demasiado tiempo a decidir el orden de los elementos del menú basándose en que esto ayudará a los usuarios a encontrarlos más rápidamente. Siga respetando las expectativas culturales, como que el enlace de “Inicio” esté siempre en el extremo izquierdo.

En resumen, pon tuHogarbotón en el lado izquierdo del menú, pero no te preocupes por el orden de nada más.

11. Aprovechar las pruebas sociales

El último de nuestros consejos de diseño web trata sobre el llamado sesgo de conformidad. Se trata de la tendencia de las personas a hacer lo mismo que los demás. Esto significa que, si un grupo de personas aprueba algo, es más probable que los demás hagan lo mismo.

Una forma de aprovechar esto en su sitio web es mostrar pruebas sociales. Si puede demostrar que otras personas tienen una opinión positiva de su sitio, contenido, producto o servicio, es más probable que los nuevos visitantes lleguen a la misma conclusión.

Puedes demostrarlo más fácilmente con el recuento de publicaciones en redes sociales, menciones en los medios y/o testimonios. En caso de que quieras profundizar en este tema, tenemos un artículo completo sobreCómo aumentar la prueba socialpara ti.

¿Cuáles son tus consejos de diseño web favoritos?

El diseño web es un tema complejo que tiene mucha influencia en el éxito de su sitio web. Por ese motivo, es mejor saber lo que está haciendo. Confiar en la investigación para obtener consejos en lugar de opiniones aleatorias es una buena manera de garantizarlo.

Puede utilizar las técnicas anteriores para que su sitio web sea más eficaz, ofrezca un mejor servicio a sus visitantes y mejore las tasas de conversión y otros indicadores de éxito. Resumámoslas una vez más:

1. Invierta en una velocidad de carga rápida de la página
2. Utilice el pliegue para atraer a los visitantes
3. Reducir las opciones para mejorar las conversiones
4. Simplifica donde puedas
5. Evite utilizar carruseles, controles deslizantes, pestañas y acordeones.
6. Priorizar el desplazamiento sobre los clics
7. Atención directa mediante señales visuales
8. Utilice imágenes de personas (pero no de stock)
9. Priorizar el orden de los elementos de la lista
10. No te preocupes por el orden de tu menú de navegación
11. Utilice la prueba social para hacer que su sitio sea más atractivo

Esperamos que esto te ayude a mejorar tu propio diseño web. Si tienes más consejos, estudios e información, no dudes en compartirlos.

¿Tienes más consejos de diseño web basados ​​en investigaciones? Si es así, compártelos en los comentarios a continuación.