Nous classons nos produits sur la base de tests et de recherches rigoureux, mais nous tenons également compte de vos commentaires et des accords commerciaux conclus avec les fournisseurs. Cette page contient des liens d'affiliation. Information sur la publicité.
  1. Website Planet
  2. >
  3. Blog
  4. >
  5. Comment concevoir un site en 2024

Comment concevoir un site en 2024

Emma Ayres Emma AyresExpert en développement de site Web 11 Janvier 2024
11 Janvier 2024
Vous pensez pouvoir vous en sortir sans site web ? Réfléchissez-y à deux fois. Les clients ne s’attendent pas simplement à ce que votre entreprise ait un site web, ils veulent que ce site soit facile à utiliser et contienne toutes les informations dont ils ont besoin pour prendre une décision d’achat. Votre site web est responsable de la première impression, il ne faut donc pas se tromper.

Mais pas d’inquiétude, vous n’avez pas besoin d’avoir le budget pour engager un professionnel de la conception web. Si travailler avec un professionnel est toujours une option, ce n’est pas celle-ci que nous allons explorer. Grâce au gain de popularité des créateurs de sites DIY, concevoir un site magnifique et fonctionnel n’a jamais été aussi simple.

Cela dit, pour concevoir un site web de qualité, il ne suffit pas de choisir un thème sur un créateur de site, d’ajouter un peu de texte et de cliquer sur publier. Bien évidemment, les modèles préconçus rendent la création de site plus simple, mais il y a beaucoup de facteurs à prendre en compte avant de publier votre site web sur le net.

Après avoir passé des milliers d’heures à plancher sur des centaines de sites web de différents genres, nous avons appris les bases essentielles pour créer un site à la fois magnifique et fonctionnel. Continuez à lire pour apprendre à le faire vous-même, sans faire appel à des professionnels coûteux.

Définissez votre objectif

Tout comme pour le reste de votre entreprise, vous devez savoir exactement pourquoi vous créez un site web.

Dans leur forme la plus simple, il existe trois types de sites principaux : portfolios, magasins en ligne, sites de services professionnels. Les catégories sont assez claires, mais explorons-les un peu plus.

Wix Food Photographer template
Les sites de portfolio ou sites vitrine se concentrent sur ce qui démarque l’entreprise de la concurrence, sans directement vendre de produits ou de services
Les portfolios donnent des informations utiles sur votre marque sans directement vendre de produits ou de services. Il peut s’agir de simples CV d’une page, de la galerie en ligne d’un photographe, ou même un site d’entreprise non commercial. En général, tous les éléments d’un site portfolio visent à convaincre les visiteurs de contacter l’entreprise ou de se rendre dans ses locaux. Ces sites ne vendent pas de produits ou de services.

Wix Sportswear Store template
Les magasins en ligne se concentrent davantage sur la méthode de vente Awareness > Consideration > Decision (prise de connaissance, réflexion et décision)
Les magasins en ligne dirigent les utilisateurs vers l’achat de produit. Bien évidemment, ils décrivent aussi en quoi l’entreprise est différente des autres, mais ce n’est pas l’objectif principal. L’objectif principal est d’assurer la vente, ils sont donc généralement conçus pour ça. Ces sites sont un peu plus complexes que les sites vitrine, à cause de leur nature commerciale.

Wix template
Si les trois « types » de sites utilisent des mises en page similaires, leurs objectifs sont différents
Les sites de services professionnels sont créés pour que les utilisateurs réservent des services. Selon les services fournis, le site web ne devra pas forcément gérer les achats, et c’est pour ça que ces sites sont considérés comme appartenant à une catégorie différente. Ils n’ont pas forcément de fonctionnalité de e-commerce, mais ils ont un système de réservation.

Bien évidemment, il y a des exceptions à la règle. Par exemple, les professionnels indépendants peuvent proposer un site qui allie un portfolio à des services professionnels. Certains magasins en ligne peuvent également proposer des services, c’est juste pour illustrer que c’est l’objectif d’un site qui détermine son design.

Astuce de pro : faites des recherches sur vos utilisateursIl

faut tenir compte de ce que les utilisateurs souhaitent accomplir sur votre site. Ça peut être très simple, comme vouloir acheter un produit (ce qui facilite la vie aux magasins en ligne !). Ça peut également être plus complexe, comme vouloir être rassuré sur les services et leur rapport qualité prix. Connaître les objectifs de vos utilisateurs peut vous aider à choisir certains éléments du design de votre site.

Choisissez une plateforme pour votre site web

