INFO : Des travaux sont programmés par le concessionnaire du réseau électrique à proximité de l’Aéroport Montpellier Méditerranée. Des perturbations sont à prévoir, nous vous invitons à anticiper votre arrivée.  Cliquez pour plus d'informations.

Accessibilité

Découvrez l'ensemble des efforts et actions réalisés pour intégrer les principes d'éco-conception et d'accessibilité dans le développement du site de l’Aéroport de Montpellier-Méditerranée.

Préambule

Le site internet de l’Aéroport de Montpellier-Méditerranée a été développé en respectant les principes et recommandations en vigueur en matière d'accessibilité numérique et d'éco-conception. L’objectif recherché dès les prémices de ce projet a toujours été de garantir une navigation fluide et inclusive pour tous les utilisateurs, y compris ceux présentant des limitations physiques, sensorielles ou cognitives. En adoptant des pratiques respectueuses de l'environnement, ce site internet veille également à limiter son impact écologique tout en offrant une expérience utilisateur optimisée. L’Aéroport de Montpellier-Méditerranée s’engage à maintenir un haut niveau d'accessibilité et à améliorer continuellement sa plateforme pour répondre aux besoins de tous, avec pour objectif déclaré d’être conforme au référentiel général d'amélioration de l'accessibilité (RGAA), version 4.1. 

Jusqu’à réalisation d’un audit permettant l’officialisation de la conformité au référentiel RGAA, cette page n’est pas une déclaration d’accessibilité et n’a pas vocation d’être utilisée pour en faire une.

Cette page présente les travaux réalisés pour intégrer les principes d'éco-conception et d'accessibilité dans le développement du site de l’Aéroport de Montpellier-Méditerranée. 

Ecoconception

L'éco-conception vise à minimiser l'empreinte environnementale du site web tout au long de son cycle de vie. Cela inclut la réduction de la consommation d'énergie, l'optimisation des ressources, et la minimisation des impacts écologiques. Comme son nom l’indique, l'écoconception est surtout un ensemble de bonnes pratiques de design pour réaliser des services numériques à l’empreinte environnementale réduite. En effet, c’est lors de la phase de conception que se trouvent les plus gros leviers.

Pour rappel, ~3,9% des émissions mondiales de CO2 sont générées par l’industrie du numérique, soit plus que l’aviation (2%). Et on estime à 6 à 9% d’émissions d’ici 2025 si on reste sur une hausse importante des usages numériques.

De plus l’écoconception amène deux principaux types de gains :

  • Gain environnemental : Réduire la consommation énergétique de sa solution numérique et donc des émissions CO2 générées.
  • Gain de performance : Meilleur ROI et conversion de sa solution numérique :
    • Moins de fonctionnalités donc moins de bugs
    • Plus facile et rapide à maintenir
    • Optimisée pour le mobile et l’utilisateur final
    • Plus rapide à afficher donc mieux référencé

Enfin, bien que les plus gros leviers se situent lors des phases de spécification et conception. L’écoconception est transversale sur toute la vie du projet. À noter que les méthodes agiles jouent aussi un rôle en permettant d’ajuster à tout moment ces phases de conception :

  • Conception : 60%
    • Spécification
    • Conception
  • Hébergement et production du site : 25%
    • Réalisation
    • Production
  • Technique : 15%
    • Utilisation
    • Maintenance et fin de vie

Travail réalisé

Dès la phase de cadrage, en début de projet, les parties prenantes ont travaillé ensemble sur une liste d'éléments, afin de définir le périmètre du site à développer. Au cours de ces ateliers collaboratifs, il a été décidé de ne retenir que les aspects essentiels au bon fonctionnement du site, toujours dans le respect et les attentes des visiteurs de l’Aéroport de Montpellier-Méditerranée. Cette démarche s’est concrétisée par des prises de positions fortes.

