Referenzen

Donnerstag, 20. Mai 2010

Neue SenSEO Rich Snippet Vorschau

Etwas später als bei Twitter angekündigt, kommt heute der Artikel zur Implementierung der Rich Snippet Vorschau in SenSEO.

Das Feature
Das Google Webmaster Central Blog hat in letzter Zeit immer wieder die Darstellung neuer Mikroformate in den Google SERPs beworben (der offizielle Name ist Rich Snippets). Zu den unterstützen Mikroformaten zählen unter anderem Personen, Ereignisse, Bewertungen oder auch Rezepte. Wie das dann aussehen kann, zeigt sich am Beispiel der Suche nach "thai green mango salad".



Das zusätzliche Bild und die Bewertungs-Skala werden von Google dargestellt, weil die Macher von about.com ihre Rezepte mit speziellen Auszeichnungen versehen haben. Um diesen und anderen Entwicklern im Vorfeld eine Möglichkeit zu bieten, diese Daten zu testen, bietet Google das Rich Snippets Testing Tool als Google Webmaster Tool an. Vor einigen Tagen hatte ich nun die Idee, dieses Tool in SenSEO 1.4.0 zu integrieren. Ein solche Vorschau bietet sich an, da SenSEO als Extension auf On-Page Optimierungen ausgerichtet ist. Läßt man von SenSEO eine Rich Snippet Vorschau der erwähnten Rezept-Seite generieren, sieht diese so aus:



Die Umsetzung
Die Umsetzung der Vorschau basiert im Wesentlichen auf dem Yahoo-Service YQL. Mit YQL ist es möglich, Inhalte einer fremden Seite zu extrahieren und in die eigene Website (oder Extension) zu integrieren. Diese Möglichkeit habe ich genutzt, um von der aktuell im Browser angezeigten Seite im Hintergund eine Vorschau mit dem Rich Snippet Testing Tool zu erstellen und diese in SenSEO zu integrieren. Die gesamte Umsetzung geschieht mit JavaScript direkt im Browser - serverseitige Scripte sind nicht nötig.

Zu Beginn wird ein XHR-Request erzeugt, welcher mit Hilfe von YQL aus dem Google Tool die Vorschau für das Rich Snippet extrahiert:

var req = new XMLHttpRequest();

req.open('GET', "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fwww.google.com%2Fwebmasters%2Ftools%2Frichsnippets%3Furl%3D" + encodeURIComponent(content.window.location) + "%22%20and%20xpath%3D'%2F%2Fdiv%5B%40class%3D%22onebox%22%5D'", true);

Als Response wird ein XML-Dokument geliefert, in dem der Code-Schnipsel der aufgerufenen Webseite verpackt ist. Um an diesen Schnipsel zu kommen, nutze ich die XPath-Implementierung des Firefox:

var xmlDoc = req.responseXML;

var nsResolver = xmlDoc.createNSResolver( xmlDoc.ownerDocument == null ? xmlDoc.documentElement : xmlDoc.ownerDocument.documentElement);

var nodesSnapshot = xmlDoc.evaluate('/query/results/node()', xmlDoc, nsResolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null );

Um die so entstandenen XML-Knoten in das Dokument integrieren zu können, müssen diese im letzten Schritt in einen String serialisiert werden:

var xmlString = (new XMLSerializer()).serializeToString(nodesSnapshot.snapshotItem(0));

SENSEO.Panel.panelDocument.getElementById('snippet-container').innerHTML = xmlString;

Fazit
Durch diese Lösung erspare ich mir das "Nachprogrammieren" des Rich Snippet Testing Tools. Die Generierung der Vorschau wird somit weiterhin von diesem Tool erledigt. Unterstützt Google in Zukunft neue Mikroformate, werden diese auch sofort in SenSEO angezeigt. Ein Schwachpunkt dieser Lösung ist die Selektion des Code-Schipsels anhand von HTML-Elementen. Sollten die Entwickler von Google den Aufbau ihres Dokuments ändern, könnte die Selektion von einer Minute zur Nächsten scheitern und die Vorschau wäre hinüber. In einem solchen Fall ist eine neue Version von SenSEO mit angepasster Selektion nötig.

Geschrieben von Nico Steiner in Referenzen um 22:59 | Kommentare (0) | Trackbacks (0)

Montag, 10. Mai 2010

Twitter-Multikulti

Die letzten Tage hat es Twitter-Followers gehagelt. Schön zu sehen, dass es bei den SenSEO-Interessierten international zugeht. Allein die Follower der letzen Tage kommen aus Deutschland, USA, Indien, Holland, Israel und Japan.



