Avant de se lancer dans la création de site, il vaut mieux se préparer un minmimum. Que ce soit du côté client que du prestataire, certaines étapes sont indispensables.
Besoin d’un spécialiste WordPress pour votre projet ? Contactez-moi
Pré-requis : La matière première
Que ce soit pour un site WordPress ou pour n’importe quel projet web, il est essentiel de réunir un maximum de ressources.
Les ressources dont il faut disposer avant de commencer la conception d’un site internet sont tous les contenus : textes, les photos, vidéos, cartes, etc …
Portés par l’envie de création, trop de designers (et moi le premier) ont tendance à vouloir se lancer dans la conception du design trop rapidement sans avoir assez d’éléments textuels ou graphiques, et c’est une erreur.
Biensur il existe la possibilité d’utiliser du faux texte (« lorem ipsum » ou aussi appelé « bolo bolo ») et pour les visuels des images de placement (placeholder images), mais d’expérience je peux vous assurer qu’avoir du vrai texte, même non-definitif, fait une grande différence.
1. Les maquettes graphiques
Bien avant de se lancer dans le codage de thème il est important de réfléchir le design de son site en fonction du contenu et non l’inverse.
Le designer doit fournir une maquette par gabarit de pages. En effet, pas besoin de fournir une maquette par page, mais plutot une maquette par type de pages.
Les gabarits les plus couramment réalisés et indipensables sont : La page d’accueil (la « home »), une page intérieure, une page de contact.
Pour les projets incluant un blog, vous devez disposer d’une maquette pour la liste des articles et un autre pour le détail d’un article
Attention aux formulaires qui nécessitent de prévoir des messages d’erreurs, et aux pages de type « mon compte » qui sont bien souvent vides lorsque l’utilisateur d’inscrira la première fois sur votre site.
Pour résumer ce point : Préparer l’ensemble des gabarits graphiques permet de vérifier que tout à bien été pensé en amont, et qu’il n’y aura pas d’oublis pendant le développement.
2. Intégration HTML des maquettes
L’intégration c’est tout ce qui comprend la création de code le HTML pour le balisage de la page, le CSS pour la mise en forme graphique, le Javascript pour l’interactivité au niveau navigateur web.
L’intégration est l’étape durant laquelle les maquettes graphiques sont converties en code dans un format cliquable. L’intégrateur prévoit les styles et intéractions graphiques qui seront accessibles à l’utilisateur, comme les menus de navigation, les effets de survol (rollovers), les fenêtres modales, etc…
C’est aussi l’étape durant laquelle les textes sont mis en forme, avec une taille est une couleur spécifique pour chaque titre et paragraphe. Ces règles de présentation sont définies dans le fichier .CSS du thème WordPress.
L’intégration HTML permet également l’intégration de premiers textes mais surtout des images.
3. Création du thème WordPress
Une fois les maquettes HTML intégrées, nous pouvons passer à l’étape de développement WordPress !
a. Installation de WordPress
Un des pré-requis pour cette étape est de disposer d’un serveur Web avec une base de donnée.
WordPress dans sa version open-source est un outil de création de site web téléchargeable gratuitement. Pour installer WordPress il faut télécharger les fichiers sur le site officiel et les envoyer sur votre serveur web, le plus souvent par un logiciel FTP. Une fois les fichiers en ligne, une interface d’installation vous guidera pas à pas.
L’intégration à WordPress des maquettes HTML ne se limite pas à un simple transfert de code. Elle nécessite plusieurs étapes supplémentaires afin de rendre la modification des pages WordPress possible tout en conservant le design souhaité. Cela inclut la conversion du HTML en un format compatible et l’ajout de balises spécifiques pour la gestion de contenu dans WordPress.
b. Développement du theme
Seuls quelques fichiers sont indispensables pour la création d’un thème WordPress, un thème de base peut être composé de seulement un fichier index.php et d’un fichier style.css
Dans les faits, un thème wordpress est composé de plusieurs fichiers et dossiers nécessaires à la mise en place des fonctionnalités WordPress. (exemple: le fichier functions.php).
L’objectif du developpement de thème WordPress est de rendre les éléments HTML précédemment créés modifiables par la partie administration (aussi appelé Back Office). Une fois le thème développé, l’utilisateur, selon son role, sera capable de créer ou de modifier des pages, modifier les menus de navigation, changer les images, … Beaucoup de possibilités de personnalisation sont envisageables si elles ont été pensées en amont, lors de la phase de maquettage par exemple.
Pour en savoir plus sur la personnalisation de site WordPress.
Durant l’étape de création du thème, le contenu peu encore être non-definitif.
c. Installation et configuration des plugins WordPress
Hormis le thème, une autre composante essentielle de WordPress est le système d’extensions (ou plug-ins) permettant de rendre cet outil de création de site web extensible en y ajoutant des fonctionnalités très variées. Un professionnel aguerri saura vous guider dans cette jungle et vous proposer les extensions utiles de WordPress ou celles qui sont juste indispensables à votre projet.
Biensur il ne suffit pas d’installer puis d’activer un plugin pour que celui-ci fonctionne, bien souvent il faut passer par une page d’option permettant la configuration plus ou moins detaillée du plugin.
A noter aussi que suivant les besoins d’un projet, il est possible de créer soit même des extensions. C’est d’ailleurs ce que je recommande dans le cas où une fonctionnalité particulière devrait continuer à fonctionner même en changeant de thème par la suite.
4. Tests, validations & insertion des contenus definitifs
Voilà, le graphisme du thème est créé, et à cette étape les fonctionnalités ont été testées et le site est techniquement fonctionnel.
Il ne reste plus qu’a insérer les contenus définitifs, les textes validés et les photos sans trademark.
L’étape suivante sera biensur la mise en ligne sur le serveur et la mise en place de routines de sauvegardes et de maintenance, mais cela fera l’objet d’autres articles 😉
Conclusion
Alors évidemment ce n’est qu’un rapide aperçu, presque chaque étape pourraient être décomposé en de multitudes d’autres, mais ce qu’il faut retenir c’est que les 4 étapes qui sont selon moi immuables à la création d’un site Worpress sont la maquette, l’intégration HTML, le developpement WordPress et pour finir les tests et l’ajout des contenus définitifs.
Image d’illutration Pixabay – StockSnap