Dernièrement, Igor Web a été amené à présenter un projet de remise à neuf du site internet de la mairie de Pouligny Notre-Dame dans l’Indre.
Visiter le site : https://demo-001.igorwebservice.com/ ! Démo complète interactive !
Le site actuel est en effet riche en contenu, mais limité dans la présentation et la mise en page, et assez peu personnalisable, ce qui correspondait aux besoins de son époque (début des années 2010) mais laisse à désirer de nos jours.
Le projet.
L'ancien site
Depuis ce temps la commune a en effet investi et créé une base de loisirs avec téléski nautique, ce qui implique un plus grand effort de communication pour la promouvoir, qui passe en partie par un site internet moderne et agréable a utiliser.
Le nouveau site est basé sur WordPress et hébergé chez OVH, l’ancien site utilise déjà une version de WordPress modifiée, il aura désormais accès à toutes les fonctionnalités du CMS1.
Étant un site d’administration publique, il y avait plus de sens à ce qu’il soit hébergé en France ou au moins au sein de l’Union Européenne, ce qui explique le choix d’OVH Cloud.
Voici quelques captures d’écran du site :
Le site est optimisé pour les smartphones.
Une section « Petites annonces » a été créée.
Les images sont automatiquement optimisées.
Le sous-site de la base de loisirs est pensé pour des amateurs de sports nautiques.
Performance et optimisation
Tout au long de la création, Igor Web a vérifié les performances du site à l’aide de Lighthouse et de pagespeed.web.dev par Google.
En effet, bien qu’il s’agisse d’un travail peu visible, il est capital car un site rapide et performant est un site mieux référencé par les moteurs de recherche, ce qui implique ici une plus grande visibilité pour la commune et sa base de loisirs.
Sachant que de nos jours la plupart des sites web sont visités sur mobile, le site a été créé pour être rendu sur tous types d’écran : mobile, tablette, ordinateur.
Il reste à améliorer mais on est sur la bonne voie. (Le 76 en « bonne pratiques » s’explique en particulier par l’absence de certificat SSL et de https)
Les temps de chargement sont détaillées image par image.
Design
L’UX et l’UI ont fait l’objet d’un travail soutenu, l’interface ayant été pensée pour évoquer le thème des sports nautiques et de plein-air, ainsi qu’une image dynamique.
L’expérience utilisateur est pensée pour faciliter la navigation entre les sous-parties du site, la base de loisirs et le camping municipal ayant presque leurs sous-sites à l’intérieur du site principal.
Nous avons eu la chance inestimable de disposer de photos de haute qualité pour agrémenter le site, prise par des adhérents de l’association de la base de loisirs nautiques.
Merci à @fafiotwakecrew pour leur superbes photos.
Vue mobile, le camping municipal.
Les images s’agrandissent au clic.
Nous avons eu la chance de disposer d’infographies de qualité, merci à monsieur « Tonton ».
Un site pour les riders, des fous de glisse et de skate et de bonne humeur…
Du côté des fonctionnalités on a pris le parti d’aller à l’essentiel, ainsi l’on retrouve une carte Leaflet, plus légère que d’autres solutions, ainsi que de formulaires de contacts simples (CF7 pour les connaisseurs) avec envoi des messages directement sur la boite mail.
Ces solutions permettent un usage de ressources limitées tout en offrant des fonctionnalités étendues aux utilisateurs. Leur autre avantage est qu’ils n’utilisent pas ou peu de cookies, ce qui facilite la mise en conformité avec le RGPD
(A vrai dire, à part les données de connexion pour les utilisateurs, le site ne conserve pas de données personnelles ou de cookies.)
Le site n’utilise que les cookies fonctionnels. (nécessaires au fonctionnement du site.)
Les cartes Leaflet sont enfantines à utiliser.
Efficace et rapide.
Afin de faciliter le travail du personnel de la mairie, le site est doté d’une partie documentation interne, accessible uniquement aux éditeurs du site.
Véritable base de connaissances, cette documentation explique chaque cas que peuvent rencontrer les agents de la commune, et leur indique pas-à-pas comment utiliser le site.
On a pris le parti d’une méthode casuistique4 pour expliquer le fonctionnement du site car les agents de la commune voulaient surtout une formation concrète pour faire connaitre leur ville, plutôt qu’une formation sur le fonctionnement général de WordPress.
On se connecte par un lien en bas de page.
La documentation interne explique chaque cas de figure.
On peut rechercher au sein de la documentation pour aller plus vite.
Un index pour les gouverner tous…
Résultats de recherche montrant la documentation interne.
Ainsi, les agents pourront utiliser le site eux-mêmes et l’alimenter petit à petit. Procès verbaux, conseils municipaux, évènements sportifs ou célébrations sur la commune, ils pourront les annoncer sur le site.
Architecture
Le site tire parti des fonctions de blog de WordPress, et surtout des boucles de requêtes introduites dans les dernières versions.
Ce boucles permettent, entre autres, de charger le contenu de plusieurs articles sur une page, ce qui permet de créer des “mini-blogs” dédiés à tel ou tel sujet.
Par exemple : au sein du même site, le camping municipal de Ligny dispose de son propre blog pour annoncer ses actualités et évènements, dont les publications sont séparées du blog de la commune qui lui se concentre sur les évènements de la ville.
De même la base de loisirs, qui prévoit de publier de nombreuses annonces d’évènements sportifs, possède son propre mini-blog dédié à ses propres publications.
On a utilisé des modèles personnalisés pour chaque sous-partie du site.
Les catégories permettent à chaque partie du site de présenter ses propres informations.
Maintenance.
La plupart des mises à jour ont été automatisés, ce qui est réaliste vu le faible nombre d’extensions (plugins) utilisées. Une formation sur la mise à jour et les contrôles réguliers est donnée au futur administrateur par Igor Web. En cas de problèmes, il est toujours possible d’établir un contrat de maintenance avec Igor Web.
Ce projet fut particulièrement intéressant puisqu’il fallait trouver un moyen de séparer le contenu propre à la mairie du contenu du camping et de la base de loisirs. Le thème des sports nautiques était aussi particulièrement rafraichissant si l’on peut se permettre.
Il reste de quoi poursuivre le projet à l’avenir. Pourquoi pas permettre de réserver un emplacement du camping depuis le site ou encore de commander au snack de la base de loisirs ? On pourrait aussi envisager de créer un site propre à chaque sous-partie du site, quitte à utiliser des sous-domaines dans un premier temps (par exemple camping.pouligny-notre-dame.fr) ce qui donnerait à chaque site une UX plus adaptée
Visiter le site : https://demo-001.igorwebservice.com/ ! Démo complète interactive !
Ce projet a retenu votre attention ? Vous souhaitez obtenir un site similaire ? N’hésitez pas à nous contacter !
