accessibility

the PowerMapperTool moans that an h1 element should be marked as strong


I tested my website https://www.skyeshepherdhuts.co.uk/ the other day using the PowerMapper tool and the following problem was flagged up under accessibility. An element is CSS-styled as

h1 { font: bold 52px/1.0 serif; }

and the PowerMapperTool moans that the h1 element should be marked with <strong>, as in

<h1><strong>…</strong></h1>

instead of being CSS-styled as bold. My question : Is this just a bug in the tool, to be safely ignored, or is it really going to cause confusion for assistive tech users? I don’t intend the h1 to have semantic emphasis; it’s just an appearance thing for me, like choosing a different font.


Solution

  • It's invalid HTML to nest an h1 in a strong element, so if PowerMapper is telling you to do that then it's wrong. There is no reason to put a strong element inside an h1 just for the sake of styling the h1. It is perfectly fine to use CSS only to style the h1.