Il est temps de choisir une plateforme pour votre nouveau site web. Vous aurez deux options : utiliser un créateur de site ou l’héberger vous-même. Les créateurs de sites sont une excellente option si vous voulez une méthode simple et tout-en-un. Cela dit, vous pouvez toujours migrer votre site facilement si vous cessez d’utiliser les services du créateur de sites. Si vous voulez opter pour cette méthode, voici les plateformes que je recommande.

Wix Japanese Restaurant template
Les modèles de Wix sont entièrement personnalisables, n’ayez donc pas peur de choisir des options différentes de votre niche
Les créateurs de sites ont la réputation de toujours proposer le même modèle de base, en changeant les couleurs et les images, et en déclarant qu’il s’agit d’un modèle totalement différent. Pas Wix ! Wix propose plus de 850 modèles uniques, pour vous offrir de l’inspiration et une excellente base pour développer votre image de marque.

Vous bénéficierez aussi d’une liberté totale sur la personnalisation de chaque modèle. Si d’autres créateurs de sites vous forcent à placer chaque élément sur une grille, Wix vous permet de placer les éléments absolument où vous voulez. Mais ça n’a pas que des avantages, par contre.

Si vos modèles sont « mobile-responsive » (c’est à dire adaptés à l’affichage sur mobile), le niveau de personnalisation peut causer à certains éléments de ne pas être bien alignés. Vous devrez donc modifier la version mobile séparément pour vous assurer que tout fonctionne. Heureusement, ce n’est pas vraiment un problème, parce que l’éditeur de Wix est très intuitif et fonctionne avec un système glisser-déposer.

wix logo alt 2

Wix est maintenant disponible à seulement $11.00 par mois !

Ne ratez pas cette offre exceptionnelle !

7534 utilisateurs ont utilisé cette réduction

Fonctionnalités

  • Design alimenté par I.A. Si vous ne savez pas vraiment par quoi commencer, Wix peut vous aider. Décrivez votre entreprise, vos objectifs et ce à quoi vous voulez que votre site ressemble à la fonctionnalité Artificial Design Intelligence (ADI) de Wix et elle vous créera un modèle sur mesure (et personnalisable !) en seulement quelques minutes.
  • Outil de SEO (référencement naturel) intégré. Le Search engine optimization (SEO) est une partie intégrante du design, et sans lui, les utilisateurs ont du mal à vous trouver. Heureusement, Wix simplifie cet aspect de la création de site avec un outil intégré qui vous donne une liste de contrôle, pour optimiser chaque page pour les moteurs de recherche.
  • Mises en page des contenus prédéfinies. En plus des centaines de modèles, Wix offre des mises en page prédéfinies. Ça vous permet de concevoir un site professionnel sans devoir connaître les principes de design avancés.
  • Très bon abonnement gratuit. La version gratuite de Wix est très généreuse, et ne vous limite pas sur la personnalisation ou sur les fonctionnalités de design.
Découvrez comment concevoir un site exceptionnel sur Wix dans notre avis d’expert.

Modèles Plus de 870
Editeur en français
Design adapté aux mobiles
Autres fonctionnalités de design
  • Wix ADI
  • Editeur glisser-déposer intuitif
  • Mises en pages prédéfinies
  • Fonctionnalités supplémentaires disponibles dans son app store
Assistance en français
  • Centre d’assistance
  • Chat en direct
  • Rappel téléphonique
Prix de départ $16.00

2. Squarespace : de magnifiques designs préconçus

Squarespace Hales template
Les modèles Squarespace sont adaptés aux mobiles et appliquent tous les principes modernes de la conception web
Créer un site web avec Squarespace est un peu comme avoir un professionnel à vos côtés, qui s’assure que chaque élément s’aligne avec les principes modernes du design et que le site offre une expérience utilisateur exceptionnelle. Vous n’aurez pas énormément de liberté sur le design de votre site, mais c’est un avantage. Vous ne serez pas paralysé par les choix, et vous ne finirez pas avec un site qui ressemble à la page d’accueil de eBay dans les années 90.

Pour commencer, vous pouvez utiliser un modèle prédéfini, créer le vôtre, ou payer un designer Squarespace pour qu’il vous en fasse un. Heureusement, les 140 modèles Squarespace sont modernes, adaptés aux mobiles et personnalisable. Et vous n’aurez pas besoin de payer plus que votre abonnement mensuel pour un site web fonctionnel.

squarespace logo alt 2 1 1

Économisez jusqu'à $30.00 sur votre abonnement à Squarespace aujourd'hui !

De plus, obtenez un domaine gratuit pendant un an !

1137 utilisateurs ont utilisé cette réduction

