Web design: comment améliorer le design de votre site web

Alors que la question du design d’un site web a un impact direct sur l’expérience de l’utilisateur (UX), elle joue aussi un vrai rôle sur votre Business. En effet, améliorer le design de votre site web peut vous aider à exploiter votre trafic pleinement, à faire naviguer vos visiteurs efficacement d’une page vers une page de produits, à acquérir des abonné(e)s à votre newsletter, et d’une manière générale à augmenter votre taux de conversion. Alors sans plus attendre, je vous partage dans cet article quelques uns des principaux conseils de web design – faciles à mettre en place quand on est solopreneur(e) – et qui vous permettront de réussir votre site internet pro.

Bien choisir la palette de votre site web

Avant même qu’un internaute lise un seul mot de votre site web, il commence déjà à se forger une opinion sur votre site, qui est largement influencé par la perception de votre palette de couleurs. En fait, la palette de couleurs d’un site web en donne le ton, en quelque sorte, et constitue un élément essentiel du design d’un site internet.

Exemple
des couleurs pastel auront généralement un effet plus apaisant sur un visiteur qu’une palette de couleurs saturées très « électriques », qui au contraire tendra plutôt à inviter l’internaute à passer à l’action

Les couleurs ont donc une symbolique qu’il est nécessaire de prendre en considération pour optimiser votre palette de couleurs et mettre en confiance votre audience-cible. Pour cela, l’utilisation d’un générateur de palette de couleurs seulement n’est malheureusement pas suffisante. C’est pourquoi, j’ai rassemblé toutes les étapes pour créer une palette de couleurs professionnelle et réussie, pas-à-pas, dans cette méthode pratique:

TÉLÉCHARGEZ LE GUIDE PRATIQUE GRATUIT POUR CRÉER LA PALETTE DE COULEURS DE VOTRE SITE AVEC SUCCÈS.

Créer une expérience utilisateur réussie en veillant à une bonne accessibilité de votre site

Un design de site web performant doit notamment pouvoir permettre à un utilisateur qui ne connaît pas le site de comprendre rapidement comment s’orienter sur le site. Voici donc les quelques points à considérer pour améliorer l’accessibilité du design de votre site web:

01 –  Faciliter l’accessibilité au contenu clé

Il est évident que si la page du produit-phare que vous vendez se trouve très enfouie dans l’arborescence de votre site, elle sera bien moins accessible que si elle en était la page d’accueil. Si le design de l’architecture d’un site dépasse en soi le cadre stricto sensu du web-design, je l’aborde tout de même brièvement ici parce que c’est un élément qui a un impact majeur sur l’expérience utilisateur (UX) de votre visiteur.

Astuce design de site web
Toute page qui se trouve à plus de 2 clics de la navigation principale est une page à considérer comme très peu accessible.

02 –  Simplifier la navigation sur le site pour améliorer l’expérience utilisateur

La barre de navigation principale doit être bien visible et surtout le menu doit être lisible car c’est grâce à ces éléments que l’internaute peut s’orienter. Pour cela, il est conseillé de limiter le nombre de liens du menu principal. Si vous avez beaucoup de pages à lier, vous pouvez alors, par exemple, limiter le nombre de liens du menu principal au “minimum vital”, et créer une navigation dans votre pied de page (“footer”) ou en barre latérale avec l’ensemble de vos liens.

03 –  Bien choisir le type de menu pour améliorer le design de votre site web

Peut-être que comme moi, vous adorez voir l’esthétique des menus dits “menus hamburger” (voir exemple ci-dessous), alors pourquoi ne pas craquer pour eux et les implémenter sur son propre site? En fait, il est recommandé de les utiliser avec parcimonie parce que les internautes, eux, ne les apprécient pas forcément, comme le montre les résultats de l’expérience que je vous rapporte sur l’infographie ci-dessous.

Donc, pour améliorer le design de votre site web, vous pouvez par exemple

  •  1   utiliser les “menus hamburger” pour vos visiteurs utilisateurs de smartphones et de tablettes
  •  2   les remplacer par une barre de navigation classique pour les utilisateurs d’ordinateurs (desktop)

