Video skal have undertekster, lyd skal have en transskription, og intet må afspille lyd automatisk

Døve og hørehæmmede kunder går glip af alt, der kun bliver sagt i en produktvideo, og skærmlæserbrugere kan ikke høre deres skærmlæser, når der automatisk afspilles lyd. Produktvideoer indeholder ofte netop de detaljer, der overbeviser folk om at købe.

Regel-id
vs-media
Kilde
Validiscan-kontrol
Alvorlighed
Moderat
Rettelsesniveau
MANUAL
på Shopify, Shopware, WooCommerce og Magento
Status
køres

Hvad kontrollen gør

Markerer videoelementer uden undertekstspor, lyd uden link til en transskription (1.2.1, 1.2.2) og medier, der automatisk begynder at afspille lyd (1.4.2). Erstatter axe-reglerne video-caption og no-autoplay-audio.

Kontrollen aflæser op til 200 video-, audio-, iframe-, lite-youtube- og lite-vimeo-elementer samt medier, der er udskudt i template-elementer, for eksempel Shopifys deferred-media. Udskudte medier rapporteres på deres wrapper; deres autoplay tæller ikke.

En video regnes for tekstet, når den indeholder et track af typen captions eller subtitles eller et track uden type. Undertekster, der er brændt ind i billedet, genkendes ikke. En lydløs video, der afspilles automatisk uden controls, regnes som dekorativ og får resultatet »kræver gennemgang«.

For audio leder kontrollen efter et link, en knap eller et summary, med ordet for transskription på engelsk, tysk, fransk, spansk eller dansk, op til nærmeste section, article, main, aside, dialog eller region, og stopper ved en wrapper, der indeholder andre medier. Uden et sådant er lyd med controls et fund; uden controls får den resultatet »kræver gennemgang«, medmindre den afspilles automatisk med lyd.

Medier med lyden slået til og uden controls, som har autoplay eller allerede afspilles, er et fund under 1.4.2. Indlejringer fra YouTube, Vimeo, Wistia, Dailymotion og Vidyard får resultatet »kræver gennemgang«. Scanneren laver i dag ingen fund af resultater, der kræver gennemgang.

Sådan retter du det

Tilføj undertekster (en <track kind="captions">-fil eller undertekster i selve videoen) til alle produktvideoer med tale, link til en transskription ved siden af lydindhold, og start medier uden lyd eller først, når den besøgende beder om det, med synlige knapper til pause og lydstyrke.

WCAG-succeskriterier

Afsnit i EN 301 549

Afsnittet i EN 301 549 for hvert kriterium, fordelt på versioner af standarden
WCAG-kriterium Version 3.2.1 Version 4.1.1
1.2.1 9.1.2.1 9.1.2.1
1.2.2 9.1.2.2 9.1.2.2
1.4.2 9.1.4.2 9.1.4.2

Opskrifter, der angiver denne regel

Reglen har niveau MANUAL. I et projekt følger et fund af reglen MANUAL-forløbet, og disse opskrifter anvendes ikke på det.

Shopware: opskrift mute-autoplay

Vis før og efter (1)
mutes a seeded autoplaying background video; vs-media no longer reports autoplay Eksempeldata

Resources/views/storefront/block/cms-block-video.html.twig Ændringer i Resources/views/storefront/block/cms-block-video.html.twig: 1 tilføjet, 1 fjernet

Ændringer i Resources/views/storefront/block/cms-block-video.html.twig: 1 tilføjet, 1 fjernet
Linje før Linje efter Ændring Kode
9 9 <h2 class="cms-block-title">{{ block.title }}</h2>
10 10 <p class="cms-video-text">{{ block.text }}</p>
11 11 <div class="cms-element-video">
12 Fjernet <video class="cms-video" autoplay loop preload="none" width="1280" height="720" poster="{{ block.posterUrl }}">
12 Tilføjet <video class="cms-video" autoplay loop preload="none" width="1280" height="720" poster="{{ block.posterUrl }}" muted playsinline>
13 13 <source src="{{ block.videoUrl }}" type="video/mp4">
14 14 {% if block.captionsUrl %}
15 15 <track kind="captions" src="{{ block.captionsUrl }}" srclang="en" label="{{ 'general.captionsEnglish'|trans }}" default>

Begynd med et gratis tjek af din webshop.

Send din webshops adresse. Validiscan scanner den og svarer med hver fejl, scanningen kan påvise, med siden og koden.

Bestil et gratis tjek

Eller skriv til info@validiscan.com.

Hvad det gratis tjek omfatter, og hvad det udelader
Du sender
din webshops adresse
Sider, der scannes
op til 15
Du får
hver fejl, scanningen kan påvise, med siden og koden
På din webshop
kun offentlige sider; intet login, intet købt, ingen formularer sendt
Hvad det ikke er
et fuldt audit

Skriv til Validiscan

Til et gratis tjek skal du skrive din webshops adresse og platform.

Validiscan bruger det, du sender, til at svare dig. Privatlivspolitik