Rabu, 11 April 2012

Adding meta-tags to your blog or to a blog-post

This article describes meta-tags: why and how to add them to your blog.  


It applies to any type of meta-tag except the description-tag:  Blogger introduced special editing tools for them in late March 2012, so they are covered separately.


What is a meta-tag, and why would you use one

A meta-tag is a piece of HTML code that is found inside a webpage, and contains information about the page.

When HTML was invented, meta-tags were used for data about who made each page, what it's about, and what keywords apply to it. Originally search-engines used these tags to build indexes (ie databases) about where to find things.  However this doesn't often happen now: spammers used meta-tags to lie to the search-engines, so the search-engines got smarter and ignored meta-tags.

Today, however, meta-tags are still used to give "information" about websites to electronic visitors, for  many purposes.

For example, a search-engine or directory may ask you to prove that you do own a website which you claim to own, by adding a meta-tags of their choice to it. PInterest lets website-owners opt out of having their sites shared / pinned by adding a specific meta-tag that effectively says "Nope, you're not allowed to pin this one". And Facebook uses (still? maybe it's used now) open-graph meta tags to let us set the picture and text that are shown when a page is shared.

There are a wide variety of meta-tags still in use on the web today.  And they are a clever idea: no one needs to set the "rules" about what meta-tags are allowed - they just need to be available to whatever electronic-visitors see them on a website.


What does a meta-tag look like:

These are some example meta-tags:
<meta name="description" content="Adding pictures to your blog without using gadgets" />
<meta name="keywords" content="HTML,images, filestore, picture" /> 
<meta name="author" content="Mary Smith" />

Each one has two parts (in technical terms, this arrangement is called a "name/value pair"):
  1. some text that says what the meta-tag is about  (eg description, author)
  2. some text that contains the value for this case (eg  "Mary Smith")

This idea has been used in other ways too - instead of "name" some meta-tags use other values, like
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />  

If you look at your blog's template, you may find that there are already meta-tags there, which Blogger added to every post and page.   For example in Blogger-HAT's template I can see:
<meta content='some-verification-codes-from-Google' name='google-site-verification'/>
<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>
<b:if cond='data:blog.isMobile'>
      <meta content='width=device-width, initial-scale=1.0, user-scalable=0' name='viewport'/>
<b:else/>
The first is a verification tag from webmaster central that I added a long time ago, while the others are meta-tags that Blogger developers decided would be good to have.


What does each meta-tag apply to


Spot the odd one out, North Bishopden Wood - geograph.org.uk - 1209764
Odd One Out
Nigel Chadwick [CC-BY-SA-2.0],
via Wikimedia Commons
Before adding a meta-tag you need to decide whether it applies to every screen (ref:  Blogger, blogs and bloggers, Posts, Pages and screens) that your blog shows, or whether it only applies to an individual post.

As a general rule, think about what the content of the meta-tag means:  unless you can see how it specifically relates to material in a post, then you are probably best adding it to your whole blog.


How to add a meta-tag to a blog-post

Description meta-tags are a special case, and I'll be publishing a separate article about them another day.

But for all other types of meta-tag, Blogger's Post-editor doesn't allow any other sort of meta-tags: even if you go into HTML mode and type them in, they will be automatically removed when you publish the post or look at in again in Compose mode.

So to add other tags to specific posts, you need to


1)   Edit your template - don't expand the widgets.


2)   Find this text:
<head> 
You may need to look for <head SOME-OTHER-STUFF>, depending on what template you are using. Usually I  search for "<head", ie without the closing bracket, and make sure that I do what is needed after the closing bracket >.


3)   Add this line of code after the <head> tag:
<b:if cond='data:blog.url == "PUT-THE-POST-URL-HERE"'>
< THE META-TAG YOU WANT TO ADD>
</b:if>
replacing:
  • <THE META-TAG YOU WANT TO ADD> - with the actual meta-tag details, and
  • PUT-THE-POST-URL-HERE with the full address of the post. 

This means you cannot add the meta-tags until you know the post's URL, ie after the post has been published for the first time. This is a little tedious, but not impossible. You just need to publish the post, get the URL, and then edit your template and add the meta-tag info for the post

Alternatively, you could just apply the tag to your so-called home page by adding the tag with a "home page only" conditional, eg
<b:if cond='data:blog.url == data:blog.homepageUrl'>
THE CODE FOR YOUR META-TAG(s) GOES IN HERE
</b:if>


Adding meta-tags to your whole blog

This is most appropriate for tags that genuinely should apply to every single page on your blog:   what these are depends on how your blog is organised, and what you expect the meta-tags to be used for.

Again, description meta-tags are a special case, and will be covered separately.

You can add non-description meta-tags by editing your template and putting the meta-tag statement somewhere in the header, ie
after  <head  SOME-OTHER STUFF>
before  </head>

Make sure that you put the meta-tag statement in-between the other HTML statements in the header, ie after a closing > and before an opening one>


What your readers see

People who visit your blog won't see anything different provided you've installed the meta-tags properly.

But search-engine-spiders and other computer-based visitors will read the contents of the meta-tags. This may cause them to display things about your blog differently at their end (eg a description within Facebook), but won't make any difference when a human visitor is looking at your blog.


Is it worth it?

Only you can decide if it's worth the trouble of adding meta-tags to your blog.

If you're doing it so your site ownership can be verified, then it's almost certainly worthwhile.

And obviously Blogger thinks that description tags are worthwile - because they've given us a way to edit them inside the post-editor.

But if you're doing it for SEO, so that your blog ranks higher in search results, or looks more attractive / clickable on the result-pages, then the only answer is "it depends". There area a lot of unknowns about SEO: there are experts who are adamanent that certain meta-tags are essential for your blog to do well in search. They may be right.  They may have been correct - for a few weeks or even months or years, but some people believe they are not correct now.   Others say that meta-tags still matter, because tags, especially description tags, influence what body-text is shown in seach-engine-result-pages (SERPS).   But really, only the search-engine makes know the real answer.   And even then, their answer may change tomorrow if a new search-algorithm change is applied.

What do you think?

Do you have specific examples where adding a meta-tag has made your blog better in some way?




Related Articles

Post snippet and post-thumbnail:  summaries of your blog post

Blogger, blogs and bloggers, Posts, Pages and screens

Giving your blog a home page

How to edit Blogger posts that have already been published



Adding meta-tags to your blog or to a blog-post
4/ 5
Oleh

Berlangganan via email

Suka dengan postingan di atas? Silakan berlangganan postingan terbaru langsung via email.