Chaque type d’utilisateur pourrait donc ainsi trouver la navigation fluide qu’il recherche pour découvrir les pages de votre site. D’ailleurs cela me conduit à vous parler tout de suite d’un autre conseil important pour le design de votre site internet:

Travailler la lisibilité de vos pages (et améliorer en même temps votre taux de conversion!)

Améliorer la lisibilité de vos pages est le point sur lequel vos objectifs Business et ceux de vos visiteurs se rejoignent. Effectivement, l’internaute a besoin de comprendre rapidement l’action qui est attendu de lui/elle (lire ou cliquer, etc…) d’une part, et d’autre part avoir un call-to-action clair sur vos pages est certainement ce qui vous aidera à booster vos taux de conversions (acquérir des abonné(e)s, convertir vos visiteurs en client(e)s, etc…).

Quelques pistes pour améliorer la lisibilité de vos pages:

N

Vérifier que la largeur de vos lignes est limitée pour éviter des lignes trop longues sur les écrans de grande taille
Une largeur de ligne de 500 à 900 px est généralement plus agréable à lire.

N

Choisir des typographies qui sont bien lisibles – même sur les petits écrans
En particulier, les polices de type manuscrites peuvent avoir une lisibilité limitée. Et assurez-vous aussi d’opter pour une taille de police suffisamment grande – autour de 16 pixels, c’est souvent proche de la taille optimale

20 pixels
Boucle d’or voulut s’asseoir sur la grande chaise, mais voilà: la grande chaise était trop large.

16 pixels
Elle essaya la moyenne chaise, mais crac… la moyenne chaise n’avait pas l’air solide.

12 pixels
Enfin elle s’assit sur la toute petite chaise, et la toute petite chaise était tout à fait juste.

N

Bien hiérarchiser l’information pour simplifier la navigation
Une bonne structuration de l’information permet à votre visiteur une navigation fluide sur vos pages et l’aide à comprendre rapidement ce que vous voulez qu’il fasse – ex: s’abonner à votre newsletter ou cliquer pour acheter un produit.
Pour cela, il est bon de:

  • scinder le contenu en sections et paragraphes pour le rendre plus digeste
  • bien mettre en avant les titres (ex. avec de la couleur ou une taille de police plus grande) pour renforcer la structuration de la page
  • éviter d’avoir de multiples call-to-action par page pour éviter le phénomène de confusion dont je parle dans l’article “3 éléments de distraction à éviter sur son site pour un meilleur taux de conversion”. Vous y trouverez d’ailleurs d’autres conseils pour optimiser vos pages web et booster votre Business
Comment améliorer son taux de conversion en éliminant les éléments de distractions visuelles de son site

Choisir des visuels de qualité pour votre site interne

Les images sont un levier à ne pas négliger quand on cherche à améliorer le design de son site web. Ce n’est effectivement pas pour rien que le magazine bien connu parle du “choc des images” dans sa promotion: les visuels jouent en effet un très grand rôle sur la perception des gens par le message qu’elles peuvent véhiculer.

Assurez-vous de sélectionner des images de qualité pour votre site web (il le vaut bien!):

N

les images sont nettes et de préférence bien cadrées

N

le sujet de l’image illustre bien le texte qu’il accompagne pour justement obtenir cet effet “choc”

N

le style des images est homogène et en accord avec l’image de marque de votre site web

L’idéal est évidemment d’avoir les propres photos de sa marque. Mais si vous débutez et que vous n’avez pas d’autres choses que les images gratuites, ne vous inquiétez pas vous pouvez les personnaliser pour donner une unité à votre image de marque. Vous trouverez dans cet article « 9 idées pour personnaliser des images (même gratuites) » et vous créer une image de marque distinctive qui se démarque et vous ressemble.

comment se demarquer reseaux sociaux avec images gratuites

Vérifier que le design de votre site est bien responsive

