Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Should I use multiple h1 or multiple h2 without h1?

In a web page that shows a list of tutors, the current HTML codes:

<div id="tutors">

 <h1>Tutors</h1>
 <div class="tutor">
  <h2>John</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>Mary</h2>
  <p>...</p>
 </div>

 <div class="tutor">
  <h2>David</h2>
  <p>...</p>
 </div>

</div>

Now, for some reasons, the word Tutors which is currently wrapped by h1 needs to be removed in the page. I can think of 3 choices:

  1. Use css to hide it.
  2. Simply remove it, and the page will have h2 without h1.
  3. Remove it, and change all h2 to h1.

Which one is more appropriate?

like image 603
bobo Avatar asked Jan 04 '12 05:01

bobo


4 Answers

#3: Remove it, and change all h2 to h1.

  1. For SEO, hiding text is frowned upon because it can be considered black-hat SEO. Unless you're going to replace the header with an image that has the text, "Tutors".
    • Should I include my logo text using 'alt' or CSS?
    • Hiding Text with CSS for SEO
    • If you insist on hiding the text, Accessibility/SEO Friendly CSS Hiding
  2. You cannot have <h2> unless there's an <h1> beforehand.
    • Headings, heading hierarchy, and document outlines
like image 82
Ayman Safadi Avatar answered Oct 13 '22 02:10

Ayman Safadi


None of these options are good SEO.

  1. This is risky and a bad practice. Search engines have become very good at figuring out when text is hidden and if they find that a heavily weighted tag like <h1> is hidden it will hurt your rank.
  2. You should never skip a step in the hierarchy of headers (don't have <h3>'s without <h2>'s etc.). In addition they should always appear in decreasing order of importance.
  3. Every page should have exactly one <h1> and it should be the first heading tag. They are on the order of <title> in terms of SEO weight.

Why does this headline need to be hidden in the first place? It seems like a good description of the content of the page.

like image 33
Ansel Santosa Avatar answered Oct 13 '22 00:10

Ansel Santosa


Depending on the use case for the page, any three of those sound like valid options. That said, here are some things I thought about when considering this question:

  • SEO: it appears there is some opinion out there that the choice of tag content may affect search engine ranking.
  • Style-less rendering: if for some reason the page might be rendered without the accompanying css sheets, be aware of the effect of default rendering on the page and how you might want it to perform
  • Be aware that there are new common tags like 'section' in HTML 5, which might fit your page and be a bit clearer semantically than H tags
like image 31
Josh Diehl Avatar answered Oct 13 '22 00:10

Josh Diehl


This is a preference. You should always separate presentation and structure, so I would say just comment it out, and put that it use to be there. If you hide it, this really isn't presentation because it is never seen. So 3 would be the most appropriate.

like image 25
Andy Avatar answered Oct 13 '22 02:10

Andy