2

I have created a Parent Article, which briefly talks about its allocated Child Articles. Here is, typically, how I have structured the Parent Article's page ...

  • H1 - Parent Article
  • A small introduction
  • H2 - Sub Article Title 1
  • Some content
  • H2 - Sub Article Title 2
  • Some content
  • Conclusion

What would be the best approach, to link to each Sub Article? Obviously, I want to ensure that my linking strategy, is focused on boosting my SEO efforts as well as maintaining a positive user experience.

Is it common practice, to turn headings into links?

PS: I want to link to external child articles (other pages), in oppose to internal blocks within the same the page.

Improve this question
3
  • 1
    Search engines are semantic search engines these days and follow HTML DOM traditions. Header tags are supposed to describe the content blocks that immediately follow it. If you make it a link, to another point, you may be defeating this.
    – closetnoc
    Nov 23, 2015 at 17:41
  • 2
    Link to what exactly? It would be usual (and ux useful) to make them link targets, so you can link to parts of the document.
    – MrWhite
    Nov 23, 2015 at 18:57
  • 1
    To be clear, those are "headings" not "headers".
    – Rob
    Mar 23, 2016 at 20:35

2 Answers 2

Reset to default
2

H1 should be the same as the article's title, so it has no sense that H1 becomes a link.

H2 could be marked up as link, but as an anchor, like <h2><a name="h2anchor">text</a></h2>

Then, if you want to make a link / an internal jump to your H2, you link to it with

<a href="#h2anchor">jump to H2</a>

or, in full, absolute address notation:

<a href="http://www.example.com/your-page#h2anchor">jump to H2</a>

Improve this answer
0

Try this format:

<!DOCTYPE HTML>
<html>
<head>
<title>Some page</title>
</head>
<body>
<h1>Major title</h1>
<h2>Table of contents</h2>
<ol>
<li>
<a href="#one">Section One</a><br>
</li>
<li>
<a href="#two">Section Two</a><br>
</li>
<li>
<a href="#three">Section Three</a><br>
</li>
</ul>

<a name="one">
<h3>Section One</h3>
<p>one one one one one one one one one one one one one one one one one one one one one one one one one one one one one one </p>
<p>one one one one one one one one one one one one one one one one one one one one one one one one one one one one one one </p>

<a name="two">
<h3>Section Two</h3>
<p>two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two </p>
<p>two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two two </p>

<a name="three">
<h3>Section Three</h3>
<p>three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three </p>
<p>three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three three </p>

</body>
</html>

I apologize for a rather unprofessional HTML page, but I need to illustrate something.

I have the major headings at the top so they are easy to see and I also have H1 before H2 since the text in H1 is the most important and H2 complements the title.

I defined the sections in H3 headers and I created links to each section. so that in the table of contents, when someone selects a section, the browser automatically scrolls the screen to the section.

My code is generally valid for HTML 4. For HTML 5 compatibility, you may have to change <a name="whatever"> to either <a ID="whatever"> or just remove <a name="whatever"> and replace it with ID="whatever" and insert that into an H3 tag so that you get for example: <h3 ID="three">Section Three</h3>

I personally would never turn a header into a link because that isn't the purpose of a header. If you want links as large-sized or bolded text, you should try to use cascading stylesheets and apply a style to the text.

Improve this answer
1
  • I want to link to external child articles (another pages), not to internal blocks within the same the pase.
    – Simohammedhttc
    Nov 24, 2015 at 10:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.