Editing pages

Accessibility

The built-in blocks output HTML that screen readers understand, and the Editor can be used with the keyboard. A few options are still set page by page: alternative texts, heading levels, video captions.

Images

The Image, Cards, Gallery and Media and text blocks have a Decorative image option.

• An image that carries information keeps the option unchecked and gets an alternative text saying what it shows.
• A purely decorative image (mood, illustration without content) is checked Decorative image: it gets an empty alt and screen readers skip it.

The SEO check reports the block images that have no alternative text and are not marked as decorative.

Heading levels

The Cards, Accordion, Files and Call to action blocks have a Title level option (H2 to H4). The default is the level used before the update. Pick the level that follows the section heading: an H3 under an H2, without skipping a level. The SEO check reports skipped levels.

Videos

The Video block accepts:

• a title, read by screen readers;
• a WebVTT captions file (.vtt) and its language, for a video file only: for a YouTube or Vimeo video, add the captions on the platform;
• a transcript, displayed under the video.

Colors and contrast

• A section with a background color picks a readable text color itself (dark or white), from the contrast with the background. A light block inside a dark area keeps a dark text.
• The muted text color stays readable on dark backgrounds.
• The color fields of the Hero, Section and Link blocks remind of the contrast to keep: at least 4.5:1 between the text and the background.

On the website

• Links opened in a new window say so to screen readers.
• Decorative characters drawn by the block styles are no longer read.
• Gallery lightbox: the image links have an accessible name, the dialog has a label and the position of the image is announced.
• The placeholder of an empty Text block is shown in the Editor preview only, no longer on the website.

Using the Editor with the keyboard

In the Editor block list:

The actions are announced to screen readers. The add block popup, the icon picker, the custom block fields builder (move a field up, down, into or out of a repeater) and the nested blocks field (Move up and Move down buttons) can be used with the keyboard too.