2.4 · Modèles : blocs & pages prédéfinis

Niveau 2 · Intermédiaire : design & contenu riche

2.4Modèles : blocs & pages prédéfinis

Objectif : gagner du temps avec la bibliothèque de modèles (blocs, pages, kits) et créer/personnaliser ses propres modèles.
Temps estimé : 12 min · lecture autonome · Si vous n'avez que 5 min : lisez « L'essentiel en 30s » + le schéma.

L'essentiel en 30 secondes

  • La bibliothèque de modèles propose des blocs (sections prêtes), des pages entières et des kits (sites complets).
  • On peut enregistrer ses propres sections/pages comme modèles réutilisables.
  • Toujours personnaliser un modèle inséré à son identité (couleurs/polices de la charte, vrais textes).

Mini-cas filé — Nadia va plus vite

Pour la page « contact » du menuisier, Nadia part d'un bloc « contact » prêt à l'emploi : gain de temps. Elle l'adapte à la charte (couleurs, police) et remplace les faux textes par les vrais. Puis elle enregistre sa bannière maison comme modèle pour la réutiliser sur d'autres pages — et sur ses prochains projets.

Suite de 2.3 — après la charte, la productivité.

1. Blocs, pages, kits

La bibliothèque de modèles accélère le travail. Un bloc est une section prête (bannière, tarifs, témoignages, contact). Une page est une mise en page complète. Un kit est un ensemble cohérent (plusieurs pages + styles) pour démarrer un site entier.

On insère un modèle, puis on l'adapte. On peut aussi enregistrer n'importe quelle section/page qu'on a créée comme modèle personnel, pour la réutiliser dans le site ou l'exporter vers un autre projet.

2. Toujours personnaliser

Un modèle inséré arrive avec des couleurs, polices et textes génériques. La règle : le personnaliser — appliquer la charte (couleurs/polices globales du site) et remplacer les faux textes/images par les vrais. Un modèle non adapté fait « template » et casse la cohérence.

En Pro, les éléments globaux vont plus loin : un élément (ex. un bloc d'appel à l'action) réutilisé à plusieurs endroits se modifie partout en une fois.