Auch bei der Alexa-Statistik geht es multikulturell zu:



Die Besucher-Landkarte von Google Analytics zeigt, dass sich die Besucher von www.sensational-seo.com auf die ganze Welt verteilen:

Geschrieben von Nico Steiner in Referenzen um 20:34 | Kommentare (0) | Trackbacks (0)

Montag, 3. Mai 2010

Highcharts - Diagramme mit JavaScript erstellen

Ich habe eben die Bücher Presentation Zen und Slide:ology durchgeblättert. Highcharts ist eine JavaScript-Library, welche es erlaubt, Diagramme in dem Stil zu erstellen, wie er von den Büchern empfohlen wird.

Highcharts is a charting library written in pure JavaScript, offering an easy way of adding interactive charts to your web site or web application. Highcharts currently supports line, spline, area, areaspline, column, bar, pie and scatter chart types.

Geschrieben von Nico Steiner in Referenzen um 00:44 | Kommentare (0) | Trackbacks (0)

Sonntag, 2. Mai 2010

Rezension: Bekenntnisse eines Redners

Ich habe das Buch von Scott Berkun in der deutschen Übersetzung von Peter Klicman in Vorbereitung auf die International PHP Conference gelesen.

Scott warnt bereits im Prolog davor, dass sein Buch für all jene ungeeignet sein könnte, die nicht immer gern die Wahrheit hören. Dieser Warung läßt er 10 Kapitel folgen, die persönlich und eigenwillig seine Erfahrungen und Erlebnisse als Redner schildern. Daraus leitet er zahlreiche Ratschläge für Neulinge und Profis ab, die sich, wie er, auf ein Podium begeben. Scott nimmt die Angst vor Anfängerfehlern, indem er an Beispielen zeigt, dass Fehler ständig passieren und diese nur allzu natürlich sind ("Vermeiden Sie den Fehler, keine Fehler machen zu wollen."). Er gibt Tipps, wie man mit der Nervosität umgehen kann, die sich in Konfrontation mit einer großen Menschenmenge (auch bei ihm) einstellt. Auf amüsante Weise unternimmt er dabei einen Ausflug zu den Höhlenmenschen und der Organisation unseres Gehirns. Er schreibt über häßliche Kronleuchter und großartig konzipierte Amphitheater, wenn er über schwierige Räume aufklärt. Auch mit der Höhe seines Jahreseinkommens hält er nicht hinterm Berg, und zeigt, was andere in diesem Business verdienen. Der Leser erfährt weiterhin, wie er als Redner den Kontakt zum Publikum aufbaut und aufrecht erhält und welche wichtige Rolle der Aufbau der Präsentation dabei spielt. Amüsante Einblicke in Auftritte beim Fernsehen, persönliche Bekenntnisse des Autors und "handwerkliche" Tipps zu Fernbedienung, Kamera und Mikrofon runden das Buch ab.

"Bekenntnisse eines Redners" ist schonungslos ehrlich, unkompliziert und mit viel Witz geschrieben. Neben zahlreichen Fakten und sehr hilfreichen Einblicken und Ratschlägen erfährt der Leser viele persönliche Einblicke in die Arbeit und das Leben eines Redners. Diese Kombination macht meiner Meinung nach die Stärke des Buchs aus. Scotts Humor hat mir nicht nur einmal irritierte Blicke eingebracht, wenn ich kichernd und glucksend in der Ecke eines Cafes in dem Buch gelesen habe.

Geschrieben von Nico Steiner in Referenzen um 20:04 | Kommentare (0) | Trackbacks (0)

Mittwoch, 28. April 2010

Erfolgreiche Ladezeiten-Optimierung

Es ist schön zu sehen, wie unsere Bemühungen, die Ladezeiten unserer Webseiten zu verkürzen, Wirkung zeigen. Dies zeigen nicht nur Tools wie YSlow oder Page Speed, sondern auch Tools wie die Google Webmaster Tools. Diese analysieren in ihrem Lab-Bereich die Ladezeiten von Webseiten und veröffentlichen neben einer Statistik der vergangenen Monate auch Empfehlungen für weitere Optimierungen. Diese Statistiken zeigen über die letzten Monate für sämtliche unserer Projekte eine deutliche Verbesserung der Ladezeiten.



Die Statistik geht nur bis zum Dezember des letzten Jahres zurück. Einige Optimierungen fanden schon vorher statt, der initiale Wert dürfte also noch sehr viel größer als 3 Sekunden sein. Und wie die Zahlen des Artikels The performance business pitch von Stoyan Stefanov zeigen, haben solche Verbesserungen einen großen Einfluß auf die User Experience und das Kaufverhalten des Besuchers einer Website.