Fonctionnalités

  • Des tonnes d’intégrations. En plus des blocs de contenus préchargés dans l’éditeur (qui fonctionne sur le modèle glisser déposer), Squarespace offre de nombreux blocs différents pour les besoins plus spécifiques, comme par exemple des blocs de réservation de table, de dates de tournées, de fichiers audios, de cartes Google Maps interactive, et plus encore.
  • Galerie d’images d’archives. Gagnez du temps pendant le processus de création en parcourant les images d’archives de Squarespace. Vous pouvez même acheter des images sans quitter l’appli.
  • Excellente assistance. En plus de l’équipe d’assistance réactive et bien informée, disponible par email et par chat, vous aurez également accès à un forum communautaire. C’est une excellente ressource pour trouver de l’inspiration et avoir les avis d’autres designers.
  • Créateur de logo gratuit. Le créateur de logos de Squarespace est relativement simple, mais assez efficace pour un outil gratuit. Il vous servira surtout si votre budget logo est très serré.
Lisez notre avis détaillé sur Squarespace pour voir le reste de ses fonctionnalités fantastiques.

Modèles Plus de 140
Editeur en français
Design adapté aux mobiles
Autres fonctionnalités de design
  • Blocs de contenus spécifiques à certaines niches
  • Modèles sur mesures des designers Squarespace
  • Créateur de logos gratuits
  • Fonctionnalités supplémentaires disponibles dans l’app store
Assistance en français
  • Base de connaissances
  • Email
Prix de départ $16.00

3. SITE123 : des designs simples adaptés aux débutants

SITE123 INFINITEA template
Les modèles de SITE123 sont conçus pour les entreprises qui veulent un site web minimaliste et sans fioritures
Si vous avez du mal à prendre des décisions (comme moi !), allez jeter un œil à SITE123. Les modèles de SITE123 peuvent sembler trop épurés, mais c’est le but. Quand l’interface n’est pas encombrée, vous pouvez créer un site qui va droit au but et qui est visuellement agréable.

Si tous les modèles sont personnalisables, ils utilisent le même design de base. Si vous cherchez un design de site totalement unique, SITE123 n’est pas la meilleure option pour vous. Par contre, il est parfait pour les gens qui veulent se familiariser avec les bases avant de se pencher sur des principes de design plus avancés.

site123 logo alt 2

Obtenez $40.00 de RÉDUCTION chez SITE123

Économisez $40.00 pour toute souscription du forfait annuel de SITE123

120 utilisateurs ont utilisé cette réduction

Fonctionnalités

  • Adapté aux mobiles. Peu importe à quel point vous personnalisez votre modèle, votre site SITE123 sera aussi beau sur mobile que sur ordinateur.
  • Des dizaines d’applis. Vous pouvez connecter des intégrations prédéfinies pour que votre site ait plus de fonctionnalités. Des blocs de calendrier pour les entreprises vendant des services aux tableaux de comparaison de prix, vous aurez tout ce dont vous avez besoin pour optimiser le design de votre site selon vos objectifs.
  • Un éditeur intuitif. Ne vous inquiétez pas si vous n’y connaissez rien en design web. L’éditeur de SITE123 est intuitif et facile à utiliser, et vous permet de créer un site sans aucune expérience.
  • Assistance 24/24 et 7/7. De l’aide est disponible en cas de problème. Vous pouvez contacter SITE123 sur son chat disponible 24/24 et 7/7, envoyer un email, ou utiliser son excellent Centre d’assistance pour obtenir des conseils.
Lisez notre avis complet sur SITE123 pour en savoir plus.

Modèles Plus de 270
Editeur en français
Design adapté aux mobiles
Autres fonctionnalités de design
  • Blocs de contenus spécifiques à certaines niches
  • Fonctionnalités supplémentaires disponibles dans son app store
Assistance en français
  • Base de connaissances
  • Chat en direct
  • Email
Prix de départ $12.80

4. Shopify : des designs modernes optimisés pour la vente

Shopify Shapes template
Les modèles payants de Shopify sont assez chers, mais ils sont magnifiques
Shopify est le choix idéal pour les magasins en ligne et les fournisseurs de services. En plus d’offrir un grand nombre de fonctionnalités de e-commerce, ses capacités de personnalisation vous permettent de créer un magasin en ligne (quasiment) unique. Je dis quasiment, parce que même si la personnalisation de votre page d’accueil est aussi variée que les autres options de cette liste, vos pages produits sont définies par le modèle choisi.

