I always stumble upon this (rather simple question) when making e.g. Wordpress blogs. Should I wrap the headline, which should also be a link, in a anchor <a>
element, or should it be the other way around. And why?
(1):
<a href="foo"> <h1>bar</h1> </a>
(2):
<h1> <a href="foo">bar</a> </h1>
I always end up doing (1), as it just seems more logical to me, that the headline is wrapped in a link.
Does it make any difference in e.g. SEO? Will it reflect the SEO ranking?
An anchor is a piece of text which marks the beginning and/or the end of a hypertext link. The text between the opening tag and the closing tag is either the start or destination (or both) of a link. Attributes of the anchor tag are as follows. OPTIONAL.
Add a custom anchor To add an anchor to a heading in HTML, add a <section> element with an id attribute. Don't use <a name> . Use lowercase for id values, and put hyphens between words. To add an anchor to a heading in Markdown, add the following code to the end of the line that the heading is on.
They're both correct in html5, html allows block elements in inline elements. This also has no effect on SEO, both cases the text is wrapped in the heading, so it remains to have the same value.
An anchor tag, or anchor link, is a web page element that links to another location on the same page. They are typically used for long or text-heavy pages so that visitors can jump to a specific part of the page without having to scroll as much.
Prior to HTML5:
The anchor has to be inside the header, you cannot put a block-level element inside an anchor, and most browsers will not render it 100% reliably if you do.
In HTML5:
It doesn't matter, use whichever one makes the most semantic sense. Likely the first one.
Remember that if your document is using HTML4 DTD's, it will not validate and may not render correctly because it's using the old rules where an anchor cannot contain a block-level element. Only use the first option in HTML5. XHTML is equivalent to HTML4, I'm not 100% sure about XHTML1.1 though (try it and see if it validates).
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