Wie ihr fürs Web designt: “Lernt die Grundzüge von HTML und CSS.”

7. Mai 2015 von Sebastian Maier

Interview von Nicole van Meegen von NVM Kommunikationsdesign über ihre Vorgehensweise beim Designen fürs Web.

Das Insiderwissen der Profis: Hier kommt der nächste Teil unserer Interview-Reihe, in der wir Designer nach ihrer Arbeitsweise beim Webdesignen und nach ihren ganz persönlichen Ratschlägen befragen. Dieses Mal sprachen wir mit Nicole van Meegen von NVM Kommunikationsdesign.

Nicole van Meegen arbeitete nach ihrem Abschluss als Diplom-Kommunikationsdesignerin zunächst in einer Festanstellung, unter anderem als Junior Art Director. Seit Juli 2011 ist sie selbstständig tätig und gestaltet unter dem Namen NVM Kommunikationsdesign fürs Web und für Print.


Nicole van Meegen von NVM Kommunikationsdesign


Welche Software verwendest du und warum?
Ich habe (in Zeiten von nicht-responsivem Webdesign) lange mit Photoshop gearbeitet. Zum Beginn der „responsiven“ Zeit habe ich dann Illustrator verwendet, weil ich dort alle Layoutansichten nebeneinander auf eigenen Arbeitsflächen platzieren konnte. Es ist mir sehr wichtig, ständig alle Größen (Desktop, Tablet, Smartphone) gleichzeitig betrachten zu können. So kann man vergleichen und relativ schnell anpassen.

Mittlerweile bin ich jedoch dazu übergegangen, InDesign für meine Weblayouts zu verwenden. Vor der Programmierung stelle ich Farbcodes und alle nötigen Grafiken zusammen, sodass sich der Programmierer ansonsten an einer Layout-PDF orientieren kann. Für meine Layouts habe ich mir eine InDesign-Bibliothek mit allen wiederkehrenden Elementen wie Dropdowns, Dummys für Headlinestrukturen u.s.w. zusammengestellt. Ich finde die Handhabung von InDesign viel angenehmer als die von Illustrator. Die Verwaltung von Typo-Formatvorlagen und Farben ist übersichtlicher.


Was ist für dich der Hauptunterschied zwischen einem Design für Print und einem für Web?
Der Hauptunterschied ist die Flexibilität. Im Printdesign hat jedes Layoutelement eine feste Position, die unverrückbar so bleibt. Im responsiven Webdesign gibt es zwar ein Raster und Referenzgrößen für alle Elemente, aber das Layout „fließt“ und passt sich jedem Gerät neu an. Webdesign ist somit viel einfacher zu aktualisieren.


Wo bekommst du deine Inspirationen her?
Da ich für verschiedenste Branchen arbeite, ziehe ich meine Inspiration vor allem aus der Vielfältigkeit der Tätigkeiten. Da bekommt man zum Beispiel während der Arbeit für ein Restaurant neue Ideen für einen Kunden aus der Personalbranche und umgekehrt. Die Gedanken richten sich ständig neu aus und Projekte bereichern sich gegenseitig. Weitere Inspirationsquellen sind natürlich verschiedene Newsletter, in denen Layouts vorgestellt werden, sowie Beispiele, die man in den unterschiedlichsten Medien findet – mal zielgerichtet, mal zufällig.


Was gefällt dir an Webdesign am meisten?
Am meisten liebe ich es, wenn mein Webdesign letztendlich vom Programmierer umgesetzt wurde und online geht. Vor allem die optische Wirkung auf den aktuellen mobilen Endgeräten finde ich immer wieder klasse. Außerdem sind Webdesigns – wie oben schon beschrieben – viel flexibler und lebendiger als Printprodukte.


Welchen Stil/Trend findest du momentan besonders schön?
Mir gefällt momentan der Mix aus Flat-Design und Elementen, die mehr Tiefenwirkung haben. Eine Kombination aus beidem wirkt einerseits sauber und aufgeräumt  – die Elemente mit Tiefenwirkung machen das Ganze dann wieder dynamisch und offener. Die Ruhe im Layout bleibt aber erhalten und der Leser wird nicht durch eine zu pompöse Gestaltung vom Inhalt abgelenkt.


