Blog zu den Themen Webentwicklung, technisches Online Marketing und Suchmaschinenoptimierung

Wie bild.de, zalando.de oder otto.de ihren Pagespeed optimieren könnten

Obwohl mittlerweile jedem Webworker klar sein dürfte, dass die Optimierung einer Webseite auf eine höhere Ladegeschwindigkeit und niedrigere Ladezeit in mehrerer Hinsicht ein essentieller Erfolgsfaktor ist, scheitern dennoch sehr viele an der Umsetzung. Dieser Artikel soll also vor allem praktische Optimierungstechniken aufzeigen, die sich auch beim eigenen Projekt anwenden lassen. Um dabei nicht in theoretischen Floskeln zu versinken, werden die verschiedenen Maßnahmen am Beispiel vier großer deutscher Webseiten veranschaulicht.

VG Wort WordPress Plugin

Zwischen den Festtagen kurz Twitter gecheckt, da kam mir ein Tweet von @KaiThrun unter die Augen. Er war auf der Suche nach einem WordPress Plugin zum besseren Arbeiten mit der VG Wort. Da ich intern bereits etwas ähnliches in Verwendung hatte, habe ich zwischen den Jahren nochmal fix meine IDE angeworfen und das Plugin etwas aufpoliert, so dass ich es nun hier im Blog zum Download anbieten kann. VG Was…? Erfahrungsgemäß ist die VG Wort vielen kein Begriff. Deshalb möchte ich an dieser Stelle ein paar Worte darüber verlieren.

Warum responsive Webseiten besser ranken (sollten)

Kurz vorweg: Zu der Idee, heute Morgen einen Artikel über Suchmaschinenoptimierung und Responsive Webdesign zu schreiben, bin ich durch den neuen OnlineRadar 2.0 gekommen. Der Podcast von Kai Spriestersbach und Eric Kubitz feierte vor wenigen Tagen auf Radio4SEO Premiere beziehungsweise Relaunch – absolut empfehlenswert. In einem Abschnitt gingen die beiden Experten auf das Thema Mobile und Responsive ein, welches ich an dieser Stelle auch behandeln möchte.

Rich Snippets: Neues Mekka für SEOs – Teil 1

Für Suchmaschinenoptimierer war es 2011 ein interessantes Thema, ich glaube 2012 wird es noch heißer. Die Rede ist von den sogenannten Rich Snippets. HTML-Mikroformate, die die Google Serps ordentlich aufpolieren können. Die Vielzahl der Möglichkeiten ist bereits heute groß: Vorschaubilder, Eventdaten, Produktinformationen oder Nutzerbewertungen; es lassen sich allerlei Informationen in die Google Suchergebnisse bringen. Rich Snippets gelten genau wie die Meta-Description als indirekte Optimierung.

Fenster per jQuery & HTML5 Teil 2: Es kommt Bewegung ins Spiel

Im letzten und außerdem ersten Teil der Mini-Artikelserie Fenster per jQuery & HTML5 haben wir ein Grundgerüst des Fensters mit Hilfe von HTML5 und CSS3 entwickelt. Wer diesen Artikel noch nicht gelesen oder den Quellcode nicht mehr parat hat, sollte den ersten Teil unbedingt nochmals überfliegen. Denn dort werden bereits die grundlegenden Basics für die Verwendung unserer Fenstertechnologie gelegt. Im heutigen Teil möchten wir nun endlich die versprochene Bewegung mit ins Spiel bringen.

HTML5 Geolocation API: Standort in Google Maps anzeigen

Nachdem ich vor einigen Tagen die neuen HTML5 Formulare vorgestellt habe, soll es heute um ein weiteres Spielzeug aus der großen bunten HTML5-Spielzeugkiste gehen. Gegenstand unserer Begierde ist die neue Javascript Gelocation API, mit der sich ziemlich exakt der Standort eines Besuchers ermitteln lässt. Dies funktioniert bereits in fast allen modernen Browsern und lässt sich somit bereits heute optional nutzen.

Tipp für die ersten Kunden: Bindung schaffen

Der heutige Artikel stellt meinen Beitrag bei der aktuellen Blogparade auf Selbständig im Netz dar. Diesmal hat sich Peer ein spannendes Thema herausgesucht, nämlich Tipps für die ersten Kunden. Viele starten motiviert in die Selbständigkeit, stellen dann aber schnell fest, dass die Kunden ausbleiben. Was auf dem Papier exakt ausgearbeitet war und felsenfest sitzen sollte, stellt sich in der Realität häufig als viel zu optimistische Zielsetzung heraus. Dies gilt sowohl für Offline-, als auch für Online-Anbieter.

Video-Tutorial: 5 CSS3-Tricks die du vielleicht noch nicht kennst

Da das gestrige und erste Video-Tutorial Einfacher AJAX-Request mit Hilfe von jQuery laut den Blogkommentaren doch besser ankam als ich dachte, habe ich mich entschlossen, dass Video-Bloggen weiter zu verfolgen und in Zukunft regelmäßig Video-Tutorials auf meinem Blog zu veröffentlichen. Auf meinen Streifzügen durchs Web fallen mir immer mal wieder CSS3-Eigenschaften auf, die man regelmäßig wiederfindet. Dazu gehören beispielweise border-radius, um Elemente abzurunden, oder box-shadow, um einen Schlagschatten zu definieren.

