Using Meta Tags in HTML [Quick Tutorial]

发布于 - 最后修改于

Meta tags give browsers and search engines important information about your webpage. They ensure your website is displayed properly, they can influence how your site is displayed in search results pages, and are generally considered good SEO practice. Meta tags are optional elements, and placed in the Head section of your page.

1. Title

This one isn't a metatag, but it is included here because many people mistakenly believe that it is, as it performs similar functions. A title tag needs to be opened and closed, and it doesn't use the meta element. Here is an example:

<title>Descriptive title of my web page</title>

Title tags are required, while meta tags are optional.

Google uses title tags when displaying search results:

Your browser also uses title tags:

2. Description Meta Tag

The meta description tag contains a sentence or two that describes your page. It looks like this:

<meta name="description" content="A description about your page goes here">

It is believed that Google uses description tags when it determines search engine rankings, but it is just one of many factors. They are also used in search results pages. i.e the two lines that Google includes in itssearch results are usually taken from the meta description. Let's look at an example:

This is how Google shows the Tate Modern art gallery in its search results. It gets this information from the meta description:

<meta name="description" content="Plan your visit to Tate Modern Southbank. London art gallery housing the UK’s collection of modern and contemporary art from 1900 to the present day. This museum is part of Tate, along with Tate Britain, London, Tate St Ives, Cornwall and Tate Liverpool" />

Here are a few points to remember about description tags:

·         They should be 25 to 150 characters long. If they are less than this, then Google will not use them. Anything past 150 characters will be cut off. In the Tate Modern example, the sentence "This museum is part of Tate, along with Tate Britain, London, Tate St Ives, Cornwall and Tate Liverpool" is cut.

·         You don't need a meta description. If you don't include one, though, Google will look at your page and will fill it for you. It is almost always better to write it yourself.

·         You should include your page keyword.

·         It should be well-written and persuasive. One of the main jobs of a meta description is to encourage people to click on your search result.

3. Keywords Meta Tag

The value of this meta tag is constantly debated, but it is still worth including. It is simply a list of main keywords (not too many). It looks like this:

<meta name="keywords" content="images, pictures, videos, national geographic, animals, world, travel, news, channel, magazine, subscriptions, shop">

This example is from National Geographic.

4. Meta Charset

The meta charset tag helps browsers display your website properly as it defines character encoding. It is particularly important for websites that use non-English characters. Here is National Geographic’s:                                    

<meta charset="utf-8" />

These are the main meta tags that you should include on all the pages of your website.

发布于 23 十二月, 2015

Happymarli

Proofreader, Editor, Writer and App Developer

Do you need a professional editor and writer to proofread your technical documents, thesis, novel, statement of purpose, personal statement, resume, cover letter, manuscript, essay, short story, textbook content, or articles? Do you want to make sure that your marketing material content is flawless and appealing to readers? I can do any of that! I am a professional editor (academic, copy, line/su...

下一篇文章

Basic File Uploads Using PHP [Quick Tutorial]