Accessible Carousel & Slider – WCAG AA Compliant Slideshow

2.11.4

Featured products carousel: the price is printed in a

<

div> instead of a

<

p>, so a short bold price is no longer reported as a possible heading.

It looks the same.

2.11.3

Skip carousel link is fixed to the top-left of the screen while it has

focus, above any sticky or see-through site header, so its contrast is

never reduced by a header laid over the carousel (WCAG 1.4.3).

2.11.2

Slide buttons add the slide heading for screen readers, so “See more”

is announced as “See more: {heading}” (WCAG 2.4.4).

Pause / Play now announces “Carousel paused” or “Carousel playing”

through a polite status region (WCAG 4.1.3).

Skip carousel link keeps white on navy on focus and uses a two-tone

focus ring that holds 3:1 over any slide image (WCAG 1.4.11, 2.4.7).

2.11.1

Hidden link context now uses a colon, not an en dash. Card and WooCommerce

featured links add the item name for screen readers, so “View case study”

is announced as “View case study: Anandodhara”. The separator was an en

dash, which some screen readers read aloud as “en dash” and which broke a

plain-hyphen house style on the page. The visible text still starts the

accessible name, so WCAG 2.5.3 Label in Name is unchanged.

2.11.0

New: Slide height presets on the Accessible Carousel block. Short, Medium,

Tall and Full screen are one choice in the sidebar, so a full height hero

no longer needs any CSS.

Fixed: the Slide height field silently dropped svh, lvh and dvh values.

Only vh was on the