Worauf kommt es dir bei Webdesign am meisten an? Was findest du am wichtigsten?
Mir ist es sehr wichtig, dass die Nutzerführung nicht unter aktuellen Trends leidet. Viele neue Weblayouts, die man heute findet, sind sehr großzügig und wirken rein optisch auf den ersten Blick attraktiv. Aber häufig wird der gesamte obere Teil einer Website von (oftmals aussagearmem) Bildmaterial und wenig aussagekräftigen Slogans dominiert. Man sitzt davor und denkt sich: „Ja... und was bietet mir diese Firma nun?“.

Ich finde es falsch, auf Teufel komm raus die neuen Trends mit großen Videos, Slogans, JavaScript-Effekten u.s.w. umzusetzen, wenn der Nutzer nicht mehr findet, was er sucht. Diese Effekte sollten an Stellen zum Einsatz kommen, an denen sie sinnvoll sind, und nicht, um einfach nur „hip“ zu sein.


Designst du erst für Desktop und wandelst das dann für Responsive um oder designst du nach dem mobile-first-Ansatz?
Ich beginne mit Desktop, aber habe währenddessen schon die ganze Zeit die mobilen Geräte im Hinterkopf. Häufig mache ich mir zuerst grobe Scribbles für alle Gerätegrößen, bevor ich digital loslege.

Die Seiten, die ich bisher gestaltet habe, waren allerdings durchweg Firmenseiten ohne reine Ausrichtung auf eine mobile Zielgruppe. Stets waren alle Gerätegrößen gleich wichtig. Bei einer Website, die vorrangig für die mobilen Nutzer gedacht ist, würde ich mit der Gestaltung der mobilen Ansicht beginnen.


Gibt es einen Stil oder eine Art von Website, die du noch nicht umgesetzt hast, die du aber unbedingt mal umsetzen möchtest?
Oh ja, da gibt es einige:

  • Fotograf mit großzügiger Galerie
  • Blumenladen/Blumencenter (da ich selbst Blumen sehr mag)
  • Eine Website für Kinder in Zusammenarbeit mit Illustratoren
  • Thema Beauty

Dies ist allerdings nur eine kleine Auswahl. Ich bin gespannt welche – eventuell auch unerwarteten – Themen mir als Webdesignerin noch begegnen werden.


Hast du einen Tipp zu Webdesign, den du eher printlastigen Designern mitgeben möchtest?
Mein Tipp ist: Lernt die Grundzüge von HTML und CSS, wenn ihr Webdesign machen möchtet. Es ist wichtig zu wissen, was geht und was nicht. Ihr solltet zumindest in Bezug auf eure Layouts die „Sprache der Programmierer“ verstehen und sprechen können. Wenn Ihr wisst, wie das HTML und das CSS aufgebaut sind, wisst ihr auch, was die Programmierer von euch brauchen, um eine richtig gute Umsetzung zu realisieren.

Und noch ein Tipp: Versucht nicht, haargenaue Punktgrößen für Schriften zu verlangen. Jeder Browser stellt Schrift ein klein wenig anders dar.


Wie hältst du dich über aktuelle Entwicklungen im Web auf dem Laufenden?
Ich habe das Glück, in einer Bürogemeinschaft mit Programmierern zu sitzen. So versorgen wir uns gegenseitig mit neuen Erkenntnissen. Mal entdeckt der Eine etwas Neues, mal der Andere. Außerdem habe ich einige Newsletter abonniert (zum Beispiel einen von Xing mit Designthemen, den von smooster und den von t3n).

Während neuer Projekte kommen immer wieder neue Anforderungen auf mich zu – auch dadurch lerne ich ständig neue Facetten dazu.


Was schätzt du an der Zusammenarbeit mit smooster?

  • Die schnelle Reaktion auf Anfragen
  • Den Newsletter
  • Die lockere, freundschaftliche Zusammenarbeit


zurück
comments powered by Disqus