Some time ago I reviewed tools that help understand the page HTML semantic structure based on H1-H6 headings. While some webmasters question the overall necessity of headings, I insist that they should be used to structure the page content for:
- SEO benefit: H-heading is one of the best ways to give your keywords prominence;
- Accessibility and usability: headings enable screen reader and some browser (e.g. Opera) users to use voice and keyboard commands to navigate throughout the page (see this video explaining the importance of headings for accessibility);
- Web etiquette: like clean (preferably validated) code, good page structure is the sign of proper behavior and trusted brand.
Here is the checklist of proper heading usage (please add your points or argue mine):
Each of my pages have at least one heading;
I have only one H1 heading per page;
H1 heading is the first heading on the page;
I use the page main keyword in H1 heading of the page;
I use headings to structure content and CSS for visual effects;
I don’t skip heading levels (e.g. H1 to H3);
All other headings (except H1) are subheadings; they are (ideally) thematically connected with the previous-level heading;
I use headings consistently throughout the site;
Headings are short and concise (and thus easily scanned);
Headings extracted from the page represent the summary of the text (i.e. I can guess what the page is about without reading its full content);
I use SEO or web accessibility tools to evaluate the structure of my pages.
Comments
14 responses so far ↓
Mitch on Sep 23, 2008 at 1:30 pm
One H1 per page is clear.
But do you believe that there should also be only one H2, only one H3 and so on?
I’ve heard others recommend this tree: one H1, two H2s, three H3s, etc … per page.
Ann Smarty on Sep 23, 2008 at 1:44 pm
@Mitch, I am pretty sure you can have H2 and H3 tags as many as you like…
Kristine on Sep 23, 2008 at 6:02 pm
@Mitch I think it’s ok to have more than one lower level H2-H3 tags. In fact, I think the content should determine how many subheadlines you have on a page.
Back in grade school when you learned how to write papers, you usually started with an outline. You had your main idea (H1) and then supporting facts (H2) and sometimes those supporting facts have their own supporting facts (H3). Oftentimes you would have more than one of each, but you always had one main idea (H1).
elad on Sep 24, 2008 at 5:22 am
My website has no headline at the moment. all needed headlines were put as an image.
Is there any way to have the headlines without being actually presented?
It’s a semantic search engine, and I actually like my images as headlines..
Ann Smarty on Sep 24, 2008 at 5:47 am
Elad, including a heading is not a must but highly recommended. So if I were I would still include a text version of each page heading…
paisley on Sep 24, 2008 at 8:52 am
good article as usual, thanks ann
Tanner (does Utah marketing) on Sep 24, 2008 at 3:46 pm
I think Kristine made the perfect point, compare your website to a grade school paper. You have a main topic (your H1), sub-points (H2 titles), and some of those sub-points have their own sub points (H3 titles). Brilliant.
Elad: There really is no reason to use images as headlines. You can use flash and javascript to use fancy fonts, or some clean XHTML and CSS markup would allow you to place text over background images. Headlines can really help your rankings in search engines, and there’s no reason not to have them. :)
Michael on Sep 25, 2008 at 1:11 pm
I always use a H1 or H2 header for the title of every web page I build.
Then I use H3, H4, H5, H6 further down the page.
It keeps the spiders happy and catches the human eye, as long as you do not go overboard. :)
kavya on Sep 30, 2008 at 9:05 am
Thanks Ann! Good information.
Pasadena Homes on Oct 1, 2008 at 7:08 pm
After reading your post I went back and looked at the code in all of my pages. Some of the headings were incorrectly set up by my designer. I am going to go back and make the suggested changes. Thank you for the great advice.
Web design Murfreesboro TN on Nov 12, 2008 at 5:05 pm
I agree with Michael, using heading tags in the right order or optimizing them correctly is key.
Gabriel Janko on Nov 13, 2008 at 5:02 am
I agree with all the points you mentioned; the only mistake I use do is skipping some levels… Anyway, 1 H1 - agree, 1 or more H2-H6 - totally agree.
Software Testing Training on Dec 16, 2008 at 11:43 pm
Thanks for Article……
Good Article Writing
Software Testing Training
http://www.qacampus.com
Our Software Testing Partner
http://www.cresech.in
prafuldass on Jun 27, 2009 at 12:31 pm
very Interesting post
Leave a Comment