Les repères devraient avoir un rôle unique ou une combinaison unique de rôle, d’étiquette et de titre (c’est-à-dire de nom accessible)
Lorsqu’une page contient plusieurs zones du même type, comme deux menus de navigation, les lecteurs d’écran ne peuvent les distinguer que par leur nom. Sans noms uniques, les clients entendent deux fois « navigation » et ne savent pas distinguer le menu principal du menu du pied de page ou du fil d’Ariane.
- Identifiant de la règle
- landmark-unique
- Source
- axe-core 4.13.0
- Impact
- Modéré
- Niveau de correction
- ASSISTED
- sur Shopify, Shopware, WooCommerce et Magento
- Statut
- exécutée
Ce que fait le contrôle
Vérifier que les repères sont uniques
La règle rassemble les repères de la page : les éléments dotés d’un role de repère, comme navigation ou search, et les éléments <header>, <footer>, <nav>, <main>, <aside>, <form> et <section> dont le rôle calculé est un repère. Sans attribut role, un <section> ou un <form> ne compte que si aria-label ou aria-labelledby lui donne un nom, et un <header> ou un <footer> placé dans <article>, <aside>, <nav>, <section> ou <main> ne compte pas. Les repères masqués aux technologies d’assistance sont laissés de côté.
axe-core compare le rôle et le nom accessible de chaque repère, en minuscules, sur l’ensemble de la page et de ses iframes. Deux repères de même rôle échouent lorsqu’aucun des deux n’a de nom ou lorsque leurs noms coïncident ; « Menu » et « menu » comptent donc comme identiques. axe-core signale un repère de chaque groupe de ce type comme l’échec ; les autres n’apparaissent que comme ses éléments associés.
Cette règle de bonne pratique n’est rattachée à aucun critère de succès des WCAG. Le scanner de Validiscan l’exécute à part des règles de conformité, ne conserve que ses échecs et laisse ses constats hors de l’avancement des corrections. La règle ne juge pas si les noms aident un client à distinguer les repères.
Comment corriger
Donnez aux repères qui partagent un même rôle des noms accessibles distincts avec aria-label ou aria-labelledby, comme aria-label="Menu principal" et aria-label="Menu du pied de page" sur deux éléments <nav>. Utilisez des noms courts et traduits.
Critères de succès WCAG
Bonne pratique : non rattachée à un critère de succès WCAG.
Recettes qui énumèrent cette règle
Cette règle a le niveau ASSISTED. Dans un projet, un constat de cette règle suit la voie ASSISTED, et ces recettes ne lui sont pas appliquées.
Shopify : recette skip-link-main
Afficher l’avant et l’après (1)
assets/base.css.liquid Modifications apportées à assets/base.css.liquid (lignes ajoutées : 30, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 1866 | 1866 | } | |
| 1867 | 1867 | ||
| 1868 | 1868 | /* ----------------------------------------------------------------- motion */ | |
| 1869 | Ajoutée | ||
| 1870 | Ajoutée | /* validiscan:skip-link-main */ | |
| 1871 | Ajoutée | .skip-to-content-link:not(:focus) { | |
| 1872 | Ajoutée | position: absolute !important; | |
| 1873 | Ajoutée | overflow: hidden; | |
| 1874 | Ajoutée | width: 1px; | |
| 1875 | Ajoutée | height: 1px; | |
| 1876 | Ajoutée | margin: -1px; | |
| 1877 | Ajoutée | padding: 0; | |
| 1878 | Ajoutée | border: 0; | |
| 1879 | Ajoutée | clip: rect(0 0 0 0); | |
| 1880 | Ajoutée | white-space: nowrap; | |
| 1881 | Ajoutée | } | |
| 1882 | Ajoutée | ||
| 1883 | Ajoutée | .skip-to-content-link:focus { | |
| 1884 | Ajoutée | z-index: 9999; | |
| 1885 | Ajoutée | position: fixed !important; | |
| 1886 | Ajoutée | top: 0.5rem; | |
| 1887 | Ajoutée | left: 0.5rem; | |
| 1888 | Ajoutée | overflow: visible; | |
| 1889 | Ajoutée | width: auto; | |
| 1890 | Ajoutée | height: auto; | |
| 1891 | Ajoutée | margin: 0; | |
| 1892 | Ajoutée | padding: 0.75rem 1.25rem; | |
| 1893 | Ajoutée | clip: auto; | |
| 1894 | Ajoutée | background-color: #ffffff; | |
| 1895 | Ajoutée | color: #121212; | |
| 1896 | Ajoutée | text-decoration: underline; | |
| 1897 | Ajoutée | } | |
| 1898 | Ajoutée | /* /validiscan:skip-link-main */ |
layout/checkout.liquid Modifications apportées à layout/checkout.liquid (lignes ajoutées : 4, lignes supprimées : 3)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 18 | 18 | </head> | |
| 19 | 19 | ||
| 20 | 20 | <body class="template-checkout"> | |
| 21 | Ajoutée | <a class="skip-to-content-link" href="#MainContent">{{ 'accessibility.skip_to_text' | t }}</a> | |
| 21 | 22 | <header class="checkout-header"> | |
| 22 | 23 | <div class="page-width checkout-header__inner"> | |
| 23 | 24 | <a href="{{ routes.root_url }}" class="checkout-header__logo"><img src="{{ 'logo.svg' | asset_url }}" width="140" height="32"></a> | |
| 24 | Supprimée | <nav class="checkout-breadcrumb"> | |
| 25 | Ajoutée | <nav class="checkout-breadcrumb" aria-label="{{ 'accessibility.breadcrumbs' | t | escape }}"> | |
| 25 | 26 | <ol class="checkout-breadcrumb__list" role="list"> | |
| 26 | 27 | <li><a href="{{ routes.cart_url }}" class="checkout-breadcrumb__link">Cart</a></li> | |
| 27 | 28 | <li><span class="checkout-breadcrumb__current">Information</span></li> | |
| 31 | 32 | </nav> | |
| 32 | 33 | </div> | |
| 33 | 34 | </header> | |
| 34 | Supprimée | <div class="main checkout" id="MainContent"> | |
| 35 | Ajoutée | <main class="main checkout" id="MainContent" tabindex="-1"> | |
| 35 | 36 | {{ content_for_layout }} | |
| 36 | Supprimée | </div> | |
| 37 | Ajoutée | </main> | |
| 37 | 38 | ||
| 38 | 39 | <footer class="checkout-footer"> | |
| 39 | 40 | <div class="page-width"> |
layout/theme.focused.liquid Modifications apportées à layout/theme.focused.liquid (lignes ajoutées : 1, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 22 | 22 | </head> | |
| 23 | 23 | ||
| 24 | 24 | <body class="gradient template-{{ template.name | handleize }} layout-focused"> | |
| 25 | Ajoutée | <a class="skip-to-content-link" href="#MainContent">{{ 'accessibility.skip_to_text' | t }}</a> | |
| 25 | 26 | {% section 'header' %} | |
| 26 | 27 | ||
| 27 | 28 | <main id="MainContent" class="content-for-layout focus-none" role="main" tabindex="-1"> |
layout/theme.liquid Modifications apportées à layout/theme.liquid (lignes ajoutées : 1, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 28 | 28 | </head> | |
| 29 | 29 | ||
| 30 | 30 | <body class="gradient template-{{ template.name | handleize }}"> | |
| 31 | Ajoutée | <a class="skip-to-content-link" href="#MainContent">{{ 'accessibility.skip_to_text' | t }}</a> | |
| 31 | 32 | ||
| 32 | 33 | {% sections 'header-group' %} | |
| 33 | 34 |
locales/en.default.json Modifications apportées à locales/en.default.json (lignes ajoutées : 3, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 34 | 34 | "total_reviews": "{{ count }} reviews", | |
| 35 | 35 | "link_messages": { | |
| 36 | 36 | "new_window": "Opens in a new window." | |
| 37 | Supprimée | } | |
| 37 | Ajoutée | }, | |
| 38 | Ajoutée | "breadcrumbs": "Breadcrumbs", | |
| 39 | Ajoutée | "mobile_menu": "Mobile menu" | |
| 38 | 40 | }, | |
| 39 | 41 | "sections": { | |
| 40 | 42 | "header": { |
sections/footer.liquid Modifications apportées à sections/footer.liquid (lignes ajoutées : 1, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 17 | 17 | {%- endform -%} | |
| 18 | 18 | </div> | |
| 19 | 19 | ||
| 20 | Supprimée | <nav class="footer__menus"> | |
| 20 | Ajoutée | <nav class="footer__menus" aria-label="{{ 'sections.footer.menu' | t | escape }}"> | |
| 21 | 21 | {%- for handle in menu_handles %} | |
| 22 | 22 | {%- assign footer_menu = linklists[handle] %} | |
| 23 | 23 | <div class="footer-block footer-block--menu"> |
sections/header.liquid Modifications apportées à sections/header.liquid (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 11 | 11 | {%- render 'icon', icon: 'menu', size: icon_size -%} | |
| 12 | 12 | </summary> | |
| 13 | 13 | <div class="menu-drawer"> | |
| 14 | Supprimée | <nav class="menu-drawer__navigation"> | |
| 14 | Ajoutée | <nav class="menu-drawer__navigation" aria-label="{{ 'accessibility.mobile_menu' | t | escape }}"> | |
| 15 | 15 | <ul class="menu-drawer__menu list-unstyled" role="list"> | |
| 16 | 16 | {%- for link in menu.links %} | |
| 17 | 17 | <li><a href="{{ link.url }}" class="menu-drawer__menu-item">{{ link.title | escape }}</a></li> | |
| 25 | 25 | <a href="{{ routes.root_url }}" class="header__heading-link"><img src="{{ 'logo.svg' | asset_url }}" width="{{ settings.logo_width }}" height="32" class="header__heading-logo"></a> | |
| 26 | 26 | {% if logo_is_heading %}</h1>{% else %}</div>{% endif %} | |
| 27 | 27 | ||
| 28 | Supprimée | <nav class="header__inline-menu"> | |
| 28 | Ajoutée | <nav class="header__inline-menu" aria-label="{{ 'sections.header.main_menu' | t | escape }}"> | |
| 29 | 29 | <ul class="list-menu list-menu--inline" role="list"> | |
| 30 | 30 | {%- for link in menu.links %} | |
| 31 | 31 | <li> |
WooCommerce : recette skip-link-main
Afficher l’avant et l’après (1)
404.php Modifications apportées à 404.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 9 | 9 | ?> | |
| 10 | 10 | ||
| 11 | 11 | <div id="primary" class="content-area"> | |
| 12 | Supprimée | <div id="main" class="site-main"> | |
| 12 | Ajoutée | <main id="main" class="site-main"> | |
| 13 | 13 | <div class="error-404 not-found"> | |
| 14 | 14 | <div class="page-content"> | |
| 15 | 15 | <header class="page-header"> | |
| 22 | 22 | </section> | |
| 23 | 23 | </div> | |
| 24 | 24 | </div> | |
| 25 | Supprimée | </div><!-- #main --> | |
| 25 | Ajoutée | </main><!-- #main --> | |
| 26 | 26 | </div><!-- #primary --> | |
| 27 | 27 | ||
| 28 | 28 | <?php |
archive-product.php Modifications apportées à archive-product.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 22 | 22 | ||
| 23 | 23 | <div id="primary" class="content-area"> | |
| 24 | 24 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: <div> instead of <main>. ?> | |
| 25 | Supprimée | <div id="main" class="site-main"> | |
| 25 | Ajoutée | <main id="main" class="site-main"> | |
| 26 | 26 | ||
| 27 | 27 | <header class="woocommerce-products-header"> | |
| 28 | 28 | <h1 class="woocommerce-products-header__title page-title"><?php woocommerce_page_title(); ?></h1> | |
| 46 | 46 | <?php do_action( 'woocommerce_no_products_found' ); ?> | |
| 47 | 47 | <?php endif; ?> | |
| 48 | 48 | ||
| 49 | Supprimée | </div><!-- #main --> | |
| 49 | Ajoutée | </main><!-- #main --> | |
| 50 | 50 | </div><!-- #primary --> | |
| 51 | 51 | ||
| 52 | 52 | <?php // The sidebar div gets role="complementary" but no label (VALIDISCAN-SEED landmark-unique on pages with two). ?> |
front-page.php Modifications apportées à front-page.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 18 | 18 | ||
| 19 | 19 | <div id="primary" class="content-area"> | |
| 20 | 20 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: the content wrapper is a <div>, not <main>. ?> | |
| 21 | Supprimée | <div id="main" class="site-main"> | |
| 21 | Ajoutée | <main id="main" class="site-main"> | |
| 22 | 22 | ||
| 23 | 23 | <?php get_template_part( 'template-parts/hero-slider' ); ?> | |
| 24 | 24 | ||
| 62 | 62 | ?> | |
| 63 | 63 | </section> | |
| 64 | 64 | ||
| 65 | Supprimée | </div><!-- #main --> | |
| 65 | Ajoutée | </main><!-- #main --> | |
| 66 | 66 | </div><!-- #primary --> | |
| 67 | 67 | ||
| 68 | 68 | <?php |
functions.php Modifications apportées à functions.php (lignes ajoutées : 1, lignes supprimées : 4)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 32 | 32 | * Storefront pieces the child theme does not use. | |
| 33 | 33 | */ | |
| 34 | 34 | function kb_remove_storefront_parts() { | |
| 35 | Supprimée | // VALIDISCAN-SEED vs-headings-landmarks: Storefront's "Skip to navigation / Skip to content" | |
| 36 | Supprimée | // links are removed because "they flash on the first Tab"; nothing replaces them. | |
| 37 | Supprimée | remove_action( 'storefront_before_header', 'storefront_skip_links', 0 ); | |
| 38 | 35 | remove_action( 'storefront_footer', 'storefront_handheld_footer_bar', 999 ); | |
| 39 | 36 | remove_action( 'storefront_header', 'storefront_product_search', 40 ); | |
| 40 | 37 | } | |
| 212 | 209 | $defaults['delimiter'] = '<span class="breadcrumb-separator"> / </span>'; | |
| 213 | 210 | // VALIDISCAN-SEED landmark-unique + vs-headings-landmarks: the breadcrumb <nav> has no aria-label, | |
| 214 | 211 | // like the primary and the footer navigation. | |
| 215 | Supprimée | $defaults['wrap_before'] = '<div class="storefront-breadcrumb"><div class="col-full"><nav class="woocommerce-breadcrumb">'; | |
| 212 | Ajoutée | $defaults['wrap_before'] = '<div class="storefront-breadcrumb"><div class="col-full"><nav class="woocommerce-breadcrumb" aria-label="' . esc_attr__( 'Breadcrumb', 'kestrel-birch' ) . '">'; | |
| 216 | 213 | $defaults['wrap_after'] = '</nav></div></div>'; | |
| 217 | 214 | return $defaults; | |
| 218 | 215 | } |
header-checkout.php Modifications apportées à header-checkout.php (lignes ajoutées : 1, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 18 | 18 | ||
| 19 | 19 | <body <?php body_class(); ?>> | |
| 20 | 20 | <?php wp_body_open(); ?> | |
| 21 | Ajoutée | <a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'kestrel-birch' ); ?></a> | |
| 21 | 22 | ||
| 22 | 23 | <div id="page" class="hfeed site"> | |
| 23 | 24 | <header id="masthead" class="site-header kb-checkout-header" role="banner"> |
header.php Modifications apportées à header.php (lignes ajoutées : 1, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 74 | 74 | <div class="storefront-primary-navigation"> | |
| 75 | 75 | <div class="col-full"> | |
| 76 | 76 | <?php // VALIDISCAN-SEED landmark-unique + vs-headings-landmarks: the primary <nav> has no aria-label. ?> | |
| 77 | Supprimée | <nav id="site-navigation" class="main-navigation"> | |
| 77 | Ajoutée | <nav id="site-navigation" class="main-navigation" aria-label="<?php esc_attr_e( 'Primary navigation', 'kestrel-birch' ); ?>"> | |
| 78 | 78 | <?php | |
| 79 | 79 | wp_nav_menu( | |
| 80 | 80 | array( |
page-contact.php Modifications apportées à page-contact.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 24 | 24 | ||
| 25 | 25 | <div id="primary" class="content-area"> | |
| 26 | 26 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: <div> instead of <main>. ?> | |
| 27 | Supprimée | <div id="main" class="site-main"> | |
| 27 | Ajoutée | <main id="main" class="site-main"> | |
| 28 | 28 | <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> | |
| 29 | 29 | <header class="entry-header"><?php the_title( '<h1 class="entry-title">', '</h1>' ); ?></header> | |
| 30 | 30 | <div class="entry-content"> | |
| 85 | 85 | </div> | |
| 86 | 86 | </div> | |
| 87 | 87 | </article> | |
| 88 | Supprimée | </div><!-- #main --> | |
| 88 | Ajoutée | </main><!-- #main --> | |
| 89 | 89 | </div><!-- #primary --> | |
| 90 | 90 | ||
| 91 | 91 | <?php |
page.php Modifications apportées à page.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 13 | 13 | ||
| 14 | 14 | <div id="primary" class="content-area"> | |
| 15 | 15 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: <div> instead of <main>. ?> | |
| 16 | Supprimée | <div id="main" class="site-main"> | |
| 16 | Ajoutée | <main id="main" class="site-main"> | |
| 17 | 17 | ||
| 18 | 18 | <?php | |
| 19 | 19 | while ( have_posts() ) : | |
| 35 | 35 | endwhile; | |
| 36 | 36 | ?> | |
| 37 | 37 | ||
| 38 | Supprimée | </div><!-- #main --> | |
| 38 | Ajoutée | </main><!-- #main --> | |
| 39 | 39 | </div><!-- #primary --> | |
| 40 | 40 | ||
| 41 | 41 | <?php |
search.php Modifications apportées à search.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 11 | 11 | ||
| 12 | 12 | <div id="primary" class="content-area"> | |
| 13 | 13 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: <div> instead of <main>. ?> | |
| 14 | Supprimée | <div id="main" class="site-main"> | |
| 14 | Ajoutée | <main id="main" class="site-main"> | |
| 15 | 15 | <header class="woocommerce-products-header"> | |
| 16 | 16 | <h1 class="woocommerce-products-header__title page-title"> | |
| 17 | 17 | <?php | |
| 36 | 36 | <?php else : ?> | |
| 37 | 37 | <?php wc_no_products_found(); ?> | |
| 38 | 38 | <?php endif; ?> | |
| 39 | Supprimée | </div><!-- #main --> | |
| 39 | Ajoutée | </main><!-- #main --> | |
| 40 | 40 | </div><!-- #primary --> | |
| 41 | 41 | ||
| 42 | 42 | <?php |
single-product.php Modifications apportées à single-product.php (lignes ajoutées : 2, lignes supprimées : 2)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 13 | 13 | ||
| 14 | 14 | <div id="primary" class="content-area"> | |
| 15 | 15 | <?php // VALIDISCAN-SEED vs-headings-landmarks + region: <div> instead of <main>. ?> | |
| 16 | Supprimée | <div id="main" class="site-main"> | |
| 16 | Ajoutée | <main id="main" class="site-main"> | |
| 17 | 17 | <?php | |
| 18 | 18 | while ( have_posts() ) : | |
| 19 | 19 | the_post(); | |
| 20 | 20 | wc_get_template_part( 'content', 'single-product' ); | |
| 21 | 21 | endwhile; | |
| 22 | 22 | ?> | |
| 23 | Supprimée | </div><!-- #main --> | |
| 23 | Ajoutée | </main><!-- #main --> | |
| 24 | 24 | </div><!-- #primary --> | |
| 25 | 25 | ||
| 26 | 26 | <?php |
Magento : recette skip-link-main
Afficher l’avant et l’après (1)
app/design/frontend/Validiscan/fixture/Magento_Cms/layout/cms_index_index.xml Modifications apportées à app/design/frontend/Validiscan/fixture/Magento_Cms/layout/cms_index_index.xml (lignes ajoutées : 1, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 6 | 6 | <div>, so the home page has no <main> landmark (and, with the page title hidden by | |
| 7 | 7 | display:none in _theme.less, no h1 either). | |
| 8 | 8 | Fixed variant: keep htmlTag="main"; hide the title visually only (clip), not with display:none. --> | |
| 9 | Supprimée | <referenceContainer name="main.content" htmlTag="div" htmlId="maincontent" htmlClass="page-main"/> | |
| 9 | Ajoutée | <referenceContainer name="main.content" htmlTag="main" htmlId="maincontent" htmlClass="page-main"/> | |
| 10 | 10 | <referenceBlock name="breadcrumbs" remove="true"/> | |
| 11 | 11 | </body> | |
| 12 | 12 | </page> |
app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/footer.phtml Modifications apportées à app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/footer.phtml (lignes ajoutées : 1, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 19 | 19 | ?> | |
| 20 | 20 | <!-- VALIDISCAN-SEEDED list + landmark-unique: list items wrapped in a div inside the ul; second unlabelled nav --> | |
| 21 | 21 | <?php /* Fixed variant: <nav class="footer-nav" aria-label="Footer links"> with the <li> elements directly in the <ul>. */ ?> | |
| 22 | Supprimée | <nav class="footer-nav"> | |
| 22 | Ajoutée | <nav class="footer-nav" aria-label="<?= $escaper->escapeHtmlAttr(__('Footer links')) ?>"> | |
| 23 | 23 | <ul class="footer links"> | |
| 24 | 24 | <div class="footer-col"> | |
| 25 | 25 | <?php foreach ($links as $link): ?> |
app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/header.phtml Modifications apportées à app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/header.phtml (lignes ajoutées : 1, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 13 | 13 | <header class="page-header"> | |
| 14 | 14 | <div class="panel wrapper"> | |
| 15 | 15 | <div class="panel header"> | |
| 16 | Ajoutée | <a class="action skip contentarea" href="#contentarea"><span><?= $escaper->escapeHtml(__('Skip to Content')) ?></span></a> | |
| 16 | 17 | <!-- VALIDISCAN-SEEDED vs-headings-landmarks: the skip link was removed from the header panel --> | |
| 17 | 18 | <?php /* Fixed variant: <a class="action skip contentarea" href="#contentarea"><span>Skip to Content</span></a> */ ?> | |
| 18 | 19 | <?php if ($linksMoved): ?> |
app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/topmenu.phtml Modifications apportées à app/design/frontend/Validiscan/fixture/Magento_Theme/templates/html/topmenu.phtml (lignes ajoutées : 1, lignes supprimées : 1)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 15 | 15 | <div class="section-item-content nav-sections-item-content" id="store.menu" data-role="content"> | |
| 16 | 16 | <!-- VALIDISCAN-SEEDED aria-required-children + landmark-unique: menubar whose children are plain list items; nav without a label --> | |
| 17 | 17 | <?php /* Fixed variant: <nav ... aria-label="Main menu"> and a plain <ul> (no menubar role). */ ?> | |
| 18 | Supprimée | <nav class="navigation" data-action="navigation"> | |
| 18 | Ajoutée | <nav class="navigation" data-action="navigation" aria-label="<?= $escaper->escapeHtmlAttr(__('Main menu')) ?>"> | |
| 19 | 19 | <ul role="menubar" data-mage-init='{"menu":{"responsive":true,"expanded":true,"position":{"my":"left top","at":"left bottom"}}}'> | |
| 20 | 20 | <?php foreach ($items as $item): ?> | |
| 21 | 21 | <li class="level0 <?= $escaper->escapeHtmlAttr($item['class']) ?> level-top"><a href="<?= $escaper->escapeUrl($item['url']) ?>" class="level-top"><span><?= $escaper->escapeHtml($item['label']) ?></span></a></li> |
app/design/frontend/Validiscan/fixture/web/css/source/_theme.less Modifications apportées à app/design/frontend/Validiscan/fixture/web/css/source/_theme.less (lignes ajoutées : 24, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 1264 | 1264 | height: 18px; | |
| 1265 | 1265 | stroke-width: 3; | |
| 1266 | 1266 | } | |
| 1267 | Ajoutée | ||
| 1268 | Ajoutée | /* validiscan:skip-link-main */ | |
| 1269 | Ajoutée | .action.skip:not(:focus) { | |
| 1270 | Ajoutée | position: absolute; | |
| 1271 | Ajoutée | width: 1px; | |
| 1272 | Ajoutée | height: 1px; | |
| 1273 | Ajoutée | margin: -1px; | |
| 1274 | Ajoutée | padding: 0; | |
| 1275 | Ajoutée | overflow: hidden; | |
| 1276 | Ajoutée | clip: rect(0 0 0 0); | |
| 1277 | Ajoutée | white-space: nowrap; | |
| 1278 | Ajoutée | border: 0; | |
| 1279 | Ajoutée | } | |
| 1280 | Ajoutée | .action.skip:focus { | |
| 1281 | Ajoutée | position: absolute; | |
| 1282 | Ajoutée | top: 4px; | |
| 1283 | Ajoutée | left: 4px; | |
| 1284 | Ajoutée | z-index: 100; | |
| 1285 | Ajoutée | padding: 8px 12px; | |
| 1286 | Ajoutée | background: #fff; | |
| 1287 | Ajoutée | color: #1a1a1a; | |
| 1288 | Ajoutée | text-decoration: underline; | |
| 1289 | Ajoutée | } | |
| 1290 | Ajoutée | /* /validiscan:skip-link-main */ |
app/design/frontend/Validiscan/fixture/web/css/styles-m.css Modifications apportées à app/design/frontend/Validiscan/fixture/web/css/styles-m.css (lignes ajoutées : 24, lignes supprimées : 0)
| Ligne avant | Ligne après | Modification | Code |
|---|---|---|---|
| 1232 | 1232 | height: 18px; | |
| 1233 | 1233 | stroke-width: 3; | |
| 1234 | 1234 | } | |
| 1235 | Ajoutée | ||
| 1236 | Ajoutée | /* validiscan:skip-link-main */ | |
| 1237 | Ajoutée | .action.skip:not(:focus) { | |
| 1238 | Ajoutée | position: absolute; | |
| 1239 | Ajoutée | width: 1px; | |
| 1240 | Ajoutée | height: 1px; | |
| 1241 | Ajoutée | margin: -1px; | |
| 1242 | Ajoutée | padding: 0; | |
| 1243 | Ajoutée | overflow: hidden; | |
| 1244 | Ajoutée | clip: rect(0 0 0 0); | |
| 1245 | Ajoutée | white-space: nowrap; | |
| 1246 | Ajoutée | border: 0; | |
| 1247 | Ajoutée | } | |
| 1248 | Ajoutée | .action.skip:focus { | |
| 1249 | Ajoutée | position: absolute; | |
| 1250 | Ajoutée | top: 4px; | |
| 1251 | Ajoutée | left: 4px; | |
| 1252 | Ajoutée | z-index: 100; | |
| 1253 | Ajoutée | padding: 8px 12px; | |
| 1254 | Ajoutée | background: #fff; | |
| 1255 | Ajoutée | color: #1a1a1a; | |
| 1256 | Ajoutée | text-decoration: underline; | |
| 1257 | Ajoutée | } | |
| 1258 | Ajoutée | /* /validiscan:skip-link-main */ |
Commencez par une vérification gratuite de votre boutique.
Envoyez l’adresse de votre boutique. Validiscan la scanne et vous envoie chaque échec que le scan peut prouver, avec sa page et son code.
Demander une vérification gratuiteOu écrivez à info@validiscan.com.
Ce que couvre la vérification gratuite, et ce qu’elle laisse de côté- Vous envoyez
- l’adresse de votre boutique
- Pages scannées
- jusqu’à 15
- Vous recevez
- chaque échec que le scan peut prouver, avec la page et le code
- Sur votre boutique
- pages publiques uniquement ; aucune connexion, aucun achat, aucun formulaire envoyé
- Ce qu’elle n’est pas
- un audit complet