Wow, das hätte ich jetzt selber nicht gedacht, aber der letzte große Relaunch der Best Website Gallery (auch bekannt als MakeBetterWebsites) ist dann doch schon knapp drei Jahre her. Zwar wurde hier und da immer mal wieder dran geschraubt, aber viel getan hat sich seit dem nichts… Bis jetzt!

Der letzte Relaunch 2012 (I do it so often… Relaunch Make Better Websites!) killte ein paar Features und so sollte es auch bei diesem sein. Dafür kam aber auch ein neues hinzu, was mir sehr gefällt und auch viel bringt.

Keine Bewertung mehr

Auf jeder Seite kennt man es ja. Likes, Daumen, Sterne und was auch immer es noch gibt. Irgendwo klebt immer ein Button der zum klicken einlädt, um zu zeigen das einem etwas gefällt. Viele Jahre gab es das auch hier doch das hat nun ein Ende. Ein Grund warum es die Herzchen gab ist ziemlich einfach erklärt. Es gab sofort beim Besuch immer ein klein wenig Feedback, dass irgendwas los ist auf der Seite. Das jetzt aber auch eher für mich. Klar, Google Analytics läuft hier auch mit, aber wenn ich ehrlich bin, schaue ich hier eher selten rein.

Letztendlich hab ich mich gegen Herzchen entschieden und kann damit bis jetzt gut leben. Weniger ist mehr!

Suche leichter zu erreichen

In erster Linie fülle ich die Seite für mich mit Inhalt. Mag egoistisch klingen, aber im Grunde ist es so und das ist auch ganz einfach zu erklären. Das Web ist bunt und es gibt viel zu sehen und wie merkt man sich Sachen am besten? Wenn man sie sich abspeichert. Eine Seite zu sehen ist das eine. Doch ein paar Screenshots davon zu machen und sich ein paar Minuten damit zu befassen ist das andere. Ich meinem Kopf sind verdammt viele von den Seiten abgespeichert. Es kommt nicht selten vor, dass mich jemand nach einer bestimmten Website fragt. Oft genügt ein kleiner Hinweis zur Seite und ich finde Sie wieder bzw. kann mich auch an sie erinnern.

In der Version vor dieser war die Suche versteckt, man musste erst einmal klicken um sie zu erreichen. Ein klick ist ja immer verdammt viel Aufwand deswegen ist die Suche jetzt schon direkt in der Sticky Leiste zu erreichen. Irgendwann verschwindet sie war wieder in die Navi, aber das ist OK. Wenn ich Suche dann ist das meist eh auf einem iMac / MacBook.

Sharing Leiste nun Sticky am unteren Rand

Auch wenn ich die Seite zu großen Teilen für mich mache, freue ich mich natürlich wenn Sachen die hier zu sehen sind auch weiter geteilt werden. Bisher waren die Sharing Links immer am Ende eines Beitrags und von den meisten wurden sie wohl übersehen bzw. gar nicht erreicht. Das hat sich mit der Sticky Leiste am unteren Rand nun geändert. Happy Sharing!

Screenshots! Screenshots! Screenshots!

Als ich damals anfing, waren die Bilder 600x200 Pixel groß. Das war das Vorschaubild und mehr gab es auch nicht. Heute ist das Vorschau Bild 1280x800 Pixel groß. Die Fläche hat sich somit fast verzehnfacht. Mir war damals wie heute wichtig, dass die Vorschaubilder schon Aussagekraft besitzen. Ähnliche Seiten die mit winzig kleinen Vorschaubildern arbeiteten mochte ich nicht. Oft war man nach einem klick auf die Seite enttäuscht oder es kam erst gar nicht zu dem klick.

Weiterhin gibt es jetzt seit ein paar Monaten schon größere Bilder in der Beitrags-Detailansicht. Man sieht jetzt nicht mehr nur einen kleinen Ausschnitt der Seite sondern die ganze Seite und oft auch die ganzen Unterseiten. Das ganze dann noch in verschiedenen Auflösungen um das responsive Verhalten zu zeigen. Die erste Seite wo die komplette Website abgebildet wurde war Semplice. Auch hier bin ich gerade überrascht, dass das schon wieder sieben Monate her ist.

Ein Beispiel wie viel das dann werden kann findet man bei Degordian, wo es gleich mal zwanzig Screenshots wurden. Unter jedem Screenshot ist auch ein Button um ihn in voller Größe (neuer Tab) zu sehen.

Warum die Mühe? Oft war es so, dass man eine Website noch mal anschauen wollte. Teilweise auch nur einen kleinen Teil von ihr. Doch nicht selten kam es vor, dass die Website nicht mehr online war oder es einen Relaunch gegeben hat. Dem will ich mit den ganzen Screenshots entgegen wirken. Klar ist der Aufwand nun deutlich höher als es vor ein paar Monaten noch war. Doch es lohnt sich für mich und auch für euch, die sich die Sachen anschauen.

Mobile First! Flexbox und etwas natives Feeling.

Endlich hat es mal geklappt eine Website komplett Mobile First umzusetzen. Lang hatte ich mir das vorgenommen doch irgendwie kam es nie dazu. Bisher hatte ich immer alles Top down gemacht. Also beginnend beim größten Viewport und endend beim kleinsten.

War eine gute Erfahrung und ich denke ich werde das nun öfters so machen. Ist ja auch der heiße Scheiß ;) Was ich auch erreichen wollte war, dass sich die Site etwas nativer anfühlt. Aus meiner Sicht ist das schon ganz gut gelungen. Hover Effekte kommen erst ab >= 768px ins Spiel was das ganze auf dem Smartphone bzw. generell dem Touchdevice etwas ruhiger macht. Nein, ich habe nicht speziell Touchdevices abgefragt sondern das nach Auflösung gemacht. Das andere wäre natürlich auch gegangen.

Es ist auch die erste Website wo ich mal wirklich Flexbox etwas einsetzen konnte. Das ganze fühlt sich sehr ungewohnt an, aber ist schon ganz geil. Auf alte Browser gebe ich recht wenig von daher konnte ich das hier mit ruhigem Gewissen machen. Macht viele Dinge auf jeden Fall einfacher. Noch ein paar mal nutzen bis es dann auch in Fleisch und Blut übergegangen ist, hoffentlich.

Filter etc. wurde alles hinter einem Navi-(Burger)Button versteckt. Mehr braucht es hier auch nicht und man kommt sofort an alles ran.

Um das ganze jetzt hier zu beenden noch ein paar Screenshots. Sonst einfach mal vorbeischauen: http://bestwebsite.gallery…

Best Website Gallery — Relaunch nach drei Jahren, nanu?!