Meta tags serve a number of purposes on a web page. While they are not displayed to the user, they can be useful in things like controlling whether search engines index your page or follows links as well as determining the kind of description that the search engines show for your site when it appears in a search, and so on. This article deals with how you can add meta tags to your website using the free What-You-See-Is-What-You-Get (WYSIWYG) web editors Nvu and KompoZer.
This article makes the assumption that you already know how to use either Nvu or KompoZer to create your website. If this is not true, please see one of the following tutorial series:
(There isn't much difference between Nvu and KompoZer. If you can't decide, just pick KompoZer, which is basically a later version of Nvu with a new name.)
In addition, the article also doesn't really delve into great detail the meaning and purpose of the different meta tags. If you don't already know what the meta tags are for, and how to use them, you can find a full description of the commonly-used tags in my article How to Use Meta Tags In Search Engine Promotion
Start up Nvu or KompoZer. The instructions for inserting Meta tags with either editor is identical.
There is no way to insert META tags into Nvu/KompoZer using the WYSIWYG interface or the GUI menus. You will, unfortunately, have to get your hands dirty by entering the source mode.
To enter the source mode, click the "View" menu and select the "HTML Source" item on the menu that appears.
When you enter the Source mode, you are actually seeing the underlying HTML code for your web page. On a blank new web page (one where you haven't entered any text yet), you should be able to see code similar to the following:
If your page is not a blank document, it will probably contain a lot more text than my above example. That is not a problem - you should still be able to follow the steps easily.
Look for the tag <head> near the top of the document. There should also be a matching </head> tag a few lines below. The <head> and </head> tags respectively mark the beginning and end of a section frequently referred to as the <head> section. The content in this section are not actually displayed in the main body of a web browser, but serve to provide more information to the web browsers and search engine robots that access the page.
All meta tags should be located within this section. In fact, if you have not modified this section before, you should be able to spot the default <meta> content tag that Nvu or KompoZer inserts for you.
To insert a meta tag into this section, place your cursor immediately before the </head> closing tag, on the same line as the tag, and hit the ENTER (or RETURN key on the Mac) to create a new blank line. You can then insert the appropriate meta tag in that blank line.
It doesn't really matter which meta tags come first or which last, nor does it really matter where in the <head> section you place those tags. However, be careful not to break up any existing tags in the head section when you insert a new line. (Which is why I suggested that you create a new line just before the close of the HEAD section, to be safe.)
To add the meta description tag, simply cut/copy and paste the following line into the head section.
After pasting my sample, replace the "put your page description here" with a brief description of your web page. A couple of sentences about what your page is about should be sufficient; if your description is too long, it will be truncated in the search engines results page.
Note the following:
Put your description in one long line. Do not hit the ENTER (or RETURN key on the Mac) in the middle of the description to make it appear prettier.
The meta description tag, as well as the other meta tags described in this article, will not be colour-coded the way the other tags on your page are. That is, it will just appear in a dull black, rather than in brown or blue like some of the other text on the page. This is just an Nvu/KompoZer deficiency.
If you are using Internet Explorer 6 to read this article, you may have trouble selecting and copying the code. If so, see the article Why Can't I Copy and Paste the Code Examples in thesitewizard.com? for the workaround.
The meta robots tag allows you to control whether the search engine should index your page, follow its links or archive its contents. It should be added the same way as the META Description tag. The tag looks like this:
Please read my Meta Tags article for more details on the various options that you can use to manage the search engine spiders that arrive on your site.
As mentioned in my article Why Don't You Use the Keywords Meta Tag on Your Website?, it's probably a waste of effort to add the keywords tag, since I doubt any search engine even looks at the tag any more. If you insist on adding it, however, put it into the HEAD section along with the other tags. I personally don't even bother to add this tag to my new pages.
Once you've finished adding your META tags, switch back to the usual visual editing mode by clicking the "View" menu and selecting the menu item "Normal Edit Mode". The Meta tag changes you made earlier will not be visible, nor are they intended to be. From the Normal mode, you can continue designing your web page in the usual way.
Copyright © 2008-2009 by Christopher Heng. All rights reserved.
Get more free tips and articles like this,
on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.
Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.
It will appear on your page as:
How to Add Meta Tags to Your Website Using Nvu or KompoZer
