6 conseils de conception Web pour créer des sites Web réussis (avec exemples)

Cet article invité sur les conseils de conception Web est fourni par Ian Loew, entrepreneur Web, expert en marketing entrant et propriétaire et responsable du développement commercial de Lform Design.

Saviez-vous qu'une entreprise pouvait perdre un grand pourcentage de ses clients si la conception de son site Web était trop complexe et difficile à naviguer ? En fait, 38 % des clients potentiels et existants passeront à une autre marque concurrente au lieu d'interagir avec un site Web mal conçu. Cette statistique rend les conseils de conception Web essentiels pour quiconque crée des sites Web pour ses clients.

Commencez à diversifier votre source de revenus. Obtenez dès maintenant votre « Guide en 6 étapes pour vendre des services de site Web aux entreprises locales ».

La plupart des clients ne reviendront pas sur un site Web après leur première mauvaise expérience d'utilisation. Par conséquent, avant de mettre en ligne la première fois, configurez vos clients pour qu'ils réussissent.

Voici les meilleurs conseils de conception Web à garder à l'esprit lors de la conception d'un site Web :

1. Navigation facile
2. Images de haute qualité
3. Conception simple de la page d'accueil
4. Boutons de partage social et de suivi
5. Conception adaptée aux mobiles
6. Contenu scannable

Plongeons plus profondément dans ces conseils de conception Web.

1. Navigation facile

La navigation est l'une des caractéristiques essentielles d'un design réactif. Techniquement, toutes les pages Web que vous voyez aujourd'hui ont une barre de navigation, qui comprend généralement des éléments de menu, une barre de recherche et probablement un menu hamburger pour les appareils mobiles.

Les visiteurs doivent pouvoir accéder aux liens vers toutes les pages de niveau supérieur en un seul endroit. Cela leur évitera une chasse inutile, ce qui augmente le taux de rebond de votre site Web. Découvrez la page d'accueil de Vendasta ci-dessous et comment la barre de navigation est bien organisée pour aider les visiteurs à trouver la ressource dont ils ont besoin.

La source

Envisagez également d'utiliser des options déroulantes pour les listes de sous-menus.

Si vous concevez un site Web de commerce électronique ou de divertissement, vous devrez gérer de nombreuses sous-catégories ou listes de sous-menus. Créez des catégories génériques en haut, puis placez les sous-catégories dans un menu déroulant, comme indiqué ci-dessous.

La source

Revenir au début d'une page Web peut être un gros problème. Rendez service à vos visiteurs en ajoutant le bouton d'action "Retour en haut". Pour la réactivité mobile, utilisez une icône évolutive, de préférence une étiquette "flèche vers le haut", comme indiqué par les astuces CSS ci-dessous.

La source

Bien que les menus déroulants soient très utiles pour créer une barre de navigation réactive, ils ne peuvent pas afficher tous les liens de votre site Web sans avoir l'air désordonné. Utilisez donc un méga pied de page pour afficher des liens supplémentaires en bas :

L'essentiel est que vous devez créer une navigation facile pour améliorer l'expérience utilisateur. Cela va booster les sessions sur le site. De plus, cela peut augmenter les ventes puisque les clients potentiels trouveront toujours ce qu'ils recherchent.

2. Ajoutez des images de haute qualité

Les images peuvent être utilisées comme un élément important pour engager les clients ou les visiteurs sans avoir besoin de beaucoup de contenu textuel. Ils peuvent également vous aider à améliorer votre classement de recherche sur les moteurs de recherche.

Par exemple, Google a une section de recherche qui permet aux utilisateurs de voir les résultats des images. Si les images du site Web sont optimisées avec les bonnes balises alt, elles peuvent apparaître dans ces résultats.

Il y a certaines choses que vous devez garder à l'esprit lorsque vous ajoutez des images à un site Web :

Chaque section d'un site Web reflète le professionnalisme du propriétaire. L'ajout d'images de mauvaise qualité à votre site Web fera plus de mal que de bien. Les images floues nuisent à l'expérience utilisateur. C'est pourquoi vous avez besoin d'images haute résolution.

