Vous préparez un projet digital à Casablanca ? Parlons création de site web. Une présence en ligne doit être claire, rapide et utile pour répondre aux besoins du public visé.
Ce qu'il faut retenir
- Une page = une intention. Si vous ne pouvez pas nommer l'action attendue du visiteur, la page n'est pas prête à être écrite.
- La réponse va en premier, les nuances ensuite. C'est vrai pour le lecteur pressé comme pour les moteurs qui citent des paragraphes.
- Le budget de performance se dépense une seule fois : une page rapide est une page où l'on a refusé quelque chose.
- Les seuils sont publics et mesurables : LCP ≤ 2,5 s, INP ≤ 200 ms, CLS ≤ 0,1. Vérifiables avec PageSpeed Insights sur n'importe quelle URL.
Quel rôle une page web peut-elle remplir ?
Une page doit répondre à un besoin défini plutôt que tenter de tout présenter. Selon le contexte, elle peut :
- expliquer une offre et ses conditions ;
- présenter une entreprise et ses coordonnées ;
- orienter vers une demande de devis, un achat ou un rendez-vous ;
- documenter un sujet utile aux clients.
Le site ne garantit ni visibilité ni demandes commerciales. Il fournit une base que le contenu, le référencement et les actions de communication peuvent développer dans le temps.
Les fondations d'une page efficace
1. Une mise en page adaptée aux écrans
Votre site doit rester lisible et utilisable sur smartphone comme sur ordinateur. Testez les contenus, les menus, les formulaires et les boutons sur plusieurs tailles d'écran.
2. Une performance mesurée
Dimensionnez les images, chargez les ressources selon leur utilité et limitez les scripts tiers. Mesurez ensuite les pages importantes sur des appareils représentatifs plutôt que de supposer leur rapidité.
3. Un contenu précis
Présentez les services, les livrables, les conditions et les coordonnées avec un vocabulaire compris par le public visé. Les références locales doivent correspondre aux zones réellement desservies, sans ajouter des noms de quartiers uniquement pour le référencement.
4. Des actions explicites
Utilisez des libellés qui annoncent le résultat de l'action, comme « Demander un devis » ou « Voir les réalisations ». Les boutons doivent rester visibles et utilisables au clavier sans interrompre la lecture.
5. Des canaux de contact cohérents
Ne proposez que les canaux réellement suivis par l'équipe. Indiquez clairement quand utiliser le formulaire, le téléphone ou une messagerie et veillez à ce que les coordonnées restent à jour.
Les principes à évaluer pour un site web en 2026
- Hiérarchie visuelle : les titres, espacements et contrastes doivent guider la lecture.
- Animations utiles : chaque mouvement doit informer sans gêner les utilisateurs qui préfèrent réduire les animations.
- Composants cohérents : boutons, formulaires et cartes doivent suivre les mêmes règles sur toutes les pages.
- Accessibilité : navigation au clavier, libellés, alternatives textuelles et contrastes doivent être vérifiés.
- Maintenance : le contenu doit pouvoir être mis à jour sans casser la structure de la page.
Le budget de performance : décider ce qu'on refuse
Une page rapide n'est pas une page optimisée après coup, c'est une page où l'on a fixé un plafond avant de commencer. Voici les ordres de grandeur que nous appliquons sur une page vitrine, et ce qu'ils impliquent concrètement.
| Ressource | Plafond visé | Ce qu'on refuse pour y tenir |
|---|---|---|
| Image principale | WebP, dimensionnée à l'affichage réel | Le visuel de 3 Mo redimensionné en CSS |
| Polices | 2 familles, graisses utilisées uniquement | Six graisses « au cas où » |
| JavaScript | Le strict nécessaire, chargé en différé | Une librairie entière pour un carrousel |
| Scripts tiers | Mesure d'audience, consentement | Widgets sociaux, chats non utilisés |
| Vidéo | Aucune en lecture automatique | La vidéo de fond d'écran en page d'accueil |
Ces plafonds servent les seuils Core Web Vitals publiés par Google et documentés sur web.dev : affichage du contenu principal sous 2,5 secondes, réactivité sous 200 millisecondes, stabilité visuelle sous 0,1. Au Maroc, où la consultation est très majoritairement mobile d'après les tableaux de bord de l'ANRT, ils se mesurent sur réseau mobile et pas sur la fibre du bureau.
Structurer une page pour qu'elle soit citable
Les moteurs génèrent désormais des réponses plutôt que des listes de liens, et ce qu'ils reprennent est un paragraphe, pas une page. Une page bien structurée est donc une page dont chaque bloc se comprend isolément.
- Un seul H1, qui nomme le sujet de la page en langage courant.
- Des H2 qui posent des questions réelles, celles que vos clients formulent au téléphone.
- Une réponse directe sous chaque titre, en deux phrases maximum, avant tout développement.
- Un chiffre, un délai ou un oui/non dans cette réponse dès que le sujet le permet.
- Un tableau plutôt qu'un paragraphe dès que l'information comporte trois dimensions ou plus.
- Des données structurées cohérentes avec ce qui est affiché : le balisage schema.org décrit la page, il ne la complète pas.
La checklist d'accessibilité minimale
Les WCAG du W3C donnent des critères vérifiables. Cinq d'entre eux suffisent à éliminer la majorité des problèmes réels sur une page vitrine.
| Contrôle | Comment le vérifier |
|---|---|
| Contraste du texte ≥ 4,5:1 | Outil de contraste du navigateur sur le texte courant |
| Navigation complète au clavier | Parcourir la page à la touche Tab, sans souris |
| Focus toujours visible | Vérifier qu'aucun outline: none ne traîne en CSS |
| Alternatives textuelles | Chaque image porteuse de sens a un alt descriptif |
| Formulaires étiquetés | Chaque champ a un <label> associé, pas seulement un texte d'exemple |
Un point souvent négligé : le texte d'exemple dans un champ (placeholder) n'est pas une étiquette. Il disparaît dès la saisie, et il est ignoré par une partie des lecteurs d'écran.
Sources
- web.dev — Core Web Vitals — indicateurs et seuils.
- W3C — WCAG — critères d'accessibilité.
- Google Search Central — guide de démarrage du référencement.
- ANRT — usages Internet et mobile au Maroc.
Les plafonds de performance indiqués sont ceux que nous appliquons sur nos projets. Ils ne constituent pas une norme sectorielle.
Vérifier la page avant publication
Relisez les informations, testez les liens et les formulaires, puis contrôlez l'affichage sur mobile et ordinateur. Vérifiez aussi le titre de page, la description, l'adresse canonique et l'indexabilité lorsque la page doit apparaître dans les moteurs.
Une webpage moderne en 2026 est avant tout compréhensible, robuste et maintenable. Les effets visuels ne doivent intervenir qu'après ces fondations.
