We have created a WordPress theme that we will distribute free to all provided that you leave at least one linke to “MetaTagGenerator.org” somewhere on the site, preferably in the footer.

We will be posting more similarly styled themes here in the future, all will be free to use for commercial and non-commercial use provided that you provide a simple backlink to this site.

You may preview this theme here: Blackout – Free WordPress Theme.

You may download the theme here: Download “Blackout”. – a free WordPress Theme.

Screenshot:

Find out more about meta tags in this short tutorial video. All you need to know.

Once you are familiar with meta tags, you can follow the instructions in this tutorial to learn how to use this site to create your own meta tags and put them in the proper place on your site.

Facebook has created a meta tag protocol to be used when people “like” a particular page. This is called the “Open Graph Protocol”.

The Open Graph Protocol lets you integrate your Web pages into the Facebook social graph. It is designed for Web pages that represent real-world things — for example, movies, sports teams, celebrities, and restaurants.

By placing Open Graph tags on your Web page, you can make your page equivalent to a Facebook Page. This means that when a user clicks a Like button on your page, a connection is made between your page and the user. Your page will appear in the “Likes and Interests” section of the user’s profile, and you have the ability to publish updates to the user. Your page will show up in the same places that Facebook pages show up around the site (e.g. search), and you can target ads to people who like your content.

The Open Graph Protocol lets you define how your page will be represented on Facebook.

See the Facebook page on their Open Graph Protocol.

We have also built a generator that lets you generate facebook open graph meta tags.

There are four essential meta tags that every site should have and must be generated by each of the three major search engines and Alexa. These four tags are created individually for each of your sites and will help with your SEO (Search Engine Optimization) efforts. The four tags are:

• The Google Webmaster Site Verification Metatag
• The Bing Site Verification Metatag
• The Yahoo Site Explorer Metatag
• Alexa site claim

Click on any of the above links to visit the site (links open in new tab/windows).

A knowledgeable webmaster will have these tags placed in the head of his page – this is one way to tell if a person knows their SEO! They will look like this:

<meta name="msvalidate.01" content="449BF0F4AF4B61D07E4D742F3F71A689" /> <meta name="google-site-verification" content="o67Y-Xl-F7DmXl_AkbFyyLJS5tcLYHycba5860nxl0o" /> <meta name="y_key" content="f130ba5d71266f65" /> <meta name="alexaVerifyID" content="AO_vru9l7OOCYYyyqy1oFvcIDSI" />

Make sure that you use each of these services for sites that you would like to promote. Click on any of the links above to visit each of the sites where you must register to actually generate your own dedicated meta tags for your sites. You may submit sites without registration or verification, but this is not the best method – actually signing up, generating dedicated meta tags and inserting those metatags into your page is the recommended method.

It is well worth going through the trouble of submitting your sites to these search engines manually. Sites submitted in such a way are usually regarded as higher quality. Spammy sites and sites which use automated methods to spam blogs and otherwise attempt link spamming and broadcasting do not often take the time to do this step which guarantees the corresponding search engines that a human actually was involved in the process.

View the source code of this site to see these metatags in use.

We have had a few comments on our Meta Tag Generator… namely, that some of you want to generate the entire document head, and that includes <TITLE> tags, stylesheet links, DOCTYPE declarations and all the rest.

We didn’t exactly know what to call it, so we settled on something easy: HeadGenerator.com – after a quick search, we discovered that in fact, the dot-com name was available so we bought it and decided to use the same clean, simple interface we used for the meta tag generator – but with a few more improvements.

This new generator will generate your entire head – it will be in W3C VALID XHTML or HTML – this will be automatically chosen depending upon the doctype you select. No more choosing by clicking different buttons.

Also, we have improved the interface and widened the copy & paste script area to be the full width of the page. Go and check it out. We hope you find it useful!

Head Generator

HTTP-EQUIV
<meta http-equiv="value" content="foo" />
META HTTP-EQUIV tags are the equivalent of HTTP headers.

When you open a new web page, a web server receives your browser’s request via HTTP (Hyper Text Transfer Protocol). The web server finds your page (or not) and then generates an HTTP response. The initial data in that response is called the “HTTP header block.” The header sends the browser information regarding the formatting and display of the page requested. There are other tags with meta information that are not technically meta tags, such as Title Tags and DTD (Document Type Declaration).

