I had an interesting argument earlier today. One of our websites is being redesigned at the moment, and the page layout has the logo and company name at the top, and below the menu is a subtitle. I noticed that two things which should be the same weren’t, and in doing so noticed that the company name was not in an <h1> tag, but just an <a href=”..”>…
Normally I would do something like this:
<img src="logo.gif" alt="Company Logo" /> <h1><a href="/home">Company Name</a></h1> <ul> <li>About This</li> <li>Portfolio</li> <li>Get In Touch</li> </ul> <h2>We are an awesome company!</h2> <h3>About This Company</h3> <p>Content...</p>
Showing here that “Company Name” is the overall most important thing on the page. However, one of the developers here has structured it slightly differently:
<img src="logo.gif" alt="Company Logo" /> <a href="/home">Company Name</a> <ul> <li>About This</li> <li>Portfolio</li> <li>Get In Touch</li> </ul> <h1>We are an awesome company!</h1> <h2>About This Company</h2> <p>Content...</p>
If I view the page without CSS, the company logo becomes unimportant and lost, but the “We are an awesome company!” tag line becomes the most important thing on the page. I’ve not come across this different way of thinking before, and I’m just wondering what other people think – what should the <h1> be?
It could just boil down to choice – whether you see the overall site name (e.g. “Company Name”) as the most important thing or something else… Maybe you design your pages in completely different way?
December 11th, 2009 at 10:02 pm
Hmm, I’m not sure that I’d put the company logo in an h1, to be honest. To me, an h1 is more page-specific than site-specific. For me, the site’s logo or name (usually an image anyway) goes in p a img, and whatever something like “Home” or “Contact Us” would go in an h1, given that they’re they main indicators to the content of the page.
That sort of thing’s quite open to stylistic interpretation, though, in my opinion.
December 17th, 2009 at 4:40 pm
My rule: The most important item that’s unique to that page should be the H1.
If GoogleBot comes along and looks at your site, it will see a collection of pages all titled “My Company Name”. If your page is a blog post, what’s more important? The name of the site/tagline (repeated on every page), or the title of the blog post (unique to that page)?
Personally, I recommend marking-up with CSS turned off initially and just using the default styles the browser puts on all the elements. Then you get a good idea of what’s actually on the page and what a bot would see.
While marking up, my advice is to try to think on an individual document/page level rather than the site as a whole.
That’s my 2p.
December 17th, 2009 at 6:29 pm
Thanks for your comments guys – I’ve changed my ways now, I’ve learnt something new now which is great
Who said blogging wasn’t rewarding…