Ladezeit: Facebook Like-Button per jQuery nachladen

Vor wenigen Tagen flog ein Tweet von Herrn Kratz (@karlkratz) durch meine Twitter-Timeline, in dem es hieß: „Der Facbook #like Button ist PageSpeed-technisch eine echte Wutz. :-(„. Diese Aussage konnte ich auf Grund meiner eigenen gemachten Erfahrungen nur bestätigen. Obwohl sich die Ladezeiten mit der neuen fbml-Methode gegenüber der alten iframe-Methode schon gebessert haben, wird dem Benutzer weiterhin suggeriert, die Webseite befindet sich in einem Ladezustand. Zum Beispiel verhaart der Cursor so lange im Ladezustand und auch in Browsern mit Fußleiste (z.B.

Mein Einstieg ins Affiliate Marketing

Bei mir lief es folgendermaßen ab: Als ich ungefähr die ersten 1.000 Besucher im Monat auf meiner Webseite hatte, war die Versuchung groß. Erfahrungsberichte von gestandenen Online-Profis – vor allem jene von Peer Wandiger – machten Lust auf das große Geld verdienen im Internet. Obwohl mir damals nur Googles AdSense ein Begriff war, schienen die Möglichkeiten gigantisch. Artikel schreiben, massig Traffic abgreifen, ein bis zwei AdSense Banner einbauen, Geld kassieren – total simpel. Natürlich musste ich schnell feststellen, dass es so einfach nicht funktioniert.

Call-to-Action-Button per CSS3

Der Call-to-Action-Button oder das Call-to-Action-Element ist ein Schlüsselfaktor im erfolgreichen Online-Marketing. Experten messen diesem Element eine entscheidende Rolle im Hinblick auf die Konversion-Rate bei. Ganz einfach ausgedrückt bedeutet das: Ist das Call-to-Action-Element gut gestaltet, wird mehr verkauft. Auch im Affiliate-Marketing ist es deshalb wichtig, dem Call-to-Action-Button auffällig und prominent zu gestalten.

Video-Tutorial: HTML-Listen per jQuery UI sortierbar machen

Im Video-Tutorial Einfacher AJAX-Request mit Hilfe von jQuery hatten wir bereits das beliebte Javascript-Framework im Einsatz. Heute ist es natürlich wieder mit an Bord, wenn auch die Erweiterung jQuery UI das eigentliche Objekt unserer Begierde ist. Im heutigen Tutorial soll es darum gehen, eine einfache unformatierte HTML-Liste (<ul><li></li></ul>) für den Benutzer sortierbar zu machen. Das bedeutet, die Einträge bleiben nicht in ihrer ursprünglichen Sortierung erhalten, sondern der Nutzer kann das letzte Element an die erste Position schieben und umgekehrt.

Video-Tutorial: Einfacher AJAX-Request mit Hilfe von jQuery

Für das CMS fokus nehme ich zur Zeit einige technische Tutorials auf. Per Screencasting-Software zeige ich beispielsweise, wie man Templates erstellt oder mit den komplexen Dokumentenklassen umgehen sollte. Da mir diese Arbeit sehr viel Spaß bereit – aber auch enorme Übung erfordert – habe ich mir gedacht, warum nicht auch mal ein Video-Tutorial für diesen Blog erstellen? Gesagt getan: Für den Anfang habe ich mir ein Thema vorgenommen, welches hier im Blog bereits in einer eigenen Artikelserie behandelt wurde.

Neue Google+ Kommentarfunktion einbauen

Facebook bietet dieses Features schon lange an: Ein Widget per iframe auf der eigenen Seite einbauen, dass dann im bekannten Facebook-Stil ein Kommentieren über die eigene Webseite ermöglicht und die Kommentare auf Wunsch auch gleich noch den Freunden mitteilt. Auch Google+ zieht nun nach und hat seinen Dienst „Blogger“ mit einer ähnlichen Funktion ausgestattet. Google schreibt dazu folgendes: Eure Blog-Leser haben nun die Möglichkeit, ihre Kommentare für alle oder nur für ihre Kreise auf Google+ zu veröffentlichen.

Website Speed: Bilder & Icons durch Sprites optimieren

In der Welt der Webentwickler ist es eines der Trending Topics dieses Jahres: Website Speed. Kaum ein anderes Thema erlebt in Zeiten der zunehmenden Breidband-Zugänge eine so starke Renaissance wie die Optimierung von Webseiten auf eine kürzere Ladezeit. Der Anstoß zum Speed-Wahn kam dabei aus einer ganz anderen Ecke: Im Frühling 2010 entschied sich Google dafür, Page Speed zum Rankingfaktor zu machen.

Google Web Fonts – für mehr Abwechslung im Web

Das Web Fonts Projekt von Google ist mittlerweile schon länger online, dennoch habe ich den Eindruck, dass viele Webdesigner und -entwickler diese Möglichkeit zur Verwendung externer Schriftarten auf der eigenen Webseite noch nicht kennen. Dabei bieten sowohl die angeboten Fonts als auch die Art der Verwendung & Einbettung diverse Vorteile gegenüber klassischen Varianten. Der Hintergrund Eine gefühlte Ewigkeit war man als Webentwickler darauf angewiesen, sich auf die bestehenden Standard-Fonts bei der Umsetzung einer Webseite zu verlassen.