Cette page ne doit être appliquée que si le script de migration assistée vous demande de passer la migration manuelle skin.20241003.INTRANET.rgaa
Plusieurs modifications ont été apportées afin de corriger les problèmes d’accessibilité de cette charte.
Les modifications touchent à la structure HTML des pages, menus, ... les scripts.
Une vérification méticuleuse est nécessaire sur l'ensemble des pages.
Toute surcharge doit être vérifiée afin de ne pas "annuler" les correctifs RGAA de la charte noyau.
Voici ci-dessous la liste des correctifs appliquées et leur issue associée.
Parcourez chacun des points et les vérifier sur votre charte.
- Structure des pages
- Éléments de navigation
- Mon espace perso
- Recherche
- Lames de la page d'accueil
- Formulaires
- Contenus
Structure des pages
- Visibilité du focus (SKININTRA-363)
- Landmarks aria et liens d'évitement (SKININTRA-368)
- Reprise du pied de page (SKININTRA-365)
- Couleur et contraste: la variable $secondary (utilisée jusque là comme couleur du texte) a été renommée $maincolor et la variable $secondary correspond désormais à la vraie couleur secondaire (vert sur la charte noyau) (SKININTRA-364).
Le renommage $secondary -> $maincolor dans vos CSS est assurée par une migration assistée automatique. - Ajout du role="search" et aria-label sur le formulaire de recherche dans l'entête (SKININTRA-369)
- Pour une meilleure navigation au clavier (ordre de tabulation pour logique), le menu "Mon espace perso" est déplacé dans <header> et dans les pages intérieures le menu "Explorer les sous-pages" est déplacé dans <main id="content" role="main"> (SKININTRA-388)
Éléments de navigation
- Ajout des attributs aria sur le fil d'ariane (SKININTRA-367)
- Refonte du menu principal (SKININTRA-371)
Attention point très délicat ! Le menu principal a été entièrement refondu (HTML / JS), pour être conforme aux critères RGAA et aussi répondre aux besoins remontés par les projets. Le menu ne s'ouvre plus au survol mais uniquement au clic. Si le menu a été surchargé la meilleure méthode est sans doute de supprimer les surcharges puis refaire. Analyser les modifications apportées par le commit de l'issue.
S'assurer que la navigation clavier dans le menu est possible (mobile et desktop), que le menu se ferme avec la touche ECHAP.
La structure HTML ayant changée, les surcharges CSS devront elles aussi être reprises. - Refonte du menu "Explorer les sous-page" (SKININTRA-373)
Tout comme le menu principal, le HTML/JS a été entièrement revu.
Toute surcharge SCSS ne fonctionnera plus et devra être reprise.
Toute surcharge HTML et/ou JS devra également être reprise.
S'assurer que la navigation clavier dans le menu est possible et que le menu se ferme avec la touche ECHAP. - Refonte des liens de notifications (SKININTRA-387)
La structure des liens a été modifié pour contenir : le lien avec l’icône, suivi des infos dynamiques (badge + dropdown), suivi d'un bouton pour afficher les infos dynamiques au clavier. Soyez très attentif à toute surcharge concernant les liens de notifications.
Toute surcharge des templates XSL "notifications-links", "alerts" et/ou "link[@url != '' and @isHidden = 'false']" mode="notification-link" devra être reprise.
Mon espace perso
- Refonte de Mon menu perso (SKININTRA-378)
Structure HTML et JS modifié, attention aux surcharges !!
Voir commentaire dans l'issue pour la liste des modifications apportées - Reprise des applications métiers (SKININTRA-382 et SKININTRA-426).
Voir dans la liste des modifications effectuées dans les tickets.
Soyez notamment attentif à toutes surcharges de user-menu.xsl
A noter que les libellés utilisées dans chaque onglet (titres / filtres de recherche) peuvent maintenant être facilement surchargées avec l'ajout de paramètres supplémentaires pour le template "user-links"
Exemple avec l'onglet "Mes favoris":
|
|
<xsl:call-template name="user-links">
<xsl:with-param name="title"><i18n:text i18n:key="SKIN_USER_MENU_MY_FAVORITES" i18n:catalogue="skin.{$skin}"/></xsl:with-param>
<xsl:with-param name="themeId" select="'MES_FAVORIS'"/>
<xsl:with-param name="inputDataId" select="'myFavorites'"/>
<xsl:with-param name="extraLinksTitle"><i18n:text i18n:key="SKIN_USER_MENU_MY_FAVORITES_EXTRA_LINKS_TITLE" i18n:catalogue="skin.{$skin}"/></xsl:with-param>
<xsl:with-param name="addUserLinkTitle"><i18n:text i18n:key="SKIN_USER_MENU_MY_FAVORITES_USER_LINK_TITLE" i18n:catalogue="skin.{$skin}"/></xsl:with-param>
<xsl:with-param name="filterFormLabelI18nKey" select="concat('skin.', $skin, ':SKIN_USER_MENU_MY_FAVORITES_FILTER_FORM_LABEL')"/>
<xsl:with-param name="filterInputLabelI18nKey" select="concat('skin.', $skin, ':SKIN_USER_MENU_MY_FAVORITES_FILTER_LABEL')"/>
<xsl:with-param name="extraFilterFormLabelI18nKey" select="concat('skin.', $skin, ':SKIN_USER_MENU_MY_FAVORITES_EXTRA_FILTER_FORM_LABEL')"/>
<xsl:with-param name="extraFilterInputLabelI18nKey" select="concat('skin.', $skin, ':SKIN_USER_MENU_MY_FAVORITES_EXTRA_FILTER_LABEL')"/>
</xsl:call-template> |
- Modifications mineures pour "Mes flux RSS" (SKININTRA-383)
- Modifications mineures pour le flux d'activités et les espaces projets (SKININTRA-384)
Recherche
Plusieurs modifications ont été faites concernant le service de recherche impactant:
- les critères de recherche (nouveau composant graphique pour les critères énumérés)
- les facettes (les éléments cliquables deviennent des boutons + utilisation de ul/li)
- la pagination (ajout d'un élément <nav> + utilisation de ul/li)
- les résultats (utilisation de ul/li)
- l'affichage des filtres en mode mobile
Dans skins/[SKIN]/services/web/pages/services/search, toute surcharge des templates XSL suivants doit être vérifiée et comparée avec la version noyau: "form-criteria", "search-sidebar", "close-filter", "facet-filter-header", "facet-filter-icon", "facet-filter-elements", "facet-filter-element", "pagination", tous les template avec mode="search-pagination", "filter-mobile", "hits", "hit", "common-service-head-js".
Par ailleurs, l'accès à la recherche depuis le bandeau de recherche en mode "sticky" (au scroll de la page) a été revu.
Toute surcharge des templates XSL "header-sticky-search" et "search-on-scroll" doit être vérifiée et comparée avec la version noyau.
Se reporter au ticket JIRA SKININTRA-389 pour voir toutes les modifications faites sur la recherche
Lames de la page d'accueil
- Utilisation de ul/li pour les petites annonces en page d'accueil (SKININTRA-366)
- Remplacement de owlCarousel par Slick Carousel pour le carrousel des actualités sur la page d'accueil (SKININTRA-375)
- Utilisation de ul/li et autres modifications mineures pour les derniers documents (SKININTRA-386)
- Remplacement de owlCarousel par Slick Carousel pour le carrousel des actualités personnalisés et refonte du filtre par thématique (SKININTRA-396)
- Remplacement de owlCarousel par Slick Carousel pour le kiosque sur la page d'accueil (SKININTRA-397)
Formulaires
Les champs des formulaires ont été retravaillés pour être accessibles:
- corrections des constrastes
- ajout d'une bordure et suppression de l'ombre
- utilisation de la lib custom ametys-multiselect.js pour les listes déroulantes (multiple ou non)
S'assurer du rendu des formulaires et de la bonne gestion des erreurs sur toutes les formulaires de la charte (formulaire v2, modification d'une entrée depuis les tableaux de bord, formulaire de connexion, publication d'une annonce, postuler à une offre d'emploi, ...)
Voir ticket JIRA SKININTRA-406
Contenus
FAQ
Le rendu du type de contenu FAQ a été repris (il n'était pas possible de naviguer dans les questions et plier/déplier les réponses au clavier)
Par ailleurs les styles CSS des FAQ, qui se trouvaient auparavant dans richtext/scss/_styles.scss, a été isolé dans une SCSS dédiée zones/faq/scss/main.scss
Déplacer les éventuelles surcharges CSS des FAQ, en prenant en compte des modifications de structure du HTML pour les questions/réponses (la question devient un <button>)
Vérifier le rendu et bon fonctionnement des FAQ (notamment à la navigation clavier)
Voir le ticket JIRA SKININTRA-410
Commentaires de contenus
L'intégration des commentaires de contenus a été reprise pour passer à la version full ajax, sans rechargement de la page (plugin:web://pages/comments/helper/comments_4.8.xsl).
La structure HTML des commentaires reste toute fois très similaire, il devrait y avoir peu d'adaptation CSS nécessaires.
Attention cependant, toute surcharge de pages/comments/helper/comments_3.3.xsl ne fonctionnera plus. Cette XSL n'existe plus dans la charte Intranet, elle est remplacée par pages/comments/helper/comments.xsl.
Voir le ticket JIRA SKININTRA-408
Styles des tableaux
De nouvelles variables ont été ajoutés dans _variables.scss pour surcharger plus facilement les couleurs des tableaux de styles data, datalight et datastrong.
Les couleurs de la charte noyau ont été légèrement revues pour des problèmes de contrastes.
Retour en haut