Adding header tags to an iWeb site has never been easier. Follow the instructions carefully in this video tutorial to learn how you can properly add header tags to your iWeb website.

Video Transcript:

Being introduced for the first time ever, iWeb users will now be able to add header tags to their websites, without having to hand code it in the HTML. Header tags are another way for you to demonstrate to search engines which keywords are important on your page.

So what is a header tag, and how do we make one?

Basically, a header tag is a block of text that can be compared to a title, or a headline for a larger body of text. Think of a newspaper article. There is a headline which indicates what the entire article is about. Then there is a subheading which gives a bit more insight into the article.

Our websites are similar to the structure of a newspaper article. A headline can contain our primary key term for each page, and an optional subheading can contain our secondary key term for each page.

In HTML, there are six headers that you can use. Those headers are h1 through h6. I am only going to demonstrate adding an h1 header since that is what most of you will be doing. If you want to add an h2 as well, then feel free to do so. h1 and h2 are the most popular headers, so use those if you have room on your site. Trying to add all headers to your site is not generally a good idea, unless your site is structured in a way that makes sense to do so. Also, the rule of thumb is to only have one h1 per page.

So to do this in iWeb, simply click on the Text Box button, and type in this code you see here.

The area where I wrote ‘This is my header tag’ is where you should type in your header tag. The HTML here should look identical to mine. But the text part should contain your header tag which could be anything you want it to be. I recommend putting the main key-term you are targeting for this specific page.

Before we move on to the next step, I want to point out that you can also change the font of this text like you normally would with any text, by highlighting the text and clicking on the Fonts button.

Now when you publish your site to a local folder, and load the site in iWeb SEO Tool, you must check the box to Convert header tags in text boxes to HTML code, and then press the Apply To Entire Site button. What this will do is strip the HTML code from the site, so that only the actual text is being shown. Remember, your header tag should be visible on your site. If you can’t see it, or if you still see the HTML code, it means you did not do this process correctly, and you will need to try again.

Some of you can expect to run into some issues when adding header tags. For example, you will notice that the header tag does not always end up in the same place online as it did in iWeb. This is normal. You may need to play around with it a bit until you find the right spot. To make things easier on yourself, try not to place the header too close other items on your page. This will leave you with a bit of a buffer for when the header ends up in a slightly different location.

Also, if your site has a black background, you most likely won’t be able to see your header. If that is the case, just send us an e-mail read this knowledgebase article on how to alter the font color.