Category: News — 17 Comments
Da ist es mal wieder passiert — ein kleiner Relaunch meiner Seite hier. Die Homies die hier lesen werden sicher wissen, dass es nicht unnormal ist, dass die Seite von Zeit zu Zeit neu gemacht wird. Meistens passiert das, weil irgendwas an der alten Seite stört oder ich mich einfach satt gesehen habe. Manchmal hält es ein Design länger durch aber es kann auch schon mal schnell gehen. Das vorhergehende hat es glaub immerhin über sechs Monate geschafft, Respekt! Was mich darn störte? Es waren relativ viele und auch große Grafiken im Einsatz. Auch so war es ziemlich voll gepackt. Das neue Design sollte etwas einfacher werden und die Seite generell etwas aufgeräumter und übersichtlicher. Das sollte geklappt haben, jeden Falls aus meiner Sicht. Wer das anders sieht darf sich natürlich gern äußern ;)
Was sollte genau anders werden
Generell gesagt: weniger ist mehr!
Startseite
Der Portfolio part ist wieder etwas prominenter jetzt. Aber es wird jetzt auch nur noch das letzte Projekt angezeigt und nicht mehr fünf wie bei der letzten Seite. Hier sollte einfach die Spielerei rausfliegen (Tooltips etc.) und die Darstellung klarer werden.
Die letzte drei Artikel haben nun auch etwas mehr Luft bekommen und die Artikel aus der Kategorie "Empfehlungen" verlinken jetzt erstmal in die Detailansicht und nicht mehr direkt auf die externe Website. Könnte den ein oder anderen vielleicht etwas verwirrt haben.
Blog Bereich
Im Blog sollte der Inhalt mehr in den Vordergrund rücken und das Design etwas zurückgenommen werden. Heißt im konkret, dass die Blog-Übersicht deutlich vereinfacht wurde. Viel mehr im sichtbaren Bereich und generell eher eine Liste die man deutlich besser Überblicken kann als bisher. Das Suchfeld drüber ist geblieben da suchen ein immer beliebteres Navigationsmittel ist sollte man dieses auch prominent platzieren. Unter der Liste finden sich die Kategorien. Diese sind wie auch schon vorher eher zurückgenommen da ich denke das diese nicht sonderlich wichtig sind. Der Blog wird eher bei aktuellen Sachen gelesen was heißt, dass wenn ich etwas publiziere die Leute über die sozialen Kanäle hier landen. Später werden diese dann eher über Google oder Verlinkungen den weg hier her finden. Auch gehe ich hier natürlich von mir aus wie ich andere Blogs lese bzw. diese navigiere. Die Suche ist mir deutlich wichtiger und meist auch schneller Zielführend als mich durch Kategorien zu klicken. Soweit so gut.
Artikel mit Tags versehen mache ich schon lange nicht mehr. Irgendwie ist das ganze in meinen Augen eher nutzlos da auch hier wieder die Suche ähnlich effektiv sein sollte wie sich durch Tags zu kämpfen. Auch ist es wieder eine Meta-Info die gezeigt werden möchte. Aber es sollte ja reduziert werden. Gegenstimmen? Nein? Danke!
Der Rest ist im Blog recht gleich geblieben. Textblöcke mit wenig Satzlänge, relativ große Typo und natürlich große Bilder. Never change... na ihr wisst schon!
Der Rest der Website
Hier ist vieles gleich geblieben. Rausgeflogen sind die Dribbble-Shots die zwar nett waren aber dennoch weichen mussten. Sagte ich es schon? Weniger ist mehr! About, Contact & Portfolio sind wirklich nahezu gleich geblieben. Hier sah ich keinen Grund etwas zu ändern. Es geht mir bei meiner Seite nicht um Fancy Effekt oder jeden Trend schnellstmöglich hier unter zu bringen. Es soll eine Visitenkarte sein meine Ansicht einer guten Website widerspiegeln.
Responsive — Natürlich!
Ein bisschen Trend muss dann schon sein, haha. Auch diesmal ist die Seite wieder komplett Responsive. Von 1200px Breite geht es runter bis auf Smartphone-Hochformat-Größe und das sollte auch ganz gut klappen. Natürlich hab ich keine Scharr an Testgeräten hier. Interessiert mich auch nicht wirklich. Meine Seite, meine Hausordnung. Aber im Ernst, wer Bugs findet darf diese mir gern mitteilen und ich versuche diese dann auch zu beheben. IE Optimierung mache ich aber nicht!!! Ehrlich gesagt hab ich das auch schon lang nicht mehr. Der IE9 & IE10 sollten das hier schon alles ganz sauber darstellen. Das was da drunter passiert ist mir letztendlich egal. Die Zielgruppe der Seite hier wird aber meisten schon auf den moderneren Browsern dieser Welt unterwegs sein und von daher wird es hier wenig Probleme geben.
So, genug geschrieben dazu! Ach ja, das erste mal kam eine Icon-Font zum Einsatz. GEILER SCHEISS!!!
Meine PSD-Datei zum aktuellen Design
Schnell in den Browser wechseln!
Gestern war ein ganz guter Artikel dazu im Design Tagebuch: Responsive Webdesign – Eine Herausforderung für Webdesigner zu lesen. Ich bin auch der Meinung das man viel schneller in den Dummy / Entwicklungsmodus wechseln muss um ein Design zu fühlen. Gerade beim Thema Responsive Webdesign ist das wichtiger den je. Natürlich sollte man hier auch nicht übertreiben denn umso eher man sein Layout Programm verlässt desto mehr besteht die Gefahr das man sich im Design einschränkt. Aber auch der Weg, dass man jede Unterseite einer Website komplett in Photoshop (Pixel Perfect) erarbeitet ist wohl etwas überholt. Problem ist wohl hier eher der Designer bzw. das Team das die Website erarbeitet als vielmehr der Kunde. Er ist es gewöhnt jede Seite — mit einigen Korrekturschleifen — als Bilddatei zu sehen, zu beurteilen und dort wieder Änderungswünsche umsetzen zu lassen. Das ist so gelernt und wird seit Jahren so gehandhabt und wird es wohl auch weiterhin werden. Einen Vorwurf kann man hier nicht machen. Glück hat man natürlich, wenn der Kunde selbst an solch einem Vorgehen interessiert ist. Hier bleibt abzuwarten wie sehr sich die Kunden hier erziehen lassen um solch ein Vorgehen öfters einsetzen zu können. Natürlich ist diese Art des Arbeitens auch keine die man immer und überall einsetzen kann. Aber doch deutlich mehr als man das aktuell macht.
Die Kurve zurück zu meiner PSD-Datei. Wie man sieht ist nicht all so viel passiert. Natürlich muss man auch sagen, dass die Seite von mir in vielen Bereich weitestgehend übernommen wurde und hier nicht viel angepasst wurde. Aber die PSD war für mich in diesem Fall und auch in vielen anderen einfach nur eine Datei die mir so grob die Richtung vorgeben sollte. Es gibt dann immer einen Punkt X wo ich sage: "Jetzt geht's ans HTML" und ab dann wird das meiste direkt im Browser gemacht. Hier wird dann nur noch Photoshop geöffnet um Grafiken zu produzieren die gebraucht werden. Das vorgehen erfordert natürlich eine gewisse Vorstellung was am Ende heraus kommen soll. Es gibt dann auch das ein oder andere Element oder Bereich wo das nicht mehr so klar ist dann geht man wieder in Photoshop und erarbeitet dort eine Lösung. Das muss auch wieder nicht bis zum bitteren Ende passieren. Das vorgehen bleibt das gleiche. Sobald klar ist was am Ende dabei raus kommen soll wird wieder in den HTML Modus gewechselt.
Die Vorteile liegen für mich klar auf der Hand:
- zeitsparend!
- das Design wird fühlbar. Ein statischer Screen ist nett anzuschauen aber das ganze im Browser zu sehen unter "realen" Bedingungen ist etwas ganz anderes
- responsive Sachen kann man schlecht auf statischen Screens darstellen. Natürlich kann man verschiedene Versionen gestalten (z.B. Smartphone- & Tablet-Ansicht) aber letztendlich bleibt es statisch.
- Fluide Layouts muss man an Hand von Dummys testen. Hier lassen sich sicher Regeln festlegen wie etwas auszusehen hat wenn Ausgabegerät X mit Auflösung Y im Einsatz ist. Doch 100% passen wird das letztendlich nicht. Hier muss am Dummy probiert und angepasst werden.
- Designer & Entwickler arbeiten viel eher viel enger zusammen. Kein Wasserfall-Prinzip nach dem Motte: Hier sind die Designs, mach du mal das HTML. Durch das engere Zusammenarbeiten sind beide Parteien auch auf gleichem Stand und können Probleme schneller erkennen bzw. diese lösen.
So, weitermachen oder einen Kommentar hinterlassen. Auswahl... nervig oder? :)
Gelesen: 2488 — Heute: 8
17 comments
Dave
am 17.11.2012 um 11:29Gefällt mir sehr gut! Danke auch für die praxisbezogenen Überlegungen zum Thema Responsive Design! Das ist bei mir das nächste, große anzugehende Thema.
Diesen Kommentar zitieren
Neogine
am 17.11.2012 um 12:13Sehr schön geworden alles, eben halt wie aus einem Guss. Beschäftige mich gerade ach ein wenig mit “Responsive Webdesign”. Schweinearbeit… die sich aber lohnt.
Hau rein!
Diesen Kommentar zitieren
Sascha Fuchs
am 17.11.2012 um 13:38Glückwunsch zur “neuen” Seite – in deinem Alter hab ich auch die Designs auch alle Nase lang geändert und war happy wenn ich mal sechs Monate durchgehalten habe ohne zu fummeln. Derzeit hab ich aber nicht mal eine eigene Zeit fehlt :)
Zum Thema PS, ich denke da genauso. Die Zeiten wo man in Photoshop das gesamte Design definiert hat und das auf den Pixel genau sind einfach vorbei. Der Kunde bekommt das mögliche Design per Screen. Der Sagt “Ist schön” und kaum hat man bei der Umsetzung etwas vorweisbares, wird der Kunde einen mit Feedback zuschütten das man fleissig am hin und her rudern ist. Heißt der Kunde braucht einfach etwas praktikables, Screenshots sind zu abstrakt und bei RWD wird es mit Screens noch schwieriger “Also sobald wir bei einer Breit von 768 Pixeln angelangt sind kommt dieses Layout” – “Wie?”
Photoshop ist daher ein Tool von vielen, ebenso wie Illustrator. Oft reicht ein einfaches Scribble oder ein Wireframe als grober Anhaltspunkt in der Entwicklung, Stilfragen bricht man auf die Elemente herunter. So kommt man recht zügig zum ersten Dummy, wozu sich der Kunde äußern kann und mit dem Dummy verfeinert man dann einfach weiter bis hin zur fertigen Webseite.
Diesen Kommentar zitieren
Vincent
am 17.11.2012 um 14:44Gefällt mir auch sehr gut.
Diesen Kommentar zitieren
David Hellmann
am 17.11.2012 um 19:24Ich sollte öfters Nachts um fünf Artikel schreiben :D
Diesen Kommentar zitieren
Bruno L.
am 18.11.2012 um 2:40I love your work. Congratulations from Spain!
Diesen Kommentar zitieren
David Hellmann
am 18.11.2012 um 2:41Zitat Bruno L. ↑:
Thanks mate!
Diesen Kommentar zitieren
Reinhard
am 20.11.2012 um 0:47Finde deine neue Seite sehr gelungen! Weiter so. Bin neugierig wie lange dieses Design hält;)
Diesen Kommentar zitieren
David Hellmann
am 20.11.2012 um 9:22Zitat Reinhard ↑:
Danke. Das bin ich auch jedes mal wieder : )
Diesen Kommentar zitieren
kuschti
am 20.11.2012 um 9:42Gibst du noch Preis welche Icon-Font du nutzt?
Diesen Kommentar zitieren
dissertation writing services
am 22.11.2012 um 6:11Das muss auch wieder nicht bis zum bitteren Ende passieren Es gibt dann auch das ein oder andere Element oder Bereich wo das nicht mehr so klar ist dann geht man wieder in Photoshop und erarbeitet dort eine Lösung.
Diesen Kommentar zitieren
Bjoern
am 22.11.2012 um 10:37Wow, responsive, minimal und sehr schick.
Und die Kommentare hauen mich um, so schön hab ich noch nie kommentiert ;-)
Diesen Kommentar zitieren
David Hellmann
am 22.11.2012 um 14:59Zitat kuschti ↑:
Sorry überlesen :)
http://foek.li/TW455S
Diesen Kommentar zitieren
David Hellmann
am 22.11.2012 um 15:00Zitat Bjoern ↑:
hehehe!!! : )
Diesen Kommentar zitieren
Nick
am 25.11.2012 um 5:03Ich bin absolut begeistert – hast mich total motiviert auch mal wieder was neues zu machen. Das Thema responsive beschäftigt mich sehr und will eingesetzt werden. Vielen Dank für die Links zu Design Tagebuch und den Iconfonts!
Diesen Kommentar zitieren
Karl
am 28.11.2012 um 16:35Hallo alle zusammen!
Also das B(L)OGT ja wirklich zu lesen :-)
Und ich sehe zwar nicht “anders” als du, äußer mich dennoch zum Design!
Mir gefallen die Farben, die “Buttons” unten mit der “Animation”
Wenn dein Ziel war die Seite aufgeräumt wirken zu lassen, kann ich
nicht sagen, im Vergleich zu vorher, da ich erst jetzt zu dir gestoßen bin.
Trotzdem würde ich sagen: Ziel ERFÜLLT!
Ich mag es :)
LG
Karl
Diesen Kommentar zitieren
Timo
am 30.11.2012 um 13:28Servus an alle!
Ich bin der Meinung das Veränderungen wichtig sind!
Man gewöhnt sich zu schnell an gewissen Dinge die man gern hat!
Und in diesem Fall wirst du sicher nicht nur deinen eigenen Geschmack getroffen haben!
Bin gespannt was noch kommt!
LG
Diesen Kommentar zitieren