Sprístupnite si svoju webovú stránku jediným kliknutím – dôveruje jej viac ako 60,000 webové stránky po celom svete

Ako vytvoriť dostupné kolotoče obrázkov vo WordPress

pridané

Marlene Fichtnerová

Nahrané o

Januára 6, 2025

Kontrolný zoznam bezplatnej prístupnosti
Získajte bezplatný kontrolný zoznam s najdôležitejšími kontrolami prístupnosti.
Obrázkové kolotoče sú vizuálne pútavé prvky, ktoré môžu zvýšiť príťažlivosť vášho webu WordPress. Bez správneho dizajnu však môžu byť pre používateľov so zdravotným postihnutím nedostupné. Zabezpečenie dostupnosti v obrázkových karuseloch zlepšuje použiteľnosť pre všetkých návštevníkov a zabezpečuje súlad so štandardmi WCAG a ADA.

Bežné problémy s prístupnosťou v karuseloch obrázkov

Problém Popis Vplyv - CSR
Neprístupnosť klávesnice Ovládanie karuselu nie je možné ovládať pomocou klávesnice. Nezahŕňa používateľov, ktorí sa spoliehajú na navigáciu pomocou klávesnice.
Chýba alternatívny text Na obrázkoch chýba popisný alternatívny text pre čítačky obrazovky. Používateľom čítačky obrazovky chýba dôležitý obsah.
Problémy s automatickým posúvaním Automatické posúvanie karuselov bez kontroly používateľa. Rozptyľuje alebo dezorientuje používateľov, najmä tých s kognitívnymi poruchami.

Podrobný sprievodca dostupnými kolotočmi

1. Vyberte Dostupný modul Carousel

Vyberte doplnok WordPress, ktorý uprednostňuje dostupnosť. Odporúčané možnosti zahŕňajú:

2. Pridajte roly a atribúty ARIA

Úlohy ARIA zlepšujú dostupnosť karuselov. Zahrňte roly, ako napríklad:

Predchádzajúci Ďalej

3. Zahrňte popisný alternatívny text

Uistite sa, že každý obrázok v karuseli má zmysluplný alternatívny text:


4. Povoľte navigáciu pomocou klávesnice

Otestujte navigáciu pomocou Tab kľúč. Pridajte CSS pre indikátory zamerania:

button:focus { obrys: 2px solid #005fcc; }

5. Poskytnite ovládacie prvky pre automatické posúvanie

Povoliť používateľom pozastaviť alebo zakázať automatické posúvanie:

Pauza

Testovanie vášho kolotoča

  • klávesnica: Pohybujte sa vo všetkých prvkoch iba pomocou klávesnice.
  • Čítačky obrazovky: Na testovanie funkčnosti čítačky obrazovky použite nástroje ako NVDA alebo VoiceOver.
  • Nástroje dostupnosti: Spustite audity pomocou nástrojov ako WAVE alebo Lighthouse.

Prípadová štúdia: Dostupný karusel pre webovú stránku elektronického obchodu

Internetový obchod aktualizoval svoj karusel produktov tak, aby zahŕňal roly ARIA a navigáciu pomocou klávesnice. Výsledkom bolo 20 % zvýšenie zapojenia používateľov so zdravotným postihnutím a zlepšené skóre dostupnosti na celom webe.

Často kladené otázky

Prečo sú kolotoče obrázkov často nedostupné?

Chýbajú im správne ovládacie prvky navigácie, alternatívny text a správa zamerania, čo sťažuje interpretáciu pomocných technológií.

Môžem sprístupniť existujúci karusel?

Áno, pridaním atribútov ARIA, alternatívneho textu a zabezpečením správnej funkčnosti klávesnice.

Sú karusely s automatickým posúvaním v súlade s WCAG?

Iba ak poskytujú používateľom ovládacie prvky na pozastavenie alebo zastavenie posúvania.

Tento blog slúži len na informačné účely a nepredstavuje právne poradenstvo. Neposkytujeme žiadne vyhlásenia ani záruky týkajúce sa presnosti, úplnosti alebo použiteľnosti obsahu. Požiadavky na prístupnosť sa môžu líšiť v závislosti od jurisdikcie a prípadu použitia. V rozsahu povolenom zákonom sa zriekame akejkoľvek zodpovednosti vyplývajúcej zo spoliehania sa na poskytnuté informácie. 

súvisiace články

Najlepší kvízový plugin pre WordPress

Interaktívne kvízy sú jedným z najúčinnejších nástrojov na zapojenie, generovanie potenciálnych zákazníkov a…

Ako optimalizovať dostupnosť pre viacjazyčné stránky WordPress

Zabezpečenie prístupnosti na viacjazyčných stránkach WordPress je kľúčové pre vytvorenie inkluzívneho webového zážitku…

Ako vyriešiť problémy s prístupnosťou v témach WordPress tretích strán

Témy WordPress od tretích strán často prichádzajú s pôsobivým dizajnom, ale môžu im chýbať vstavané funkcie prístupnosti.…

Ako pridať preskakovacie navigačné odkazy do ponúk WordPress

Odkazy na preskočenie navigácie sú nevyhnutné pre zlepšenie prístupnosti vašej stránky WordPress. Umožňujú…

Ako zabezpečiť dostupnosť v blogových príspevkoch WordPress

Prístupnosť v blogových príspevkoch zabezpečuje, že váš obsah je inkluzívny a použiteľný pre všetkých…

Ako navrhovať prístupné formuláre v Elementore

Vytváranie prístupných formulárov v Elementore zabezpečuje, že všetci používatelia vrátane používateľov so zdravotným postihnutím môžu…

Krok za krokom: Riešenie problémov s prístupnosťou vo WooCommerce

WooCommerce je populárna platforma na vytváranie online obchodov, ale zabezpečenie jej dostupnosti je…

Ako otestovať dostupnosť s čítačkami obrazovky na WordPress

Testovanie vašej WordPress stránky pomocou čítačiek obrazovky je kľúčové pre zabezpečenie jej prístupnosti…

Sprístupnite si svoju stránku ešte dnes

Dôveruje mu viac ako 60,000 1 webových stránok – vyrobený v Európe. OneTap je plugin číslo 1 pre prístupnosť vo WordPresse. Zlepšite prístupnosť za XNUMX minútu – nie je potrebné žiadne kódovanie.
1
Vyberte si svoj balíček
2
Stiahnuť plugin
3
Inštalácia jedným kliknutím
dokončené
1
Vyberte balíček
2
Stiahnuť plugin
3
inštalovať
dokončené
Bezplatný kontrolný zoznam prístupnosti pre WordPress

Čo robí väčšina WordPress stránok zle – a ako to opraviť. Získajte praktický kontrolný zoznam krok za krokom na odhalenie bežných problémov s prístupnosťou na vašej stránke WordPress.