Le projet de refonte a fait l’objet au préalable d’une enquête de satisfaction, d’une étude auprès des services de la ville et d’un ensemble de réunions de réflexion menées avec une assistance à maîtrise d’ouvrage en plus des agents de la direction de la communication.
A l’issue de ces réflexions, il a été convenu de réaliser un site orienté « outil », sur Wordpress en « mobile first ». La page d’accueil de type « one page » a été divisée en plusieurs sections spécifiques :
Zone 1 : un mince filet informatif sur les horaires et le contact téléphonique du centre administratif que l’on retrouve sur toutes les pages ainsi que l’accès à l’espace familles, l’inscription à la newsletter et aux alertes SMS.
Une zone intermédiaire entre la zone 1 et la zone 2 est insérée selon la nécessité en cas d’alerte : orages, crue, grand froid, canicule… Elle permet de diffuser un court message d’information sur la situation.
Zone 2 : une barre de menus conventionnels permet aux usagers « classiques » de naviguer sur le site avec les « anciennes » habitudes.
Zone 3 : un visuel « conceptuel » appuyé par une courte définition contextuelle vient donner la tonalité générale du moment : « historique, culturelle, sportive… »
Zone 4 : une mosaïque composée de 12 zones rassemble par thématique les secteurs de services aux usagers, à la manière de service public, et permet d’accéder directement aux pages les plus demandées de la rubrique à l’aide de liens hypertexte insérés dans chaque zone.
Zone 5 : une zone d’actualités hiérarchisée « à la une », « brèves », « actualités » permet de diffuser les informations pratiques à la volée. Visuellement, 1 pavé « majeur » avec image occupe la partie de mise en avant et 2 pavés « mineurs » avec image complètent cette partie. Le reste des actualités, listé sur 10 titres directement accessibles, est consultable par un bouton « toutes les actualités ». Le classement s’effectue par défaut dans l’ordre chronologique mais peut aussi être « trié » afin de classer telle ou telle info devant ou derrière telle autre.
Zone 6 : l’agenda de la ville propose une vision par défaut sur 2 mois des événements programmés. Pour connaître les événements des mois suivants, des flèches permettent de progresser dans le calendrier. Le détail d’un événement s’affiche au clic, dans un popup.
Zone 7 : à droite de l’agenda sont disposés 3 pictos invitant les usagers sur les réseaux sociaux Instagram, Twitter et Facebook ainsi qu’un bulletin météo simplifié qui renseigne l’usager sur le temps du moment.
Zone 8 : Les parutions et les guides sont rassemblés dans cette section. 4 visuels sont par défaut proposés à la consultation. Le bulletin municipal, le guide de la ville et le guide de la saison culturelle sont présentés en priorité. Un bouton invite l’usager à voir plus de publications. Cette section ouvre une visionneuse PDF Calaméo.
Zone 9 : L’usager est invité dans cette zone à s’inscrire à la Newsletter hebdomadaire de la ville conçue avec Mailchimp. Il est aussi invité à donner son avis sur un sujet de son choix.
Section 10 : le footer se compose d’un rappel des coordonnées de l’hôtel de ville avec les horaires. En bonus, 6 vignettes des dernières photos publiées sur Instagram invite l’usager à suivre la ville sur ce réseau social.