1

For SEO reasons, I've understood that it is important that the pages top most h1 is descriptive of the page's actual content. If one also wishes to have the site title at the top most part of the page, what element would this be put in? For example, take a simple blog. If one wishes to have the blog post header to be the top most h1, but want to have the blog name visible at the top of each post, in what element would this best be put? My guess is that it could be put within a span or p, but this would make a span or p be placed above the first header of the page, which perhaps could be argued to be bad semantics.

Any ideas?

Improve this question
2
  • 2
    You may want to show a code example demonstrating your question as it is difficult to understand exactly what your problem is.
    – John Conde ♦
    Commented Jul 10, 2011 at 15:34
  • What are you using to create your blog? Are using WordPress, some type of CMS, or are you coding it yourself with HTML5/CSS?
    – Michael W Moriarty AScT
    Commented Jun 27, 2017 at 3:23

4 Answers 4

Reset to default
1

The title of the page is hopefully already in the <title> tag in your <head>. Therefore, no tag exists for the purpose of showing your page's title. Putting it in a <p> or <span> as you suggest yourself would be perfectly fine.

As an example, just look at this page's source:

<div id="hlogo">
    <a href="/">Pro Webmasters</a>
</div>

Additionally, there's no SEO rules or anything stating that no text can be before your first headers. As another example, menus, welcome-notes, etc. are often before the first article on a blog anyway.

Improve this answer
0

I'm not exactly sure what you mean by "what element would this be put in". <h1> tags are a block element. This mean they can only go in other block level elements. If you place it in an inline element then your HTML is invalid.

The <h1> tag can go anywhere in your HTML although it usually is close to the top since it acts like the page's visible title. But this isn't always the case due to design considerations (i.e. floating elements, login boxes, etc). If your <h1> tag falls far down into your page's HTML then you've probably made an error or your page can be coded in a better way.

Improve this answer
0

The solution to your semantics problem is to write the page in HTML5 which supports using multiple <h1> tags on a page. The page header is marked up inside tags and the main blog article is marked up in <article> tags. In this way the search engines can understand the true relationship of the h1 tag and the content of the site.

If you want to stick to HTML4 then you can only use the <h1> tag once in the page. So it would be best to use that tag only for the article's title rather than the site title. You should mark up the site title using a suitably lower order header tag ( <h2>, <h3>, etc.) or in a <p> tag. You should not use a <span> as that is an inline tag and you need a block level tag to surround it.

If you desperately don't want to have a <p> tag at the top of the html code there is something you can do. If you use css positioning, you can position the site title at the top of the page while locating the html further down the page. I used to do this for some of my sites where I wanted the article to be first in the html and the nav and headers at the bottom of the html. I could then use css positioning to put the nav on the left and the header at the top of the visible page.

Improve this answer
0

In addition to @Rincewind42's answer, you may also make use of the <hgroup>-element to group the website- and page-title.

You mustn't use two heading's, it is also possible to combine an <h1> and <p> or whatever within one <hgroup>:

<hgroup>
    <h1><a href="/">overall website title</a></h1>
    <h2 id="slogan">Subtitle, or maybe pagetitle</h2>
</hgroup>

See: http://html5doctor.com/the-hgroup-element/

Improve this answer

Your Answer

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

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