Wie wir das geschafft haben, läßt sich in diversen Artikeln hier im Blog nachlesen.

Geschrieben von Nico Steiner in Referenzen um 06:49 | Kommentare (0) | Trackbacks (0)

Montag, 26. April 2010

GWT - Top search queries

Google hat in den Webmaster Tools die Statistik zu den Top search queries ordentlich erweitert. Statt weniger, wager Daten stehen jetzt detaillierte Statistiken zu Impressions und Clickthroughs in Abhängigkeit zur Position in den SERPs zur Verfügung. Wer hätte gedacht, dass Google solche Daten eines Tages in dieser Genauigkeit so bereitwillig veröffentlicht?

Geschrieben von Nico Steiner in Referenzen um 23:27 | Kommentare (0) | Trackbacks (0)

Sonntag, 25. April 2010

Xsticky-Addon - Sticky Notes für den Firefox

Das Xsticky-Addon erlaubt im Firefox das Platzieren von Sticky Notes auf einer beliebigen Webseite. Ich schreibe darüber, da mir diese Idee vor einiger Zeit auch durch den Kopf ging (wir hatten vor 2 Jahren etwas ähnliches als Teil unserer Entwicklungsumgebung implementiert). Von der Entwicklung eines entsprechenden Firefox-Addons habe ich dann aber abgesehen - der Aufwand schien mir einfach zu groß. Das Xsticky-Addon steht in der aktuellen Version erst am Anfang einer denkbar aufwändigen Entwicklung. Die Todo-Liste auf der Mozilla Addon-Seite läßt erahnen, wo die Reise hingehen könnte. Ich bin gespannt, ob Swen Burdack das nötige Durchhaltevermögen zeigt.

Hier eine kleine Liste von Gedanken/Problemen, die mir damals vor allem in Hinblick auf den Austausch der Notes durch den Kopf gingen:

• Wie bestimme ich, wer die Note zu lesen bekommt? (Organisation von Teams/Projekten/Zuständigkeiten)
• Wie findet diese Organisation statt? (Weboberfläche, Autorisierung, Rechtervergabe)
• Wie gehe ich mit unterschiedlichen Seitenzuständen um? Welchen Identifier für den Zustand einer Seite kann ich nutzen? Was mache ich mit Seiten, die sich innerhalb eines Flows befinden (Kundendaten etc.)?
• Wie kann ich solch ein Addon monetarisieren? (Bis zu 3 Projekte/Personen/Teams kostenlos, dann zahlen?) Wie stelle ich dann eine 100%ige Verfügbarkeit sicher? Und die ganze Zahlungsabwicklung

Ich fänd' es toll, wenn der Entwickler hierfür Lösungen finden würde. Dann wird Xsticky vermutlich ein großer Erfolg.

Geschrieben von Nico Steiner in Referenzen um 23:41 | Kommentare (0) | Trackbacks (0)

Nachtrag zum JavaScript Error Tool

Es gibt nun auch einen Online-Service ExceptionHub, welcher JavaScript-Fehler trackt und über eine Weboberfläche, per E-Mail oder als RSS-Feed kommuniziert. Weitere Features des Service sind ein stack trace (feine Sache, aber wie in den Kommentaren zu lesen ist, nicht ganz unkritisch implementiert), die Gruppierung von Fehlern und eine Unterscheidung zwischen Entwicklungs- und Produktionsbetrieb. Das Prinzip ähnelt dem des J.E.T., welches wir für die Analyse von JavaScript-Fehlern einsetzen.

Unsere Erfahrungen seit Einführung des J.E.T. im Dezember des letzten Jahres sind durchaus positiv. Nach einer anfänglichen Bugfix-Phase haben sich die Fehler auf ein moderates Maß eingependelt. Viele der jetzt noch auftretenden Fehler sind auf vorzeitig abgebrochene Ladevorgänge und ähnliche, nicht behandelbare Fehler, zurückzuführen. Sehr hilfreich ist das unmittelbare Feedback über neu auftretende Fehler nach Onlinegängen. Hier können wir entsprechende Maßnahmen sehr viel schneller als früher ergreifen.

Ein stack trace, wie ihn ExceptionHub bietet, wäre auch für das J.E.T. wünschenswert. Momentan ist es sehr frustrierend, die Ursache für so ungenaue Fehler wie "target is null" zu finden.

Geschrieben von Nico Steiner in Referenzen um 21:01 | Kommentare (0) | Trackbacks (0)