David Hellmann

x

Ahoi!

Schreib was dir auf dem Herzen liegt oder was auch immer sonst du mir mitteilen willst. Du hast die Wahl, entweder per supercoolem Kontaktformular oder ganz klassisch per E-Mail — Beides kommt ganz sicher bei mir an und wird natürlich auch beantwortet. Ich freue mich auf Deine Nachricht!

David Hellmann
Köln, Deutschland
Website / E-Mail

Relaunch… und noch ein paar Zeilen dazu! 17. November 2012

Category: News17 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: 5116 — Heute: 3

17 comments

  1. 1

    Dave

    am 17.11.2012 um 11:29

    Gefä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

  2. 2

    Neogine

    am 17.11.2012 um 12:13

    Sehr 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

  3. 3

    Sascha Fuchs

    am 17.11.2012 um 13:38

    Glü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

  4. 4

    Vincent

    am 17.11.2012 um 14:44

    Gefällt mir auch sehr gut.

    Diesen Kommentar zitieren

  5. 5

    David Hellmann

    am 17.11.2012 um 19:24

    Ich sollte öfters Nachts um fünf Artikel schreiben :D

    Diesen Kommentar zitieren

  6. 6

    Bruno L.

    am 18.11.2012 um 2:40

    I love your work. Congratulations from Spain!

    Diesen Kommentar zitieren

  7. 7

    David Hellmann

    am 18.11.2012 um 2:41

    Zitat Bruno L. :

    I love your work. Congratulations from Spain!

    Thanks mate!

    Diesen Kommentar zitieren

  8. 8

    Reinhard

    am 20.11.2012 um 0:47

    Finde deine neue Seite sehr gelungen! Weiter so. Bin neugierig wie lange dieses Design hält;)

    Diesen Kommentar zitieren

  9. 9

    David Hellmann

    am 20.11.2012 um 9:22

    Zitat Reinhard :

    Finde deine neue Seite sehr gelungen! Weiter so. Bin neugierig wie lange dieses Design hält;)

    Danke. Das bin ich auch jedes mal wieder : )

    Diesen Kommentar zitieren

  10. 10

    kuschti

    am 20.11.2012 um 9:42

    Gibst du noch Preis welche Icon-Font du nutzt?

    Diesen Kommentar zitieren

  11. 11

    dissertation writing services

    am 22.11.2012 um 6:11

    Das 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

  12. 12

    Bjoern

    am 22.11.2012 um 10:37

    Wow, responsive, minimal und sehr schick.

    Und die Kommentare hauen mich um, so schön hab ich noch nie kommentiert ;-)

    Diesen Kommentar zitieren

  13. 13

    David Hellmann

    am 22.11.2012 um 14:59

    Zitat kuschti :

    Gibst du noch Preis welche Icon-Font du nutzt?

    Sorry überlesen :)
    http://foek.li/TW455S

    Diesen Kommentar zitieren

  14. 14

    David Hellmann

    am 22.11.2012 um 15:00

    Zitat Bjoern :

    Wow, responsive, minimal und sehr schick.

    Und die Kommentare hauen mich um, so schön hab ich noch nie kommentiert ;-)

    hehehe!!! : )

    Diesen Kommentar zitieren

  15. 15

    Nick

    am 25.11.2012 um 5:03

    Ich 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

  16. 16

    Karl

    am 28.11.2012 um 16:35

    Hallo 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

  17. 17

    Timo

    am 30.11.2012 um 13:28

    Servus 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


instagram

twitter

tumblr

dribbble

facebook

google+

foursquare