Pages et sections

Avant de penser au contenu, il faut poser la structure de votre site. Dans Prezevent, cette structure repose sur deux niveaux : les pages, qui découpent votre site en plusieurs écrans, et les sections, qui organisent le contenu à l’intérieur de chaque page. Bien comprendre cette logique vous fera gagner beaucoup de temps lors de la conception.

Plusieurs pages par site

Un site n’est pas limité à une seule page. Vous disposez toujours d’une page d’accueil, le point d’entrée de votre site, et vous pouvez ajouter autant de pages secondaires que nécessaire : un programme détaillé, une page d’accès et de plan, une page partenaires, une foire aux questions, etc. Chaque page possède sa propre adresse et son propre contenu, mais partage le thème graphique commun du site.

Astuce

Gardez la page d’accueil concise et orientée vers l’essentiel : ce que vos invités doivent comprendre et faire en premier. Les détails peuvent vivre sur des pages secondaires.

Les sections : des conteneurs horizontaux

Chaque page se compose d’une pile de sections empilées de haut en bas. Une section est un conteneur horizontal qui occupe toute la largeur visible et dans lequel vous viendrez déposer vos composants. C’est l’unité de base avec laquelle vous rythmez votre page : une section pour l’en-tête, une autre pour la présentation, une autre pour l’appel à l’inscription, et ainsi de suite.

Des mises en page en colonnes

À l’intérieur d’une section, vous choisissez une mise en page qui détermine le nombre de colonnes et leur répartition. Plusieurs dispositions sont disponibles :

• Une seule colonne, pleine largeur.
• Deux colonnes au tiers et aux deux tiers (1/3 – 2/3).
• Deux colonnes égales (1/2 – 1/2).
• Deux colonnes aux deux tiers et au tiers (2/3 – 1/3).

Ces dispositions vous permettent, par exemple, de placer un texte d’un côté et une image de l’autre, ou de créer une section d’introduction centrée sur une seule colonne.

Largeur, alignement et espacement

Au-delà des colonnes, chaque section offre plusieurs réglages pour soigner la présentation :

• La largeur du conteneur : pleine largeur (le contenu s’étend d’un bord à l’autre de l’écran) ou boxé (le contenu est centré dans une largeur maximale, ce qui le rend plus lisible sur grand écran).
• L’alignement du contenu : à gauche, centré ou à droite.
• Le padding et l’espacement (gap) : la marge intérieure de la section et l’espace entre les colonnes ou les composants, pour aérer ou densifier votre mise en page.

Fond et couleurs

Pour distinguer visuellement vos sections, vous pouvez leur appliquer une couleur de fond ou une image de fond. C’est un moyen simple de séparer les grandes parties de votre page et de donner du relief à votre site sans complexité.

En résumé

1. Créez vos pages : la page d’accueil, puis les pages secondaires utiles.

2. Sur chaque page, empilez des sections de haut en bas.

3. Pour chaque section, choisissez une mise en page en colonnes.

4. Ajustez la largeur du conteneur, l’alignement, le padding et l’espacement.

5. Ajoutez si besoin une couleur ou une image de fond.

Une fois la structure en place, vous pouvez la remplir avec des composants.