Webdesgn mit Photoshop Blogbeitrag Slidebird Webdesign

Vorweg möchte ich klarstellen, dass ich Adobe Photoshop für eines der besten Programme für die Bildbearbeitung halte, auch wenn es mittlerweile mehr als gute Alternativen hierfür gibt. Ich bin definitiv kein Photoshop Gegner, jedoch war mir nie klar, warum es Webdesigner und vor allem Grafiker gibt, die stundenlang aufwendigste Webdesigns in Photoshop erstellen, um später genau diese „fertigen“ Webseiten als Vorlage herzunehmen und die Designs eins zu eins mit weiteren unzähligen Stunden in einem CMS oder Framework umsetzen oder gar von Scratch weg programmieren.
Nur so am Rande, es gibt gute Gründe für Content Management Systeme wie WordPress, Drupal und Typo3 und auch Frameworks wie Twitter Bootstrap und Konsorten sind nicht mehr wegzudenken, daher gibt es aus meiner Sicht kaum Gründe sich vor einen leeren Texteditor zu setzen und ein Html und CSS Gerüst selbst zu erstellen. Weder dem Kunden ist damit geholfen noch dem Designer bzw. Programmierer.

Grafiker sind keine Webdesigner

Immer wieder passiert es mir in meinem beruflichen Alltag, dass Kunden mit sehr aufwendig erstellten PSDs zum Erstgespräch kommen mit dem Satz „Also, unser Webdesigner hat die Seite schon in Photoshop erstellt, jetzt muss sie nur mehr programmiert werden“. Mann kann davon ausgehen, je nach Qualität des PSD Files, dass der Kunde bereits einiges an Geld für die Erstellung dieser Webseite oder besser gesagt, der Idee einer Webseite bezahlt hat. Das Problem aus meiner Sicht liegt daran, dass der Begriff Designer bzw. Webdesigner sehr weitläufig ist. Ich habe Designer kennen gelernt, die zugegebener Maßen wirklich sehr stilvolle und aussagekräftige Webdesigns erstellt haben, jedoch Dinge wie Usability, Page Speed, responsive Design oder generell die tatsächlich technische Umsetzung nicht mal im Ansatz bedacht haben und hier fängt das Problem auch schon an.

Jemand der noch nie eine einzige Zeile Code geschrieben hat oder für den Bereiche, wie technische Suchmaschinenoptimierung und Usability nicht zur täglichen Arbeit gehören, wird sich natürlich auch schwer tun, diese zu Berücksichtigen. Im schlimmsten Fall hat der Kunde nun eine fertige Webseite als PSD Datei, die der tatsächliche Webdesigner bzw. „Programmierer“(mit klassischem Programmieren hat die Umsetzung einer Webseite in der Regel nur sehr wenig zu tun) erst recht wieder von vorne umgestalten bzw. adaptieren muss, da es technische Hürden gibt und aufwendiges Design oft auf Kosten der Benutzerfreundlichkeit geht und natürlich technische SEO Faktoren wie Page Speed nicht berücksichtigt worden sind.

Full-Stack Webdesigner

In meinen Augen ist es nicht nur wichtig, sondern eine Grundvoraussetzung zumindest grundlegende Kenntnisse in HTML 5, Css 3, den gängigsten Frameworks  und JavaScript Bibliotheken wie jQuery und AngularJS und der Scriptsprache PHP zu besitzen. Darüber hinaus sollte sich ein full stack Designer umfangreiches wissen über technische Suchmaschinenoptimierung aneignen und Usability in jede Entscheidung miteinbeziehen. Gerade bei kleinen Projekte für KMUs ist in der Regel nicht das Budget vorhanden, für ein ganzes Team aus Designern, Programmierern und UX Profis.

Web Design Live im Browser erstellen

Sofern man nun oben genannte Kenntnisse besitzt, macht es aus meiner Sicht daher durchaus Sinn, die Seite von Anfang an, live im Browser zu erstellen. Ich selbst, benutze einfachste Wireframing Tools um so schnell wie möglich das Grundgerüst der Seite zu erstellen um dann sofort mit dem Design im Browser zu beginnen. Natürlich ist es hierbei nötig HTML und CSS zu beherrschen, aber die Vorteile liegen auf der Hand. Ich kann sofort testen was funktioniert und was nicht, ich sehe von Beginn an die Auswirkungen meines Design auf die Geschwindigkeit der Seite, ich arbeite so gut wie bei jedem Projekt mit Twitter Bootstrap um auch das responsive Design von Anfang an zu testen und bin ein großer Fan davon, responsive Design mit Adaptive Design zu vermischen um so auch Breakpoints optimal nutzen zu können. Zugegebener Maßen gibt es natürlich auch Nachteile bei dieser Variante. Was ich des Öftern von Kollegen schon gehört habe und auch selbst feststellen musste, kann die Kreativität sehr schnell unter diesem Prozess leiden. Oft haben wir Ideen oder ein Design im Kopf die wir erst schnell visualisieren müssen um zu erkennen, ob sie funktionieren oder nicht. Diese Visualisierung ermöglichen die zahlreichen Tools in Photoshop natürlich wesentlich einfacher, als es im Browser umzusetzen wäre. Aus diesem Grund ergibt es durchaus Sinn, einzelne, sehr grafische Teilbereiche einer Seite in Photoshop zu designen, diese Teilbereiche sollten aber wirklich minimal gehalten werden. Ich persönliche versuche immer, sobald ich merke, dass meine Idee oder mein Design funktioniert, es im Browser umzusetzen.

Web Design mit Photoshop Fazit

Ich denke, Photoshop hat seine Berechtigung, ein großer Teil im Webdesign zu sein, noch lange nicht verloren. Jedoch speziell für Freelancer und Webdesigner die Projekte alleine oder in sehr kleinen Teams umsetzen, macht es aus meiner Sicht keinen Sinn, eine komplette Webseite in Photoshop zu erstellen, nur um das Ganze dann eins zu eins ins Web zu übertragen. Speziell der Kunde wird es einem auch danken, da der Designprozess in Photoshop sehr zeitaufwendig ist und am Ende oft Designs entstehen die nur sehr schwer vernünftig zu realisieren sind. Wer von Anfang an im Browser arbeitet erkennt sehr früh was funktioniert und was nicht und vor allem responsive Design kann in Photoshop zu einem echten Problem werden.

Daniel Knoflicek ist seit 2012 Geschäftsführer von Slidebird Webstories, einer Agentur für online Marketing, Webdesign und Webentwicklung. Des Weiteren hat Daniel Knoflicek das Start Up Ernst M. gegründet, welches vegane, bio Marmelade in Österreich herstellet und vertreibt. Er ist als CTO für das Start Up tätig. Seit 2015 und der Gründung von DESK.WORKS ist Daniel Knoflicek als Brand Ambassador für Österreich zuständig.