4

The design of my website looks good, but trying to put a main big heading at the top doesn't look as nice. But I know how important a H1 tag is for SEO , after all it is the main heading describing the page the visitor is on.

That being said, I have a breadcrumb as the top of my page which looks similar to:

Home > directory > page

The HTML for the bread crumb looks like this:

<ul>
    <li><a href="/">Home</a></li>
    <li class="bread-separator"> > </li>
    <li><a href="/the-website-page" class="red">The website page heading</a></li>
</ul>

Now because the H1 tag that I want to put on my page is the same as the title in the breadcrumb, would it be acceptable for SEO to put the H1 tag in the bread crumb like this:

<li><a href="/the-website-page" class="red"><h1>The website page heading</h1></a></li>
  • I would not do this. While I do not think there is a specific problem, at least that I can think of right away, using an h1 tag along with your bread-crumbs gives you two opportunities for semantic weighting. In otherwords, you likely double your search match potential keeping them separate. Cheers!! – closetnoc May 24 '16 at 15:05
  • Your <a ...><h1> points to the current page, which is pretty confusing. – maaartinus Nov 28 '16 at 0:53
1

If you end up splitting up the breadcrumb from the H1 tag like closetnoc suggested in the comments (which is a good idea I think), I think you're still left with the problem where you stated, "My site looks good. But putting a big heading at the top doesn't look as nice."

In that case, I would still use the H1 tag (as you realize is very important) and simply add a class to it that simply changes the CSS such that the size is much more appropriate (smaller, I would guess according to you). That way you keep your breadcrumbs split from your H1 (like closetnoc suggests) as well as keep your website looking good by altering the H1 tag class to make the font smaller.

  • So are you saying to go with my code example above but make the h1 tag the same size as the rest of the breadcrumb? – Matthew Smart May 24 '16 at 15:45
  • Sorry for the confusion - there's also a chance I might not be understanding what you're trying to accomplish. However, I believe closetnoc is saying do not use your <li><a href="/the-website-page" class="red">...</a></li> idea b/c maybe he's presuming that H1 content is elsewhere besides your breadcrumb (having a few H1s with similar content has been proven 'fine'). If that's not the case though and your bread crumb is your only H1, then simply add something to the styling of it (eg. <li><a href="/the-website-page" class="red"><h1 class ="smaller">The website page heading</h1></a></li> – Tony DiNitto May 24 '16 at 18:48
  • @MatthewSmart For the record, you should only ever use one h1 tag. The h1 tag is special in that it signifies what the entire page is about just like the title tag and description meta-tag. If you use more than one h1 tag, Google will only weigh the first one found basically ignoring the second making any effective SEO value completely moot. This is done very intentionally. – closetnoc May 24 '16 at 22:44
1

No effect. Breadcrumb is specific structure to display tree structure of links. You can apply anchor attributes like title.

H1 or other highlighters ( em,cite,headings) help to extract document meta-data. Link is for navigation ,so document highlighter does not effect on them.

0

<h1> states it's the main heading. That's enough information for Google.

If you care about SEO, you should probably have the <title> tag in your <head> section match as closely as possible your H1.

How you style it is not an issue - provided you don't do dubious things like hiding the tag using CSS (display: none), or place other DOM nodes on top of it.

  • Just the opposite. The title should not match the H1. The title is the title of a book and the h1 would be the chapter heading. Or the title is the title of your outline and h1 is the introductory heading. – Rob May 24 '16 at 22:11
  • For the record, the title tag and h1 tag should never be identical. However, the semantic value of the h1 tag should match the title tag as well as add additional value. The h1 tag should expand on the limited title tag which is often tailored to fit within the SERPs. – closetnoc May 24 '16 at 22:48
  • I disagree. The title tag is hardly ever visible enough, it's meta data only displayed in browser tabs (which are usually really small). Google says you should focus on providing the best service to users, not to search engines, that's why H1 is far more important to me than the title. – Seb May 26 '16 at 11:22
  • Recent SEO testing indicates that Google doesn't care about what tags are used. It cares about what it looks like to the users. Styling text to be big and bold at the top of the page is equivalent to using an H1 there. Styling an H1 to have small text makes it less important for SEO. – Stephen Ostermiller Jun 10 '16 at 1:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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