Seit zwei Tagen fällt mir bei der Google Suche im Firefox ein kleines Lupen-Icon auf, das neben dem jeweiligen Suchtitel in den organischen Ergebnissen erscheint. Handelt es sich um ein neues Google Feature: Google Web Preview oder Google Site-Vorschau?
Ich wundere mich, ob es hierbei wieder ein neues Merkmal ist, das Google
nur bei ausgewählten Personen testet. Zuerst dachte ich, es wäre ein
bei mir installiertes Firefox Addon, das mir diese Vorschauen der
Websites liefert. Denn auf anderen Rechnern, bei meinem Kollegen und in
anderen Browsern wurde dies nicht angezeigt. Selbst im modernen Google
Chrome Browser konnte ich dieses Vorschau-Lupensymbol nicht finden. Ein
Firefox-Addon ist es aber nicht.
Man erkennt das daran, wenn man z.B. mit CookieCuller alle Cookies
löscht oder zwischenzeitlich alle Cookies deaktiviert, dann verschwindet
das Vorschau-Symbol mit der Lupe (Vorsicht: Cookies vorher zwischenspeichern, wenn man das wiederherstellen möchte!). Alternativ lassen sich auch alle Addons im Firefox deaktivieren und das Lupen-Symbol ist immer noch da.
Was macht die Suchergebnisvorschau?
Die Suchergebnisvorschau (Google Web Preview) ist eine herhorragende Möglichkeit, sich die Websites noch innerhalb der Suchergebnisse anzusehen, ohne die Website direkt zu besuchen. Die Suchtreffer werden beim Hovern (beim Überfahren mit der Maus ohne Klick) blau umrahmt. Mit der Maus braucht man nur auf das Lupensymbol zu klicken oder irgendwo innerhalb des blau umrahmten Suchtreffers:
Danach öffnet sich rechts vom Suchtreffer eine Seitenvorschau und dies ab sofort jedesmal, wenn über die Suchergebnisse gehovert werden. Die Vorschauen werden bei einer Auflösung von ca. 1045px Breite (also etwas größer als Standard 1024px-Breite) gerendert und enthalten von Google gecachte Vorschauen. Selbst pdf-Suchtreffer werden in der Google Web Preview dargestellt.
Sehr interessant ist der Aufbau dieser Vorschau. Während bei den normalen Google-Suchtreffern nur Textinformationen eine Rolle spielen und anhand dessen der Benutzer auf einen Treffer klickt oder auch nicht, so wird bei der Vorschau das komplette Potenzial an Visualisierung ausgeschöpft: innerhalb der kleinen Vorschau der Website sind die Texte natürich nicht lesbar (Schriftgrößen 1-3px), daher werden relevante Textpassagen orange umrahmt und ein Textauszug unterhalb der relevanten Stellen gezeigt. Auch mehrere relevante Stellen können optisch hervorgehoben werden.
In angereicherten Suchinhalten wie Video-Treffer innerhalb der Suchergebnisse wird keine Vorschau angezeigt, z.B. wenn ein YouTube-Miniatur-Icon bereits beim Suchtreffer eine Videovorschau bietet:
Wenn eine Seite nicht sofort geladen werden kann, kommt eine typische Ladeanzeige:
Manchmal kommt die Anzeige "Vorschau konnte nicht geladen werden". Kurze Zeit später wird dann aber meistens die Vorschau angezeigt.
Lange Websites, bei denen man normalerweise zur relevanten Stelle scrollen muss, werden zerrissen oder angerissen dargestellt:
Wie sieht der Quelltext zur Google Vorschaufunktion aus?
Die Lupe ist ein gestyltes Button-Element:
<button class="vspib"></button>
Neben dem Logo ist in der mir ausgelieferten Google Sprite-Grafik auch die Lupe enthalten:
Hier das zugehörige CSS:
.vspib {
background-position:-19px -193px;
border:0 none;
cursor:pointer;
display:inline;
height:13px;
margin-left:5px;
margin-right:3px;
vertical-align:6px;
width:13px;
}
search...s_rfai= (Zeile 4)
#vsrs, #vspci, .vspib {
background:url("/images/srpr/nav_logo21.png") no-repeat scroll 0 0 transparent;
}
Die Vorschau wird aus mehreren Grafiken zusammengesetzt.Beid en Grafiken handelt es sich um base64-kodierte jpeg-Bilder, die mit src="data:image/jpeg;base64,/......" lokal gespeichert und auch im cache abgelegt werden.
Hier das Beispiel für die erste Gurkcity Vorschaugrafik:
<img id="vsi" alt="Preview image" src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD
... usw...
f/9k=">
Das HTML-Grundgerüst der Google Vorschau sieht so aus:
<div id="vspb" style="left: 769px; width: 302px; top: -28px; height: 326px; visibility: visible;"><span id="vspci"></span><span id="vsrs" style="top: 53.5px;"></span>
<div id="vspc" style="height: 326px;">
<div id="vsic" style="width: 302px; height: 326px;"><img width="22" height="22" id="vsli" alt="" src="/images/vsli1.gif" style="visibility: hidden;">
<div id="vsm" style="visibility: hidden;"></div>
<a id="vsia" style="visibility: visible; display: block;" href="/url?q=http://www.gurkcity.de/&sa=X&ei=H4rKTKG5JomLswanztWoBA&ved=0CBoQlAowAA&usg=AFQjCNFlMLOgRaJ_wWlj2QqTWjJGf2DrTQ"></a></div>
</div>
</div>
Jedes Vorschau Element hat einen Inline-Style:
element.style {
height:326px;
left:769px;
top:-28px;
visibility:visible;
width:302px;
}
Und die div-Box mit der id vspb bekommt diesen style zugewiesen:
#vspb {
-moz-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5);
background-color:#FFFFFF;
border:1px solid #999999;
display:block;
padding:15px;
position:absolute;
top:0;
visibility:hidden;
z-index:110;
}
vspci stellt die Box für den Schließen-Button.
Google hatte in der letzten Zeit erfolgreich neue Technologien getestet und eingesetzt. Jeden Tag kommen neue Technologien hinzu. Diese müssen sich in der Praxis bewähren und auch von den Benutzern angenommen werden. Eine gängige Praxis ist es, diese erst mal einem kleinen Kreis zur Verfügung zu stellen und zu messen, ob diese neuen Technologien auch angenommen werden. Ich vermute, dass ich Teil eines solchen Betatests bin und diese neue Suchtechnologie präsentiert bekomme.
Welchen User-agent nutzt Google für die Web Preview?
Das kann man recht einfach den Log-Dateien entnehmen:
66.249.XX.X - - [29/Oct/2010:11:33:44 +0200] "GET /images/profi-webdesign01.jpg HTTP/1.1" 200 12630 "http://www.gurkcity.de" "Mozilla/5.0 (en-us) AppleWebKit/525.13 (KHTML, like Gecko; Google Web Preview) Version/3.1 Safari/525.13"
Google Web Preview nutzt demnach einen amerikanischen Safari Browser in der Version 525.13 zum Rendern der Vorschau-Grafiken.
Mein Fazit: Ich finde die neue Suchvorschau innerhalb der Google Suchtreffer richtig klasse. Weiter so Google!
Weiterführende Links zum Thema Google Web Preview:
Ergänzung vom 12.11.2010:
Google nennt dieses Feature "Instant Previews". Dieses ist seit gestern in Google Deutschland für alle Benutzer verfügbar.
Bookmarks:
Delicious Facebook Google Yahoo Mr. Wong Linkarena Digg