L’arborescence d’un site
Définir l’arborescence (ou l’architecture) d’un site consiste à représenter graphiquement sa structure et à organiser les différentes pages en hiérarchisant les données de façon logique. Cette structure comprend la page d’accueil, les rubriques principales et les sous-rubriques.
Une arborescence simple et claire facilite le parcours de l’internaute pour accéder aux informations de manière rapide et intuitive. Elle offre aussi une vision d’ensemble du site utile lors de sa conception et de sa maintenance.
L’ergonomie du site
L’ergonomie englobe la mise à disposition de fonctionnalités facilitant la navigation et le design général du site, qui doit rester sobre et clair.
La navigation
Le site doit offrir un système de navigation intuitif comprenant :
- Un menu de navigation principal clair et accessible
- Un fil d’Ariane pour situer l’internaute dans l’arborescence
- Un moteur de recherche interne pour trouver rapidement un contenu
- Un formulaire de contact pour faciliter la prise de contact
Le responsive design
Le site doit être accessible depuis tout support utilisé par les internautes (ordinateur, tablette, smartphone), quels que soient le système d’exploitation et le navigateur. On dit alors que le site est en responsive design. L’UX (expérience utilisateur) constitue un levier stratégique : un site agréable à utiliser retient les visiteurs plus longtemps et favorise les conversions.
La maquette fonctionnelle d’une page web
Une maquette fonctionnelle (wireframe) est réalisée pour chaque page web afin de définir la disposition des éléments et l’organisation de l’information.
Les zones d’une page web
Une page web est composée de trois zones principales :
- L’en-tête (header) : élément fixe qui reste identique sur toutes les pages (logo, menu de navigation)
- Le corps de page (body) : zone variable d’une page à l’autre, qui contient le contenu spécifique
- Le pied de page (footer) : partie fixe en bas de page, présente sur toutes les pages du site (mentions légales, liens utiles, coordonnées)
Une barre latérale (sidebar) peut compléter la mise en page avec des éléments secondaires (formulaire de recherche, catégories, liens rapides).
L’évolution de la maquette
Chaque maquette est ensuite traduite et codée dans un langage web. Les CMS comme WordPress proposent des plugins et extensions qui permettent d’ajouter de nouvelles fonctionnalités sans intervention sur le code source.
Fiche de révision
Vocabulaire clé
- Charte graphique : Document de référence fixant l’ensemble des règles relatives à l’identité visuelle (couleurs, polices, logo, images, mise en page) pour garantir la cohérence de tous les supports de communication.
- CMS (Content Management System) : Système de gestion de contenu permettant de créer et d’administrer un site web sans compétences avancées en programmation (WordPress, Wix, Shopify).
- Loi LCEN : Loi pour la Confiance dans l’Economie Numérique (21 juin 2004) imposant l’affichage de mentions légales obligatoires sur les sites professionnels. Amende jusqu’à 75 000 euros pour une personne morale en cas de non-respect.
Comparatif des noms de domaine : bonnes et mauvaises pratiques
| Critère | Bonne pratique | Mauvaise pratique |
|---|---|---|
| Longueur | Court et mémorisable | Trop long, difficile à saisir |
| Mots-clés | Intègre l’activité ou la marque | Aucun lien avec l’offre |
| Tirets et accents | Sans tiret ni accent | Utilise des tirets ou caractères spéciaux |
| Extension | Adaptée à la cible (.fr pour la France, .com pour l’international) | Extension incohérente avec le marché visé |
| Disponibilité | Vérifiée sur un outil Whois ou Namecheckr | Non vérifiée avant le choix |
L’essentiel à retenir
- La charte graphique est le document de référence de l’identité visuelle : elle fixe les couleurs, polices, usages du logo et règles de mise en page pour garantir la cohérence de tous les supports digitaux.
- Le nom de domaine doit être court, mémorisable, sans tiret ni accent, et intégrer si possible un mot-clé lié à l’activité ou à la marque.
- L’extension du nom de domaine reflète la stratégie de ciblage : « .fr » pour une clientèle française, « .com » pour un développement international.
- Le footer d’un site web doit contenir au minimum : les mentions légales, les coordonnées, les liens vers les réseaux sociaux, la politique de confidentialité et, idéalement, un formulaire d’inscription à la newsletter.
- 88 % des internautes affirment ne pas revenir sur un site après une mauvaise expérience de navigation (Amazon Web Services, 2023).
Vous avez termine ce chapitre ? Testez vos connaissances avec le QCM interactif du chapitre 10 →
