One of our pages has an empty heading (heading tag with no text content).
Headings help to break up content and make it easier for visitors to scan a page for information. They need to be set up correctly so that visitors using screen readers can use them in this way.
-- Siteimprove
"The page heading shouldn’t be blank. It should display the name of the team member. We investigate the source code for the team member layout (_layouts/member.html) to try to troubleshoot this issue, and we find that the page heading expects the value name_degree to be set. When we review the source code for specific team member page (_members/cynthia-rosas.md), we discover that the name_degree value is not defined. It should be okay for name_degree to be undefined, since some team members such as undergraduate student interns are without degrees, and repeating the page title would be redundant. However, without a defined name_degree value, the heading for the member page is going to be empty. One way to address this is to use a fallback value for the header when name_degree is undefined. Member pages have a title value, and the H1 element is meant for the title, making the title value a good fallback. "
-- Accessibility updates journal
Fix:
We decide to set the layout's title value as the fallback (default) value for the H1 when name_degree is undefined.
Issue:
One of our pages has an empty heading (heading tag with no text content).
"The page heading shouldn’t be blank. It should display the name of the team member. We investigate the source code for the team member layout (
_layouts/member.html) to try to troubleshoot this issue, and we find that the page heading expects the value name_degree to be set. When we review the source code for specific team member page (_members/cynthia-rosas.md), we discover that thename_degreevalue is not defined. It should be okay forname_degreeto be undefined, since some team members such as undergraduate student interns are without degrees, and repeating the page title would be redundant. However, without a definedname_degreevalue, the heading for the member page is going to be empty. One way to address this is to use a fallback value for the header whenname_degreeis undefined. Member pages have atitlevalue, and the H1 element is meant for the title, making thetitlevalue a good fallback. " -- Accessibility updates journalFix:
We decide to set the layout's
titlevalue as the fallback (default) value for the H1 whenname_degreeis undefined.