Mes étapes de création d’un site internet

Lorsque l’on souhaite se lancer dans la création de son site internet, c’est normal de se sentir un peu perdu(e) et « dans le flou » au début. On a parfois besoin de visualiser tout ce qui nous attend, étape par étape, pour se rendre compte que ce n’est pas si insurmontable que ça. Petit à petit, on y arrive. Il ne faut pas paniquer en imaginant une montagne. 🏔

Je me suis donc dit que ça pourrait t’intéresser si je te partage les grands axes / les grandes étapes que je suis lorsque je réalise les sites internet pour mes clients. Bien évidemment, chacun ses méthodes, chacun ses techniques et chacun ses étapes. Ça varie évidemment en fonction de chaque projet puisque chaque client a ses besoins, ses fonctionnalités… Mais globalement, ça te donnera une vision d’ensemble. Ça peut en aider certain(e)s à se lancer dans la création de leur site internet. 🥰

J’ai essayé de décomposer au maximum. Je me répète : selon les sites internet et selon les options, les étapes peuvent varier. Je ne vais cependant pas tout expliquer en détails : ce serait bien trop long… Et je réfléchis sérieusement à te préparer une formation sur le sujet 😏 Ça t’intéresserait ?

Mathilde Langle - Graphiste Webdesigner - Créer son site internet

Avant de lancer ton site internet

Avant de se lancer dans la création technique de son site internet, il y a plusieurs étapes auxquelles il faut penser. Si tu ne veux pas te perdre, changer d’avis toutes les 2 minutes, te rendre compte que ça ne va pas, ou qu’il manque quelque chose… Il faut préparer le terrain !

1. Définir le plan de ton site internet

Définir le plan de ton site internet est donc indispensable. Tu n’es pas obligé(e) d’avoir tout dans les moindre détails (si c’est la cas, tant mieux !). Tu pourras toujours faire tes petites modifications par la suite. Cependant, il est important d’avoir les grands axes. De quoi vas tu parler ? À qui ? Comment vas-tu communiquer tes offres, prestations, informations… Liste les pages principales et la structure globale de ton site.

2. Créer ton moodboard

Arrive la première étape créative : le moodboard. Cette étape va te permettre de définir les polices d’écriture, les couleurs que tu vas utiliser sur ton site internet, l’ambiance, l’univers dans lequel tu vas embarquer tes visiteurs pour les immerger dans ton monde. Comment ? Pinterest est ton ami. Canva aussi.  

3. Créer tes maquettes

Avant de te lancer dans l’épreuve « technique » pour mettre en ligne ton site internet, tu vas gagner du temps si tu sais déjà ce que tu veux et ce que tu vas mettre en ligne. Réalise les maquettes (c’est-à-dire le visuel avec le placement de chaque bloc, les bonnes couleurs, les bonnes polices d’écriture…) de ton site internet. Du moins, ta page d’accueil pour donner le ton. Si tu n’as pas les logiciels de la suite Adobe, Canva va beaucoup t’aider pour cette étape. Et c’est gratuit.

4. Nom de domaine, hébergement et base de données

Maintenant que tu sais vers quoi tu vas, il est l’heure d’acheter ton nom de domaine et ton hébergement. Quézaco ? Ton nom de domaine c’est l’adresse de ton site internet. Par exemple, mon nom de domaine est mathildelangle.com. L’hébergement c’est le stockage. En effet, tout comme les dossiers sur ton ordinateur, plus tu les remplis de photos, textes et contenus, plus ils pèsent lourd. Ton site internet, c’est pareil. Il faut lui prévoir plusieurs gigas d’espace pour pouvoir tout stocker. C’est un abonnement annuel (entre 50 et 100€ / an).
Et puis, il faut créer ta base de données. Ce n’est pas bien compliqué, ton hébergeur le fait pour toi. Suis les étapes.
Selon l’hébergeur que tu choisis, tu seras guidé et tu trouveras toutes les informations. Tu as par exemple Hostinger, OVH, O2switch, IONOS

Mise en place de ton site internet

Tu as le plan de ton site, tu as le moodboard et au moins la maquette de la page d’accueil, ton nom de domaine et ton hébergement… C’est parti pour installer WordPress !

1. Installation de WordPress.org

Tu peux passer directement par l’interface de WordPress.com mais sache que les options seront limitées et que tu seras un peu bridé(e). Je te conseille de télécharger les fichiers de WordPress.org et de tous les installer sur ton site. Ton hébergeur te propose sûrement une interface pour accéder aux fichiers de ton site. Pour ceux qui s’y connaissent un peu : HOP ! On met tous les fichiers de WordPress.org grâce au FTP (par exemple Filezilla).