Et en parlant de modèles, vous aurez de nombreuses options avec Shopify. Il en offre plus de 120, mais seuls 12 d’entre eux sont gratuits. Si aucun d’entre eux ne vous convient, vous pouvez aussi importer l’un des milliers de modèles Shopify disponibles en ligne. De plus, Shopify vous donne accès au code de base de votre site web gratuitement, vous pourrez donc y ajouter du code sur mesure pour personnaliser encore plus le modèle selon vos préférences.

shopify logo alt 1

Économisez jusqu'à $25.00 sur votre abonnement Shopify !

Offre à durée limitée - À ne pas manquer !

357 utilisateurs ont utilisé cette réduction

Fonctionnalités

  • Adapté aux mobiles. Les designs de Shopify sont tous adaptés aux mobiles mais vous pouvez aussi modifier votre site sur votre appareil mobile. Vous aurez la certitude que votre design aura l’aspect voulu sur petit écran.
  • Compatibilité 3D. Offrez un aperçu réaliste de vos produits à vos visiteurs grâce à la prise en charge des modèles de produits en 3D Shopify.
  • Des milliers d’applications. Ajoutez à votre site des galeries sur mesure, des avis de vos clients sur les produits, des barres de recherche et bien plus encore. Avec ses dizaines d’options de fonctionnalités simples comme un bouton d’achat, vous trouverez forcément la solution idéale pour votre entreprise.
  • Liste de contrôle pour lancement rapide. Si c’est la première fois que vous concevez un site, Shopify vous guide avec une liste de contrôle personnalisée selon vos objectifs.
Apprenez comment créer un magnifique magasin en ligne dans notre avis d’expert sur Shopify.

Modèles Plus de 120
Editeur en français
Designs adaptés aux mobiles
Autres fonctionnalités de design
  • Modèles de produits en 3D
  • Blocs de contenus spécifiques à certaines niches
  • Fonctionnalités supplémentaires disponibles dans l’app store
Assistance en français
  • Centre d’assistance
  • Email
Prix de départ $29.00

Astuce de pro : créateurs de sites

Si les quatre options citées plus haut sont selon nous les meilleurs créateurs de sites du marché, il existe de nombreuses autres options. Si les marques mentionnées ne vous conviennent pas, consultez notre liste des 10 meilleurs créateurs de sites en 2024. Nous la mettons régulièrement à jour, vous pourrez donc forcément trouver une option adaptée à votre entreprise.

WordPress est une très bonne alternative

Les créateurs de sites ne sont pas la seule option. Héberger vous-même votre site web est une bonne alternative, parce que vous aurez plus de flexibilité sur le design et les performances. Mais ce n’est pas une option que je recommande aux débutants, puisqu’il faut un peu plus de connaissances techniques. Notre guide complet de l’auto-hébergement de votre site web peut vous aider à savoir quelle option est la mieux adaptée à vos besoins.

WordPress est ma recommandation numéro un pour les sites autohébergés. C’est un CMS (système de gestion de contenu ou content management system) open-source qui alimente 43 % des sites web existants, ce qui en fait l’une des plateformes les plus populaires. Et comme il s’agit d’une solution aussi populaire, il offre plus de 20 000 modèles, et des milliers d’autres sont disponibles dans des galeries externes. En plus de ça, vous pouvez afficher l’éditeur en français. Vous aurez également accès au code de votre site, pour modifier les éléments comme vous le souhaitez.

Si WordPress est gratuit, vous devrez payer l’hébergement. Heureusement, ce n’est pas aussi cher que ce qu’on pourrait penser. Notre fournisseur d’hébergement préféré, Hostinger, débute à, un tout petit prix mensuel pour 100 Go de stockage et la bande passante illimitée pour jusqu’à 100 sites WordPress. Vous aurez également droit à un nom de domaine gratuit pendant un an et un certificat SSL gratuit pour toute la durée de votre abonnement.

Astuce de pro : certificats SSL

Un certificat SSL est une signature numérique qui indique à un navigateur web que votre site utilise le protocole Secure Socket Layer pour crypter les données entre un serveur web et votre navigateur. Votre site web doit absolument avoir un certificat SSL valide. Ça évite les fuites de données coûteuses et protège votre réputation. Heureusement, la plupart des créateurs de sites et des hébergeurs offrent un certificat SSL gratuit, c’est la norme dans l’industrie.

Créer des pages pour votre site web

Si vous avez choisi de proposer un site à plusieurs pages, vous devrez ajouter des pages standards, que vos utilisateurs s’attendent à trouver. Ça ne veut pas dire que les sites d’une page n’ont pas besoin d’inclure les informations contenues dans ces pages, mais ce ne sera pas la même méthode. Voyons comment fonctionnent ces pages dans cet exemple de la galerie de modèles de Wix.

