7 erreurs de conception de site Web qui me conduisent des écrous

Parfois, les sites Web me rendent grincheux. Je clique avec anticipation et ensuite? désastre de conception. Admettez-le, vous avez également murmuré à l'écran plusieurs fois.

Du type médiocre aux liens manquants en passant par les problèmes d’utilisabilité, je vais vous faire part des erreurs qui me rendent absolument dingue. Prenez garde! Ce sont des choses à aborder et à corriger sur votre propre site, avant que quelqu'un d'autre ne les découvre!

1. Manque de contraste

Le texte et les images de votre site Web doivent être lisibles. Le moyen le plus simple d'y parvenir est le contraste. Mais trop de designers oublient ce simple fait.

Le plus gros problème est souvent le manque de contraste entre le texte et l'arrière-plan, ce qui rend le lettrage illisible. (N'est-ce pas le but du contenu?)

Il est important de veiller à ce que chaque emplacement contienne suffisamment de contraste avec les éléments environnants pour le distinguer des autres éléments. Rappelez-vous les bases du design lorsque vous réfléchissez au contraste - couleur, espace et taille. L'utilisation de ces éléments vous aidera à les distinguer les uns des autres.

L'image ci-dessus contient deux problèmes de contraste avec le texte. Regardez la couleur des liens sur le fond. Le texte est assez difficile à lire. Regardez ensuite la taille du texte par rapport à l’échelle des images à l’écran. C'est trop petit et les caractères blancs sur fond clair aggravent le problème.

2. Mauvaise navigation et écoulement

À partir du moment où je débarque sur votre site, je devrais savoir ce que vous attendez de moi. Les motifs de clics et le flux d'informations doivent être plutôt évidents. (C’est une des raisons pour lesquelles la navigation et les menus se trouvent souvent en haut de la page.)

Les astuces et les effets de navigation doivent être clairement étiquetés et fonctionner de manière intuitive. C’est pour vous tous qui expérimentez le défilement de gauche à droite ou d’autres effets animés inhabituels - donnez aux utilisateurs un type de repère sur la façon dont cela fonctionne. Frustrer les utilisateurs avec des astuces de conception compliquées les fera abandonner votre site.

3. Mauvaise utilisation ou traitement photo

Il n'y a rien de pire qu'une belle image masquée par d'autres éléments de conception. Si vous prenez le temps d'utiliser d'excellentes images sur votre site, utilisez-les sans effets superposés. Ajoutez une simple ligne de texte et arrêtez. (D'où la popularité des boutons fantômes.)

Bien que cela puisse se produire de nombreuses façons, le piège se produit souvent lorsque les concepteurs essaient d'être «trop tendance». Les en-têtes de héros sont amusants. Les curseurs sont géniaux. Mais lorsque vous associez ces éléments à du texte, ils peuvent devenir dangereux. Chaque image de l'ensemble doit fonctionner avec le texte afin que chaque mot soit lisible et que tous les éléments importants de la photo soient visibles.

Ne couvrez pas les parties importantes d'une image avec du texte ou des boutons. Si cela se produit dans votre conception, il serait peut-être préférable d’opter pour un arrière-plan simple et d’utiliser des photos ailleurs.

À première vue, l’image ci-dessus vous saisit parce qu’elle est dans le style d’esquisse légale. Mais regardez de plus près, les visages sont obscurcis par le texte et le tout est un peu brouillé avec un témoignage qui n'a pas besoin de couvrir l'image.

4. Ne pas utiliser une grille

Il y a une certaine quantité de chaos heureux dans la conception Web; l'asymétrie est l'un de ces éléments. L'absence de grille ne l'est pas.

L'utilisation d'une grille est l'un de ces vernis professionnels qui distinguent le bon design du mauvais. Les grilles ajoutent de la clarté et de l'organisation, aident à créer un espacement adéquat et cohérent entre les éléments et vous aident à savoir où et comment placer les éléments. La grille peut aider à cibler la prise de décision concernant la taille des éléments, la taille du texte et l'espace, et à concevoir dans des proportions pondérées de manière appropriée.

