Graphisme

6 astuces pour améliorer le design de votre site web

1. Bien choisir ses couleurs.

Le choix des couleurs est très important pour avoir un site web réussi. Vos couleurs doivent bien s’harmoniser pour ajouter du dynamisme à votre site. 

Nous vous conseillons de :

  • Vous limiter à trois couleurs, et utiliser la règle du 60/30/10. C'est à dire, une couleur dominante qui occupe 60% de la surface de votre site, une couleur complémentaire qui contraste avec la couleur dominante et qui occupe 30% de la surface, et une couleur accent qui occupe 10% de la surface.
  • Choisir des couleurs qui conviennent à l'ambiance que vous désirez donner à votre site. Par exemple, les couleurs pastel rappellent normalement la douceur, les couleurs vives ou néon rappellent la jeunesse ou le dynamisme, tandis que les couleurs neutres donnent un air plus sérieux.

2. Bien choisir ses polices.

Les polices décoratives sont généralement bien jolies, mais rarement pratiques. Elles sont souvent plus difficiles à lire et ne conviennent pas à toutes les situations. 

Pour bien choisir une police, nous vous conseillons de miser sur la lisibilité et la fonctionnalité. Les polices gratuites serif et sans-sérif, comme Cardo ou Roboto sont habituellement utilisées sur le web pour leur bonne lisibilité et leur aspect moderne. Ces polices contiennent un grand nombre de variante ce qui vous permet de décliner votre charte graphique de différentes façons. N'oubliez pas que votre police doit être en harmonie avec le design global de votre entreprise.

Vous avez besoin d'avoir un aperçu global d'un panel de polices ?

Nous vous suggérons d'aller faire un tour sur Google Fonts, service d’hébergement gratuit de polices d’écritures sous licences libres pour le Web.

3. Bien choisir ses médias.

Bien sûr, les photos et les vidéos ajoutent beaucoup d’attrait visuel à votre site web.

Nos conseils :

  • Vous assurer que ces supports soient de bonne qualité car les photos floues enlèvent beaucoup de professionnalisme à votre site.
  • Pour embellir votre page d'accueil grâce à une grande photo d'arrière plan, vous devez avoir une photo assez grande et de très bonne qualité lorsqu'elle sera plein écran pour éviter qu'elle soit dénaturée.

4. Ne pas surcharger.

Pour bien mettre en valeur l’information que vous désirez transmettre, nous vous conseillons d'épurer votre contenu. Bien qu'il soit tentant de remplir tout l’espace disponible avec le plus d’information possible, cela n’aidera pas votre utilisateur à trouver l’information qu’il recherche rapidement. Il est mieux de s’en tenir aux informations plus importantes, et à bien structurer votre contenu. De plus, n’ayez pas peur de laisser des espaces blancs, cela laisse respirer votre mise en page et met le reste des informations encore plus en valeur.

5. Être constant.

Votre site internet doit être en cohésion avec l’image de votre marque. On doit se sentir dans le même univers que votre logo ou votre carte de visite. De plus, pour sentir une cohésion entre les pages, on doit retrouver environ le même type de mise en page, les mêmes alignements et une structure similaire pour que l’utilisateur sache qu’il est dans le même site web.

Nous vous conseillons de :

  • Mettre en place une charte graphique. Celle-ci vous permettra de garantir l’homogénéité et la cohérence de la communication visuelle sur l'ensemble des pages de votre site web.
  • Utiliser le design UX  (User eXperience = Expérience de l'utilisateur). L’UX prend en compte les attentes et les besoins de l’internaute pour l’amener à concrétiser son action, le tout sans trop d’effort et dans un environnement agréable, fluide, rassurant. Le but étant de faciliter la vie de l’internaute pour qu’il atteigne facilement son objectif (achat, recherche d’informations…).
  • Utiliser le design UI (User Interface = Interface pour l'utilisateur). L’UI intervient plusieurs fois dans le processus UX. Il s’agit effectivement de proposer une jolie enveloppe et donc de créer un design fonctionnel, qui inspire confiance et qui permette à l’utilisateur d’arriver à son but

Prenons un exemple avec un objet de la vie courante :

  • Produit : Une voiture, plus précisément une Porsche. 
  • Utilisateur : Le conducteur (utilisateur principal, mais par extension, les passagers aussi, s'il y en a).
  • Interface UI : L'intérieur de la voiture : là où il y a ce dont vous avez besoin pour l'utiliser, conduire la voiture.

Le siège, le tableau de bord, le volant, les pédales et le levier de vitesse sont des signifiants qui forment (tous ensemble) l'interface UI; c'est ce qui vous permet de conduire. Cela dit, il y a d'autres choses qui permettent à la voiture d'avancer, et dont vous n'avez pas besoin de vous préoccuper : c'est la partie cachée de l'iceberg (UX).

  • Expérience UX : conduire la voiture.

Si le siège est confortable, si le bruit du moteur et le contact de vos mains sur le volant sont agréables, si la voiture est belle (ou en tout cas, qu'elle vous représente, donne une bonne image de vous), si les sensations sont fortes, que les freins sont efficaces, que la direction est assistée, etc., alors votre expérience globale est positive !

6. S’assurer d’avoir une bonne lisibilité.

Avant tout, le design de votre site web doit mettre en valeur votre contenu. Il ne doit pas distraire votre utilisateur.

Nos conseils :

  • Avoir un bon contraste entre la couleur de la police et la couleur de votre fond pour une bonne lisibilité. Si vous décidez d'utiliser une photo comme arrière-plan, vous aurez plus de difficulté à y ajouter du texte dessus.
  • Pour conserver une bonne lisibilité, votre texte devra être plus gros et plus contrastant que sur un fond uni. Assurez-vous que l'information que vous désirez communiquer est bien mise en valeur, pour que votre utilisateur n'ait pas à fouiller très longtemps pour trouver ce qu'il cherche.

Ces quelques conseils d'optimisation de votre site vous permettront d'améliorer la navigation des visiteurs sur vos différentes pages et ce, sur différents supports. Vous diminuerez ainsi votre taux de rebond, ce qui favorisera également votre positionnement dans Google.

Partager cet article

Les autres ateliers