2. Paramètres de base du site sur WordPress

Au fur et à mesure des projets avec mes clients, j’ai testé pas mal d’extensions. Je ne sais pas si ce sont les meilleures, mais clairement j’ai ma petite liste de base que j’installe sur tous les sites : thème, éditeur de page, page de maintenance avec mot de passe, feed Instagram, sécurité, sauvegarde…
C’est aussi le moment de passer votre site internet en https pour le sécuriser. (Tu sais, pour avoir ce petit cadenas à gauche de l’adresse de ton site internet). C’est bon pour ton référencement mais aussi pour rassurer tes visiteurs. Normalement avec chaque hébergeur tu as ce qu’on appel un certificat SSL qui est gratuit. Il n’est pas toujours activé par défaut. N’hésite pas à aller voir.

3. Page de construction avec mot de passe

Tu n’as pas forcément envie que l’on voit ton site internet en cours de construction. Je te conseille donc d’installer une page avec un mot de passe. Tu vas pouvoir la personnaliser simplement avec par exemple un fond de couleur, ton logo et une petite phrase du style « Coming soon ». La zone de mot de passe te permettra de partager ton site aux personnes que tu veux pour qu’elles puissent visualiser l’avancée des travaux. 😊
N’oublies pas de désactiver cette page dès que ton site est prêt !

4. Création du footer

Un des premiers éléments que je mets en place est le footer (le pied de page). On y trouve souvent les mêmes informations : Mentions légales, Politique de confidentialité, CGV, FAQ, Contact, logo et les réseaux sociaux. Cet un élément qui ne va quasiment pas changé, alors autant le mettre en place tout de suite !

5. Création du menu

C’est ensuite au tout du menu. J’ai besoin de visualiser à quoi va ressembler la navigation du site. Parfois elle change puisque des sections et sous sections sont ajoutées / modifiées. Quand tout n’est pas encore fixé je crée Accueil, À propos, Prestations, Blog, Contact. Ce sont mes sections par défaut dans ma navigation pour démarrer et visualiser le rendu.

6. Création de la page d'accueil

Et c’est parti pour l’élément principal : la page d’accueil ! C’est elle qui va donner le ton. N’oublie pas de te fier à la maquette que tu as réalisée auparavant. L’idée : avoir un petit « teaser » de chaque catégorie de ton site. Un peu de contenu sur toi puis un bouton pour en découvrir plus. Un peu de contenu sur ton concept et tes prestations, puis un bouton pour en savoir plus qui redirige vers la bonne page, tes 3 derniers articles et un bouton « En lire + »… Bref ! Je crois que tu as compris le principe. 😉

7. Création de la page de contact

Personnellement, juste après la page d’accueil je m’attaque à la page de contact. Je crée une page spécifique avec un formulaire de contact qui regroupe tous les éléments dont j’ai besoin. Les visiteurs aiment être guidés donc les formulaires qui disent champs après champs ce qu’il faut remplir facilite la tâche.
N’oublie pas de mettre de temps en temps des boutons « Contact » sur les pages de ton site (même si tu as un onglet « Contact » dans ton menu) pour aider tes visiteurs à te contacter plus facilement.

8. Création des pages du site (à propos, prestations...)

Une fois la page d’accueil créée, tu dois y voir déjà un peu plus clair. Ton site internet prend forme. C’est parti pour décliner tout cet univers sur tout ton site !

9. Mise en place et configuration du blog

Le blog est installé par défaut sur WordPress. C’est une fonctionnalité présente nativement. Il faut cependant ne pas oublier de le configurer si tu souhaites en avoir un sur ton site. Est-ce tu veux une colonne de droite sur les pages de ton blog ? Que veux-tu comme infos dans cette colonne de droite ? As-tu différentes catégories ? Si oui, comment veux-tu qu’elles s’affichent ? Comment s’affichent tes articles qui remontent automatiquement sur ta page d’accueil du blog ? Et sur la page de résultats de recherches ? Autorises-tu les commentaires ? … Il y a de quoi faire !

10. Mise en place et configuration de la boutique

