Quelle typographie choisir en quelle taille et de quelle couleur ? Où mettre les "call to action" ? Comment faire un bon formulaire de contact ? Autant de questions auxquelles nous vous répondons dans cet article.
Publié le 16 mars 2021 15:15 (Mise à jour le 16 avril 2021 16:05)
Afin que tous les internautes puissent voir correctement votre contenu, vous devez respecter une règle : le contraste entre la couleur de fond de votre page web et la couleur de votre texte doit être au minimum de 4,5:1.
Prenons l'exemple d'un site internet avec un fond sombre :
Vous pouvez retrouver plus de détails sur les règles "The W3C's Web Accessibility Initiative" ici
La couleur n'est pas perçu de la même façon par tout le monde, elle ne doit donc pas être le seul élément pour transmettre une information. L'exemple d'un message d'erreur est parfait pour illustrer ce point. Une simple couleur rouge ne doit pas suffire à annoncer une erreur, une icône attention ou une croix doivent s'y ajouter.
Pensez aux polices d'écriture simples et sans serif pour vos paragraphes, elles sont très lisibles et offrent de nombreuses graisses pour mettre des mots en gras ou encore des citations en italique.
Voici une petite sélection de typographies disponibles gratuitement sur Google Font et ayant une belle lisibilité :
Pour vos titres, permettez-vous un peu de folie ! Utilisez une typographie serif plus classique. Cela va aider à la lecture car l'œil va reconnaitre plus rapidement les titres des paragraphes.
Voici une petite sélection de typographies disponibles gratuitement sur Google Font et ayant une belle lisibilité :
Voici une article pour améliorer le contenu de vos textes.
Les internautes ont l'habitude de se fier au visuel pour voir quels contenus sont importants et/ou cliquables.
Votre "call to action" doit, comme son nom l'indique, appeler à l'action. Le texte que vous y mettrez sera important mais le design aussi. Le choix de la couleur du bouton "Call to action" va attirer ou non le regard. Chaque couleur diffusera un message différent. Certaines couleurs comme le rouge, le vert clair ou le bleu clair vont inciter l'internaute à cliquer.
Un bon moyen de faire ressortir votre "Call to action" c'est d'utiliser les overlaps. Cela va mettre en avant votre section "Call to action" grâce à une coupure du fond en 2 couleurs.
Pour améliorer le SEO de vos pages sur mobile, consultez l'article sur la vitesse de chargement des pages.
Aujourd'hui, plus de la moitié des recherches internet se font depuis un mobile ou une tablette. Un design responsive est alors primordial ! Il ne faut pas décevoir vos lecteurs avec une expérience utilisateur frustrante ou un site lent à charger.
L'optimisation d'un site sur ordinateur n'est pas la même que celle sur mobile ! Attention, votre site internet peut être très optimisé sur ordinateur mais pas sur mobile.
Cela passe par :
Il faut penser que tous les écrans de mobiles ne sont pas grands et que toutes les personnes n'ont pas de petites mains ! Alors pour éviter que certaines personnes cliquent sur 2 boutons à la fois, il y a des règles à respecter :
Lorsque vous demandez par exemple à votre utilisateur de vous contacter via un formulaire, vous devez suivre quelques règles d’ergonomie :
Retrouvez tous nos articles sur le design
