html, css, jQuery, PHP, mySQL

« | »

HTML From Scratch. 7:3 Meta tags

seo

Use "keywords" for Search Engine Optimisation

We already used a meta tag in the head of our html code:

<meta charset=”UTF-8″>

Meta tags add extra information in the head of the html, for use by the browser or by web crawlers. The attribute name can take any value, so the following are all valid:

<meta name=”author” content=”Fred Bloggs”>
<meta name=”favourites” content=”chocolate, purple, cats”>
<meta name=”keywords” content=”cats, animals, pets”>

The most commonly used value is keywords. This is used for Search Engine Optimisation (SEO), although many experts consider it outdated and recommend the use of semantic code and keywords in the text of your page instead. Web crawlers such as Googlebot can read the keywords and gain knowledge about the content of your website. Separate keywords (or phrases) with commas.

Another popular value is description, which will give the line of content displayed by Google on its search results page under the title of your page.

<meta name=”description” content=”My page about my pet cats.”>

gives:

My Cats Dot Com
My page about my pet cats.

Another interesting attribute which meta tags can take is http-equiv. This can take many values, but perhaps the most useful is refresh. The value of content will give the number of seconds before the page will automatically refresh, with the option of adding an url after a semi-colon in order to reload a different page.

<meta http-equiv=”refresh” content=”60″; url=”myNewPage.html”>

The attribute redirect can also be used with refresh in order to secretly redirect the page.

<meta http-equiv=”refresh” content=”60″; redirect=”secret.html”>

These can be combined together in creative ways, as long as logic is obeyed, in order to produce effects such as slideshows, automatic logouts, and to cue users to update their bookmarks when a site’s web address has changed.

Key point: use keywords and descriptions for SEO.

Tags: , , , , , , , , , , , , , , , ,

This entry was posted on Sunday, August 7th, 2011 at 10:18 am and is filed under Tutorials. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

Leave a Reply