I have noticed today that <main> element should contain only the main content. I, on the contrary, use it as container of <header>, <section> (main content) and <footer>. And this because of formatting reasons (you can see https://www.culturanuova.net).
Should I change my html page structure?
But, if I rename <section> as <main>, what element should I use as container of <header>, <main> and <footer>? There is no a tag such as <container> and <div> would not be semantic…
body. That’s the base element. Always and forever.
But technically, you can use header and footers inside other elements (like article or main) as well but those headers and footers tie directly to the content inside that parent. So for example, you could have a header element that goes with an article element which includes the article headline and byline, and the footer could contain footnotes that goes with the article.
So, in reality your layout isn’t semantically wrong, just uncommon. And could probably be improved upon.
But this gives me pause that your layout structure is more semantically wrong than what you’re saying. If it’s laid out a certain way for formatting purposes, you’re probably doing it wrong. The content should stand alone logically without any styling at all. Styling is additive not a replacement.
2 Likes
Thank you!
As you can see <header>, <section> (main) and <footer> are (stylistically) grouped as vertically aligned, and in a desktop resolution at their side there are two <aside> element.
Transforming the structure in a fully semantic way means, I guess, a lot of css work, doesn’t it?
While, a common container, is, from a css point of view, much simper.
Ahhhhhh… I see what you’re doing. You’re using it as a tool to set a max-width on your site.
Not sure I agree with the use of aside for the pop-ups but the other markup is ok in that usage.
1 Like
Yes.
Maybe a solution could be use a <div> element as container, and use <main> in its semantic sense for the real main content of a webpage.
BTW, pop-up is not an aside element (you can see this topic).
That sound about right to me. If you structurally need another global container below body.
1 Like
Indeed I did so. Thank you all.
1 Like
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.