Search Engine Optimization tips for Blogger Templates (Part 2)

While Blogger templates may not be naturally optimized for search result status, there are many easy adaptations we can make to ensure they are more accessible and search engine friendly.

Last week in the first part of the SEO series for Blogger templates, I explained some how the head section could be best optimized for rankings in search engine results. In this part, I will explain how best to optimize the links in your blog template, which can help ensure these are properly crawled and better adapted for search engine spiders.

Back to Basics

Before we get into the intricacies of optimizing links in Blogger templates, let’s get back to basics!

SEO experts universally agree that link text is one of the most important factors of optimizing a link. Link text is the word or phrase which is used as a link in text links, like this:

<a href=”#”>This is Link Text</a>

The easiest way to optimize text links is to ensure the value of the text link tells the regular reader (and also search engine spiders) a description of where the link will lead to.

Let’s say I wanted to create a link to Kelby Carr’s post, SEO 101. A poor way of linking to this resource would be using non-descriptive link text like this:

Take a look at Kelby Carr’s post here

The link text, “here”, features no descriptive keywords related to Kelby’s SEO post, nor do the surrounding words have any impact on how this link is understood, either by readers of my post, or search engine spiders.

A much better way to link to this article would be to use descriptive text within and around the link:

Are you looking for SEO tips? Kelby Carr’s article describes the basics of search engine optimization with particular reference to blogs.

You can apply this technique to any manually created links in your blog, whether this be in your blog posts or links within your blog template (for example, links to important pages). Search engine spiders will reference the keywords contained in the link text more easily, while readers will prefer the experience of having a full description of where the links will lead to.

Using titles in your links

Links can be optimized even further by adding titles within the anchor tags, like this:

<a href=”#” title=”This is title text”>An example of link text</a>

The “title” of an anchor link should be exactly that: a descriptive title which explains something about the link. Titles offer even more information about the link to search engine spiders, and when a reader hovers their cursor over a link with a title in the anchor tag, the title will appear in a small box to provide a visual description.

Going back to the original example of linking to Kelby’s SEO 101 post, I could add the title”SEO 101″ to the link, which is also the title of her post, like this:

>Are you looking for SEO tips? Kelby Carr’s article describes the basics of search engine optimization with particular reference to blogs.

Hover your cursor over the same link text in each of the examples above. Do you notice the difference? If you use this technique for all manually created links in your Blogger blog, both search engine spiders and regular readers will notice the difference too!

Applying these techniques to your Blogger template

These techniques are easy to apply to any manually created links in your blog template. But what about your blog title, link lists and labels which use code generated by Blogger specific tags?

Even though such links are not generated by regular HTML anchor tags, there are methods we can use to optimize them by using keywords which are relevant to your blog, and by adding title tags.

The methods you can use are slightly different, depending on the link you wish to optimize. So I’ll go through the most prominent links you may wish to optimize in your own Blogger template with instructions on how these links can best be optimized for search engines and accessibility.

Your Blog Title/Home Page Link

In Blogger templates, your blog’s title in the header section provides a link to your blog’s home page. By default, this is displayed as a regular text link (featuring your blog title as the link text), though you can also opt to use an image instead of the blog title.

Your blog title is one of the most important factors of SEO, so you really need to ensure this is well optimized if you want your blog to rank highly for related keywords in search engine results. Whether you use regular link text as your blog title, or choose to use an image instead, you can still ensure this link is well optimized and adequate to your blog’s SEO requirements.

The widget code for your blog header contains two distinct sections of code: one for instances where link text is used to display your blog title (and link to your home page), and one which generates the correct code for when an image is used instead.

If you are using regular text to display your blog title, you’ll discover that it’s very easy to optimize this link. Simply go to Layout>Edit HTML in your Blogger dashboard, check the box to expand the widget templates, then locate the following section of code:

    <!--No header image -->
    <div id='header-inner'>
      <div class='titlewrapper'>
        <h1 class='title'>
          <b:include name='title'/>
        </h1>
      </div>
      <b:include name='description'/>
    </div>
  </b:if>
</b:includable>
<b:includable id='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <data:title/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl' title="A Link Title Here"><data:title/></a>
  </b:if>
</b:includable>

The text which I’ve highlighted in bold red is additional code which I have added to the template in order to give this link a title.

You can optimize this title by using descriptive keywords which are relevant to your blog subject. For example, if you are writing a blog about blogs, and your blog title is “The Cat’s Whiskers”, you could use a link title such as “The Pussy Cat Lover’s Blog” to provide adequate reference for search engines and readers alike.