Page d’accueil

Votre page d’accueil est probablement la page la plus importante de votre site. Après tout, vous n’aurez qu’une seule occasion de faire une bonne première impression, et c’est le rôle de votre page d’accueil.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (16)
Votre page d’accueil doit ce concentrer uniquement sur ce que votre entreprise propose

Cette page n’a pas besoin de contenir des informations spécifiques, mais doit mettre en valeur votre logo et le nom de votre marque. Les meilleures pages d’accueil indiquent clairement ce que l’entreprise fait dès que possible (avant que les utilisateurs ne descendent sur la page). Vous pouvez aussi inclure des aperçus juste après, comme des témoignages, un lien vers votre galerie, ou un court paragraphe sur votre entreprise. La clé est d’inclure à votre page d’accueil des informations brèves et pertinentes.

À propos

La page À propos est l’endroit où vous pourrez décrire votre entreprise et ce qui la différencie de ses concurrents. C’est l’occasion d’entrer dans les détails sur ce que vous faites et le pourquoi du comment, pour rendre votre marque plus humaine et créer une connexion avec vos visiteurs.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (17)
Votre page À propos n’a pas besoin d’être longue, mais elle doit expliquer le « pourquoi » aux visiteurs
Une page À propos crée de la confiance. Elle rassure vos visiteurs sur le fait qu’il y a un humain (ou plusieurs !) de l’autre côté de l’écran, et que vous n’êtes pas une autre entité sans visage. Selon votre niche et votre industrie, ce sera peut-être la première page que vos visiteurs verront après votre page d’accueil.

Contact

Enfin, vous devez offrir à vos visiteurs un moyen de vous contacter. Votre page Contact doit se concentrer uniquement sur les différentes manières dont vos clients peuvent communiquer avec vous. Pas besoin d’inclure des informations sur l’entreprise à moins qu’il s’agisse des délais de réponses moyens, des heures d’ouverture ou un lien vers vos FAQ.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (18)
Votre page Contact ne doit pas contenir des informations autres que les infos de contact
Et au strict minimum, il faut offrir un formulaire de contact sécurisé. Il peut être personnalisé selon vos besoins, et vous pouvez mettre en place des champs obligatoires, ce qui veut dire que les clients peuvent soumettre le formulaire qu’une fois qu’ils ont fourni toutes les informations dont vous avez besoin pour répondre à leurs questions.

Pages facultatives

Il est très probable que votre entreprise ait besoin de pages supplémentaires. Le site web présenté comme exemple plus haut a des pages pour des formations, des conférences, d’autres expériences, un blog, et une zone réservée aux utilisateurs. Les magasins en ligne ont besoin d’un catalogue avec des pages produit individuelles, et les sites de portfolio auront besoin d’une galerie ou d’une page qui énumère les différentes missions accomplies par l’entreprise.

Il n’y a pas de limite au nombre de pages que vous pouvez ajouter à votre site web, et il est dur de vous suggérer un nombre sans connaître votre objectif. Je vous conseille de jeter un œil aux sites web de vos concurrents pour examiner leurs pages et les informations fournies.

Astuce de pro : la règle des 3 clics

Un principe essentiel du design important ici, la navigation à plat ou la règle des 3 clics : toutes les pages de votre site web sont accessibles en 3 clics maximum depuis votre page d’accueil. Moins un utilisateur aura besoin de cliquer pour accéder à une page, plus il accédera vite aux informations dont il a besoin. Si vous avez besoin de beaucoup de pages, il est judicieux d’ajouter des éléments comme des barres de recherche ou des menus déroulants pour aider vos visiteurs à naviguer sur votre site web.

Créer les éléments individuels du site

Passons aux choses sérieuses. Il est temps de mettre tout ce que nous avons appris en pratique. Voici les éléments clés d’un site web et les manières d’optimiser leur design.

En-tête et pied de page

Votre en-tête et votre pied de page sont, comme vous l’avez probablement deviné, les éléments qui se trouvent tout en haut et tout en bas de chaque page. Si ces éléments semblent simples, il ne faut pas vous méprendre. Les utilisateurs s’attendent à ce que votre en-tête et votre pied de page soient disposés d’une certaine manière. Vous pouvez prendre des risques partout ailleurs, mais pour ces éléments-là, mieux vaut s’en tenir à ce qui fonctionne.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (19)
Si vous utilisez la version gratuite de Wix (comme moi), votre pied de page mentionnera que c’est Wix qui est à l’origine de votre site web
De plus, votre en-tête et votre pied de page doivent faire partie des éléments les plus simples de votre site web. Vos visiteurs ne veulent pas des éléments luxueux ou un design parfait, ils veulent trouver facilement les pages qu’ils cherchent. 88 % des utilisateurs ne retournent pas sur un site web après une mauvaise expérience, ne prenez donc pas de risques.

