Is there any authoritative information on the web concerning which HTML element to chose for an advertisement banner?
I considered <article>
or <aside>
, but I think more appropriate is simply: <div class="ad">
In most cases I'd use the aside
element:
The element can be used for […] for advertising, […] and for other content that is considered separate from the main content of the page.
As the aside
element is a sectioning element, it creates an entry in the document outline, even if you don't use a heading explicitly. In most cases this would be what you want.
If you don't host the ad yourself, you might want to include it in iframe
:
Here is an example of a page using an
iframe
to include advertising from an advertising broker:<iframe src="http://ads.example.com/?customerid=923513721&format=banner" width="468" height="60"></iframe>
(Where appropriate use the sandbox
attribute for security.)
So, a simple blog post page could be structured like:
<body>
<h1>My blog</h1>
<article>
<h1>My blog post</h1>
<p>…</p>
</article>
<nav>
<h1>Navigation</h1>
<!-- site-wide navigation -->
</nav>
<aside>
<h1>Advertisement</h1> <!-- or omit the heading altogether, it doesn't change the outline -->
<iframe></iframe>
<footer><small>Advertisement by ACME Inc.</small> <!-- or whatever --> </footer>
</aside>
</body>
The page has the following outline:
- My blog
- My blog post
- Navigation
- Advertisement
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With