C’est en fait un sujet dont je parle assez souvent sur le site, mais je ne pouvais évidemment pas finir cet article qui parle d’améliorer le design de son site web sans évoquer la nécessité de vous assurer d’avoir un site responsive… En effet, un design responsive, c’est un design qui s’affiche correctement sur tous les types d’écran (téléphones mobiles, tablettes et ordinateurs).

Ne pas vérifier que votre site est responsive, c’est donc prendre le risque de ruiner des heures d’efforts à en travailler le design. Et ne croyez pas que des affichages aberrants sont rares, au contraire, c’est même plutôt très fréquent si l’on ne prend pas soin de faire les vérifications nécessaires. Malheureusement, il ne suffit pas de juste jeter un rapide petit coup d’œil à votre site depuis votre smartphone pour en vérifier l’affichage. En fait, je vous ai préparé un petit tutoriel simple et rapide pour y parvenir et vérifier que votre site s’affiche comme l’avez prévu pour tous vos visiteurs:

Téléchargez gratuitement le TUTORIEL pour contrôler le design responsive de votre site dans tous les navigateurs et sur tous les écrans
(Chrome, Firefox, Safari, Opéra, Edge etc.. pour téléphones, tablettes et ordinateurs)

Cliquez pour lire le tutoriel gratuit

et vous assurez de réussir le design de votre site web en toutes circonstances…

Conclusion

Améliorer le design de votre site web est un processus itératif auquel vous devrez revenir de temps en temps, pour le faire évoluer avec le développement de votre activité, mais aussi dans une certaine mesure avec les tendances. Ne vous découragez pas, surtout s’il y a beaucoup de choses à faire sur votre site, le jeu en vaut vraiment la chandelle: une meilleure expérience utilisateur (UX) c’est aussi un bon moyen de mieux convertir votre trafic et de booster votre Business. Et puis n’oubliez pas que “Rome ne s’est pas construite en un jour”. Alors j’espère qu’avec les 5 étapes que nous avons passées en revue dans cet article, vous avez maintenant une vue d’ensemble des grands axes sur lesquels focaliser vos efforts pour créer le site web à l’image professionnelle dont vous avez besoin pour réussir. Et c’est à vous de jouer!

1ère mise en ligne de l’article: mai 2020

LIRE D’AUTRES ARTICLES

3 distractions à éviter pour améliorer sont taux de conversion

3 éléments visuels de distraction à éviter sur votre site pour un meilleur taux de conversion…
Lire plus…

17 outils gratuits générateurs de palettes de couleurs pour un site web réussi…
Lire plus…

améliorer la lisibilité de ses articles de blog en 3 étapes

Comment améliorer la lisibilité de vos pages web et articles de blog…
Lire plus…

Entrez votre email pour accéder au contenu exclusif: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, la procédure est aussi simple que de cliquer sur un lien... :)

DIGITAL TWISP | sauvegarder son site wordpress

Cliquez pour accéder au tutoriel gratuit:

"Comment faire une sauvegarde automatique de son site Wordpress dans Google Drive (Dropbox, etc...)"

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

GUIDE PRATIQUE: comment bien choisir sa palette de couleurs

Cliquez pour accéder au guide gratuit:

"Comment bien choisir sa palette de couleurs pour un site web réussi..."

> astuces pour bien choisir la couleur de base de sa palette
> comment concevoir une palette cohésive pour son site
> un exemple pratique de la conception d'une palette de couleurs pour une site pro

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Cliquez pour recevoir tous les conseils et articles en avant-première:

Productivité. Organisation. Lifestyle.
Donner le meilleur de vous-même sans ruiner votre santé

Un grand Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

Vous recevrez directement et immédiatement le guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

trouver le nom de blog idéal | GUIDE COMPLET

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

> nombreuses techniques créatives pour vous inspirer
> la liste des critères pour trouver un nom de blog que vous ne regrettez pas
> des outils performants pour vous aidez à trouver le nom de domaine unique dont vous avez besoin
> des conseils pour bien choisir votre extension de nom de domaine

>> Vous allez directement et immédiatement recevoir ce guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

Vous recevrez directement et immédiatement le guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

