The Meta Description Tag

What Is the Meta Description Tag?



The Meta description tag is a snippet of HTML code that belongs inside the section of a Web page. It usually is placed after the Title tag and before the Meta keywords tag, although the order is not important.



The proper syntax for this HTML tag is:


--------------------------------------------
Stop Worrying About Meta Tags
And Learn What REALLY Matters!

In this economic climate, can you afford to put your

SEO on the back burner?



areas that might be costing you targeted website visitors.

--------------------------------------------

I used to believe that the purpose of the Meta description tag was twofold: to help the page rank highly for the words that were contained within it, as well as to provide a nice description in the search engine results pages (SERPs). However, today it appears that, similar to the Meta keywords tag, the information you place in this tag is *not* given any weight in the ranking algorithms of Google, and only a tiny amount of weight in Yahoo's.


In other words, whether you use your important keyword phrases in your Meta description tag or not, it won't affect the position of your page in the SERPs for the words that are important to you. In fact, you could easily leave it out altogether.

But should you?

Well, if you're already happy with the "snippets" of text that the search engines post from your page in any given search query, then there's no reason to have a Meta description tag on your pages. However, it's important to note that the snippet the engines use will vary, depending on what the searcher typed into the engine.


Let's take a step back and look at what the search engines show in the SERPs. It can get a little bit confusing, but if you try out your own searches in the various engines, you'll have a better idea of what I'm talking about. The search engines are constantly changing this sort of thing, plus they all behave in slightly different ways, as you'll see in my examples.


At Google, if you search for a site by URL like this: www.highrankings.com, the snippet you see is the first instance of text on the page. Interestingly enough, on my home page, an image alt attribute tag is the first instance of words "on the page," and that's what shows up as part of my "snippet" for this particular search. (The image is a clickable image, so this jibes with my other theory of Google indexing the words in the alt attributes of clickable images. See this forum thread from Dec. 2003.)


For this type of search, Yahoo displays the Meta description info. It's important to note that generally the only people searching using URLs are site owners trying to see if their pages are indexed. Therefore, you shouldn't worry too much about what you see under those circumstances.

So let's try something that a real person might search for when looking for what I have to offer -- how about "SEO copy"?

In Google, my Nitty-gritty handbook page shows up second in the results with the following snippet:

"... techniques: Search engine optimization (SEO) consultants who need to edit the existing copy of their clients' sites as a matter of course. ..."

Not the best of snippets, to say the least.

In this case, I don't have the phrase "SEO copy" in my Meta description tag, nor is it anywhere on the page as a complete phrase. Because of this, Google has simply found instances where the word SEO and the word copy were near each other, and used the surrounding text as the snippet.

Now, if I felt that "SEO copy" was a viable keyword phrase that people might be searching on, I may want to adjust my page accordingly so that the phrase appeared in my Meta description tag as well as somewhere in the body text. Again, this is not because it would help it to rank highly, but because I would receive a more suitable description that was more in tune with what the searcher was looking for. One can surmise that they might be more inclined to click on my listing in that case.

Let's look at Yahoo for the same phrase. They've ranked the page at #3, and used the following snippet:

"Learn SEO copywriting with Jill Whalen's special report -- The Nitty-gritty of Writing for the Search Engines."

Now that's a good snippet! Well, guess what? That's my Meta description tag for that page. Even though the exact phrase wasn't in the tag, and neither was the word "copy," Yahoo still chose to display it for this search query. I'm guessing this is because that phrase is actually nowhere on the page, other than in the Title tag. So with Yahoo, having a decent Meta description tag was very worthwhile in this instance.

More Tests

I also recently discovered that when I tested a nonsense word in the Meta description tag of a page (with the word not appearing elsewhere on the page), Google did not find it. But when I added the word to the visible text copy on the page, Google would bring up the test page when the nonsense word was searched for. Not only that, but it displayed that part of the Meta description tag where the nonsense word appeared.