If you are using an image instead of your blog title, you will need to locate a slightly different area of code and can optimize the link in two different ways:

  <b:if cond='data:useImage'>
    <b:if cond='data:imagePlacement == "REPLACE"'>
      <!--Show just the image, no text-->
      <div id='header-inner'>
        <h1 style="display: none;">Your Blog Title</h2>
        <a expr:href='data:blog.homepageUrl' style='display: block' title="Link Title Here">
          <img expr:alt='data:title' expr:height='data:height'
expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width'
style='display: block'/>
        </a>
      </div>

You’ll notice that I made two changes in the code above: the first is to add <h1> tags just before the link tags, which ensures there is a reference to a first class title within the blog template (when using an image instead of the textual title, this is omitted from the template code). By including the style reference, “display:none” this means that the H1 tags are referenced by search engine spiders, while not being displayed in the visual make-up of the template.

The second change is the same as the previous example, adding a link title inside the anchor tags, to ensure optimization for search engines and readers. As before, this also makes the link title appear when your cursor hovers over it.

Optimizing Labels Lists

In “new” Blogger layouts templates, you can add an optional “Labels” widget to your blog’s sidebar. This widget lists all the labels you have used to categorize your blog posts.

Since we do not have direct access to each label link in this list, you may imagine that it is impossible to add link titles to these links. Fortunately by adapting the code slightly, we can still add appropriate titles to these links!

If you have added a label widget to your blog, you can look in your template code to find this section:

<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
    <h2><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <ul>
    <b:loop values='data:labels' var='label'>
      <li>
        <b:if cond='data:blog.url == data:label.url'>
          <span expr:dir='data:blog.languageDirection'>
            <data:label.name/>
          </span>
        <b:else/>
          <a expr:dir='data:blog.languageDirection' expr:href='data:label.url' expr:title='"Read
more posts filed under " + data:label.name ' rel='tag'>
            <data:label.name/>
          </a>
        </b:if>
        <span dir='ltr'>(<data:label.count/>)</span>
      </li>
    </b:loop>
    </ul>

    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>

As before,t he code I added to make these labels more optimized for search engines is highlighted in bold red.

You will notice that I have referenced the titles for each label link using this formula:

expr:title=’”Read more posts filed under ” + data:label.name ‘

As the link to each label link is generated by widget tags, we cannot add the code for each link title individually. Instead we need to use the section of the widget code which is used to generate the title as an expression, along with more descriptive link text.

Furthermore, you will notice that I added “rel=”tag” to the anchor link code. This is because Blogger labels can be used as tags which are referenced by Technorati and other sites to collect and collate information about a blog’s content.

Optimizing Link Lists

Link lists can be optimized in a similar way. If you already have a link list present in your blog, simply find the expanded widget template for your link list widget which should look something like this:

<b:widget id='LinkList1' locked='false' title='' type='LinkList'>
<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>
 <div class='widget-content'>
   <ul>
     <b:loop values='data:links' var='link'>
       <li><a expr:href='data:link.target' expr:title='data:link.name'><data:link.name/></a></li>
     </b:loop>
   </ul>
   <b:include name='quickedit'/>
 </div>
</b:includable>
</b:widget>

Once again, I have added some extra code in red to show how the links in this list may be optimized with titles.

If all of the links in a particular link list are those of friends’ sites, you may also wish to add the tag rel=”friend” to the anchor link code. Similarly, if all the links in this list reference your other sites or social profiles, you may prefer to add the rel=”me” tag instead. Either of these tags may be added to the code like this:

<li><a expr:href=’data:link.target’ expr:title=’data:link.name’ rel=”friend”><data:link.name/></a></li>

These “rel” tags establish relationships between your blog and other sites, which is useful for those interested in the Social Graph API and for those who wish to link all their profiles using sites such as Ziki and OpenID.

Final thoughts

One thing you must note is that keyword spamming is frowned upon by search engines, and could result in a negative impact, rather than a positive one! When adding titles to your anchor links, it is advisable to use well formed phrases and proper descriptions rather than simply adding one keyword after another! This will stand you in much better stead, and will also be more friendly for your readers when hovering over such links.

Proper implementation of the methods I’ve described here will help your Blogger powered blog rank more highly in search engine results, and with some variation of these techniques, you could even learn how to optimize other links too!

I hope you have found these techniques useful in learning how your Blogger template can be optimized for inclusion in search engine results. In the next and final post of this mini-series, I’ll explain how you can optimize the images in your Blogger template, including your header image and those contained in widgets.

For more SEO tips related to your blog, be sure to check out the Search Engine Optimization category here at Blogging Tips!

Written by Amanda Fazani from Blogger Buster
Posted on March 3rd, 2008 and filed under Blogger
Do not forget to subscribe to our RSS feed for updates

11