23 listopada 2012

Śledzenie ruchu pochodzącego z wyszukiwania grafik w Google Analytics

Witamy, rozpoczynacie lekturę trzeciego artykułu poświęconego wyszukiwaniu grafik w Google. W poprzednich dwóch tekstach pisaliśmy o istotności Google Image Search w generowaniu ruchu oraz o sposobach rozpoznawania potencjału wyszukiwań. W tym artykule zaprezentujemy, jak mierzyć faktyczną liczbę wizyt pochodzących z wyszukiwania obrazków, przy pomocy narzędzia Google Analytics.

Domyślne raporty w Google Analytics

Wspominaliśmy wcześniej, że domyślnie w Google Analytics nie mamy możliwości weryfikacji poziomu ruchu z obrazków. Wizyty te niegdyś były raportowane głównie jako google.pl / referral ze ścieżką odwołania zawierającą „imgres”. Obecnie ruch ten w większości zawiera się w ramach google / organic, ale po części również we wcześniejszym google.pl / referral (około 25%). Bez wprowadzania zmian w kodzie czy ustawieniach Google Analytics nie możemy zweryfikować faktycznej liczby wejść z Google Image Search.


Sposobów na modyfikację kodu śledzącego może być kilka. Poniżej przedstawimy jeden, który według nas jest najprostszy do wdrożenia i obarczony najmniejszym błędem.

Rozpoznanie wyświetlania strony w ramce

Przede wszystkim, warto zauważyć, że po kliknięciu na zdjęcie w wynikach wyszukiwania grafik użytkownik odwiedza stronę, która wyświetlona jest w ramce na domenie Google.pl (ewentualnie google.com lub innej domenie regionalnej).



Biorąc pod uwagę ten fakt, wystarczy wprowadzić funkcję JavaScript, która rozpozna, czy serwis wyświetlony jest w ramce, czy nie i jeżeli jest – wykona odpowiednią akcję.


if (top.location!= self.document.location)
    {
        var url = String(document.referrer);
        if (url.indexOf ("google") !=-1)
            {
                ...
            }
    }


Akcją, która zostanie wykonana może być wywołanie analyticsowej funkcji trackPageview z odpowiednio zmodyfikowanym adresem URL (w takim przypadku należy tylko pamiętać o tym, by nie została też wywołana domyślna funkcja trackPageview, w przeciwnym wypadku Analytics naliczy dwie wizyty).

Drugim sposobem może być przekierowanie użytkownika na domyślny adres podstrony, już bez ramki i dodanie do adresu zmiennych określających parametry kampanii w Google Analytics. Dzięki temu zamiast rejestrowania wizyty w ramce, Analytics zliczy wizytę na stronie docelowej i określi źródło wizyty na podstawie parametrów kampanii:

if (top.location!= self.document.location)
    {
        var url = String(document.referrer);
        if (url.indexOf ("google") !=-1)
            {
                var adres=self.document.location+'?utm_source=google&utm_medium=image';
                top.location=adres;
            }
    }


W powyższym przykładzie źródło wizyty zostało oznaczone jako „google”, a medium kampanii jako „image”. Wartości te są oczywiście dowolne, podobnie jak wybór zmiennych (mamy 5 do wyboru: utm_source, utm_medium, utm_term, utm_content i utm_campaign). Więcej na temat zmiennych kampanii: http://support.google.com/analytics/bin/answer.py?hl=pl&hlrm=en&answer=1033867 .

Raporty w Google Analytics po modyfikacji

Po wprowadzeniu wspomnianej funkcji w serwisie, Google Analytics będzie raportował przyszły ruch z grafik jako źródło: google i medium: image.

Prezentujemy porównanie wizyt wygenerowanych przez google / organic i google / referal (powyżej) oraz wizyt z google / image (poniżej) po modyfikacji, która miała miejsce pod koniec września w serwisie www.inspireme.pl:



Dodatkowe zmienne

Dzięki zastosowaniu funkcji JavaScript możemy oprócz rozpoznania adresu z ramką jako Google.pl, wyciągnąć dodatkowe zmienne. URL strony ze zdjęciem (ramka) wygląda tak:

http://www.google.pl/imgres?start=100&num=10&hl=pl&biw=1525&bih=685&tbm=isch&tbnid=R0FFOBCRVHhHkM:&imgrefurl=http://www.koty.org.pl/ogloszenia/5373,Kocieta-Rosyjskie-Niebieskie.htm&docid=AOYMTjr6LIgb2M&imgurl=http://www.koty.org.pl/zdjecia/dodane/5373_Kot-Rosyjski-niebieski.jpg&w=498&h=434&ei=-
F6rUJWEEIjmtQabtIGQBg&zoom=1&iact=hc&vpx=714&vpy=339&dur=329&hovh=210&hovw=241&tx=134&ty=102&sig=103833619232994679928&page=1&tbnh=138&tbnw=155&start=0&ndsp=23&ved=1t:429,r:12,s:0,i:144


Jak widać, w adresie ramki widzimy orientacyjną pozycję zdjęcia na stronie wyników wyszukiwania (start) oraz adres URL grafiki. Obie te zmienne można określić przy pomocy funkcji i dodać do adresu URL dla przekierowanej strony:

var urlVars = {};
var parts = url.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value)
{
    urlVars[key] = value;
});
if (urlVars["imgurl"]!=undefined && urlVars["imgurl"]!="") {
    if (urlVars["start"]!=undefined && urlVars["start"]!="") {
        var numerzdjecia=urlVars["start"];
    }
    else {
        var numerzdjecia=0;
    }
    var adres=self.document.location+'?utm_source=google&utm_medium=image&utm_campaign=' + urlVars["imgurl"] + '--poz--' + numerzdjecia;
}
else {
    var adres=self.document.location+'?utm_source=google&utm_medium=image&utm_campaign=' + url;
}