Erreur d'interprétation fréquente : « j'insère un modèle, c'est terminé ». Non : un modèle arrive avec des styles et textes génériques. Sans le personnaliser (charte, vrais contenus), le site paraît standard et incohérent.
Modèles : insérer puis personnaliser Choisir un bloc, une page ou un kit, l'insérer, puis l'adapter à sa charte et ses vrais contenus ; enregistrer ses propres modèles. BibliothèqueBloc / page / kit → PersonnaliserCharte + vrais contenus → Enregistrer son modèleRéutiliser / exporter Insérer fait gagner du temps ; personnaliser évite l'effet « template ».
Insérer → personnaliser (charte + vrais contenus) → enregistrer pour réutiliser.
Version texte du schéma (SEO / lecteurs d'écran / traduction) : La bibliothèque propose blocs (sections prêtes), pages et kits (sites complets). On insère, puis on personnalise (charte globale + vrais textes/images). On peut enregistrer ses propres modèles pour réutiliser/exporter. En Pro, les éléments globaux se modifient partout en une fois. Leçon : toujours personnaliser.

🔎 Exemple concret — Page contact en deux temps (cas Nadia)

1. Insérer un bloc « Contact » prêt à l'emploi.
2. Appliquer la charte (couleurs/polices globales).
3. Remplacer les faux textes/images par les vrais (adresse, tél, atelier).
4. Enregistrer sa bannière maison comme modèle réutilisable.
→ Rapide, mais à l'identité du menuisier.

Résultat : productivité sans effet « template ».

Leçon : insérer vite, personnaliser toujours.

Vocabulaire de la section

Bibliothèque de modèles
Collection de blocs (sections prêtes), de pages et de kits à insérer.

Exemple simple : Nadia part d'un bloc « contact ».

Ce que ce n'est pas : tout recréer à la main quand un modèle existe.

Réflexe : un besoin standard ? chercher un bloc d'abord.

Bloc / page / kit
Bloc = une section prête ; page = une page entière ; kit = un site complet (pages + styles).

Exemple simple : bloc « tarifs », page « à propos », kit « artisan ».

Ce que ce n'est pas : confondre un bloc avec un kit entier.

Réflexe : section → bloc ; site → kit.

Ses propres modèles
Enregistrer une section/page créée pour la réutiliser (site ou autre projet).

Exemple simple : la bannière maison, enregistrée et réutilisée.

Ce que ce n'est pas : refaire la même bannière à chaque projet.

Réflexe : un élément réutilisable ? l'enregistrer en modèle.

Personnaliser les modèles
Adapter un modèle inséré à sa charte (couleurs/polices) et ses vrais contenus.

Exemple simple : appliquer la palette du site et les vrais textes.

Ce que ce n'est pas : laisser les couleurs et faux textes du modèle.

Réflexe : après insertion, toujours personnaliser.

Éléments globaux (Pro)
Un élément réutilisé à plusieurs endroits, modifiable partout en une fois.

Exemple simple : un bloc d'appel à l'action global.

Ce que ce n'est pas : copier-coller le même bloc et le mettre à jour partout à la main.

Réflexe : élément répété → global (Pro).

En pratique — Utiliser et créer des modèles

  1. Insérez un bloc prêt à l'emploi (ex. contact ou tarifs).
  2. Appliquez votre charte (couleurs/polices globales).
  3. Remplacez tous les faux textes et images par les vrais.
  4. Enregistrez une de vos sections comme modèle réutilisable.
Vous gagnez du temps avec les modèles sans tomber dans l'effet « template », et vous constituez votre bibliothèque.

Script prêt à dire — expliquer le gain de temps au client (20 s)

« Pour aller plus vite, je pars de sections éprouvées que j'adapte entièrement à votre identité : vos couleurs, vos polices, vos vrais textes et photos. Vous gagnez en délai sans perdre en personnalisation — le site reste bien le vôtre, pas un modèle standard. »

Vendre la rapidité sans laisser craindre un site « tout fait ».

Modèle copier-coller — check d'un modèle inséré

MODÈLE INSÉRÉ : _______________ (bloc / page / kit)
CHARTE APPLIQUÉE (couleurs/polices globales) : oui / non
FAUX TEXTES REMPLACÉS : oui / non
IMAGES RÉELLES : oui / non
LIENS/BOUTONS VÉRIFIÉS : oui / non
ENREGISTRÉ COMME MODÈLE RÉUTILISABLE ? : oui / non

Démarrage rapide

Partir d'un kit cohérent, puis tout adapter à la charte du client.

Section ponctuelle

Un bloc « tarifs » ou « contact » suffit, personnalisé.

Réutilisation

Enregistrer ses sections maison pour ses futurs projets freelance.

Pro

Éléments globaux pour un appel à l'action présent sur plusieurs pages.

✓ Bonnes pratiques

  • Partir d'un modèle pour un besoin standard.
  • Toujours appliquer la charte et les vrais contenus.
  • Enregistrer ses sections réutilisables.

✗ Pièges fréquents

  • Laisser les couleurs/textes génériques d'un modèle.
  • Refaire à la main ce qu'un bloc fournit.
  • Copier-coller un même bloc partout au lieu d'un élément global (Pro).

Points clés à retenir

  • Bibliothèque : blocs, pages, kits.
  • Enregistrer ses propres modèles.
  • Toujours personnaliser (charte + vrais contenus).
  • Pro : éléments globaux modifiables partout.

Défi 48h — appliquez demain

Insérez un bloc prêt à l'emploi, appliquez votre charte, remplacez tous les faux contenus, puis enregistrez une de vos sections comme modèle réutilisable. 20 minutes.

Checklist sortie de section
  • J'insère un modèle et je l'adapte à la charte.
  • Je remplace tous les faux contenus.
  • J'enregistre mes sections réutilisables.
Auto-évaluation 1-5 : mes modèles n'ont plus l'effet « template » ?je me constitue une bibliothèque réutilisable ?

Questions fréquentes

Quelle différence entre un bloc, une page et un kit ?

Un bloc est une section prête (bannière, tarifs…) ; une page est une mise en page complète ; un kit regroupe plusieurs pages et styles pour démarrer un site entier.

Dois-je toujours personnaliser un modèle ?

Oui : appliquez votre charte (couleurs/polices globales) et remplacez les faux textes/images par les vrais. Sinon le site paraît standard et incohérent.

Puis-je réutiliser mes propres créations ?

Oui : enregistrez n'importe quelle section/page comme modèle personnel, réutilisable dans le site ou exportable vers un autre projet — un gain de temps durable.

Vérifiez votre compréhension — scénario

Nadia insère un bloc « contact » prêt à l'emploi. Que doit-elle faire ensuite ?

Ressources supplémentaires (optionnel, pour aller plus loin)

Examen du niveau 2Questions inédites et durcies pour valider vos acquis