logo Brussels.be

Comment transformer 200 sites Web gouvernementaux fragmentés en un site accessible ?

Communiquer efficacement et de manière inclusive auprès de 1,2 million de citoyens, dans une région aussi diverse et complexe que la Région de Bruxelles-Capitale ? Ce n'est pas un mince défi. Dans un labyrinthe de plus de 200 sites web fragmentés, les Bruxellois devaient trouver des informations essentielles sur leurs services communaux. Transformer ces îlots numériques en un portail cohérent et accessible a nécessité une transformation numérique à grande échelle. Mais ce projet est bien plus qu'une solution technique : il redéfinit les normes d'accessibilité numérique dans les services publics. 

  • Ateliers sur la co-conception inclusive 

  • Directives pour l'accessibilité des contenus Web (WCAG) 2.2 AA comme base de référence 

  • Mise en œuvre des meilleures pratiques WAI-ARIA pour les interfaces dynamiques 

  • Développement d'une bibliothèque de composants 

  • Fusion de + de 200 sites en un seul portail doté d'une architecture moderne et sécurisée : be.brussels 

  • Plus de 3 550 pages web rendues entièrement accessibles 

BHG et iO 

Avec 1,2 million d'habitants, la Région de Bruxelles-Capitale dispose d'un public large et diversifié. Tous doivent être clairement informés des services essentiels, indépendamment de leur langue, de leurs compétences numériques ou de leurs capacités. De l'enregistrement des naissances aux permis de stationnement, des événements culturels aux services sociaux, les citoyens comptent sur une communication accessible. Désormais, toutes ces informations cruciales sont disponibles en un seul endroit. 

Le défi

Transformer plus de 200 sites web en un portail clair et accessible, structuré autour de 13 pôles thématiques au service de 1,2 million de Bruxellois.

La solution

Un écosystème inclusif qui structure toute l'information publique autour de véritables enjeux citoyens, au lieu d'une collection fragmentée de sites web. La nouvelle approche est fondée sur la cohérence, la pertinence, l'inclusion et la responsabilisation.

De plusieurs fragments à un tout accessible 

La Région de Bruxelles-Capitale était confrontée à un double défi en termes d'efficacité et d'accessibilité numérique. Avec plus de 200 sites web gérés par différents départements, le portail numérique de la région était devenu un labyrinthe administratif. 

Au fil des années, les différentes administrations bruxelloises se sont diversifiées, entraînant une multiplication des canaux numériques. Même pour obtenir des informations de base, les citoyens devaient naviguer dans un parcours d'obstacles numérique, souvent à travers plusieurs sites Web et procédures. Chaque département appliquait sa propre logique numérique, rendant impossible un flux logique. En plus de cette complexité organisationnelle, les utilisateurs ont rencontré des obstacles supplémentaires tels que des lecteurs d'écran cassés, une navigation au clavier inutilisable ou un contraste insuffisant. 

Un portail, toutes les réponses 

Avec une stratégie web régionale, nous avons mis fin à cette fragmentation. Les citoyens arrivent désormais à un point d'accès central où toutes les informations sont regroupées et clairement structurées autour de sujets et de services spécifiques. L'accessibilité universelle est au cœur de notre conception : les besoins de tous les citoyens sont prioritaires. L'expérience utilisateur pour tous, quelles que soient les capacités, a été radicalement transformée. 

Audit d'accessibilité approfondi

Grâce à une analyse complète des sites web existants, nous avons cartographié toutes les barrières d'utilisation possibles. Cette revue a révélé un écart important entre l'usage théorique et la réalité pratique des sites. 

Nous avons organisé des ateliers de design inclusif avec tous les acteurs administratifs, en veillant à ce que les besoins des utilisateurs soient intégrés dès la phase de conception. En mettant en œuvre les meilleures pratiques WAI-ARIA pour les interfaces dynamiques et en utilisant WCAG 2.2 AA comme minimum absolu, nous plaçons la barre haute. 

Lire sans obstacles

Pour évaluer nos efforts, nous avons intégré des tests d'accessibilité automatisés dans le flux de travail de développement et validé NVDA et JAWS pour une compatibilité maximale. Nous avons testé la navigation au clavier uniquement sans souris et nous nous sommes assurés que les contrastes de couleurs étaient conformes aux normes WCAG. 