Cette étape dépend évidemment de chaque projet. Tout le monde n’a pas besoin d’une boutique en ligne. Mais lorsque c’est le cas, j’installe WooCommerce, je mets en ligne un ou plusieurs produits puis je paramètre tout. Il faut que les pages produits soient claires, esthétiques, en accord avec ton identité visuelle, organisées correctement selon tes catégories si tu en as… etc. Et puis, il faut paramétrer toutes les infos de ta boutique (paiement, email, taxes, livraison….)

11. Cookies, mentions légales, politique de confidentialité, CGV…

N’oublies pas de rédiger une page de Mention légales et de Politique de confidentialité. Si tu n’as pas de boutique en ligne, pas besoin de CGV. Tu trouveras de nombreux exemples sur internet. Sinon, tu peux tout à fait demander à un avocat de s’en occuper pour toi. Ce sera plus sérieux, totalement adapté à ton activité… A toi de voir !

La version mobile

Une fois que tu es OK avec tout ton site et que tu ne souhaites plus modifier de blocs, de sections… tu peux aller vérifier ce que ça donne en version mobile (et tablette aussi !)

1. Adapter le menu mobile

Tu peux installer une extension qui va t’aider à personnaliser davantage ton menu mobile. En effet, l’écran étant plus petit, tu as peut-être envie de mettre certaines infos avant. Par exemple, mettre un bouton pour accéder à la boutique ou réserver des cours en ligne. C’est donc le moment d’adapter et personnaliser ton menu mobile.

2. Vérifier toutes les pages

Même si WordPress te facilite la tâche (c’est quand une grande force de WordPress), il faut quand même repasser sur toutes les pages pour optimiser l’affichage mobile. Parfois, il est plus intéressant d’afficher les blocs les uns après les autres et d’oublier certaines sections qui s’affichent toujours en colonne sur mobile. À toi de voir !

Aller plus loin

Même si je te résume toutes les étapes « grossièrement » et que l’on peut évidemment aller toujours plus loin, je te rajoute quelques étapes supplémentaires juste en dessous.

1. Personnaliser la page de connexion

Pour modifier et gérer ton site internet il faut que tu te connectes à ton tableau de bord. Pour ça, tu passes par une page page défaut de WordPress toute blanche, avec le logo de WordPress et deux champs : identifiant et mot de passe. Tu peux personnaliser cette page avec tes couleurs, ton logo… C’est clairement plus sympa pour te connecter à ton site. Des extensions peuvent t’aider à le faire super facilement.

2. Google Analytics

Une fois ton site en ligne, tu as peut-être envie de voir le nombre de visiteurs, les pages vues… bref ! Les statistiques ! Tu peux lier Google Analytics à ton site WordPress. Et là, comme d’habitude, une extension peut t’aider à le faire facilement. Il suffit de suivre étape par étape.

3. Yoast SEO

On entend beaucoup parler du référencement. C’est super important. Pour t’aider avec les bases, une extension du nom de Yoast SEO te guide pour optimiser chacune de tes pages, articles, produits…
Cette extension ne fera pas tout non plus. À toi de te renseigner sur les différentes actions à entreprendre pour optimiser ton site. Tu peux d’ailleurs consulter cet article concernant la gestion des images de ton site internet. Ça fait partie des tâches à réaliser pour ton référencement.

4. Sécuriser le site

Parce que même si ton site est tout nouveau, que tu n’as pas un million de visiteurs, tu peux te le faire pirater… Sécurise ton site. Installer une extension qui te permettra de faire des sauvegardes automatiques au moins 1 fois par mois, ainsi qu’une extension pour t’aider à sécuriser un peu tout ça (captcha, sécurisation des fichiers…)
Et n’oublie pas que ton site internet vit : il faut faire régulièrement les mises à jour si tu ne veux pas avoir des soucis d’affichage et des failles de sécurité ! Tu peux d’ailleurs consulter mon article sur la gestion de la maintenance de ton site internet pour en apprendre plus sur le sujet.

Mathilde Langle - Graphiste Webdesigner - Créer son site internet
Mathilde Langle - Graphiste Webdesigner - Freebie : les étapes de création d'un site internet
Mathilde Langle - Graphiste Webdesigner - Freebie : les étapes de création d'un site internet
Mathilde Langle - Graphiste Webdesigner - Freebie : les étapes de création d'un site internet

Mathilde

Hello ! ☀️ Je m’appelle Mathilde. 👩🏼, Je suis graphiste et web designer freelance. J’accompagne les entrepreneurs dans le lancement et le développement de leur activité grâce à une identité visuelle, un site internet et des supports de communication à leur image.💫