La conception de sites Web était autrefois très difficile, mais ce n’est plus le cas.
Il y a des années, lorsque j’ai commencé à concevoir mes sites Web, il n’y avait pas une tonne de ressources. Il y avait essentiellement deux options: apprendre les bases des langages de programmation de sites Web ou engager un concepteur. Le premier choix est difficile et prend du temps. Ce dernier est cher.
Après une brève tentative d’essayer de tout concevoir par moi-même, j’ai fini par dépenser beaucoup d’argent pour un designer. C’était plus que ce que je voulais dépenser, mais je n’avais pas vraiment le choix.
Aujourd’hui, les nouveaux propriétaires de sites Web ont plus de ressources à leur disposition. Il est possible de concevoir un site Web professionnel sans engager un concepteur ni apprendre à coder.
Que vous soyez un débutant complet ou que vous recherchiez simplement une autre façon de concevoir des sites Web, vous êtes au bon endroit. Je vais vous expliquer comment concevoir un site Web ci-dessous dans ce guide étape par étape.
Mon outil préféré pour la conception de sites Web
Wix est mon outil préféré pour la conception de sites Web. C’est essentiellement une méthode alternative pour contourner complètement la conception Web.
En tant que créateur de site Web gratuit, Wix permet à quiconque de créer et de concevoir facilement un site Web à partir de zéro – aucune expérience, aucune compétence en développement ou aucune connaissance en conception requise.
La raison pour laquelle j’aime tant Wix est que c’est tellement simple. Même pour un outil aussi simple, la conception finale semble toujours professionnelle. Les gens supposeront simplement que vous avez embauché un designer – c’est aussi bien.
Une autre raison pour laquelle je recommande vivement Wix est sa polyvalence. Il peut répondre aux besoins de conception de pratiquement tous les types de sites Web sous le soleil.
Des blogs simples aux sites de portfolio, en passant par les boutiques en ligne, les sites Web de restaurants, les sites de petites entreprises, etc., Wix peut tout faire. Les autres créateurs de sites Web sur le marché n’ont tout simplement pas la même polyvalence.
Continuez ci-dessous et je vous apprendrai à concevoir un site Web gratuitement avec Wix.
Étape # 1: Créez un compte Wix
La première chose à faire est de vous inscrire à Wix. Rendez-vous donc sur Wix.com et créez un compte . C’est 100% gratuit et vous n’avez même pas besoin de fournir les informations de votre carte de crédit.
Cliquez simplement sur l’un des nombreux boutons «Commencer» sur la page d’accueil ou n’importe où ailleurs sur le site.
Contrairement aux autres plates-formes, le processus d’inscription à Wix peut être terminé en quelques secondes. Il n’y a pas de champs de formulaire complexes à remplir. Ils ont juste besoin de votre email et d’un mot de passe.
Vous pouvez même éviter de taper quoi que ce soit et vous inscrire en un seul clic en utilisant Google ou Facebook.
Une fois inscrit, Wix vous guidera automatiquement tout au long du processus de conception de site Web.
Étape n ° 2: Choisissez votre type de site Web
Ensuite, vous devrez déterminer le type de site Web que vous souhaitez concevoir. Votre réponse aura un impact significatif sur vos choix de conception.
Par exemple, un blog personnel et un site Web de commerce électronique présenteront des différences majeures dans les choix de conception. Un site de portfolio utilisé pour présenter des photographies ou des œuvres d’art personnalisées n’aura pas le même design qu’un site Web de restaurant local.
Wix vous facilite cette étape. Vous serez invité à sélectionner le type de votre site Web parmi un large éventail d’options potentielles.
En fonction de votre réponse, Wix vous présentera automatiquement les modèles applicables dans cette catégorie. Par exemple, si vous sélectionnez «boutique en ligne», la mise en page accueillera les pages de produits, les catégories de produits et vous facilitera la conception d’un processus de paiement.
Une fois que vous avez choisi un type de site Web, Wix vous propose deux options pour votre conception:
- Laissez Wix ADI créer un site Web pour vous.
- Créez votre site web avec l’éditeur.
La première option est simple et est excellente pour les personnes pressées. Vous répondrez simplement à quelques questions simples et Wix concevra un site pour vous en fonction de vos réponses. La rapidité du processus est impressionnante.
Vous aurez un tout nouveau design de site Web personnalisé en moins d’une minute. Le design est magnifique, et mis à part la personnalisation des pages avec votre propre contenu, vous avez terminé.
Pour les besoins de ce tutoriel, nous allons nous en tenir à la deuxième option: créer un site avec l’éditeur Wix. Cela vous donnera plus de liberté et de contrôle sur tous les aspects des choix de conception.
Étape # 3: Sélectionnez un modèle
Plutôt que d’essayer de concevoir un site Web avec une toile vierge, il est beaucoup plus facile de commencer avec un modèle.
Prenez quelques minutes pour parcourir les différentes options. Quels styles aimez-vous? Quels modèles imitent votre image de marque? Wix propose des milliers de modèles. Cela peut être un peu écrasant au début. Mais limitez votre concentration en fonction de votre type de site Web spécifique.
Pour cet exemple, je choisis un site Web «professionnel». Mais c’est une catégorie vraiment large. Si vous regardez sur le côté gauche de l’écran, vous pouvez vous concentrer davantage sur les types d’entreprises.
Wix propose des modèles spécifiques pour les consultants, les sociétés immobilières, les services professionnels tels que la finance et le droit, le marketing et bien plus encore. Chaque type de site Web a différentes sous-catégories avec des modèles.
Par exemple, si vous sélectionnez « boutique en ligne », vous verrez des modèles pour les vêtements, les bijoux, l’électronique, la décoration intérieure, les produits de beauté, les équipements de sport, etc. Si vous concevez un site Web de blog, Wix propose des modèles pour les blogs personnels, les blogs de voyage, les blogs de mode, les podcasts, etc.
Votre modèle deviendra la base du reste de la conception de votre site Web. Il est donc important de prendre son temps et de ne pas se précipiter dans cette étape. Vous pourrez toujours personnaliser différents éléments de conception à votre guise, mais c’est beaucoup plus facile avec le bon modèle.
Étape # 4: Modifiez votre mise en page
Les visiteurs du site Web se formeront une opinion sur votre site Web en moins d’une seconde après leur arrivée sur la page d’accueil. C’est pourquoi le design est si important, et tout commence par la bonne mise en page.
Les modèles Wix ont déjà été optimisés pour une conception conviviale. Mais vous avez la liberté et la flexibilité d’apporter des modifications ici.
Dans cet exemple, je modifie le modèle «Business Consultant». Disons que je voulais déplacer le positionnement du titre sur cette page d’accueil. Je cliquais simplement sur la case dans l’éditeur Wix et la ferais glisser ailleurs sur la page.
Ou peut-être que je souhaite repositionner cet appel à l’action «En savoir plus» sur la moitié droite de l’écran. Je peux cliquer dessus et faire glisser le bouton où je veux.
Je vous encourage à déplacer certaines choses lorsque vous commencez. Cela vous présentera l’éditeur Wix, vous serez donc à l’aise sur la route. Si vous ne souhaitez finalement pas apporter de modifications à la mise en page, vous pouvez toujours revenir à la conception d’origine.
Étape n ° 5: Préparez votre contenu
Le contenu est un élément important de la conception de votre site. Vous ne pouvez pas finaliser complètement la conception sans comprendre exactement quels matériaux seront présentés sur le site Web.
Rassemblez des images, des vidéos, des GIF, des logos, des slogans, du texte (copie) et tout ce que vous souhaitez afficher sur votre site.
Permettez-moi de vous montrer un exemple pour illustrer mon propos.
Je suis toujours en train de modifier ce même modèle de consultant en affaires. L’une des premières choses que je ferais sur cette partie de la page est d’échanger l’image avec une photo de moi-même. Mais avant de faire cela, je devrais également penser à la copie de texte correspondante en bas à gauche de l’écran.
Par défaut, le modèle a un espace vide ici, comme je l’ai souligné ci-dessus. Bien que l’espace vide soit une fonctionnalité de conception Web importante, je n’aime pas comment il est utilisé dans ce cas.
Voici donc mes options:
- Utilisez une photo pleine longueur (comme celle ci-dessus) et ajoutez un paragraphe dans l’espace vide.
- Utilisez une photo plus petite (comme une photo dans la tête) et n’utilisez qu’un seul paragraphe de texte.
Les deux atteindront mon objectif d’éliminer cette section vide de la page. Voyez-vous comment un composant en a un autre? Tout cela est lié à la conception, et c’est beaucoup plus facile si vous avez préparé votre contenu à l’avance.
Étape # 6: Définissez votre stratégie de marque
Commencez à réfléchir à la façon dont les visiteurs percevront votre site Web. Des éléments tels que le jeu de couleurs, les polices et d’autres composants de conception auront un impact direct sur votre image de marque.
Cliquez sur le « Gestionnaire de thèmes » sur le côté gauche de votre éditeur Wix. C’est le bouton avec un «A» et ce qui ressemble à une goutte de pluie ou de peinture.
À partir de là, vous pouvez modifier les couleurs du thème de votre site. Vous aurez également la possibilité de modifier vos thèmes de texte par défaut pour les en-têtes et les paragraphes.
Dans ce cas, la palette de couleurs actuelle fonctionne bien pour un consultant en entreprise. C’est moderne et professionnel. Mais disons que vous conceviez un site Web pour les enfants. Vous pourriez vous amuser un peu plus avec des couleurs vives et de grandes polices audacieuses.
Si vous avez ajouté les logos de votre entreprise et d’autres matériaux à l’étape 5, vous voudrez vous assurer que le jeu de couleurs s’harmonise bien avec le reste de votre contenu.
Étape 7: Ajouter des pages de destination
Vos pages de destination auront chacune des designs uniques. Bien qu’ils devraient tous suivre les mêmes principes de marque et le même thème de votre page d’accueil, les choix de conception présenteront quelques variantes.
Pour ajouter une page, cliquez sur l’icône du haut sur le côté gauche de votre éditeur Wix. Cliquez ensuite sur « Ajouter une page », comme je l’ai souligné ci-dessous.
Les nouvelles pages seront essentiellement un canevas vierge, à l’exception de votre en-tête et pied de page. Mais plutôt que de partir de zéro, vous pouvez «ajouter une bande» à n’importe quelle page en fonction du contenu qu’elle contiendra.
Cliquez simplement sur le bouton «+» de l’éditeur pour parcourir certaines options.
Considérez cela comme un mini modèle. Appliquez les mêmes principes que vous avez utilisés à l’étape 3 lorsque vous avez choisi pour la première fois votre modèle de site global.
Il s’agit simplement d’un moyen plus simple de concevoir de nouvelles pages de destination. Wix propose déjà tellement d’options intéressantes qu’il ne vaut pas la peine d’essayer de créer vos pages à partir de zéro.
Étape # 8: Concentrez-vous sur la convivialité
Parfois, pendant le processus de conception, vous pouvez commencer à perdre de vue la façon dont les visiteurs interagiront avec votre site. Mais l’expérience utilisateur (UX) ne peut être négligée.
Il existe certaines bonnes pratiques de conception auxquelles les gens s’attendent lorsqu’ils visitent un site Web. Par exemple, ils s’attendent à ce que le menu de navigation soit en haut de la page. Ils s’attendent à ce que le pied de page contienne des informations de contact. Ils s’attendent à ce que le logo les ramène à la page d’accueil.
Regardons quelque chose de simple, comme un menu de navigation:
Dans cet exemple, il n’y a que quatre pages dans le menu. Vous pourriez peut-être vous en sortir en en ajoutant un ou deux de plus. Mais au-delà, c’est trop.
Imaginez si ce site Web avait 10 ou 20 pages dans le menu. Ce serait un désastre. Le haut de la page serait trop encombré et les visiteurs ne trouveraient jamais ce qu’ils recherchent. Dans l’ensemble, ce serait un mauvais choix de conception.
Pensez à la convivialité avec chaque choix de conception que vous faites, du placement du CTA aux effets de défilement, en passant par les espaces blancs, l’architecture et tout le reste.
N’essayez pas de réinventer la roue ici. Suivez les meilleures pratiques de conception Web, et l’expérience utilisateur sera très bien.
Étape n ° 9: Optimiser la conception des appareils mobiles
Selon Statista , environ la moitié du trafic Web mondial provient d’appareils mobiles. Il y a donc une chance que chaque visiteur de votre site navigue à partir d’un smartphone ou d’une tablette.
Vous devez vous assurer que la conception de votre site Web est adaptée aux mobiles. Sinon, les visiteurs rebondiront et vous n’obtiendrez jamais de conversions mobiles.
Heureusement, Wix facilite ce processus pour vous.
Depuis la page de l’éditeur ou de l’aperçu, cliquez simplement sur l’icône mobile pour quitter la vue de bureau de votre site Web.
Wix optimisera automatiquement votre site Web pour mobile. Mais c’est toujours une bonne idée de tout vérifier par vous-même pour voir si vous souhaitez apporter des modifications. Si vous voyez quelque chose que vous souhaitez modifier, vous pouvez modifier la conception mobile de votre site sans changer la version de bureau.
Étape # 10: Publiez votre site Web
Une fois que vous avez finalisé la conception, il est temps de mettre votre site en ligne sur le Web.
Il est à noter que votre site n’a pas besoin d’être terminé à 100% pour le publier. Vous pouvez toujours revenir en arrière et ajouter des pages ultérieurement. Mais une fois que vous avez une page d’accueil, une page à propos, une page de contact et une poignée d’éléments de site, faites-la publier afin de pouvoir commencer à générer du trafic. Assurez-vous simplement de ne pas publier de pages incomplètes.
Cliquez sur le bouton bleu «Publier» en haut à droite de votre tableau de bord Wix pour continuer.
Comme je l’ai déjà dit, vous pouvez concevoir et publier un site avec Wix à 100% gratuitement. Mais il y a un hic.