Projet, séance 17 : construire ce qui a été décidé

Sept étapes, une charte réglée une fois, et cinq contrôles avant de partir

Où nous en sommes

L’arborescence est figée, les maquettes sont testées. À partir d’aujourd’hui, on construit ce qui a été décidé, et rien d’autre.

C’est la séance où l’on gagne ou perd trois jours, et la différence tient dans l’ordre des gestes.

Ce que vous saurez à la fin de cette séance

• Suivre un ordre de montage qui évite de refaire deux fois le même travail
• Régler une charte une seule fois, et la voir s’appliquer partout
• Monter la page d’accueil à partir de la maquette, sans y ajouter d’idées neuves
• Vérifier un site en construction sur les points qui coûtent cher plus tard

1. L’ordre du montage

1.1 Sept étapes, et elles ne se permutent pas

1. L’environnement : hébergement ou installation locale, et un accès que vous maîtrisez.
2. WordPress, puis ses réglages : permaliens en « nom de l’article », indexation fermée pendant la construction.
3. Le thème, choisi sobre, et un thème enfant si vous devez toucher au code.
4. Les extensions minimales : sécurité, sauvegarde, formulaire, référencement. Rien d’autre pour l’instant.
5. La charte : couleurs, typographie, espacements, définis une fois dans les réglages du thème.
6. Les gabarits : un par type de page.
7. Le contenu, en dernier.

Deux erreurs coûtent trois jours. Choisir le thème après avoir écrit le contenu : tout est à remettre en forme. Régler les couleurs page par page : tout est à reprendre au premier changement d’avis.

1.2 L’indexation fermée pendant la construction

Un site en chantier ne doit pas être indexé : des pages incomplètes, des titres provisoires et du faux contenu se retrouveraient dans les résultats.

Le geste : la case de Réglages > Lecture reste cochée pendant toute la construction, et se décoche le jour de la mise en ligne. Le mettre dans votre liste de vérification finale : c’est l’oubli le plus fréquent et le plus coûteux.

1.3 Le thème : sobre, maintenu, et documenté

Sobre, parce qu’un thème très marqué se voit trois mois et se dépasse ensuite.

Maintenu, parce qu’un thème abandonné devient une faille au premier changement de version de WordPress.

Documenté, parce que vous n’êtes pas la dernière personne à travailler sur ce site.

Atelier 1, l’installation et le thème

Individuellement, sur poste. Quarante-cinq minutes de travail, dix de mise en commun.

1. Installez ou reprenez votre environnement.
2. Réglages : permaliens en « nom de l’article », indexation fermée, titre du site, fuseau.
3. Choisissez et activez un thème sobre, maintenu.
4. Installez les quatre extensions : sécurité, sauvegarde, formulaire, référencement. Pas une de plus.
5. Lancez une sauvegarde et vérifiez qu’elle est allée quelque part.
6. Réglez la charte : deux couleurs, une typographie, une échelle d’espacement.
7. Créez les pages vides de votre arborescence, et montez le menu.

Version courte : points 1, 2, 3 et 7.

2. Les gabarits et la charte

2.1 Ce qui se règle une fois, et ce qui se règle à chaque page

La règle : si vous vous surprenez à régler une couleur dans une page, arrêtez-vous. Elle se règle dans la charte, et elle s’appliquera partout.

2.2 Un gabarit par type de page

Trois suffisent pour un site d’entreprise : la page d’accueil, la page de service, la page de contenu.

Ce qu’un gabarit décide : l’ordre des zones, leurs proportions, la place de l’action. C’est la maquette de la séance précédente, transposée.

Ce qu’il ne décide pas : le contenu. Un gabarit rempli de contenu n’est plus un gabarit.

2.3 Les composants réutilisables

Un bloc de preuve, un bloc d’appel à l’action, une bande de témoignage : ils se construisent une fois et se réutilisent.

Le bénéfice : quand le commanditaire demande de changer le bouton, on le change à un endroit. Sans composants, on le change quinze fois, et on en oublie trois.

3. La structure des pages principales