Avec tout ça en tête, concentrons-nous sur le menu de votre site web.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (20)
Quand je dis « non nécessaire », je veux dire les pages que vos utilisateurs ne chercheront pas en premier
Quand vous créez votre menu, pensez à Marie Kondo. Si les utilisateurs s’attendent à voir certaines pages dans votre menu, ils ne veulent pas voir toutes les pages de votre site listées dans le menu. Utilisez des sous-menus (comme des menus déroulants) pour grouper les pages de façon organisée.

Effets de défilement et mouvement

C’est un peu le principe « ça passe ou ça casse » avec ces éléments de design, mais parlons-en un peu. Quand on les utilise avec modération, les éléments animés peuvent très bien fonctionner, mais également causer des problèmes d’accessibilité. Je vous en parlerai plus en détail un peu plus loin.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (21)
Les effets de défilement ne sont pas disponibles sur tous les blocs de contenus, mais c’est une bonne chose qui permet de ne pas surcharger la page
L’effet de défilement le plus populaire sur les sites modernes est le défilement parallaxe. Avec cette animation, l’arrière-plan de votre site défile plus lentement que le texte au premier plan, ce qui ajoute de la profondeur au bloc de contenu. C’est une bonne manière d’attirer l’attention sur votre texte et ajouter un élément visuel à votre site. Cela dit, ce n’est pas toujours la meilleure manière d’ajouter du mouvement à votre site. Vous pouvez également utiliser des vidéos, de petites animations, ou des effets de défilement plus complexes, selon ce que vous voulez accomplir.

Texte, images et audio

Ces trois éléments représentent la majorité des contenus de votre site. Dans de nombreux cas, vous n’aurez pas besoin d’utiliser des fichiers audios, mais je les ai inclus ici parce qu’ils sont essentiels pour certaines entreprises. Assurez-vous simplement que les fichiers audio ne se lancent pas automatiquement, d’accord ? Tout le monde connait la panique que cause un fichier audio qui se lance automatiquement, donc si vous voulez que les gens restent sur votre site, mettez un bouton lecture sur le fichier audio.

Copy of Copy for Translation_ How To Design a Website __IMAGES__ (22)
Les textes générés automatiquement sont pratiques, mais n’oubliez pas de les modifier pour rester fidèle à votre marque !
Pour préserver l’équilibre, évitez d’ajouter trop de texte, ça peut perturber les utilisateurs. À la place, ajoutez des images au texte, et laissez des zones vides. Je ne dis pas que vous ne pouvez pas ajouter des gros pavés de texte dans les pages d’information, mais il est préférable de laisser un peu d’espace entre les textes pour que vos visiteurs puissent respirer.

Astuce de pro : vitesses de chargement

Selon Google, les chances qu’un utilisateur quitte votre site augmente de 32 % si votre temps de chargement passe d’une à trois secondes. Plus votre site met du temps à charger, moins les visiteurs restent pour voir quel genre d’entreprise c’est. Faites attention à la quantité de contenus ajoutée à chaque page, parce que ça aura un impact sur les délais de chargement.

Pensez à l’accessibilité

Vous avez probablement hâte de commencer à travailler sur votre site et de jouer avec les palettes de couleur, mais j’ai encore besoin de votre attention quelques minutes. L’un des principes de design les plus important est l’accessibilité, qui peut affecter l’ensemble de votre design.

Les Web Content Accessibility Guidelines (ou Règles pour l’accessibilité des contenus web, WCAG) sont une initiative internationale, menée par le World Wide Web Consortium (W3C). C’est un ensemble de directives (sur base de volontariat, mais nécessaires) qui rendent les sites web plus accessibles aux utilisateurs en situation de handicap, qui doivent parfois utiliser des technologies d’assistance pour naviguer sur Internet.

Nous n’avons pas le temps de parcourir l’ensemble de WCAG 2 (la dernière version de ces directives), je vais donc vous faire un résumé.

Textes, sous-titres, et transcriptions alternatives

Quand vous téléchargez une image sur votre site, il faut savoir que les utilisateurs ne pourront pas tous voir ce que cette image représente. Un texte alternatif est une description que les lecteurs d’écran lisent pour expliquer aux utilisateurs ce qu’il se passe sur l’image.

