Das Design 2014

Für einige ist es vielleicht recht langweilig über das neue Design eines Blogs oder einer Webseite zu lesen, dazu kommt das sich das Design nicht grundlegend geändert hat. Ich möchte aber trotzdem auf die kleinen Dinge hinweisen, einige wundern sich vielleicht was und vor allem warum sich etwas geändert hat. Dieser Post hier versucht also das Warum zu beantworten und als Notiz für mich was sich alles geändert hat.

Zugegeben, für 2014 ist das Design recht spät dran, aber gute Dinge brauchen ja meist etwas um zu reifen.

Ich habe mit dem Design wieder versucht Punkte die mir wichtig sind für einen Blog einzuhalten. Dazu zählen:

  • Gute Lesbarkeit
  • Performance der Seite
  • Datenschutz, Requests

Ich habe also nicht alles grundlegend überarbeitet, sondern in einigen Teilen verbessert und kleinere aber mir wichtige Änderungen umgesetzt.

Lesbarkeit

Lesbarkeit der Seite ist mir am wichtigsten. Auch ich achte bei anderen Blogs die ich lese darauf. Es gibt zwar mittlerweile in den meisten Browsern einen Readability View aber, wenn möglich versuche ich diesen zu vermeiden1. Ich denke mir ist auch hier ein Design gelungen, welches nicht zwingend durch einen Readability View leichter zu lesen ist.

Lesbarkeit geht of auch einher mit Performance, Datenschutz usw. Auch die nachfolgenden Punkte haben irgendwie alle etwas mit Lesbarkeit zu tun, hängen aber alle voneinander ab.

Typographie

Die Schriftarten die ich nun verwende haben sich auch verändert. Mir hat zwar Open Sans als Textschrift gefallen, eine Serif-Schrift gefällt mir aber nach Tests immer noch am besten. Somit habe ich mich für die Überschriften, Navigation usw. für eine Serif-lose Schrift entschieden, den Text der Artikel aber in einer Serif-Schrift gefasst.
Bei Schriften und deren Auswahl kann man schnell sehr viel Zeit verlieren und es gibt zig Variationen, ich denke aber das eine Serif-Schrift auch am Bildschirm besser zu lesen ist.

Das alte Design verwendete das Google Fonts-Verzeichnis, somit wurden bei jedem Request auch Daten an Google gesendet und die Schriften geladen. Beim neuen Design passiert das nicht mehr. Die Webseite liefert die Schriften nun direkt, das führt zwar zu mehr Datenvolumen bei mir, aber die Anfragen an Google konnte ich somit unterbinden.

Die Schriftgröße habe ich ebenfalls leicht angepasst, diese sollte nun auf allen Geräten und Auflösungen gut skalieren, hier gab es im alten Design bei kleineren Auflösungen ein paar Probleme.

Performance

Wichtig war mir auch die Performance der Seite. Ich habe lang probiert was ich optimieren kann und bin zu dem Entschluss gekommen, die Index Seite des Blogs die einfach die größte Seite ist umzugestalten.

Vorher wurden immer die letzten 10 Artikel einer Seite komplett geladen und dargestellt, dazu gab es noch die sogenannte Paging-Funktion um auf die nächste Seite mit weiteren 10 Artikeln zu blättern. Laut Statistik haben das nur ca. 3-5% der Leser des Blogs benutzt.
Die Landing-Page zeigt nun nur noch den aktuellen Blog-Post komplett an, die anderen 9 werden als Zusammenfassung darunter angezeigt. Auch die Paging-Funktion ist weg, dafür gibt es das Archiv über das komfortabel alle Beiträge wie bisher auch erreicht werden können.

Diese Änderungen zusammen mit Schriften usw führen nun dazu das die Landing-Page in ihrer Größe um ca. 60% geschrumpft ist, das hilft allen weiter. Besonders auf mobilen Geräten lädt die Seite nun deutlich schneller. Auch wenn die Drossel eures Mobilfunk-Vertrages aktiviert wird sollte nun ein gutes Ergebnis geliefert werden.

Datenschutz, Requests

Wie oben bereits erwähnt, habe ich auch auf den Datenschutz wert gelegt. Die Seite verzichtet nun auf alle Anfragen die in Richtung Google gehen, keine Skripte, Fonts usw. werden von dort geladen. Google Analytics habe ich hier auch vorher schon nicht genutzt. Dafür verwende ich GoSquared wie bisher auch. Ohne diesen Service auch keine Statistiken die mir helfen die Seite weiterhin zu verbessern.
Externe Javascripts von CDN werden ebenfalls nicht mehr geladen so das alles direkt vom Server hier geladen wird. Dieser hängt allerdings hinter einem Cloudflare CDN und somit gehen auch weiterhin einige Requests direkt dorthin. Das hilft mir aber das Datenvolumen bei Heroku meinem Hoster für die Seite gering zu halten.

Kommentare

Die Kommentarfunktion die ich in den letzten 6 Monaten habe mitlaufen lassen, habe ich wieder deaktiviert. Es wurde einfach zu wenig benutzt. Die Implementierung des 2 war nicht ausreichend und somit gibt es hier keine Kommentare mehr. Wer Informationen, Diskussionen und Anregungen für mich hat kann mich über die Kontakt-Seite erreichen. Zusätzlich dazu kann auch gern in den sozialen Netzwerken zu meinen Beiträgen diskutiert werden.

Fazit

Wie am Anfang angekündigt, ein langweiliger Posts für die meisten. Ich habe viel Wert darauf gelegt eben auch die kleinen Dinge, die ich nicht direkt erwähnt habe anzufassen und zu verbessern. Das Ergebnis kann sich aber denke ich sehen lassen. Für Feedback und Anregungen bin ich über die Kontakt-Seite jederzeit erreichbar.


  1. Meist fehlen Bilder oder es wird der Beitrag nicht korrekt dargestellt. Außerdem problematisch bei Posts über mehrere Seiten. [return]
  2. Ein Kommentar-System auf Basis von App.net Posts. [return]