Just like normal headers, META HTTP-EQUIV tags usually guide the response of web browsers, and are used to further refine the information which is provided by the actual headers. In some browsers, even though the DTD declaration declares the character set, the page may not display properly if the meta-tag for character set also does not appear! HTTP-EQUIV tags affect the browser in exactly like normal headers. Certain servers may translate META HTTP-EQUIV tags into actual HTTP headers automatically so that the user’s Web browser would simply see them as normal headers. The Apache and CERN httpd servers, use a separate text file which contains meta-data. A few Web server-generated headers, such as “Date,” may not be overwritten by META tags.

NAME
<meta name="value" content="foo" />
META tags with a NAME attribute are used for META types which do not correspond to normal HTTP headers. There is still a lot of disagreement among developers, experts and just about everyone regarding how the various bots interpret tags which contain various attributes (especially keywords); whether they are declared as “name” or “http-equiv,”.

Are Meta Tags Obsolete?
Meta tags were designed for a simpler time and therefore many of the attributes and reasons thought up by the people who run the W3C turned out to be obsolete thanks to the later actions of search engine.

Some argue that meta keyword tags and even meta description tags are useless as the main innovation of Google was that it basically ignored meta tags, which were being extensively abused – and instead actually parsed the page to determine on-page content relevance, content and even keywords.

Which should we use, HTML or XHTML, and why?

Background

HTML
HTML began with HTML 3.2, code named Wilbur, which was followed a few years later by HTML 4.0, then HTML 4.01. HTML 4.01 is the last version of HTML, and is also the final W3C specification. Over the years, some of the upgrades have included:

• Separation of presentation from structure
• Improved document rendering
• Improved accessibility
• Better internationalization

XHTML
XHTML 1.0 was created shortly after HTML 4.01 to help the transition of hypertext to a new generation of mark-up languages. XHTML 1.1 is a more flexible version of hypertext with the benefits of XML architecture. XHTML 1.1 has improved the semantics of HTML 4.01 by including the Ruby module, used in multibyte languages such as Japanese scripts (Reference:Ruby Specification).

---

For our purposes, we will look only at meta-tags.
HTML

<META NAME="description" CONTENT="This is a sample page">

XHTML

<meta name="description" content="This is a sample page" />

The syntax in these examples are still very similar with just a few differences between them.
For meta tags, the main difference you will observe is that XHTML tags must always be closed, so you will see a slash at the end of each tag />. Also, all attributes must be lower case – in HTML, they may or may not be.

Both languages have three types:

1. Strict (recommended)
2. Frameset
3. Transitional

The “strict” version is strongly recommended by the W3C for regular documents. Using strict versions removes problematic elements and forces a significant separation between the structure of your document and its presentation. Transitional versions allow deprecated elements to assist those implementers to upgrade smoothly their software or their content – you might want to consider this if you are a sloppy coder.

Does HTML 4.01 have any advantages over XHTML 1.0?
There is no simple answer and the benefits you will gain are tied to how you’re using the language in a given situation.

Switching from HTML 4.01 to XHTML 1.0 has no benefits for your site visitors.
Web authors change for some of these reasons:

XHTML is easier to maintain

XHTML syntax rules are far more rigorous than HTML. XHTML requires the following:

• all elements and attribute names must appear in lower case
• all attribute values must be quoted
• non-empty elements require a closing tag
• empty elements are terminated using a space and a trailing slash (<hr />, <br />)
• no attribute minimization is allowed
• in strict XHTML, all inline elements must be contained in a block element

On the other hand in HTML:

• case, quotes, termination of many elements and uncontained elements are allowed and commonplace
• The margin of error in HTML is much looser than in XHTML, where the rules are very clear.

XHTML is XSL ready

XHTML 1.0 is the reformulation of HTML 4.01 in XML. So it follows that XHTML documents are hypertext documents AND XML documents.

XHTML is easier to teach and to learn

The syntax rules defined by XML are far more consistent than those found in HTML and therefore easier to explain than the SGML rules on which HTML is based. Most web generation software applications use XHTML as default – applications such as Adobe (Macromedia) Dreamweaver now close all tags by default and generate XHTML compliant code.

For more information on XHTML see the W3C website: Using XSLT and XHTML.

Suppose your page changes or your URI changes and you need to redirect users to a new page…

Meta Redirect is the WRONG way to do it! Yes it works, but it is not recommended by W3C.

According to W3C

“Some user agents support the use of META to refresh the current page after a specified number of seconds, with the option of replacing it by a different URI. Authors should not use this technique to forward users to different pages, as this makes the page inaccessible to some users. Instead, automatic page forwarding should be done using server-side redirects”

You can read more on this here: http://www.w3.org/TR/html4/struct/global.html#adef-http-equiv.

There are far better and more search engine friendly ways of redirecting old URLs to new sites – Meta redirects are not one of them!