ElkArte Community

Elk Development => Theme development => Topic started by: Antechinus on May 18, 2022, 10:33:49 pm

Title: HTML main tag and a11y
Post by: Antechinus on May 18, 2022, 10:33:49 pm
I noticed that your < main > tag is  nested inside #wrapper and #main_content_section. This is "hierarchically-correct" according to W3 specs, but WebAIM says (https://webaim.org/techniques/semanticstructure/):
Quote< header >, < main >, and < footer > must be direct children of < body > to be exposed to screen readers. They cannot be nested within other container elements.
Which is a bit of a nuisance. With a forum it more or less means you either bung the news and linktree into < main >, or you find somewhere else for them.

I've gone with just bunging the news and linktree in. I figure that, in practice, the lower linktree and all sorts of minor shiznit (post buttons, etc, etc) are going to have to end up in there anyway, so no point getting too persnickety about the top linktree and the news being in there either. The skipnav link can still go straight to #main_content_section, so no dramas there.
Title: Re: HTML main tag and a11y
Post by: Spuds on May 19, 2022, 06:35:33 pm
Well that kind of stinks :nose:

It not flagging that issue when I run the wave analyzer, not that it is infallible, (much like the html validator).  I'll move it around and see what breaks when I do that. 

I've been cleaning up some of the other low hanging fruit that the validator spits out, some of it is a bit of a circle jerk, but some is just easy.
Title: Re: HTML main tag and a11y
Post by: Antechinus on May 21, 2022, 06:38:42 pm
Ok, if WAVE can still see the main tag where it was, it may be that screen readers have improved since WebAIM wrote their article. Not sure. It's just something I noticed when reading their site. :)