GUIDE PRATIQUE: comment bien choisir sa palette de couleurs

Cliquez pour accéder au guide gratuit:

"Comment bien choisir sa palette de couleurs pour un site web réussi..."

> astuces pour bien choisir la couleur de base de sa palette
> comment concevoir une palette cohésive pour son site
> un exemple pratique de la conception d'une palette de couleurs pour une site pro

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Entrez votre email pour accéder au contenu exclusif: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, c'est très simple.

DIGITAL TWISP | sauvegarder son site wordpress

Cliquez pour accéder au tutoriel gratuit:

"Comment faire une sauvegarde automatique de son site Wordpress dans Google Drive (Dropbox, etc...)"

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Liste de 53 sites d'images gratuites à usage commercial

Cliquez pour télécharger le fichier PDF:

"Liste de 53 sites d'images gratuites à usage commercial !!"

>> Vous y trouverez des images dans à peu près tous les domaines: business, lifestyle, santé, sport, cuisine, voyage, famille, animaux etc…

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Cliquez pour recevoir votre checkliste au format PDF:

"9 points-clés SEO à vérifier avant de publier pour bien optimiser vos articles"

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Cliquez pour recevoir votre web-magazine:

LES "EXCLUSIVES"

>> Vous allez tout de suite recevoir un email de confirmation avec l'un des précédents numéros du web-magazine - qui contient un bonus, petite surprise de bienvenue, qui sans aucun doute va vous faire plaisir…

Puis vous recevrez 1x / mois le web-magazine avec possibilité de désabonnement en bas de chaque email

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

GUIDE PRATIQUE: comment bien choisir sa palette de couleurs

Cliquez pour accéder au guide gratuit:

"Comment bien choisir sa palette de couleurs pour un site web réussi..."

> astuces pour bien choisir la couleur de base de sa palette
> comment concevoir une palette cohésive pour son site
> un exemple pratique de la conception d'une palette de couleurs pour une site pro

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

DIGITAL TWISP | sauvegarder son site wordpress

Cliquez pour accéder au tutoriel gratuit:

"Comment faire une sauvegarde automatique de son site Wordpress dans Google Drive (Dropbox, etc...)"

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Entrez votre email pour accéder au contenu exclusif: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, c'est très simple.

trouver le nom de blog idéal | GUIDE COMPLET

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

> nombreuses techniques créatives + des outils performants pour vous aidez à trouver le nom de domaine unique dont vous avez besoin
> la liste des critères pour trouver un nom de blog que vous ne regrettez pas
> des conseils pour bien choisir votre extension de nom de domaine

>> Vous allez directement et immédiatement recevoir ce guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

Cliquez pour recevoir votre web-magazine:

LES "EXCLUSIVES"

>> Vous allez tout de suite recevoir un email de confirmation avec l'un des précédents numéros du web-magazine - qui contient un bonus, petite surprise de bienvenue, qui sans aucun doute va vous faire plaisir…

Puis vous recevrez 1x / mois le web-magazine avec possibilité de désabonnement en bas de chaque email

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

trouver le nom de blog idéal | GUIDE COMPLET

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

> nombreuses techniques créatives + des outils performants pour vous aidez à trouver le nom de domaine unique dont vous avez besoin
> la liste des critères pour trouver un nom de blog que vous ne regrettez pas
> des conseils pour bien choisir votre extension de nom de domaine

>> Vous allez directement et immédiatement recevoir ce guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

Entrez votre email pour accéder à votre PLAN D'ACTION gratuit: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, c'est très simple.

trouver le nom de blog idéal | GUIDE COMPLET

Entrez votre email et recevez gratuitement le guide "Trouver un nom de blog idéal"

> nombreuses techniques créatives + des outils performants pour vous aidez à trouver le nom de domaine unique dont vous avez besoin
> la liste des critères pour trouver un nom de blog que vous ne regrettez pas
> des conseils pour bien choisir votre extension de nom de domaine

>> Vous allez directement et immédiatement recevoir ce guide sous format PDF dans votre boîte email.

