5 ejemplos de mal diseño de sitios web y cómo hacerlo mejor
El diseño de un sitio web afecta directamente a la experiencia del usuario., Un sitio mal diseñado es menos probable que los visitantes completen una acción, como comprar un producto o unirse a una lista de correo.
de hecho, si la página se carga lentamente o es difícil de navegar, el 95% de los visitantes se irán en cuestión de segundos.
si no está obteniendo los resultados que desea de una página web, como el aumento de conversiones y la disminución de las tasas de rebote, evalúe el diseño.
Aquí hay algunos errores que hemos detectado en otros sitios web. Trate de evitar repetir cualquiera de estos cinco ejemplos de mal diseño de sitios web.
¿cómo se ve un mal diseño de Sitio Web?,
el propietario promedio de un negocio puede no entender las diferencias entre el buen y el mal diseño web, por lo que muchos sitios web terminan con diseños terribles e ineficientes.
mientras que las tendencias de diseño cambian constantemente, hay componentes básicos de un sitio web que siguen siendo universales, incluyendo:
- navegación fácil de seguir
- Diseño limpio
- compatibilidad
- diseño apropiado para la industria
Los usuarios no deberían tener que adivinar cómo encontrar una página dentro de su sitio web. Todo debe estar claramente organizado, con menús sencillos y funciones de navegación.,
también se recomienda un diseño limpio. Si la página está llena de Información, gráficos y videos, se tarda más en cargarse y se vuelve más difícil de leer.
La compatibilidad es menos preocupante, ya que la mayoría de los sitios ahora usan diseños responsivos que se ajustan al tamaño de la pantalla del usuario. Sin embargo, a menudo se necesitan pruebas exhaustivas para garantizar que los elementos se carguen correctamente en diferentes dispositivos.
la apariencia visual del sitio web es un detalle subjetivo, ya que cada uno tiene sus propios gustos. En cualquier caso, necesita un diseño que sea apropiado de la industria., Por ejemplo, si bien los gráficos llamativos pueden no funcionar en un sitio para una funeraria, pueden funcionar en un sitio para una tienda de alquiler de fiestas.
tenga esto en cuenta mientras revisamos los peores errores de diseño de sitios web.
sitios web sin un mensaje claro
uno de los peores errores de diseño que puede cometer es no proporcionar un mensaje claro relacionado con el propósito de su sitio web. Los usuarios deben saber al instante el nombre del negocio y lo que venden.
por ejemplo, cuando visita por primera vez el buzón 3D, tarda unos segundos en comprender lo que está mirando., Parece ser una página web para algún tipo de software de correo electrónico. Es difícil determinar si el software es un juego, salvapantallas o cliente de correo electrónico.
el sitio CyberDsignClan es otro ejemplo de un sitio web sin un mensaje claro. Simplemente ves un gran gráfico que dice, » skip intro.»Después de hacer clic en la página, la página de inicio real se carga, lo cual es tan confuso como el buzón 3D.
Ambos sitios la falta de un mensaje claro. Para obtener más información sobre el producto, los visitantes deben desplazarse por la página o hacer clic en otros enlaces.,
todo lo que aparece en la página antes de que los usuarios necesiten desplazarse más lejos se considera por encima del pliegue. A esto lo llamamos la «sección de héroes».»Esta es la zona donde se debe incluir el nombre del negocio y alguna indicación de lo que venden. La parte superior de la página también debe ofrecer algún tipo de navegación.
los visitantes del Sitio Web forman opiniones sobre el negocio en una fracción de segundo. Si los usuarios necesitan desplazarse por la página para averiguar qué hace la empresa, es probable que abandonen la página.,
demasiados elementos que saturan la página
Además de un mensaje claro, el sitio debe tener un diseño claro. Si la página está desordenada, se vuelve difícil de navegar, lo que hace que los visitantes se vayan.
Arngren.net es un buen ejemplo de mal diseño. Este sitio web Clasificado contiene listados arrojados juntos sin estructura. Los listados no están divididos en categorías y encajan como un rompecabezas.
para otro ejemplo, visite Lings Cars., El sitio web es para coches usados, pero tiene tantos elementos diferentes, puede pasar por alto el propósito del sitio. El diseñador incluyó al menos media docena de elementos animados encima del pliegue, lo que hizo increíblemente difícil navegar por la página.
es posible mostrar una gran cantidad de contenido sin recargar la página. Para un buen ejemplo de diseño web que cuenta con varios productos, mira Amazon o AliExpress. Si bien ambos sitios contienen un pergamino interminable de productos, están organizados en cuadrículas en lugar de estar juntos como un mosaico.,
además de saturar la página con una mezcolanza de enlaces, algunos sitios están llenos de ventanas emergentes, anuncios flotantes, videos de carga automática y otros elementos que distraen a los visitantes.
páginas sin optimización móvil
La mayoría del tráfico de internet en los EE.UU. ahora proviene de dispositivos móviles, sin embargo, muchos sitios web todavía se construyen para computadoras de escritorio primero. Si el sitio web no está optimizado para dispositivos móviles, la mayoría de los visitantes no obtendrán una buena experiencia de usuario.,
muchos sitios ahora incluyen diseño responsivo, que permite a la página web ajustar los elementos en función del ancho de pantalla del dispositivo del usuario. El sitio también puede ocultar elementos, cambiar fuentes o eliminar fondos cuando se detecta una pantalla más pequeña.
Estos detalles permiten que el sitio funcione en cualquier dispositivo. Si bien los diseños responsivos son comunes, todavía hay muchos sitios que son ilegibles en dispositivos móviles.
casi todos los ejemplos ya discutidos no tienen un diseño responsive. La Universidad de Deque tiene un ejemplo de diseño web no responsivo.,
si está leyendo esto en su navegador web, intente visitar el sitio y ajustar el ancho del navegador. A medida que la ventana del navegador se hace más pequeña, la página no Cambia su diseño. El texto se vuelve imposible de leer sin desplazarse hacia la derecha.
si quieres ver un ejemplo de diseño web responsivo, visita casi cualquier sitio web propiedad de una empresa importante, como Nike o Microsoft.
falta de navegación Simple y enlaces
cuando los usuarios llegan a un sitio, no deberían tener ningún problema navegando por el menú y encontrando la información que necesitan., En el sitio web oficial de la Universidad de tecnología avanzada, la parte superior de la página está cubierta con una gran pantalla animada que contiene gráficos flotantes.
Los gráficos flotantes son enlaces en los que se puede hacer clic que son difíciles de hacer clic y ralentizan la velocidad de carga de la página. Aunque esto es extremadamente innovador, hay otras formas creativas de diseñar un sitio web sin dificultar la navegación. En lugar de usar esos elementos flotantes como enlaces, la Universidad de tecnología avanzada debería haberse centrado en crear un menú que sea fácil de abrir y navegar.,
Por último, hay muchos sitios que incluyen desplazamiento de paralaje y elementos de video incrustados que no dominan la página y limitan su navegabilidad.
texto ilegible o botones no clicables
debido a las demandas en el navegador web, el menú en el sitio anterior es casi no clicable. Esto también es un problema cuando los sitios no están optimizados para dispositivos móviles. Cuando los elementos no se ajustan a la pantalla más pequeña, pueden superponerse o volverse demasiado pequeños para leerlos.,
evitar este problema es fácil si completa pruebas detalladas antes de lanzar su sitio web. Utilice emuladores o software para emular cómo aparece su sitio en varios dispositivos móviles, incluidos los últimos teléfonos inteligentes y tabletas.
cómo evitar un mal diseño para tu sitio web
Los ejemplos discutidos son relativamente fáciles de evitar, Ahora que sabes qué buscar. Sin embargo, la implementación de los cambios necesarios puede requerir conocimientos técnicos., En WANDR, obtienes la ayuda de diseñadores de experiencia de usuario experimentados que entienden lo que se necesita para crear una mejor experiencia de usuario.
si desea asegurarse de que su sitio no contiene ninguno de los ejemplos de diseño malo discutidos, considere trabajar con profesionales.