Many of you have already seen websites highlighting searched keywords to improve accessibility. Using the same concept of parsing the referring URL, we can adjust the website to improve the chances that the user will find what they are looking for. Here are a couple of examples to give an idea of the many ways it can be used.
Example 1
The first example can be seen by going to the search page and clicking the top link for Web Design Sydney.
These examples are Google-specific as that is what the vast majority of users use. It is possible to add multiple search engine matching though.
Example 2
This is the code for demo 2. In this example the promo image is changed if a search term is matched. If multiple words are matched, the last keyword the user entered is the one that is displayed.
$(function(){
var ref = document.referrer;
if(ref.indexOf('google') != -1){
var q = ref.match(/q=([^&]+)/);
if(q){
var terms = decodeURIComponent(q[1].replace(/\+/g,' ')).split(' ');
var last = terms[terms.length-1].toLowerCase();
$('#promo').attr('src', '/images/promo-' + last + '.jpg');
}
}
});
Comments