W powyższym przykładzie obie zmienne zostały dodane do parametru utm_campaign, więc będą widoczne w Google Analytics, jako nazwa kampanii. Przykładowe dane dla serwisu www.zamiasto.com.pl:


Dzięki takiej modyfikacji kodu mamy dostęp do wielu ciekawych informacji. Przede wszystkim wiemy, jakie wartości ruchu są w serwisie generowane z wyszukiwania grafik, możemy porównać ruch według stron docelowych, określić najbardziej popularne zdjęcia generujące wizyty oraz zweryfikować jakość ruchu dla poszczególnych stron docelowych i grafik (ten temat opiszemy w kolejnym artykule).

--
Jacek Tkaczuk, SEO Director w Bluerank 


Udostępnij:

5 komentarzy:

Polskie Szlaki pisze...

Witam,
czekałem na ten wpis.
Mam jednak pewien problem z tym kodem.
Mianowicie on ustawia kampanię, a nie nowego organica - przez to nie mamy informacji jakie słowo kluczowe było użyte do wyszukiwania.

Osobiście korzystam z takiego kodu:
// śledzenie wyszukiwania obrazów

var ref = document.referrer;
if (ref.search(/google\.([^\/]+)\/(ima?g|.*[?&]tbm=isch|.*[?&]site=images)/i) != -1) {
var regex = /google\.([^\/]+)\/.*/i;
var match = regex.exec(ref);
_gaq.push(['_addOrganic','images.google','q',true]);
if (ref.search(/[?&]prev=/i) != -1) {
regex = /[?&]prev=([^&]*)/i;
var match2 = regex.exec(ref);
_gaq.push(['_setReferrerOverride', 'http://images.google.'+match[1]+unescape(match2[1])]);
}
else
{
_gaq.push(['_setReferrerOverride', 'http://images.'+match[0]]);
}
}

// koniec śledzenia wyszukiwania obrazów

Działa on nawet dobrze, ale czasem nie zalicza mi ruchu ze zdjęć do images.google jako organic, ale jako refer, albo jako organic, ale google

Podoba mi się w waszym kodzie że usuwa ramkę. Pytanie czy można przerobić ten kod tak, żeby images.google było jako organic ze słowem kluczowym i bez ramki?

Polskie Szlaki pisze...

Stworzyłem taki kod.
Najpierw sprawdza czy referrer jest z images google. Jeżeli tak to sprawdza czy ma parametr q (słowo kluczowe). Jeżeli nie to bierze ścieżkę grafiki jako słowo kluczowe. Następnie sprawdza czy klieknięcie nastąpiło w serpach czy images search.
Mam nadzieję, że się kod przyda.

var ref = document.referrer;
if (ref.search(/google\.([^\/]+)\/(ima?g|.*[?&]tbm=isch|.*[?&]site=images)/i) != -1) {
var regex = /google\.([^\/]+)\/.*/i;
var match = regex.exec(ref);
regex = /[?&]q=([^&]*)/i;
var match_q = regex.exec(ref);
if (!match_q) {
var search_param="imgurl";
} else {
var search_param="q";
}
if (ref.search(/[?&]prev=/i) != -1) {
regex = /[?&]prev=([^&]*)/i;
var match2 = regex.exec(ref);
_gaq.push(['_addOrganic','images.googleSerps',search_param,true]);
_gaq.push(['_setReferrerOverride', 'http://images.googleSerps.'+match[1]+unescape(match2[1])]);
} else {
_gaq.push(['_addOrganic','images.google',search_param,true]);
_gaq.push(['_setReferrerOverride', 'http://images.'+match[0]]);
}
}

bluerank pisze...

Dzięki za kod. Wcześniej też próbowaliśmy z rozpoznaniem frazy dla referera, ale problem jest taki, że nie wszystkie wizyty były w ten sposób zliczane. Refererem przy wyszukiwaniu grafik jest URL, który nie zawiera parametru określającego frazę kluczową. Kod, który zaproponowaliśmy wydaje się działać we wszystkich sytuacjach. Ale oczywiście ma wady - tak jak napisałeś wcześniej, nie widać słowa kluczowego po którym nastąpiła wizyta z obrazków.

Myślę też, że przy takim kodzie ciężko będzie uciec z ramki (bo zgubisz referera). Ewentualnie możesz ustawić czas na przekierowanie - np 2 sekundy. Kod Analytics powinien się załadować, a użytkownik zostanie ostatecznie przekierowany na docelowy adres. Możesz też zmienić wykorzystywane funkcje "addOrganic" po prostu na przekierowanie na adres z odpowiednimi parametrami kampanii - np. jako utm_medium daj "organic". Resztę dowolnie.

Anonimowy pisze...

Witam,
zastanawiają mnie dwie rzeczy:

- opisany kod działa tak samo po zmianie w wyświetlaniu grafik w I.2013?

- w iframe src wyswietla się blank.html (niezależnie czy jestem zalogowana czy nie). Czy nie jest tak że przerzuci nas na adres blank.html?

bluerank pisze...

Po zmianie wyświetlania grafik kod ten nie będzie już działał, ponieważ strona nie jest teraz wyświetlana w ramce. Musimy zastosować kod opisany tu: http://bluerank.blogspot.com/2013/01/zmiany-w-sposobie-wyswietlania-grafik-w.html. Być może będzie to również odpowiedzią na Twoje drugie pytanie - nowe wyszukiwanie grafik nie wyświetla strony w ramce.