3.1 De la maquette à la page

Les cinq zones de votre maquette deviennent cinq sections. Dans cet ordre, avec ces proportions, avec les vrais libellés que vous avez écrits.

Ce qui n’est pas dans la maquette n’entre pas dans la page. C’est la règle du jour, et c’est elle qui fait tenir le projet dans le temps imparti.

3.2 Les trois pièges du montage

Le contenu de démonstration. Le thème en installe, il est joli, et il reste. On le supprime avant d’ajouter quoi que ce soit.

Les blocs du catalogue. Un thème propose cinquante blocs décoratifs. Chacun ajoute du poids et de la maintenance. On n’en utilise que ce que la maquette demande.

L’idée neuve. Elle arrive toujours vers la troisième heure, elle est bonne, et elle n’est pas dans la maquette. On la note, on ne la monte pas.

3.3 Le responsive n’est pas une option

La moitié des visiteurs arrivera sur un téléphone. On vérifie chaque section sur téléphone au moment où on la monte, pas à la fin.

Ce qui casse le plus souvent : les titres trop longs, les images de fond avec du texte dessus, les tableaux, et les menus à trois niveaux.

Le piège. Vérifier le rendu sur téléphone à la fin du projet est la meilleure façon de découvrir qu’il faut refaire trois sections. Le vérifier section par section coûte trente secondes à chaque fois, et ne coûte rien à la fin.

Atelier 2, la page d’accueil montée

Individuellement, sur poste. Quarante-cinq minutes de travail, dix de mise en commun.

1. Supprimez tout contenu de démonstration.
2. Créez le gabarit de la page d’accueil : cinq sections, dans l’ordre de la maquette.
3. Montez la zone d’arrivée avec ses vrais libellés. Vérifiez sur téléphone.
4. Montez la preuve, puis vérifiez sur téléphone.
5. Montez l’action principale, une seule, avec son vrai libellé.
6. Notez sur une feuille les idées neuves qui vous viennent. Ne les montez pas.
7. Relancez une sauvegarde avant de partir.

Version courte : points 1, 2, 3 et 5.

4. Ce qui se vérifie avant de partir

4.1 Cinq contrôles, et ils prennent dix minutes

1. La sauvegarde est partie, et elle est allée ailleurs que sur le serveur du site.
2. Le formulaire envoie, et vous recevez, depuis une adresse extérieure.
3. Chaque section tient sur téléphone.
4. Le menu ne pointe vers aucune page inexistante.
5. L’indexation est toujours fermée. Elle s’ouvre le jour de la mise en ligne, pas avant.

4.2 Ce qu’on emporte pour la séance suivante

La liste des contenus manquants, la liste des visuels à obtenir, et les idées neuves notées mais non montées.

Ces trois listes sont le travail de la séance suivante, et les avoir écrites fait gagner la première heure.

À retenir. Le montage n’est pas un moment de conception. Tout ce qui se décide pendant le montage est décidé sans test, dans l’urgence, et sur un écran. Les décisions ont été prises la semaine dernière, sur papier, avec des tests. Le travail d’aujourd’hui consiste à les exécuter, pas à les rouvrir.

Synthèse

1. Sept étapes, et elles ne se permutent pas. Le contenu vient en dernier.
2. L’indexation reste fermée pendant toute la construction.
3. Un thème sobre, maintenu, documenté. Un thème enfant si vous touchez au code.
4. Quatre extensions, pas une de plus : sécurité, sauvegarde, formulaire, référencement.
5. La charte se règle une fois. Une couleur réglée dans une page est une couleur à reprendre.
6. Trois gabarits suffisent : accueil, service, contenu.
7. Ce qui n’est pas dans la maquette n’entre pas dans la page.
8. On vérifie sur téléphone section par section, jamais à la fin.
9. Cinq contrôles avant de partir, dix minutes.

Sources

Séance vérifiée le 28 août 2026. Les écrans montrés en séance sont ceux des thèmes choisis par les apprenants : ils diffèrent d’un poste à l’autre, et le formateur les commente en direct.