Merci! Votre demande a bien été envoyée et vous allez recevoir un email dans un instant.

Entrez votre email pour accéder à votre PLAN D'ACTION gratuit: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, c'est très simple.

DIGITAL TWISP - Les Exclusives e-publication

Cliquez pour recevoir votre web-magazine:

LES "EXCLUSIVES"

>> Vous allez tout de suite recevoir un email de confirmation avec l'un des précédents numéros du web-magazine - qui contient un bonus, petite surprise de bienvenue, qui sans aucun doute va vous faire plaisir…

Puis vous recevrez 1x / mois le web-magazine avec possibilité de désabonnement en bas de chaque email

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Cliquez pour télécharger le tutoriel gratuit:

"Comment vérifier l'apparence de votre site web en toutes circonstances"

>> vous allez apprendre pas-à-pas comment vous assurer que l'affichage de votre site web est optimal pour tous vos visiteurs - quelque soit leur type d'écran ou leur navigateur Internet (Chrome, Safari, Firefox, etc...)

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

GUIDE PRATIQUE: comment bien choisir sa palette de couleurs

Cliquez pour accéder au guide gratuit:

"Comment bien choisir sa palette de couleurs pour un site web réussi..."

> astuces pour bien choisir la couleur de base de sa palette
> comment concevoir une palette cohésive pour son site
> un exemple pratique de la conception d'une palette de couleurs pour une site pro

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Entrez votre email pour accéder à votre PLAN D'ACTION gratuit: "Générer des visites immédiatement et durablement sur votre site"

Merci, votre demande a bien été envoyée. Vous allez recevoir un email dans un instant, avec les informations pour accéder au contenu exclusif. Ne vous inquiétez pas, c'est très simple.

Cliquez pour recevoir votre web-magazine gratuit:

LES "EXCLUSIVES"

>> Vous allez tout de suite recevoir un email de confirmation avec l'accès à votre webzine- qui contient des astuces et conseils pour préparer votre site pour l'été et pouvoir repartir du bon pied (checkliste PDF en BONUS)…

Puis vous recevrez 1x / mois le web-magazine GRATUITEMENT (no spams) avec possibilité de désabonnement en bas de chaque email

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

5 jours pour se lancer avec succès sur Pinterest

Cliquez pour accéder tout de suite à la FORMATION GRATUITE:

"5 jours pour vous lancer avec succès sur Pinterest..."

>> et découvrez comment optimiser votre profil Pinterest et booster votre trafic pouvoir rapidement faire profiter votre Business de trafic qualifié 

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

DIGITAL TWISP - Les Exclusives e-publication

Cliquez pour recevoir votre web-magazine:

LES "EXCLUSIVES"

>> Vous allez tout de suite recevoir un email de confirmation avec l'un des précédents numéros du web-magazine - qui contient un bonus, petite surprise de bienvenue, qui sans aucun doute va vous faire plaisir…

Puis vous recevrez 1x / mois le web-magazine avec possibilité de désabonnement en bas de chaque email

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

Cliquez pour accéder tout de suite à votre FORMATION GRATUITE:

"5 jours pour poser les bases solides de votre site web et vous lancer avec succès..."

>> et découvrez tout ce que vous devez savoir de A à Z pour préparer et installer votre site web et mettre toutes les chances de votre côté de pour réussir votre lancement

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

GUIDE PRATIQUE: comment bien choisir sa palette de couleurs

Cliquez pour accéder au guide gratuit:

"Comment bien choisir sa palette de couleurs pour un site web réussi..."

> astuces pour bien choisir la couleur de base de sa palette
> comment concevoir une palette cohésive pour son site
> un exemple pratique de la conception d'une palette de couleurs pour une site pro

Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email dans un instant.

le Billet pinterest

Cliquez pour recevoir chaque mois gratuitement dans votre boite email, votre chronique exclusive de veille Pinterest et bien plus:

Conseils, astuces et infos exclusives pour réussir sur Pinterest...

Un grand Merci ! Votre demande a bien été envoyée. Vous allez recevoir un email de confirmation dans un instant.

Share This