Quelques exemples concrets :

  • Pas de slider sur la homepage -> Chargement aléatoire de d’images optimisées parmi un panel limité.
    • Suppression de la fonctionnalité d’alerte SMS/mail car peu utilisée, non essentielle, et génératrice de ressources.
    • Hébergement des documents mis à disposition pour les utilisateurs (PDF Salon Coupe file et PDF Parking) via un lien et non pas une transmission à chaque demande via un PDF. Ces documents sont envoyés une seule fois lors du passage de commande.
    • Utilisation d’une seule police de caractère sur l’ensemble du site, pour éviter les multis-chargements chez les utilisateurs. 
    • Le site fournit aux utilisateurs la possibilité de connaître les nouveaux contenus ou services.

Lors de la phase de développement du site internet, Il a été identifié des points de simplification. Nous pouvons citer le fait de limiter au strict minimum les appels APIs qui n’auraient pas de valeur ajoutée pour l’utilisateur, ou encore la mise en cache du site pour fluidifier les parcours mais aussi privilégier un design simple, épuré, accessible et adapté au web.

Quelques exemples concrets :

  • Optimisation du parcours utilisateur
  • Eviter les animations JS/CSS non essentielles
  • Préférer la pagination au défilement infini
  • Mettre en cache les données souvent utilisées
  • Maintenir à jour les versions les plus récentes du CMS et des plugins utilisés
  • Utiliser un titre de page et une meta description pertinentes
  • Éviter l’autocomplétion dans la recherche, privilégier une recherche simple
  • Eviter le transfert de grandes quantités de données
  • Fournir un contenu alternatif (ALT sur les images)
  • Utiliser le lazy loading (chargement à la volée) -> Utilisé uniquement sur les images
  • Fusionner les fichiers CSS communs à tout le site 
  • Préférer le CSS et les illustrations vectorielles aux images
  • Préférer des images plus réduites
  • Ne pas redimensionner les images côté navigateur
  • Optimiser, compresser et mettre en cache les images côté serveur
  • Limiter l’utilisation de plugins de CMS
  • Les vidéos et sons sont déclenchées par l'utilisateur
  • Chaque page de résultats de recherche peut être atteinte via une adresse Web
  • Le site propose un fichier sitemap indiquant les contenus à explorer
  • Le serveur envoie un code HTTP 404 pour les ressources non trouvées
  • Privilégier le traitement asynchrone pour les traitements longs, mais surtout trouver des solutions pour éviter les traitements longs au maximum
  • Les tableaux de données ne sont pas remplacés par des images
  • Choix d’un hébergeur éco-responsable et optimisation de son utilisation ainsi que mise en place de bonnes pratiques


 

Accessibilité

L'objectif de l'accessibilité web

L'accessibilité web est l'ensemble des pratiques et des principes qui visent à rendre les sites web, les applications en ligne, et tout autre contenu numérique accessibles à tous les utilisateurs, y compris les personnes en situation de handicap. Cela signifie que tout le monde, indépendamment de ses capacités physiques, sensorielles, ou cognitives, doit pouvoir percevoir, comprendre, naviguer, et interagir avec le web.

Les principaux aspects de l’accessibilité web sont :

  • La perceptibilité :
    • Alternatives textuelles : Fournir des équivalents textuels pour les images, les vidéos, et autres contenus non textuels.
    • Contraste suffisant : Utiliser des combinaisons de couleurs avec un contraste élevé pour que le texte soit lisible par les personnes ayant une déficience visuelle.
    • Utilisabilité :
      • Navigation au Clavier : Le site doit être navigable sans souris, via des raccourcis clavier
      • Temps Suffisant : Donner suffisamment de temps aux utilisateurs pour lire et utiliser le contenu
    • Compréhensibilité :
      • Langage Clair : Le contenu doit être rédigé dans un langage simple et clair. Les interfaces doivent être prévisibles et faciles à comprendre.
      • Instructions : Les formulaires et autres interactions doivent fournir des instructions et des retours d'erreur clairs pour guider l'utilisateur.
    • Robustesse :
      • Compatibilité avec les Technologies d'Assistance : Le contenu doit être compatible avec diverses technologies d'assistance
      • Respect des Standards Web : Utiliser un code propre, conforme aux standards du W3C (World Wide Web Consortium)

Le travail réalisé