In Yahoo, my nonsense-word test page was found, even if the word appeared only in the Meta description tag and nowhere else on the page. Interestingly enough, however, Yahoo didn't display the part of the tag where the word was placed. They displayed only the beginning of the description, and cut it off after about 45 words. I purposely placed my nonsense word deep into my description tag to see if it would get picked up. In this case, the word appeared as the last of 138 words in the tag. I'll probably add even more words at some point to see if there's any cutoff point where Yahoo will stop indexing.

Other Engines

I also tested a few searches at Teoma and MSN. Each engine is slightly different in how they display the Meta description tag. Teoma seems to find the words in the tag, but doesn't necessarily display them. When I searched for a unique sampling of text from one of my tags, Teoma found the page, but chose to display the first sentence on the page instead. Not surprisingly, the current MSN search worked the same as Yahoo. However, MSN's search technology preview (which is the new engine they're working on) behaved similarly to Google on all tests regarding Meta descriptions.



My new recommendation for this tag is not to worry too much about it. If you have some great call-to-action statements utilizing your keyword phrases on your Web pages, they will probably show up in your snippets at the engines. But since it's easy enough to create a compelling sentence or 2 that incorporates your main keyword phrases, you might as well do this for your Meta descriptions.



Certainly, the more control you have over your listing in the SERPs, the more clickthroughs you should see. If your Meta description tags can help with that, then it's certainly worth the time to create compelling, keyword-rich ones.

Where Design Really Fits

As a designer, do you know where your work really fits in the process of design?

We all love Web design. Looking at a blank white box on a computer screen and using only your mind's eye, a mouse, and a keyboard to transform it into a living, breathing Website is no minor feat, and there is undoubtedly a creative rush when it comes to doing something like this. Web design can be a strong artistic outlet and it inevitably brings with it the joy that comes with looking at your finished work and presenting it to others.

Yes, in a word, Web design is fun. But let's face it: if you plan to make money off of Web design, then it also becomes a business.

If Web design is your business, then you must make certain you are in the right mindset and you use the right process when it comes to your work. You don't want your designs to fail, but, unfortunately, there is a strong chance that they will do exactly that. Lets take a step back for a minute and define what a failing design is, and why it fails.

Failing Design

Failing design is not necessarily poor design. This means that a "failing design" is not necessarily an ugly Website. Rather, a failing design is one that fails to function properly for the site where it's used. A design can be very beautiful, but be terrible for its purpose.

If your (or your client's) goal with a Website is to sell something or generate excitement over a specific idea or campaign, you'll want to design accordingly. For a site like this, you don't want to use a calm ocean picture as your header with deep ocean blues and blacks in your design. Sure, you may be able to make a very pretty design this way, but it's a failing design because it doesn't supplement the site's goal or message.

The above example is a gross exaggeration, but it serves to show why so many designs fail. The problem lies in the misunderstanding of the process of design.

The Process of Web Design

So many designers, especially newer, freelance workers, jumble up the process of design. What's worse is that this is a direct path to failure and they don't even know it. We'll be focusing on each of the aspects of the process of design in just a bit, but first, let's look at an overview. This, at its most basic, is the process of design:

• Planning
  Before you even get a single idea in your head about what your latest Web design is going to look like, you need to do all the appropriate planning. Mostly, this includes knowing the answers to important questions.
• Content Building
  You need to build all of the content of your site after you have a clear plan. This doesn't necessarily mean getting every detail down, but you need to know what your content will be and where it will go.
• Designing
  Now you'll design the Web site. This is a crucial step, of course, but if you've done the planning and content building first, this part will be the most fun, and most likely the most profitable! But keep in mind that there are several key considerations you'll be taking into account, so you won't be getting wild with your digital paintbrushes here.
• Development
  Once you've finalized your design, you'll turn it into XHTML/CSS/PHP/MySQL and whatever else your site needs. Development typically refers to the technical side of Web design: the coding and backend stuff.

As you can see (pay attention to this part, it's important!), designing the site comes late in the game. Many designers make the mistake of wanting to jump right into the design step, because that's where a designer's talents shine. But if you avoid or simplify the planning and content building steps, you will end up with a design that probably fits the site pretty well, but will ultimately fail in helping the site achieve its goals.

Therefore, it's important that you know and follow this process in your professional work. Let's take a look at the process in greater detail.

Step 1: Planning

There's a lot of work ahead of you before you actually get to start drawing, coloring, laying out, and generally designing your Website. First, you need the answers to these questions. You will know these answers if you are designing a site for yourself, or your client will know them.

You need to know the answers to these:

• What is your goal with this site?
  Are you trying to sell something? Deliver a message? Share information? Keep in touch? Etc.
• Who are your site's visitors?
  In other words, who is your target audience? This can sometimes be as vague as, "students" or as specific as "restaurant review publication advertisers."
• What do you want your visitors to do?
  Usually, if you're getting visitors to your site, you want them to actually do something. Some answers to this question could be, "buy a product," "sign up for a newsletter," or "learn how to build better Websites." This is an important question; make sure you have a good, clear answer for it.
• Why should they do it?
  Look at this site from the viewer's perspective. Why should they be interested in your site? What's in it for them?

If you or your client don't have clear answers for the above questions, it's time to do some research. Find some of your customers and get these answers or make some calls. Visit other sites that are similar to yours in idea and find out what kind of crowd they're drawing. If this is the type of crowd you'll be working with, then you'll have some answers.

Once you have good, clear answers to all of these questions, you can start building content for your site and start making some actual design decisions. With just these answers, you can determine the basics, like:

• Color
• Layout
• Font family
• Font size

Colors? Layouts? Fonts? Ah, here we go; this is starting to sound more like Web design! If you know, for example, that your goal is to provide wildlife safety tips to new campers, you will want a layout that allows you to provide clear, readable text. Because your tips will come mostly in the form of text and illustrations, you'll want plenty of body space and a font that looks good on screen and spaced well with CSS (Arial is a good default for something like this). Since you're dealing with wildlife-related material, your colors might mimic those of the woods, with deep greens, sandy and earthen tones, and dark wood colors.

But don't jump the gun and open Photoshop just yet! You're still not quite ready to start drawing and coloring. Next, you want to build the content of your site.

Step 2: Content Building

There's a phrase that's often thrown around in the Web development world: "content is king." This is true for most Websites out there. Most Websites want to be found and one key way sites are discovered is through search queries. Search engines frequently "spider" their database of Websites for new, clear, up-to-date, and original content, and Websites that have good content are rewarded with higher ranking and thus they are found more often.

It's no wonder, then, that content building is such an important step in Web design. With the answers you got from Step 1: Planning, you should know what kind of content you will want to start building. If your goal is to sell music and electronics, and your target audience is college students looking to buy things like iPods and digital cameras, then you'll want to write some content that's light-hearted, down-to-earth, and to the point while still building on the popular "lifestyle" trend that sells gadgets like these so well.

Or, as another example, if your target audience is a group of professionals in the medical research field and your goal is to pose challenging new ideas for collaboration or discussion, you'll want to write content that comes off as something of a technical blog.

Ultimately, though, the most important thing you want to do in this step is get all your ideas for content down on paper or in a text file. You don't need to write the ads for your music and electronics right now, for example, and of course you wouldn't want to spend the time in this step to write a long medical journal entry. For now, it's enough just to get all of your content down in shorthand. Just be sure you get it all.

Once you have all your content in a place where you can look at it, you'll want to build your sitemap. This is the final step before you actually start designing the site. You can use a computer program to draw your sitemap like I did below, but most of the time a pencil and paper works best for this part.

Let's take a look at a small sample sitemap for the music and electronics store we talked about earlier.

Here we can see that our homepage links to four other pages: Store Locations, Music, Electronics, and Contact Us. The Music and Electronics pages each link to different subsections. The Music page lets you choose a genre of music to buy, and the Electronics page lets you browse through different gadgets.

When designing your sitemap, it's important to remember the 3-click rule. Simply, the 3-click rule states that a visitor should never have to click more than three times on your site to do anything. In our sample sitemap, we can see that if a visitor wanted to get our other store locations, they would just need 1 click on the homepage. Or, if they wanted to browse through rock music to buy, they would just need to click Music on the homepage, then Rock on the Music page. Just 2 clicks.

While building your sitemap, you should make sure that every box (or page) on the sitemap will hold some of the content you outlined earlier. All of your content should have a place on your site, and you need to be able to visually see on what pages you'll put each bit of your content.

And now that we have our planning and content building done, let's get designing!

Step 3: Design

Many designers make the mistake of skipping steps 1 and 2, jumping instead right here to Step 3: Design. But if you got here after having done the necessary work beforehand, then you're on the right track!

In Step 1: Planning, you probably already got a good idea about what types of layouts and design you want to use. Let your creativity flow here. Remember, there are multiple layouts you will probably need for your design. You'll want a layout for your homepage, which, according to your sitemap, will just contain some introductory information or highlights, some links, and, depending on your goals, maybe some exciting imagery.

You'll also want a layout for your transitional pages. Transitional pages are pages that just shuttle the user to more important things. In the sample sitemap above, the Music and Electronics pages are just transitional pages. The Music page would be small, and contain links to the different genres of music below (Country, Hip Hop, Classical, and Rock). The Electronics page would also be small, and just contain small bits of information while it links to the more important stuff, like the DVD Players, TVs, MP3 Players, and Digital Cameras pages. Transitional page layouts should match the whole site, but also be simple so users can spend as little time on them as possible.

You probably don't want to hear this, but even at this point, you might consider leaving Photoshop closed for a bit. Instead, try drawing several layouts for your site on paper first. It's a good idea to build multiple layouts just to see how they "feel" with the site you're building, and using Photoshop to build lots of layouts that you might not even use is time consuming. It's much faster to draw some quick and dirty layouts on paper to get a rough feel for which way you want to go with the design.

By this point, you probably have a twitchy trigger finger right about now when it comes to firing your design gun. But take it slow. Here's something to consider about design.

Did you know that Apple, the company behind the designs of the wildly successful iPhone, iPod, and iMac computers and Macbooks, uses a design process they call "10-3-1?" It's true; at the 2008 South By Southwest Interactive Festival, I attended a presentation by Michael Lopp, Apple's senior engineering manager, where he revealed this small little bit of information to a packed room filled with designers.

Here's how it works. Apple designers must adhere to the 10-3-1 rule, where designers first give themselves plenty of creative freedom and come up with 10 good, wholesome designs for something. This could be for a site or a product, among other things. Then, after coming up with 10 good designs, they must go through the painful and often difficult task of eliminating 7 of them, leaving them with 3 really good designs to work with.

Then, the Apple designers will spend some months on these 3 designs improving them and bringing them up to Apple's game. Finally, after all this work, the designers must again eliminate 2 of the designs, until they're left with just 1 powerful design which gets the final work done and is given the well-known Apple brand and polish.

In recent years this type of thinking has been very good to Apple, and their designs have met with some big success. If you want your designs to be successful as well, then it's here in this step, Step 3: Design, that you should take the time before opening Photoshop to really plan out your design, taking into account everything you learned from Step 1 and knowing what the site will flow like from Step 2.

Make sure you finalize your design. Once you have your design ready, there's no going back.

Step 4: Development

If you've finalized your design (either to yourself or with your client), then you can begin developing the site. Depending on how you want the site to work, this could involve such complexities as PHP and MySQL backend programming, or it could just be as simple as some basic HTML and CSS. Either way, this step involves the actual coding of the site.

Some designers are solely designers and deal with only the basics of XHTML and CSS, opting to work with a partner or hire someone to do the coding of a site. Other designers know the development and coding side just as well as the design side, but these designers aren't altogether too common.

Either way, we won't go into the development of the site here. For the purposes of this article, it's enough to say that this is the final step, after the design is done, in the creation of a Website.