Problem/Motivation
Block titles can currently be displayed or hidden by site-builders. When hidden, the heading element is omitted from the HTML entirely. Hiding titles might be desirable for a visual design, however block titles can be useful for visually impaired users, providing contextual clarity and navigational cues via screenreaders.
Proposed resolution
Add another option in block configuration, to output visually-hidden block titles, with a "visually-hidden" class.
In D7 this functionality is provided by the a11y_titles module.
We have already added equivalent functionality to D8 for the FieldAPI label display. Offering visually-hidden block titles will extend the options available for site builders to fine-tune the page structure.
Remaining tasks
- Usability review: decide whether to use radio buttons or select element, suitable labels and help text. (FieldAPI label display uses a select).
- Documentation: explain the visually-hidden option on the block help page?
Update settings form in\Drupal\Core\Block\BlockBase::buildConfigurationForm()
Update HTML output in block module, adding "visually-hidden" class to title_attribute twig variable via template_preprocess_block. The block twig template does not need to be changed.Update block settings config schema.Not necessary -block_settings.label_display
is already type: string, not boolean.- Update installation config in core profiles/modules, changing
block_settings.label_display
values of '0' to explicit 'hidden'. - hook_update(). Change
block_settings.label_display
values of '0' to explicit 'hidden'. - Write tests.
- Some blocks have custom behaviour, e.g. menu blocks already have visually hidden titles, and Bartik uses it's own CSS to hide block titles in the header region. Come up with an approach for these - we might be able to remove custom templates and CSS, relying instead on installation config.
User interface changes
Block title display option changes from a boolean checkbox option to 3 options, most likely radio buttons or a select element: Visible, Visually Hidden, Hidden.
Aim for consistency with the Field API options in entity manage-display settings.
Also descriptive help text may change (D7 a11y_titles module says "Block titles can provide context to users who can’t rely on visual cues").
API changes
None expected.
Data model changes
We are introducing a third option to Block title display: 'visually-hidden'. Effect on data model are as follows:
- Config Schema: NO CHANGE. While we are introducing an additional option ('visually-hidden') for the core data type
block_settings.label_display
, this is already of type: string, which accommodates all proposed values (visible, visually-hidden, hidden). - Installation Config: CHANGED. Block configuration files in
config/install
folders will need to be updated, changingblock_settings.label_display
values of '0' to explicit 'hidden'. - Existing Sites' Config: UPDATE HOOK required, changing
block_settings.label_display
values of '0' to explicit 'hidden'.