5. Ne pas utiliser la conception sensible

Pour votre bien, utilisez un cadre réactif pour vos sites Web. Votre site doit fonctionner sur un téléphone portable. Période. Inversement, cela doit également fonctionner aussi bien sur mon bureau.

Je continue à rencontrer des sites qui s'affichent sous forme de pages Web complètes sur mon téléphone. Les sites Web qui ne répondent pas, ou qui ne possèdent pas au minimum de version mobile, manquent chaque jour de trafic et de conversions. (Bien que plus rares, les sites proposant uniquement des versions mobiles sont tout aussi frustrants.)

Et de nombreux autres utilisateurs sont probablement comme moi. Si j'essaye votre site sur mon téléphone et que cela ne fonctionne pas, je ne reviens pas et ne l'essaie pas sur mon ordinateur.

6. Liens manquants

Les liens brisés sont l’une des plus grandes frustrations du Web. Prenez l’habitude de réaliser un audit annuel des liens de votre site. C'est quelque chose que vous pouvez faire manuellement ou à l'aide d'un outil tel que Website Link Checker.

L'autre chose qui m'énerve? Lorsque le logo n'est pas un lien vers la page d'accueil de chaque page. Il devrait toujours y avoir une? Maison? une fonction. (Et tant que vous y êtes, ne désactivez pas le bouton Retour.)

En ce qui concerne les liens, songez à la convivialité. Assurez-vous que les liens, en particulier ceux dans le texte, sont visibles et suffisamment grands pour cliquer ou appuyer sans obtenir par erreur un lien voisin. N'incluez pas trop de liens dans le texte pour cette raison, car il peut être difficile d'exploiter le bon lien, en particulier sur les plus petits appareils.

7. Son de lecture automatique

Le son sur votre site Web peut être amusant. Le son qui joue sans invite n'est pas.

Vous devez toujours donner aux utilisateurs une option d'activation / désactivation du son et la désactivation par défaut. Le son peut être surprenant pour les utilisateurs, peut ne pas être sans danger pour les environnements de travail et est généralement agaçant. La plupart des utilisateurs souhaitent avoir le contrôle de l'expérience de visionnage sur le site Web et la lecture automatique du son enlève une partie de ce contrôle. Je suis beaucoup plus susceptible d'interagir avec le son et de le jouer si on me donne l'option; la lecture automatique me force souvent à quitter le site sans chercher de lieu pour le faire taire.

À certains endroits, cela peut être délicat - la publicité, par exemple. Si vous avez quelque chose qui contient du son qui doit jouer, considérez une boîte de style contextuelle avec un gros bouton muet.Les utilisateurs sont plus? Formés? accepter quelques secondes de diffusion de la publicité pour afficher le contenu. Ce n'est toujours pas une situation idéale, mais peut être une meilleure solution.

Regardez l'image du site ci-dessus. Il joue des sons automatiquement - ils sont supposés être tranquilles - mais voyez si vous pouvez voir le son basculer d'un coup d'œil. Le bouton est plutôt petit, surtout comparé à la taille des autres éléments.

7 autres Pet Peeves

Malheureusement, il y a plein d'autres petites choses qui peuvent aussi me rendre fou lorsque je navigue sur le Web. Essayez de ne pas être victime de l'une de ces erreurs d'inattention.

  1. Pas de recherche
  2. Erreurs de grammaire ou d'orthographe
  3. Pas d'appel à l'action
  4. Trop de liens dans la copie
  5. Césure de texte
  6. Super petits boutons
  7. Mauvaise typographie et lisibilité

Conclusion

Tomber dans certains de ces pièges est trop facile et peut arriver à tout le monde. (Vous trouverez même certaines de ces erreurs cachées dans des sites au design génial.)

Veillez donc à vous concentrer sur les détails tout au long du processus de conception et de lancement afin d’éviter bon nombre de ces problèmes. Tu ne veux pas me rendre grincheuse, n'est-ce pas?