Practică recomandată Prioritate: Moderat
Pagina are mai multe zone de conținut principal
Două sau mai multe părți ale paginii sunt marcate drept conținut principal. Ar trebui să existe una singură. Este o practică recomandată, care depășește nivelul WCAG 2.2 AA pe care se bazează legea.
Acest text a fost tradus automat și nu a fost încă verificat de un vorbitor nativ.
De ce contează pentru clienții tăi
Utilizatorii de cititoare de ecran sar între zonele paginii (antet, meniu, conținut principal, subsol) ca între capitole. Când sar la „conținutul principal”, pot ajunge pe un banner sau un widget în loc de pagina produsului sau coș și trebuie să caute din nou.
Pe cine afectează
- persoane nevăzătoare care folosesc cititoare de ecran
- utilizatori de tastatură care se bazează pe linkul „Salt la conținut”
- persoane cu vedere slabă care folosesc lupe de ecran cu voce
Cum se remediază
Păstrați un singur element <main> (sau role="main") care cuprinde conținutul real al paginii. Înlocuiți elementele <main> sau role="main" suplimentare din șabloanele imbricate, secțiuni și widgeturi încorporate cu <div> sau <section>. Verificați și ferestrele pop-up, vizualizarea rapidă a produsului și meniurile mari, deoarece sunt adesea construite dintr-o copie a șablonului de pagină.
În Shopify
De obicei, layout/theme.liquid al temei conține deja <main>, iar o secțiune sau un bloc de aplicație adaugă încă unul. Schimbați elementul <main> în plus din fișierul secțiunii sau cereți dezvoltatorului aplicației să îl elimine.
În Shoptet (CZ)
De obicei, provine din HTML propriu adăugat pe o pagină sau din șablon. Verificați mai întâi codul adăugat de dumneavoastră; dacă problema este în șablon, semnalați-o către Shoptet sau un partener.
În PrestaShop
De obicei, atât șablonul de layout al temei (.tpl), cât și un șablon de modul afișează <main>. Editați suprascrierea șablonului modulului în temă, astfel încât doar layout-ul să aibă <main>.
În WooCommerce
De obicei, tema încadrează conținutul în <main>, iar un page builder sau o suprascriere de șablon WooCommerce adaugă al doilea. Corectați în șablonul temei copil sau schimbați eticheta containerului din builder în div.
Standarde
Nu este un criteriu WCAG, ci o practică recomandată care face site-ul mai ușor de folosit.
Verificare automată: regula axe-core landmark-no-duplicate-main.
dequeuniversity.com, github.com, www.w3.org