En 2020, n’importe qui peut créer et concevoir un site Web sans rien savoir du développement Web, de la conception ou du codage.
Que vous souhaitiez créer un site Web pour vous-même ou pour votre entreprise, vous pouvez facilement le faire en utilisant les bons outils et ressources.
Ce guide étape par étape vous aidera à créer un site Web à partir de zéro sans avoir à dépenser de l’argent pour des pigistes, des agences ou des créateurs de sites Web.
Tout ce dont vous avez besoin est de 1 à 2 heures de votre temps libre pour terminer le guide et créer un site Web.
Ce dont vous avez besoin pour créer un site Web
- Nom de domaine (votre adresse Web personnalisée, www.Votre-siteweb.com)
- Hébergement de site Web (service qui héberge votre site Web)
- WordPress (plate-forme de site Web gratuite et couramment utilisée)
Pour créer un site Web entièrement fonctionnel, vous devez sécuriser un nom de domaine (adresse Web) et un compte d’hébergement Web. Ces deux éléments garantissent que votre site Web est entièrement accessible aux autres. Sans l’un ou l’autre, vous ne pourrez pas créer de site Web.
Une fois que vous avez un domaine et un hébergement, vous pouvez créer un site Web WordPress. WordPress est la plate-forme de création de sites Web la plus populaire utilisée par 35% de tous les sites Web sur Internet.
La configuration d’un site WordPress est généralement un processus simple en un clic via votre service d’hébergement Web.
Une fois le guide terminé, vous disposerez d’un site Web entièrement fonctionnel en ligne, sur un nom de domaine personnalisé et entièrement accessible par d’autres.
Prêt? Commençons…
Table des matières (étapes pour lancer un site Web):
- Choisissez un nom de domaine
- Enregistrez un domaine et inscrivez-vous avec un hébergement Web
- Configurer un site Web à l’aide de WordPress (via l’hébergeur Web)
- Personnalisez la conception et la structure de votre site Web
- Ajouter des pages et du contenu importants
- Configurer un menu de navigation
- Ajouter une boutique en ligne (facultatif)
Choisissez un nom de domaine :
Pour créer un site Web, la toute première chose dont vous aurez besoin est un nom de domaine.
Le nom de domaine est le nom et l’adresse de votre site Web. Cette adresse est utilisée par les visiteurs lorsqu’ils essaient de trouver votre site via leur navigateur Web.
Le nom de domaine de ce site Web est websiteetup.org. Le vôtre peut être n’importe quoi.
Les noms de domaine peuvent coûter entre 100 Dh et 500 Dh par an. Le prix habituel est d’environ 150 Dh.
Si vous n’avez pas enregistré ou choisi de nom de domaine pour votre site Web, voici quelques conseils pour vous aider:
- Si vous créez un site Web pour une entreprise, votre nom de domaine doit correspondre au nom de votre entreprise. Par exemple:
votre-entreprise.com - Si vous envisagez de créer un site Web personnel pour vous-même, Votre-Nom.com peut être une excellente option.
- Utilisez une extension de nom de domaine «générique» telle que .com, .net ou .org si votre objectif est les visiteurs internationaux. Utilisez une extension de nom de domaine «locale» telle que .de, .fr ou .ru si votre objectif est les visiteurs ciblés par pays.
Ne vous inquiétez pas si votre nom de domaine préféré est déjà utilisé. Il y a plus de 300 millions de noms de domaine différents enregistrés, mais il existe encore un milliard d’autres possibilités.
Si vous n’avez pas encore de nom de domaine, il n’est pas nécessaire d’en enregistrer un.
Nous allons vous montrer comment obtenir un nom de domaine à l’étape suivante.
Obtenez l’hébergement Web et enregistrez le domaine :
En plus d’avoir un nom de domaine, vous aurez également besoin d’un hébergement de site Web (hébergement Web).
L’hébergement Web est un service qui héberge et stocke les fichiers de votre site Web (contenu) sur un serveur sécurisé qui est toujours opérationnel. Sans un hébergeur, votre site ne sera pas accessible aux autres pour le lire et le parcourir.
L’hébergement Web abordable et fiable pour les nouveaux sites Web coûte généralement entre 30 Dh et 100 Dh par mois. Moins d’une tasse de café, mais un investissement important pour le succès de votre site Web.
Quelle que soit la société d’hébergement Web avec laquelle vous vous inscrivez, assurez-vous qu’elle dispose des fonctionnalités suivantes :
- Nom de domaine GRATUIT avec SSL (pour la sécurité)
- Installation en un clic pour WordPress (gratuite)
- Comptes de messagerie personnalisés
- Bande passante illimitée ou illimitée (aucune limitation de trafic)
- Support client, de préférence un chat en direct 24/7
Si vous trouvez un hébergement de site Web qui offre toutes les choses ci-dessus, vous avez probablement trouvé un bon fournisseur.
Nous vous recommandons d’utiliser 02system.com pour l’hébergement Web et les domaines. Ils offrent un enregistrement de domaine gratuit pour la première année et l’obtention d’un nom de domaine et d’un hébergement auprès de la même société vous permet d’économiser du temps et de l’argent.
1) Visitez simplement 02system et choisissez votre plan d’hébergement Web (le choix plus est entièrement illimité, tandis que le basique est le meilleur pour les nouveaux sites) :
2) Enregistrer votre nom de domaine :
Si vous avez déjà un nom de domaine que vous avez acheté ailleurs, 02system vous permet de le connecter à votre nouveau plan d’hébergement. Certaines étapes supplémentaires seront nécessaires ici – comme la mise à jour de vos serveurs de noms.
3) Une fois que vous avez terminé votre processus d’inscription, il vous faudra quelques minutes pour obtenir un accès instantané, afin que vous puissiez commencer à créer votre site Web immédiatement.
Configurer le site Web WordPress (via l’hôte Web)
Une fois votre nom de domaine et votre hébergement Web prêts à l’emploi, vous devrez choisir et installer une plate-forme de création de site Web (également appelée CMS).
Nous vous recommandons de choisir WordPress car il est facile à utiliser et est livré avec des milliers de conceptions et de modules complémentaires gratuits qui donnent à votre site Web un aspect professionnel et unique.
La configuration de votre site Web WordPress est facile, et votre hébergeur le fait principalement pour vous, vous n’avez donc pas vraiment à vous salir les mains.
Si vous n’utilisez pas 02system comme hébergement Web, ne vous inquiétez pas. De nombreux fournisseurs d’hébergement Web ont «WordPress install» situé quelque part dans le cPanel d’hébergement. Si vous avez affaire à un hébergeur qui ne propose pas les « installations en un clic », essayez de configurer WordPress manuellement.
Installation du site Web WordPress sur 02system
1) Connectez-vous à votre compte 02system et Cliquez sur « Connexion au cPanel »
2) recherche « wordpress » Fournissez des informations de base sur votre site et l’installation de WordPress commencera.
Testez votre site Web en saisissant votre adresse de domaine
Avec WordPress installé, ce que vous devez faire ensuite est de tester si tout fonctionne.
Le moyen le plus simple de le faire est de saisir votre nom de domaine dans le navigateur Web.
Avec WordPress correctement installé, ce que vous verrez est un site Web très basique comme celui-ci :
Si cela n’a pas l’air trop attrayant, ne vous inquiétez pas, vous apprendrez bientôt comment changer le design en quelque chose de plus attrayant.
Vérifier les paramètres SSL / HTTPS
En bref, un certificat SSL garantit que votre site Web est livré à vos visiteurs en toute sécurité.
02system ajoute automatiquement un SSL lorsque vous créez un nouveau site Web ou installez WordPress. Pour vérifier l’état SSL de votre site, procédez comme suit :
Connectez-vous à votre portail 02system
Cliquez sur «Mes sites»
Trouvez votre site et cliquez sur «Gérer le site»
Allez dans l’onglet «Sécurité»
Sous « Certificat de sécurité », vous trouverez votre statut « Certificat SSL gratuit »
Si tout s’est bien passé, vous devriez voir une icône de verrouillage à côté de votre nom de domaine dans le navigateur Web.
La configuration complète du SSL peut prendre quelques heures, mais cela ne devrait pas vous empêcher de continuer à créer votre site Web.
Personnalisez la conception et la structure de votre site Web
Avec votre site Web nu vivant et dynamique, il est maintenant temps de le faire sentir comme le vôtre en choisissant un joli design, en le personnalisant et en ajoutant des éléments de marque.
Commençant par:
1) Choisissez un thème pour votre site Web
Les thèmes WordPress sont des packages de conception prêts à l’emploi qui changent l’apparence de l’ensemble de votre site Web. Les thèmes WordPress sont interchangeables – vous pouvez facilement passer d’un thème à l’autre.
Plus important encore, il existe des milliers de thèmes WordPress gratuits et payants disponibles sur le Web.
Si vous souhaitez obtenir un thème gratuit – c’est là que la plupart des gens aiment commencer – le meilleur endroit où aller est le répertoire officiel des thèmes sur WordPress.org. En particulier, la section pour les thèmes les plus populaires.
Tous les thèmes que vous voyez là-bas se sont avérés être de grande qualité et ont de grandes bases d’utilisateurs derrière eux.
Vous êtes libre de parcourir cette liste et de choisir le thème de votre choix, mais pour accélérer les choses pour vous dans ce guide, nous vous recommandons Neve. C’est un thème polyvalent qui est fourni avec une poignée de sites de démarrage (des packages de conception pour différentes niches et types de sites Web).
Nous allons utiliser ce thème dans ce guide à l’avenir.
2) Installez le thème que vous aimez
Accédez à votre interface d’administration WordPress. Vous pouvez le trouver sur Votre-siteweb.com/wp-admin. Utilisez le nom d’utilisateur et le mot de passe que vous avez obtenus lors de l’installation de WordPress.
1)-Dans la barre latérale, accédez à « Thèmes → Ajouter un nouveau ».
2)-Dans le champ de recherche, tapez «Neve» et cliquez sur le bouton «Installer» à côté du nom du thème:
3)-Une fois l’installation terminée, cliquez sur le bouton «Activer» qui apparaîtra à la place du bouton «Installer».
4)-Vous verrez un message de réussite, vous indiquant que l’installation s’est déroulée comme prévu.
3) Importer un design (uniquement pour les utilisateurs du thème Neve)
Bien que le thème soit actif à ce stade, il y a quelques autres choses que vous devez faire pour lui donner un aspect correct.
Vous verrez ce message de bienvenue:
L’une des grandes choses à propos de Neve est que vous obtenez non seulement un design, mais toute une gamme de designs différents parmi lesquels vous pouvez choisir. Cliquez sur le gros bouton bleu pour les voir.
Il existe plus de 20 modèles disponibles gratuitement et couvrent la plupart des niches de sites Web populaires, telles que les entreprises, les restaurants, le fitness, la musique, la nourriture, les mariages, la photographie, le commerce électronique, les portefeuilles, etc. En gros, quel que soit le sujet de votre site, vous trouverez un package de conception qui vous convient.
Pour les besoins de ce guide, nous choisirons le premier de la liste, appelé « Original ».
Vous remarquerez que ce processus d’installation prend en charge tous les éléments dont vous aurez besoin sur votre site – vous obtenez le design lui-même, tous les plugins nécessaires pour le faire fonctionner, ainsi que le contenu de démonstration que vous pourrez modifier ultérieurement.
Cliquez sur le bouton «Importer» pour que tout se passe. Après environ une minute, vous verrez le message de réussite.
Ensuite, allez dans «Apparence → Options Neve» pour voir ce que vous pouvez faire d’autre avec le thème.
Nous allons explorer certaines de ces options ci-dessous:
4) Ajouter un logo
La première chose que la plupart des utilisateurs veulent faire est de télécharger leur logo et de l’afficher dans le coin supérieur gauche du site. Faisons cela maintenant.
Vous pouvez bricoler un logo. Voici quelques-uns des outils que vous pouvez utiliser pour créer vous-même un logo.
Une fois que vous avez un logo prêt, vous pouvez l’ajouter à votre site. Allez dans «Apparence → Options Neve» et cliquez sur le lien intitulé «Télécharger le logo».
Voici ce que vous verrez:
Cette interface s’appelle le personnalisateur WordPress et vous permet de modifier divers aspects de l’apparence de votre site Web. Pour commencer, vous pouvez télécharger votre logo. Pour ce faire, cliquez sur le bouton « Sélectionner un logo » situé près du coin supérieur gauche.
WordPress vous donnera la possibilité de recadrer le logo, mais vous pouvez l’ignorer.
Vous devriez voir votre logo dans le coin de la page sous peu.
En outre, vous pouvez choisir si vous souhaitez afficher le nom du site et le slogan à côté du logo, et définir la largeur maximale du logo. Essayez ces paramètres et choisissez ce qui vous convient le mieux.
Cliquez sur le bouton «Publier» lorsque vous avez terminé (le coin supérieur gauche), puis cliquez sur le bouton «X» pour quitter le personnalisateur.
5) Modifier le schéma de couleurs et les polices du site Web
Une autre chose que vous pouvez expérimenter est de changer les jeux de couleurs et les polices utilisés sur le site. Au fur et à mesure que vous apprenez à créer un site Web, il s’agit d’une solution simple pour rendre votre site plus unique et plus en phase avec votre identité de marque.
1-Pour commencer, allez à nouveau dans «Apparence → Options Neve». Nous allons nous concentrer sur les deux options suivantes:
2-Tout d’abord, cliquez sur « Définir les couleurs ».
3-La plupart des thèmes WordPress sont définis par le jeu de couleurs qu’ils utilisent pour divers éléments de la conception.
4-Le plus souvent, ce sont les couleurs des liens, des textes sur le site et des arrière-plans.
5-Vous pouvez modifier les attributions de couleurs pour le thème Neve via le personnalisateur.
6-Pour changer l’une des couleurs, cliquez simplement dessus et choisissez une nouvelle couleur.
7-Cliquez sur «Publier» et «X» lorsque vous avez terminé.
La modification des polices fonctionne de la même manière:
1-Cliquez sur le lien «Personnaliser les polices» dans le panneau «Apparence → Options Neve».
2-Neve vous permet de choisir parmi tout un catalogue de polices système et de polices Google.
3-Cliquez simplement sur la case «Famille de polices» et sélectionnez la police que vous aimez.
4-Après cela, vous pouvez affiner les polices individuelles utilisées pour vos en-têtes.
Testez ces paramètres pour voir l’effet qu’ils ont sur votre site.
1-Pour personnaliser la police utilisée pour la section corps de votre site, cliquez sur le bouton fléché en haut à gauche.
2-Cliquez sur « Général ». Cela vous mènera à un panneau d’options similaire, mais cette fois, vous ajustez la police du corps principal.
3-Cliquez sur «Publier» et «X» lorsque vous avez terminé.
6) Ajouter une barre latérale
Une autre chose que vous pouvez faire dans le panneau « Apparence → Options Neve » est de définir l’apparence de votre barre latérale. Cliquez sur « Contenu / Barre latérale » pour commencer.
Vous avez trois options principales ici: pas de barre latérale, barre latérale à gauche ou barre latérale à droite. La barre latérale à droite est la mise en page classique de la plupart des sites Web. Vous pouvez également définir la largeur du contenu. Après avoir effectué vos modifications, cliquez sur «Publier» et «X».
7) Ajouter des widgets (modules complémentaires WordPress gratuits)
Les widgets sont ces petits blocs de contenu qui apparaissent généralement dans les barres latérales des sites Web. Puisque nous venons de définir la barre latérale à l’étape précédente, personnalisons-la maintenant avec des widgets.
Pour configurer les widgets, accédez à «Apparence → Widgets». Vous verrez ceci:
Sur la gauche, vous pouvez voir tous les widgets disponibles; et sur la droite, il y a toutes les zones de widgets prises en charge par votre thème actuel. Pour ajouter un widget à la barre latérale, tout ce que vous avez à faire est de saisir le widget par la gauche et de le glisser-déposer dans la zone de la barre latérale.
Par exemple, si vous souhaitez lister toutes vos pages dans la barre latérale, saisissez le widget «Pages» et faites-le glisser dans la section de la barre latérale. Vous pouvez également configurer certains paramètres de base du widget.
8) Expérimentez avec le thème que vous avez construit
Ce que nous avons abordé ci-dessus vous suffira pour comprendre comment créer un site Web qui se démarque et semble original, mais de nombreuses autres options sont disponibles.
Pour les voir tous, accédez à « Apparence → Personnaliser ». Cela lancera l’interface principale du Customizer avec tous ses paramètres et préréglages.
Nous vous encourageons à parcourir ce qui y est disponible et à jouer avec certaines des options. Vous tomberez probablement sur certaines personnalisations dont nous n’avons pas discuté ici.
Ajouter du contenu / des pages à votre site Web
Les pages sont l’essence même de votre site Web. Il est difficile d’imaginer un site Web sans aucune page, non ?
D’un point de vue technique, une page Web n’est qu’un document sur le Web. Il n’est pas très différent de votre document Word traditionnel, sauf qu’il contient des éléments de marque de votre site Web tels que l’en-tête et le pied de page.
Les pages Web sont faciles à créer dans WordPress. Mais avant d’entrer dans la procédure, examinons les pages que vous devez créer en premier lieu.
La plupart des sites Web trouveront les pages suivantes essentielles :
- Page d’accueil – c’est la première page que vos visiteurs voient lorsqu’ils accèdent à votre site Web
- À propos de la page – une page expliquant en quoi consiste votre site Web
- Page de contact – une page permettant aux visiteurs de vous contacter
- Page de blog – une liste de vos articles de blog les plus récents ; si vous ne prévoyez pas de bloguer, vous pouvez utiliser la page du blog comme espace pour les actualités et les annonces de votre entreprise
- Page Services – si le site Web que vous créez est destiné à une entreprise, utilisez cette page pour présenter vos services
- Page Boutique – pour les entreprises qui souhaitent lancer une boutique de commerce électronique
La plupart des pages ci-dessus auront une structure très similaire – la seule différence étant le contenu de la page réelle. En gros, une fois que vous aurez appris à créer une page, vous saurez comment les créer toutes. Avec cela, il y a une nuance ici, alors voyons maintenant comment créer quelques types de pages de base :
1) Créer une page d’accueil
Si vous utilisez Neve, votre page d’accueil ressemble à ceci :
Vous pouvez modifier la structure de cette page ainsi que les éléments qu’elle contient (tous les textes et images).
Pour ce faire, cliquez simplement sur le bouton «Modifier avec Elementor» dans la barre supérieure.
Ce que vous verrez est l’interface du générateur de page Elementor.
Elementor est ce que nous appelons un constructeur de pages visuelles. Cela signifie que vous pouvez cliquer sur n’importe quel élément que vous voyez sur la page et le modifier directement. Par exemple, si vous souhaitez modifier le titre principal, cliquez simplement dessus et commencez à taper.
Si vous regardez la barre latérale gauche, il y a tout un panneau de personnalisation. Vous pouvez ajuster la structure et le style de n’importe quel bloc de contenu. Par exemple, voici ce que vous pouvez voir lorsque vous travaillez sur le titre:
Une autre chose intéressante est que vous pouvez saisir n’importe quel élément de la page et le glisser-déposer ailleurs.
Pour ajouter de nouveaux éléments, cliquez sur la petite icône carrée dans le coin supérieur gauche.
Vous verrez une liste de tous les blocs de contenu disponibles.
Saisissez l’un des blocs et faites-le glisser sur le canevas de la page.
La meilleure façon de travailler sur votre page d’accueil est d’aller bloc par bloc et de modifier le contenu de démonstration qui se trouve sur la page.
Saisissez le nouveau contenu textuel, réalignez certains des blocs, supprimez ceux dont vous n’avez pas besoin et ajoutez-en de nouveaux en conséquence. Toute cette interface est assez intuitive à utiliser, alors passez une heure environ à l’utiliser et à expérimenter différentes choses.
2) Créer des pages telles que «À propos», «Services», «Contact»
Créer des pages Web classiques est encore plus facile à faire dans WordPress que de travailler sur votre page d’accueil. Allez dans «Pages → Ajouter nouveau». Vous verrez cette interface:
Chaque page a besoin d’un titre, alors commencez par en ajouter un là où il est dit « Ajouter un titre ». Par exemple, « À propos de nous » ou « Contact ».
Ensuite, choisissez une mise en page. Si vous créez une page standard, vous pouvez utiliser la première de la liste – « Une seule ligne ». Mais pour accélérer les choses, vous pouvez choisir dans la bibliothèque de modèles. Pour cela, cliquez sur le bouton bleu.
Vous verrez une fenêtre vous permettant de choisir parmi une gamme de sections de page prédéfinies. Si vous travaillez sur votre page À propos, par exemple, vous pouvez trouver et utiliser rapidement les blocs suivants:
Cliquez simplement sur le bouton «Insérer» à côté du bloc que vous aimez, et il sera ajouté à la page. À partir de là, vous pouvez le personnaliser davantage, modifier les textes ou remplacer des images.
Lorsque vous avez terminé, cliquez sur le bouton « Publier » dans le coin supérieur droit de l’écran.
Vous pouvez également suivre le même processus lorsque vous travaillez sur votre page de contact ou sur votre page de services.
Choisissez simplement différents blocs de page dans la bibliothèque de modèles. Par exemple, ceux-ci devraient fonctionner parfaitement sur une page de services:
Si vous souhaitez ajouter de nouveaux éléments de page à la main – au lieu d’utiliser les modèles – cliquez sur l’icône «+» qui se trouve dans le coin supérieur gauche de l’interface de l’éditeur.
Tout bloc que vous sélectionnez ici sera ajouté au bas de votre page. Voici à quoi ressemble un nouveau bloc de paragraphe:
Comme vous pouvez le voir, vous pouvez le modifier librement, changer les propriétés du texte, et il y a des paramètres de couleur dans la barre latérale droite.
Comme toujours, n’oubliez pas de cliquer sur « Publier » lorsque vous avez terminé.
3) Créer une page de blog
La page de blog est l’endroit où la liste de vos articles de blog les plus récents peut être trouvée.
La bonne nouvelle est que la page du blog a déjà été créée pour vous. Cela s’est produit lorsque vous avez installé WordPress et le thème Neve. Vous pouvez voir cette page en accédant à « Pages » :
Cliquez sur le lien «Afficher» pour voir votre page de blog en action.
Ajout de nouveaux articles de blog:
Pour ajouter de nouveaux articles de blog, accédez simplement à Aller à «Articles → Ajouter un nouveau».
Cette interface vous rappelle-t-elle quelque chose? Oui, c’est le même environnement d’édition que nous avons utilisé lors de la création de pages standard. Facile!
Configurer un menu de navigation
Avec une gamme de pages attrayantes créées, la prochaine étape de notre quête pour créer un site Web consiste à configurer votre navigation (un menu de site Web). Le menu est ce que vos visiteurs utiliseront pour passer de page en page sur votre site.
Allez dans « Apparence → Menus », et à partir de là, cliquez sur « Créer un nouveau menu ».
Voici comment créer votre premier menu étape par étape:
Félicitations, vous êtes prêt à lancer!
Pour résumer rapidement les étapes que vous avez apprises :
Table des matières
1. Obtenez un hébergement Web et enregistrez un domaine :
Choisir un nom de domaine
Choisir un hébergement de site Web
2. Configurez votre site Web via l’hébergeur :
Installer WordPress
3. Conception de votre site Web :
Trouver un thème
Installer un thème
Personnalisation et ajustements
4. Terminez en ajoutant du contenu (pages) :
Ajout et modification de pages
Configuration du menu de navigation
