blog archive contact about feed

Rob's Blog - July 2009

Contents

Here are Rob's Blog entries for July 2009.

Blog entries for other months can be found in the main blog index.

Using A Canonical URL

Websites that can be accessed from multiple URL's aren't very search engine friendly.

Sometimes this structure may have evolved by accident as a site was developed at different times on varying technologies. You don't want to turn off the old links as that would loose valuable search engine equity, but you don't want them scattered on multiple URL's either.

There is a solution, and that is to use a canonical URL.

The easiest is to add a simple link element to the page with it's correct canonical URL. For example, if we have a page that can be reached at www.example.com/test.html, example.com/test.html or beta.example.com/test.html. we only want this to be index at www.example.com/test.html, so we can use add a link element as follows...

<link rel="canonical" href="http://www.example.com/test.html" />

Notice the use of rel="canonical", this is tells a search engine if it has accessed the page from another URL, it's actually meant to be indexed from this URL.

Google, Yahoo and Microsoft have all agreed to support this canonical link element.

Another approach is to redirect the user to the page on the correct URL server side. Using Apache, this can be done using a RewriteRule and couple of RewriteCond's.

Using the same example, the rewrite rule would be something like this

RewriteEngine on RewriteCond %{HTTP_HOST} !^www\.example\.com [NC] RewriteCond %{HTTP_HOST} !^$ RewriteRule ^/(.*) http://www.example.com/$1 [L,R=301]

Here we make sure we're not already accessing using the correct domain name. If we aren't, the we redirect using the L flag to make sure this it's the last rule run, and R=301 to issue a 301 Moved Permenantly redirect. Anyone visiting the page on an incorrect domain, will now be redirected to the right page.

Entered: 2009-07-21 14:31:34

Using jQuery And Mootools On The Same Page

While it's never a good idea to bloat your webpage with too much unneeded content, there are times when you can't avoid it. One example I came across recently was with my day job's adoption of jQuery as our official JavaScript framework, I needed to add some jQuery goodness to some blog pages belonging to a certain category in Movable Type. Simple, right?

Well the site in question already used Mootools extensively, so the jQuery would have to run nicely next Mootools and not disrupt existing functionality.

The designers of jQuery have designed for this sort of situation, and have provided a function called noConflict that returns the use of $ to Mootools, or any other framework you may have installed as well.

Here's some example code to show both jQuery and Mootools running in the same page...

<script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript"><!-- jQuery.noConflict(); //--> </script> <script type="text/javascript" src="mootools-1.2-core-yc.js"></script>

In my Movable Type situation, I am able to use a custom MT tag to make sure jQuery only appears for certain categories. Let's assume I have a category called jQuery where I need the jQuery library to be imported, the MTIfCategory tag is what I need to guard with...

<MTIfCategory label="jQuery"> <script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript"><!-- jQuery.noConflict(); //--> </script> </MTIfCategory> <script type="text/javascript" src="mootools-1.2-core-yc.js"></script>

With this in place I can call jQuery functions using the jQuery variable, and MooTools using $ where necessary.

Entered: 2009-07-15 18:24:37

Links for 2009-07-03

Bookmarks from del.icio.us
Entered: 2009-07-04 00:15:02