How to add alt text on Wix
Google utilise les textes alternatifs pour explorer votre site web, il est donc important d’ajouter des textes alternatifs à des fins de SEO
De la même façon, vous devrez proposer une transcription des fichiers vidéo et audio pour les malentendants. Les vidéos sans contenu narratif doivent avoir une transcription descriptive (un peu comme les textes alternatifs).

Contraste des couleurs

Les utilisateurs malvoyants peuvent avoir du mal à distinguer les couleurs. Ça veut dire que s’il n’y a pas assez de contraste entre votre texte et votre arrière-plan, certains utilisateurs n’arriveront pas à lire le contenu de votre site.

Adjusting color contrast on Wix
Les textes doivent avoir un haut contraste pour que tout le monde puisse les lire
Heureusement, Wix propose un assistant accessibilité créé avec les directives WCAG 2 en tête. Quand vous le lancez, il vous indique où le contraste couleur doit être amélioré.

Réduire les mouvements

Les animations et les effets de déroulement peuvent causer de l’inconfort à certains utilisateurs qui souffrent de vertige ou de mal des transports. Je sais que j’ai mentionné plus haut la popularité du défilement parallaxe, mais gardez en tête que ce n’est pas l’option de design la plus accessible.

Pour rendre votre site complètement accessible, je vous conseille d’éviter le défilement parallaxe et d’utiliser aussi peu d’animations que possible. Si vous voulez ajouter du mouvement, l’option la plus accessible est d’utiliser une vidéo, qui se lance quand les utilisateurs cliquent dessus.

DOM

Le Document Object Model (DOM, qui est une interface de programmation normalisée) dicte l’ordre dans lequel le lecteur d’écran et le bouton tabulation (c’est-à-dire utiliser le bouton tab pour naviguer) passe d’un élément à l’autre. La plupart des créateurs de sites paramètrent automatiquement l’ordre DOM de votre site web, mais il est important de vérifier avant de cliquer sur publier.

Astuce de pro : applis et services d’accessibilité

Le WCAG 2 est un document énorme. S’il existe des outils de vérification d’accessibilité gratuits, une appli ou un service d’accessibilité vous envoie des rapports réguliers pour s’assurer que les nouvelles directives sont appliquées. Notre recommandation numéro un est accessiBe, parce que ses analyses alimentées par intelligence artificielles cherchent les problèmes d’accessibilité en permanence.

Optimisation pour les utilisateurs sur mobile

La moitié du trafic internet provient des utilisateurs mobiles. C’est pour ça que votre site web doit avoir la même qualité sur les mobiles que sur ordinateur. Cependant, tous les visiteurs sur mobile n’ont pas la même taille d’écran, votre site doit donc être réactif (c’est-à-dire s’adapter à différents appareils automatiquement).

Wix websites on different devices
Utilisez les outils de développeur de votre navigateur pour avoir un aperçu de votre site sur différents appareils
La plupart des créateurs de sites intègrent la réactivité sur mobile dans leur design de base et leurs modèles. Certains, comme Wix, vous demandent de modifier séparément la version mobile de votre site web. D’autres, comme Squarespace, changent automatiquement la taille des contenus quand un visiteur utilise son smartphone ou sa tablette pour consulter votre site.

Si vous optez pour l’auto-hébergement, ce ne sera pas aussi simple. Si WordPress a de nombreux thèmes adaptés aux mobiles, vous devez faire attention aux éléments personnalisés. Si vous en utilisez beaucoup, vous devrez aussi ajouter des requêtes média CSS (un code qui applique les règles de design en se basant sur la taille de l’écran) pour qu’ils fonctionnent sur les appareils mobiles.

Astuce de pro : engager des concepteurs web

Si vous hébergez vous-même votre site, je vous conseille d’engager un concepteur web pour vous assurer que votre site est totalement adapté aux mobiles. Je sais qu’il ne s’agit pas de l’option la moins chère, mais vu le nombre de visiteurs qui consulteront votre site sur des appareils mobiles, le prix supplémentaire est justifié pour proposer une bonne expérience aux utilisateurs. Et engager un concepteur web freelance n’est pas forcément ultra coûteux. Allez voir notre top 7 des sites de freelance en 2024 qui offrent un excellent rapport qualité prix.

Publiez votre site web et mettez-le régulièrement à jour !

Une fois que votre design vous plaît, il est temps de cliquer sur Publier. Hourrah !

Ça ne veut pas dire que vous n’aurez plus besoin de vous en occuper : vous devez le mettre à jour régulièrement et tenir compte des avis de vos visiteurs. Avoir un site web est une aventure sans fin.