Conseil de pro : utilisez des fichiers JPEG pour une compression d'image efficace et un chargement rapide.

Un autre conseil de conception Web dont vous devez vous souvenir est que les humains sont plus sensibles aux illustrations visuelles qu'au texte. Évitez donc les photos d'archives et utilisez des images qui ajoutent de la valeur au contenu. Vos images doivent prendre en charge la copie. C'est pourquoi l'utilisation de captures d'écran, d'illustrations et de vidéos est une pratique standard de conception de sites Web B2B.

La page d'accueil de Slack en est un excellent exemple :

La source

Soyez précis avec les balises alt utilisées pour chaque image que vous ajoutez. Comme indiqué précédemment, cela pourrait aider l'optimisation des moteurs de recherche (SEO) d'un site Web.

L'utilisation d'images volumineuses avec des tailles de fichier excessives peut affecter le temps de chargement d'un site. Donc, un bon conseil de conception Web consiste à compresser et à utiliser des charges paresseuses. De plus, certains services d'hébergement Web peuvent réduire le temps de chargement de votre site Web en fournissant les outils d'optimisation d'image nécessaires, contribuant ainsi à une bonne expérience mobile pour vos visiteurs.

3. Gardez la page d'accueil libre et simple

La façon dont les visiteurs interagissent avec un site Web dépend de leur première impression après avoir atterri sur la page d'accueil. Par conséquent, toute page d'accueil que vous concevez pour les clients doit être soignée. Les menus doivent être clairs et cliquables. Utilisez suffisamment d'espace blanc pour vous assurer que les éléments importants se démarquent. Ajoutez des images de haute qualité et attrayantes pour soutenir la copie. Évitez également les gros morceaux de texte.

Freshbooks l'obtient bien avec cette page d'accueil.

La source

Voici d'autres conseils de conception Web pour vous aider à créer une excellente page d'accueil :

• Les éléments esthétiques sont inestimables

L'importance d'ajouter des éléments visuellement attrayants ne peut pas être surestimée. Tout en gardant votre page d'accueil simple, assurez-vous d'utiliser des images de haute qualité, des couleurs vives, des illustrations verticales et des icônes partout où cela est nécessaire.

• Personnalisez votre page d'accueil avec des polices impressionnantes

Utilisez des polices simples mais attrayantes. Mélanger sans-serif et empattements peut perturber la cohérence de la police de votre page et rendre votre contenu difficile à lire.

Une autre chose à garder à l'esprit est la taille de votre police. Une taille de police de 16 pt est assez appropriée, même pour les personnes ayant des difficultés visuelles.

Évitez également d'utiliser plus de trois types de polices.

4. Inclure les boutons de partage social et de suivi

Environ 4,14 milliards de personnes utilisent les médias sociaux. C'est plus de la moitié de la population mondiale. Par conséquent, il est fort probable que le public cible d'un client utilise les médias sociaux.

Incluez donc des boutons de partage social pour encourager les visiteurs existants du site Web à partager le contenu du site Web avec d'autres sur les réseaux sociaux. Cette astuce de conception Web est particulièrement essentielle pour les blogs de commerce électronique et de marketing.

Certains des boutons de médias sociaux les plus utilisés sont Twitter, Facebook, WhatsApp et LinkedIn.

Placez les boutons sociaux et de suivi dans des zones visibles, comme le haut et le côté gauche de votre page. Un autre emplacement stratégique se trouve à la fin de vos articles de blog ou sur une barre collante.

La source

L'ajout de boutons de suivi pour les poignées de médias sociaux peut également être placé dans la section de pied de page, comme DocuSign ci-dessous.

La source

Assurez-vous de décrire le but des boutons sociaux. Si les icônes sont destinées au partage social, signalez-le. S'ils sont destinés à suivre les comptes de médias sociaux de la marque, mentionnez que les visiteurs du site peuvent suivre la marque sur les réseaux sociaux. Ceci est particulièrement important si les icônes ne se trouvent pas dans le pied de page.

5. Pages adaptées aux mobiles

