10 Errores en diseño web que no debes cometer

Los errores en diseño web más comunes que no debes hacer al crear una página web.

En este artículo quiero comentarte algunos de los errores comunes en el diseño web que me encuentro en mi día a día en blogs y páginas web.

Se trata de errores que pueden perjudicar no solamente estéticamente tu página web, sino que algunos afectarán a la velocidad de carga, la usabilidad web, el SEO, … con lo que tu página web se puede ver seriamente perjudicada.

He recopilado una lista de 10 errores que no debes cometer a la hora de diseñar tu página web, como si fueran una lista de 10 mandamientos de obligado cumplimiento.

#1 No uses texto justificado para la web

En el mundo editorial y la imprenta es común el uso de textos justificados, cosa que en el diseño web no te recomiendo para nada.

Los textos justificados en formato editorial aportan sensación de orden, en internet la lectura de textos es más dinámica y puede generar los llamados “ríos” en los párrafos de los textos.

Los textos justificados pueden resultar muy molestos para todos los usuarios pero especialmente para personas con dificultades en la visón.

Aquí te muestro un ejemplo de los ríos que se crean en los párrafos y lo forzosa que puede ser su lectura.

errores en diseño web

Cada navegador web interpreta los estilos y el texto justificado a su manera y ligeramente diferente.

#2 Bloques de texto interminables

Evita a toda costa usar textos muy largos para la web. no se trata de realizar un copy/paste de tu documento Word.

Realiza un buen marcado de textos con un uso correcto de títulos, negritas, botones,…

Los usuarios de tu web se cansarán rápido si los obligas a leer párrafos interminables, intenta comprimir tu mensaje en párrafos de 2 o 3 líneas.

Al redactar tus textos debes pensar también en las versiones móviles ya que allí tus textos aún se verán más largos.

#3 Cuidado con el uso de las tipografías

Debes cuidar el uso de tipografías y no abusar de las tipo script o hand draw en los párrafos. Este tipo de tipografías son difíciles de leer en párrafos mas largos aunque si pueden utilizarse para algún tipo de encabezado.

Lo recomendable es usar tipografías tipo Serif o Sans-serif y combinarlas entre ellas.

Puedes usar una fuente con serifas (Serif) para los encabezados y para los párrafos una Sans-serif con lo que tendrás una buena legibilidad para los textos.

Hay muchas combinaciones posibles, lo recomendable es usar dos familias tipográficas diferentes o bien usar la misma familia jugando con el grosor.

En este post de Feeling Studio puedes ver algunos ejemplos de combinaciones tipográficas para los textos de tu web.

Por otro lado no abuses de textos en mayúsculas, en algún momento se deben usar para destacar encabezados pero úsalos con moderación y sentido común.

#4 Usar demasiados colores

Combinar demasiados colores en una página web puede resultar muy confuso. Con dos o tres colores debe ser más que suficiente para dar relevancia visual a los bloques de contenidos que son realmente importantes.

Además una mala combinación de colores puede dificultar la lectura de los textos y es un fallo en diseño web bastante recurrente.

La mejor combinación para la lectura es el negro para los textos y el blanco de fondo. Si quieres realizar otro tipo de combinaciones asegúrate de que la lectura sea la correcta.

En este ejemplo la primera columna presenta un buen contraste, la segunda y la tercera columnas la elección de los colores no es la correcta.

errores en diseño web

#5 Usar el espacio en blanco de forma correcta

En mis trabajos como diseñador web trato de aplicar el espacio en blanco de una forma correcta.

Me he encontrado con clientes que me a resultado un poco complejo explicarles que deben mostrar sus contenidos de forma ordenada utilizando los espacios en blanco.

Muchos usuarios piensan que mostrar los contenidos en espacios reducidos ayuda a su lectura cuando es todo lo contrario.

Haciendo un buen uso del espacio en blanco facilitas la atención del usuario y posibilitas que se centre en la información realmente importante.

Los espacios en blanco son fundamentales en diseño web ya que ayudan a una correcta lectura de los textos y la usabilidad web.

#6 Usar imágenes distorsionadas, pixeladas o pesadas.

Uno de los errores en diseño web más comunes y que más veces me suelo encontrar.

Hacer uso de imágenes pixeladas perjudicará el aspecto visual de tu diseño web y empobrece el resultado final dando sensación de poco profesional.