Depuis la phase de conception jusqu’à la phase de développement, l’Aéroport de Montpellier-Méditerranée, et ses partenaires, ont pris en compte la notion d’accessibilité du site web en y incluant un maximum de notions RGAA. Ces actions se décomposent en 8 parties et ont été testées sur les pages citées en annexe.

Images

  • Les images ont toutes un texte alternatif (Image qui véhicule une information nécessaire à la compréhension du contenu auquel elle est associée.) ou une description détaillée pertinente

Textes

  • Utilisation d’une police de caractère sans serif pour faciliter la lecture des personnes dyslexique notamment
    • Contraste suffisant pour que le texte soit lisible par les personnes ayant une déficience visuelle
    • Interlignage du texte plus confortables pour les contenus

Couleurs

  • L’information n’est pas donnée uniquement par la couleur
    • Sur chaque page, le contraste entre la couleur du texte et la couleur de l’arrière plan est suffisamment élevée (hors cas particuliers)
    • La page contient des en-tête, des listes, des repères ARIA et autres éléments sémantiques pour la structure de la page

Liens

  • Chaque lien est explicite et visuellement différencié du texte.

Eléments obligatoires

  • Chaque page web est définie par un type de document
    • La langue par défaut est présente et le code langue y est pertinent
    • Chaque page web a un titre
    • Le code source généré est valide selon le type de document spécifié
    • Les balises ne doivent pas être utilisées uniquement à des fins de présentation

Structuration de l'information

  • L’information est structurée par l’utilisation de titre approprié
    • La structure de chaque page est cohérente (header, nav, main, footer)
    • Chaque liste est correctement structurée
    • Chaque citation est correctement indiquée

Présentation de l'information

  • Des feuilles de style sont utilisées pour contrôler la présentation de l’information
    • L’information et le contenu restent visibles sans les feuilles de style activées
    • Le texte reste lisible lorsque la taille est augmentée jusqu’à 200%
    • L’information n’est pas donnée uniquement par la forme, la taille ou la position
    • Les contenus additionnels apparaissant au survol ou au focus sont contrôlables par l’utilisateur

Formulaires

Il y a deux types de formulaire sur le site. Les formulaires natifs Drupal qui servent principalement à la création/modification de compte ou encore à la création d’une commande. Le deuxième type de formulaire est intégré via une iframe (Hubspot), ces formulaires répondent à la majeure partie des critères d’accessibilité :

  • Chaque formulaire de champ a une étiquette qui est associée à son champ
  • Le contrôle de saisie est utilisé de manière pertinente.

Navigation

  • Chaque page dispose au moins de deux systèmes de navigation (Menu et moteur de recherche)
    • Dans chaque ensemble de page les menus de navigation sont toujours à la même place
    • Le plan du site est accessible et pertinent
    • Dans toutes les pages, le moteur de recherche est atteignable de manière identique
    • L’ordre de tabulation est cohérent
    • Les contenus additionnels apparaissant au survol, à la prise de focus sont atteignables au clavier
    • Le contenu du site est consultable quelle que soit l’orientation de l’écran
    • Lien d'accès rapide placé dès le début du document permettant d'accéder directement au contenu du site

Pistes d'améliorations

Afin de toujours aller plus loin dans l’accessibilité du site internet de l’Aéroport de Montpellier-Méditerranée, et afin de préparer l’évaluation de conformité au référentiel général d'amélioration de l'accessibilité (RGAA), version 4., une liste non exhaustive d’actions qui pourraient être menées après la mise en ligne du site est d’ores et déjà en cours. Ces futures actions comprendraient les actions suivantes : 

  • Chaque lien qui redirige vers une page extérieure au site est visuellement différencié
    • Les contrôle de saisie est accompagné de suggestions facilitant la correction des erreurs de saisie
    • Facilitation du remplissage automatique des champs avec les données utilisateur
    • Le plan du site est accessible et pertinent
    • Les pages qui ont des limites de temps incluent des mécanismes pour ajuster ces limites pour les utilisateurs qui ont besoin de plus de temps
J'ai déjà un compte
Vous n'avez pas encore de compte ?
Créer un compte
Cet article a bien été ajouté à votre panier.
Aller au panier