Vous pourriez être surpris d'apprendre que 61 % des internautes abandonneront un site Web qui n'est pas adapté aux mobiles. Ceci est crucial compte tenu du passage à l'utilisation d'appareils mobiles pour accéder à Internet. Par conséquent, les concepteurs doivent optimiser les pages Web pour les appareils mobiles afin de fidéliser les visiteurs et d'offrir une expérience utilisateur exceptionnelle.

Procédez comme suit pour optimiser un site Web pour une utilisation mobile :

• Utilisez une image de héros évolutive et des icônes esthétiques

Utilisez une image de héros différente pour votre contenu mobile et limitez les fonctionnalités disponibles tout en conservant la pertinence. Privilégiez l'utilisation d'icônes évolutives comme un menu hamburger pour la navigation déroulante. Un menu hamburger est une icône en forme de sandwich qui ouvre un menu latéral ou une barre de navigation lorsque vous cliquez dessus.

• Gardez le contenu mobile simple

La simplicité est toujours l'un des conseils de conception Web les plus importants à garder à l'esprit. Sur la page mobile, gardez les choses simples. Réduisez la quantité d'informations empilées sur une seule page mobile. Assurez-vous également que toutes les informations sur les pages Web, y compris les images, peuvent être visualisées correctement via un appareil mobile.

• Privilégier la vitesse

Les pages adaptées aux mobiles ne doivent pas seulement être belles et évolutives. Ils devraient charger plus rapidement sans accroc. Vous pouvez réduire manuellement les images et le code pour atteindre une vitesse plus rapide. Alternativement, vous pouvez utiliser des plugins de vitesse pour les sites Web WordPress pour améliorer la vitesse du site. La beauté de l'optimisation des vitesses de chargement d'une page Web est que cela profitera également au référencement. Google a confirmé que la vitesse du site est un facteur de classement car elle affecte l'expérience utilisateur.

6. Créez du contenu scannable

L'un des meilleurs conseils de conception Web que vous devez connaître est de créer du contenu scannable. Lorsqu'une personne visite le site Web de votre client, cela devrait prendre moins de quelques secondes pour parcourir le contenu à l'écran. La plupart des utilisateurs appuieront probablement sur le bouton de sortie si la numérisation prend plus de temps.

Pour éviter cela, vous devez implémenter une hiérarchie visuelle flexible. Les utilisateurs doivent être en mesure de localiser les informations dont ils ont besoin et de concentrer leur énergie sur cette lecture. De plus, une excellente hiérarchie visuelle devrait guider les utilisateurs des sections les plus critiques vers le bas de la page.

Gardez ces conseils de conception Web à l'esprit pour créer du contenu scannable :

• Divisez le contenu en puces ou utilisez des en-têtes (H1, H2, H3, H4 et H5)
• Utilisez le poids visuel pour présenter les sections essentielles. Vous pouvez utiliser une couleur d'arrière-plan ou de texte différente pour mettre en évidence un élément essentiel du reste.
• Incluez un appel à l'action ou plusieurs options de navigation afin que les utilisateurs ne soient pas laissés vides après avoir atteint la fin de la page Web.

Une bonne pratique consiste à utiliser une taille de police plus grande pour le texte du héros et à réduire progressivement à des tailles plus petites pour le corps du site Web.

Vendez plus de sites Web avec ces conseils de conception Web

Les utilisateurs n'ont besoin que de quelques secondes pour se forger une opinion sur un site Web. Lorsque vous vendez des sites Web à des entreprises locales, votre objectif est de vous assurer que cette impression favorise l'entreprise de votre client. Pour y parvenir, vous devez suivre plusieurs conseils de conception Web. Nous avons discuté de six de ces conseils dans cet article.

Assurez-vous que les sites Web que vous créez pour les clients sont faciles à naviguer, visuellement attrayants, partageables et adaptés aux mobiles. Il est important de noter que la page d'accueil et les autres pages de destination doivent être simples et scannables pour donner aux visiteurs une bonne première impression.

Mettez en œuvre ces conseils de conception Web pour vendre et créer des sites Web très attrayants que vos clients et leurs clients adoreront.