Ihr kennt doch bestimmt alle die Websites, die auf Knopfdruck und Angabe einer URL ein kleinen Thumbshot/Screenshot von dieser Website erstellt (z.B. http://www.thumbalizr.com). Nun wollte ich mir selber mal so etwas programmieren, bzw. einfach mal die Technik dahinter anschauen. So einfach wie das aber vielleicht zunächst aussehen mag ist das gar nicht. In vielen Foren findet man entsprechende Beiträge mit Fragen ob und wie man das beispielsweise per PHP realisieren kann. Nun war mir schnell klar, dass das mit PHP nicht wirklich so einfach umsetzbar ist. Die Lösung, die wohl auch die ganzen vorhandenen Diensten einsetzen ist soweit ich das verstanden habe, ein entsprechender Server auf dem ein Dienst läuft der den Screenshot macht und dann diesen per Script weiterverarbeitet und eben auch ausgibt. Um einen Server kommt man also scheinbar nicht herum, wenn man selbst solch einen Dienst betreiben möchte.

Nun kam mir durch den HTML5-Hype natürlich auch gleich HTML5 in den Sinn, habe das aber dann nicht weiter verfolgt. Umso überraschter war ich, als mir wenige Tage nach diesen Überlegungen Mister Wong in seinem Newsletter folgendes empfahl:

html2canvas – screenshots with JavaScript
html2canvas.hertzen.com

Schon einen Tag vorher hatte Golem.de darüber berichtet, was mir aber irgendwie entgangen ist. Schon irgendwie sehr nice, kaum darüber nachgedacht, schon bekommt man die Lösung auf dem Silbertablett geliefert 😉

Zwar ist die Lösung natürlich nicht perfekt, zeigt aber schon, wie man das Canvas-Element unter anderem einsetzen kann. Ich werde mir das auf jeden Fall mal genauer anschauen und empfehle euch das natürlich auch 🙂