Me suelo encontrar con bastantes logotipos e iconos en formato png pixelados, para solucionar esto debes usar el formato SVG que permite usar logos e iconos en formato vectorial sin pérdida de calidad y con un menor peso.

Para poder cargar archivos SVG de forma segura en WordPress debemos usar un pequeño plugin llamado Safe SVG, este plugin forma parte de mi lista de plugins imprescindibles y lo encuentras en el repositorio oficial de WordPress.

Por otro lado, todas las imágenes deben estar optimizadas y preparadas con la resolución adecuada para el bloque que la vayamos a usar.

#7 Uso de sonido obligatorio

Uno de los errores en diseño web que más rabia me da. Nunca me han gustado aquellas páginas web en las que entras y empieza a sonar alguna música o sonido sin ningún criterio.

¿Para que vas a poner sonido en tu web? Aunque parezca raro aún hoy en día se ven webs o blogs con música de fondo que distraen la atención del usuario.

Los sonidos de fondo ya han pasado a la historia deberían quedar solo en el recuerdo de aquellas primeras webs de internet.

#8 Abusar de las animaciones

Añadir animaciones a botones, imágenes o elementos concretos de la web puede resultar atractivo pero no debes abusar de ello.

Puede resultar muy molesto navegar por una web donde todo se mueve de un lado para otro sin ningún sentido.

Añadir interactividad a ciertos elementos esta bien pero no debes pasarte ya que puedes distraer al usuario de lo realmente importante.

#9 Cuida el diseño en versiones tablet y móvil

Todas las versiones y tamaños de pantalla son importantes.

Debes tener en mente a todos los usuarios que acceden a los contenidos de tu página web y dar igual de importancia al diseño en versiones escritorio, tablet y móvil.

Desde hace años los usuarios que acceden a internet a través de sus dispositivos móviles superan a los que usan versiones de escritorio ampliamente.

#10 Navegación complicada

La navegación principal de la página web tiene que ser intuitiva para que los visitantes de la web puedan acceder a todas las secciones con un par de clics.

En páginas web grandes con muchos servicios o productos intenta evitar menús muy largos con más de 3 niveles de navegación.

Desde el menú principal se debe poder acceder a todas las secciones de la web y muy importante al contacto que en muchas webs y blogs resulta complicado encontrarlo.

errores en diseño web

Conclusión final

Hasta aquí mi lista de errores en diseño web que a toda costa debes evitar.

La lista aún podría ser más larga pero he intentado comprimir en una lista con los errores más habituales.

Puedes leer un poco más sobre este tema en este magnífico artículo, donde profundizan al detalle con todos estos errores: secciones con poco contenido, muchos estilos diferentes, textos que tapan parte de una imagen, títulos demasiado largos, demasiado texto centrado, uso incorrecto de los bordes de los botones, …

Deseo que este post haya sido de utilidad y sirva para mejorar el diseño de tu página web.

5/5 (1 Review)

Daniel Massó

Soy diseñador web y me encanta Wordpress y todo el mundo digital. Me gustan los diseños limpios y sencillos sin excesos, que tengan una buena usabilidad para mejorar la experiencia de usuario y la conversión. En mi blog comparto mis conocimientos para ayudarte a triunfar con tu web.

25 Plugins para triunfar con WordPress

Ebook plugins para triunfar con Wordpress

Lo que necesitas para dominar WordPress como un profesional.

Deja un comentario

Información básica sobre protección de datos

Responsable » Daniel Massó Matas (+info)

Finalidad » Gestionar los comentarios.

Legitimación » tu consentimiento (Que me das permiso). (+info)

Destinatarios » los datos que me facilitas estarán ubicados en los servidores de Siteground (proveedor de hosting de espaideal.com) dentro de la UE. Ver política de privacidad de Siteground. (https://www.siteground.es/aviso-legal.htm).

Derechos » Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la información adicional. (+info)

Ebook plugins para triunfar con Wordpress

25 plugins para triunfar con Wordpress

Todo lo que necesitas para dominar WordPress como un profesional

Libro en formato PDF fácil de leer

*Nota: no recibirás nada de Spam ni cosas por estilo, lo odio tanto como tú.

Escribe tu email y recíbelo GRATIS ahora mismo.