Mettre régulièrement à jour votre site web n’est pas seulement la meilleure manière de garder l’intérêt de vos clients, ça montre aussi aux moteurs de recherche que votre site est toujours en activité. Et tout comme les propriétaires d’un centre commercial, les moteurs de recherche sont plus susceptibles de promouvoir les magasins régulièrement dépoussiérés.

Astuce de pro : mettez régulièrement à jour votre site

Une des meilleures manières de garder un site actuel (et améliorer vos efforts marketing au passage) est d’avoir votre propre blog. Le marketing de contenu est un outil puissant et peu utiliser qui permet d’attiser la curiosité des visiteurs, de leur donner de nouvelles informations et d’améliorer les ventes. En plus de ça, c’est la meilleure façon de montrer votre côté créatif et de mettre en valeur les éléments de votre entreprise qui vous inspirent.

Créer un site web moderne en 2024

Créer votre propre site web n’est pas aussi difficile que ce qu’on pourrait croire. Entre la promotion de marque, les principes de design et l’accessibilité, il y a beaucoup de facteurs à prendre en compte, mais la tâche n’est pas impossible. Grâce aux créateurs de sites web modernes comme Wix qui offrent des modèles préfabriqués modernes et adaptés aux mobiles, vous n’avez plus besoin d’exploser votre budget en engageant un concepteur web pour obtenir un site incroyable.

Cela dit, ce n’est pas parce que vous n’êtes pas obligé d’engager un concepteur que ce n’est pas une option à envisager. Si vous optez pour l’auto-hébergement, vous aurez probablement besoin de l’aide d’un professionnel. Et si vous n’avez aucune expérience des principes de design comme l’accessibilité et l’adaptativité aux mobiles, engager un concepteur web en freelance est un investissement qui peut rapporter gros sur le long terme.

FAQ

Comment concevoir son propre site web ?

La meilleure manière de concevoir son propre site web est d’utiliser un créateur de site ou d’opter pour l’hébergement WordPress. Les deux options vous permettent d’obtenir des modèles modernes et adaptés aux mobiles. Les créateurs de sites sont parfaits pour les débutants, mais si vous avez de l’expérience en matière de code (ou si vous voulez simplement plus de contrôle sur votre site web), envisagez d’héberger vous-même votre site.

Combien coûte la création d’un site web ?

Vous pouvez commencer à créer un site web gratuitement ! Wix offre un abonnement gratuit à vie très intéressant qui vous donne accès à ses outils de personnalisation. WordPress est également gratuit si vous préférez ce type d’hébergement. Vous devrez payer l’hébergement, mais le fournisseur d’hébergement que nous recommandons, Hostinger, offre un hébergement à un prix mensuel très bas, avec une garantie de remboursement fiable s’il ne vous convient pas.

Quels sont les trois principes les plus importants du design web ?

Un site web bien conçu doit être rapide, réactif et accessible. Si une page met trop longtemps à charger ou fonctionne mal sur les appareils mobiles, et si certains utilisateurs ne peuvent pas l’utiliser, vos visiteurs ne resteront pas.

Comment organiser son site web ?

Il existe une règle pratique, qui explique que les utilisateurs doivent pouvoir accéder à toutes vos pages en 3 clics depuis votre page d’accueil. Si vous avez beaucoup de pages sur votre site (comme c’est le cas des magasins en ligne), utilisez des menus déroulants et des barres de recherche pour rendre votre site plus simple à parcourir.

Évaluez cet article
4.5 Évalué par 4 utilisateurs
Vous avez déjà voté ! Annuler
Ce champ est requis Maximal length of comment is equal 80000 chars La longueur minimale du commentaire est de 10 caractères
Avez-vous des commentaires ?
Répondre
Afficher %s réponses
View %s reply
Articles similaires
Voir plus d'articles similaires
Nous vérifions tous les commentaires des utilisateurs sous 48 heures pour nous assurer qu'ils proviennent de " vraies " personnes comme vous. Nous sommes ravis que cet article vous ait semblé intéressant. Nous vous serions reconnaissants de le partager !
Popup final window
Partagez cet article avec vos amis et collègues dès maintenant :

We check all comments within 48 hours to make sure they're from real users like you. In the meantime, you can share your comment with others to let more people know what you think.

Une fois par mois, vous recevrez des conseils et des astuces intéressantes et utiles pour améliorer les performances de votre site web et atteindre vos objectifs de marketing numérique !

Ravis qu'ils vous it plu !

Partagez-le avec vos amis

Ou notez-nous sur

3224498
50
5000
64933911