Was tut man als Blogger nicht alles, um seinen Lesern etwas zu bieten. Dazu gehören neben gutem Content selbstverständlich auch akzeptable Ladezeiten der einzelnen Seiten. Geschwindigkeit – im Sinne von schnell – auch praktisch umgesetzt zu bekommen, ist gar nicht so einfach, wie der Einzelne vielleicht vermuten mag.

Auch gilt es immer wieder aufs Neue abzuwägen, was man selbst gerne hätte und dem was sinnvoll ist, denn alles verbraucht euren Traffic. Denn wohl nicht jeder hat ein monatlich ausreichendes Datenvolumen zur Verfügung bzw. geht es so wie mir, dass regelmäßig jeden Monat annähernd 2 Gigabyte verfallen. Wie oft lese ich auf Twitter, dass das Datenvolumen schneller verbraucht ist, schon wieder, als das Monatsende heran ist.

Google Developers PageSpeed Insights

Daher gab es hier die letzten Tage reichlich zu tun, um endlich (lange überfällig) meinen Blog tekshrek.com auch in Sachen Geschwindigkeit, ebenfalls nach vorn zu bringen. Als Maßstab dienten mir dabei die PageSpeed Insights, ein Tool von Google, dass die Geschwindigkeit auf Webseiten misst und in Form eines Wertes ausgibt. Erreichen konnte ich hier auf tekshrek.com einen Page Speed von beachtlichen 95/100 für die Darstellung auf mobilen Geräten und gewaltige 98/100 für die Darstellung auf einem Desktop.

Leider kostet die Google-eigene Werbung wertvolle Punkte und so verliert man wieder etwas am Score, lässt man diese aktiv. Aber ich möchte ja jedem Leser zumindest die Gelegenheit zum Klick einräumen und daher denke ich, rechts in der Sidebar und in leicht dezent geht das in Ordnung.

Wer mir jedoch mit zahlreichen Tipps tatkräftig geholfen hat und was hier im Einzelnen alles so passiert ist, warum mir stellenweise der Kopf ordentlich rauchte, dazu demnächst hier mehr.

Zusätzliche Grafiken für hochauflösende und Retina-Displays sind wieder mit an Bord und werden zunehmend auch für bereits erfolgte Veröffentlichungen regelmäßig ergänzt.

Für alle unsere Leser mit hochauflösenden und Retina-Displays hatte ich es für eine zu lange Zeit vernachlässigt, zusätzliche Bilder bereit zu stellen – diese Zeit ist hiermit vorbei. Die Pixeldichte wurde wieder erhöht und das Versäumte Schritt für Schritt nachgeholt. Wer mag schon gern einzelne Pixel auf seinem Display erkennen, wenn sich das vermeiden lässt.

Das Photoshop Plugin TinyPNG: Komprimierung von PNG-Dateien

Hier und jetzt soll es um ein Plugin für Photoshop gehen, das tatkräftige Unterstützung dabei leistet, die Größe von Bildern ohne sichtbaren Qualitätsverlust zu reduzieren. Ein Standard-Header- und auch Artikelbild hier auf dem Blog hat aktuell eine Breite von 777 x 437 Pixel und für die passende hochauflösende Grafik dazu sind es immerhin schon 1554 x 874 Pixel.

Das gehört ordentlich komprimiert, sonst steigen die Ladezeiten je nach Schnellig-(Langsam-)keit der genutzten Datenverbindung schnell in Richtung unerträglich und das Risiko, bei Google deshalb in Ungnade zu fallen, besteht ebenfalls.

Speichere komprimierte PNG-Dateien direkt aus Photoshop

Nachdem das TinyPNG Plugin geladen wurde, wird dieses einfach im Plugin-Ordner: Macintosh HD ▸ Programme ▸ Adobe Photoshop CS6 ▸ Plug-ins gespeichert und beim nächsten Start von Photoshop steht ein neuer Menüpunkt unter Datei ▸ Exportieren ▸ TinyPNG... zur Verfügung.

Durch einen Klick darauf wird eine Vorschau angezeigt, es kann an dieser Stelle ein Speicherort gewählt und das komprimierte Bild gespeichert werden.

Auch eine Größenänderung ist an dieser Stelle noch möglich. Aber vermutlich wird das wohl eher weniger genutzt, denn das Bild wurde sicher sinnvollerweise zuvor in Photoshop selbst fertig bearbeitet. Ansonsten sind keine weiteren Schritte im Workflow notwendig.

Scripting & Batch-Automatisierung und Rundum-Sorglos-Farbmanagement

Ebenfalls lassen sich hunderte von Bildern mit TinyPNG auf einmal komprimieren. Das Plugin unterstützt JavaScript, VBScript und Applescript sowie Batch-Automatisierung. Dabei werden sämtliche Bilder automatisch auf sRGB für maximale Kompatibilität umgewandelt und es ist egal, ob Farbprofile verwendet werden oder nicht – es funktioniert einfach.

Das TinyPNG Plugin wurde für Adobe Photoshop CS5, Photoshop CS6, Photoshop CC und Photoshop CC 2014 für Windows und Mac OS X entwickelt und kann zum Preis von $40 direkt beim Entwickler erworben werden.

TinyPNG gibt es auch als kostenlosen Online-Service

Da das TinyPNG Photoshop Plugin aktuell nur PNG-Dateien unterstützt, bleiben die JPEGs vermeintlich auf der Strecke. Zwar würde ich mir hier ebenfalls ein passendes Plugin für Photoshop wünschen aber das dauert nach Rücksprache mit dem Entwickler noch einige Zeit.

Das Photoshop Plugin TinyPNG macht die Komprimierung von PNG-Dateien viel einfacher!

Wer mag und hier noch nach einer Lösung sucht, kann dies derzeit online auf tinypng.com tun und dort seine JPEGs komprimieren.