Which semantic tag to use for this?
Hi, for this banner on top, in which semantic tag should I wrap it?
12 Replies
I'd personally just wrap it in a div.
Wait you're on Hallmark's website, why not inspect and see what they did?
so there is no semantic tag for it?
um no actually I designed this website, now gonna code it, and I used Hallmark logo.
for practice
Ah, well I would try to find other sites in the future that have something like that and see how they implemented it
ok for now I am goin gto use div
The header element has a role of “banner” if it’s not nested in another element
I'm with Vince, I'd just use a div.
Like savvystrider15 mentioned,
<header> has a role of banner, but that's for defining the global site header, which this definitely isn't (that would be the logo and nav under it).
It could potentially be an aside ... that would make it a landmark area for screen readers, which makes it easier for them to navigation between them (aside, header, main, footer, etc)... I think I'd lean to using a div though,An announcement type banner? Feels like a good use case for div as others have mentioned
Thank you all, I would go with Div, I should use it outside and before the header tag, right?
I think you could put it in the header
Hm maybe not. I guess it wouldn't be introductory to the page content, just a banner
I was checking Cartier website, they put it inside a div and that div wrapped in a header tag.
https://www.cartier.com/en-us/home
My first instict would be to have it before the header, but the more I think about it, includnig it in there does make sense
ok I would place it before the header inside a div, thanks