Pour les citoyens, cela fait toute la différence. Quelqu'un qui s'appuie entièrement sur la navigation au clavier peut désormais naviguer dans les services sans difficulté. Et un résident malvoyant peut désormais lire les informations sans obstacle grâce à des contrastes optimisés. 

Nouveau portail be.brussels en deux parties

Grâce à l'écosystème unifié de be.brussels, les citoyens peuvent désormais accéder à tous les services en ligne via une plateforme moderne, intuitive et sécurisée. La nouvelle architecture a découplé le backend (Drupal 10) et le frontend (NextJS) pour de meilleures performances, une plus grande flexibilité et une maintenance plus facile. Nous avons également mis en place une bibliothèque de composants : des composants réutilisables et accessibles qui assurent la cohérence et la conformité techniques. 

Principales technologies utilisées :

  • Drupal 10

    Plateforme de gestion de contenu robuste.

  • NextJS

    Un framework JavaScript moderne pour l'interface utilisateur.

  • GraphQL

    Langage de requête pour une communication efficace entre le backend et le frontend.

  • Redis

    Système de mise en cache qui accélère considérablement le chargement des pages.

  • Imgproxy

    Service de traitement d'images qui optimise automatiquement les visuels en fonction du contexte.

  • Kubernetes

    Technologie de conteneurisation permettant un déploiement flexible et évolutif sur tous les clusters.

  • GitLab CI/CD

    Automatisation complète du processus de déploiement avec contrôles qualité intégrés.

En collaboration avec iO, nous avons créé des solutions numériques qui simplifient la vie des citoyens et contribuent à un avenir numérique inclusif et durable. Le prix Agoria souligne la force de notre collaboration et les résultats concrets que nous avons obtenus ensemble.

Benjamin Snick, Chef de projet : Relation client, Produit & Stratégie – eCitizen

Qu'est-ce que la transformation a apporté ?

La transformation a donné lieu à des résultats mesurables ainsi qu'à un changement culturel. Les points forts sont les suivants : 

  • Améliorations de l'accessibilité : le portail unifié est conforme aux WCAG 2.2 AA 

  • Lauréat de l'Impact Award for Digital Accessibility : reconnaissance de l'excellence en matière de design inclusif et positionnement de la Région comme une référence européenne 

  • Obtention du label AnySurfer, une reconnaissance clé pour l'accessibilité numérique 

  • Plus de 3 550 pages entièrement accessibles 

  • Migration réussie de dix administrations vers la nouvelle plateforme 

  • Consolidation de 200+ sites web en un seul écosystème cohérent 

  • Intégration d'autres administrations actuellement en cours 

Qu'est-ce que cela signifie pour la Région de Bruxelles-Capitale ?

Il dispose désormais d'un site web plus efficace et plus facile à découvrir : 

  • SEO maximal grâce à une structure sémantique et une indexation améliorées 

  • De meilleures performances grâce à des temps de chargement optimisés 

  • Expérience simplifiée et plus intuitive 

  • Réduction des coûts de maintenance : architecture standardisée et composants réutilisables 

  • Réduction de l'empreinte numérique 

Les résultats en chiffres

  • 100,000+
    visiteurs uniques par mois
  • 20%
    baisse du taux de rebond en deux ans
  • 50%
    des conversions sont réussies

Mais l'impact va au-delà de ces chiffres. En adoptant une nouvelle perspective sur l'accessibilité, nous contribuons à une révolution culturelle. Cette transformation marque un changement : l'accessibilité n'est plus considérée comme une exigence légale pour l'adopter comme une valeur fondamentale, ancrée dans chaque processus de conception et de développement.

Blue line iconDecorative blue line graphic used in website

Vous souhaitez savoir comment votre transformation numérique peut devenir non seulement conforme à la loi, mais aussi véritablement conviviale pour tout le monde ?

Découvrez-le avec un audit d'accessibilité ou demandez notre livre blanc De la conformité à l'excellence en matière d'accessibilité numérique

Construisons un monde numérique qui fonctionne vraiment pour tout le monde.