Webdesign

Statik ist out – Dynamik ist in. Webdesign folgte einst einer simplen Rechnung: HTML plus Stylesheet ist gleich Webseitengestaltung. Diese ist längst überholt. Heute zählen Interaktion und Optimierung der Usability und eine stimmige, dem jeweiligen Onlineangebot angemessene User Experience.

mehr

YouTube: Neues Logo, neues Design, neue Funktionen

Google hat seiner Videoplattform YouTube ein neues Logo verpasst – aber nicht nur das!

mehr

So frech wie erfolgreich: Caritas-Kampagne zur Bundestagswahl

»Wählt Menschlichkeit« – und vor allem: Wählt überhaupt! Mit einer Kampagne der Berliner Agentur glow mischt sich die Caritas in die Bundestagswahl ein. Und das sehr erfolgreich.

mehr

Filterblasentest Lisa Jasch

Raus aus der Filterblase

Mit dem Test von Lisa Jasch findet man heraus, wie stark man in seiner Filterblase steckt – und wie man sie platzen lässt.

mehr

Ungewöhnliche Fotografen-Websites: Ina Niehoff

Nicht nur ihre Bilder sind sehenswert, es lohnt sich auch, auf der Website von Ina Niehoff auf gestalterische Details zu achten …

mehr

Anzeige

Ungewöhnliche Fotografen-Websites: Peter Kaaden

Nicht nur die Bilder auf der Website von Fotograf Peter Kaaden sind provokativ, auch die Typografie ist ausgesprochen mutig …

mehr

Ungewöhnliche Fotografen-Websites: Daniel Sannwald

Die ungewöhnlichste Fotografen-Website, die uns in letzter Zeit begegnet ist, ist die von Daniel Sannwald. Sogar ein Buch wurde aus der Site …

mehr

CSS-Spezifikationen fürs kreative Webdesign

Die neue CSS-Spezi­fikation Grids erweitert Flexbox und ermöglicht die zweidimen­sionale Gestaltung des Layouts.

mehr

Ungewöhnliche Fotografen-Websites: Martina Borsche

Die Frau von Mirko Borsche ist Fotografin – ihre neue Website entstand im Bureau Mirko Borsche.

mehr

Anzeige

»Webdesigner müssen verstehen, was Grafikdesign für sie tun kann«

Jen Simmons, Designer Advo­cate bei Mozilla und Betreiberin des Blogs »The Web Ahead«, findet gängige Grid-Systeme langweilig, weil alle die gleichen nutzen …

mehr

Typografie Grundlagen für Print und Online

Diese Stolperfallen gibt es – und so kann man sie umgehen.

mehr

5 Tipps für die Einbindung von Videos auf Websites

Aus Entwicklerperspektive: Jan Henckel, Technischer Leiter bei Dunckelfeld in Köln, gibt Tipps zu Codecs, Framerate, Auflösung …

mehr

Das Internet in Echtzeit

Wie viele neue User hat Instagram im Vergleich zu Twitter? Dies und vieles mehr erfährt man auf dieser infografisch aufbereiteten Webseite …

mehr

Anzeige

Navigationsmuster: Priority+ oder Tableiste?

Navigationskonzepte für mobile Geräte stehen ganz im Zeichen der Ökonomie. Meist heißt es Platz sparen, um alle Inhalte auf dem kleinen Screen unterzubringen.

mehr

Navigationskonzepte: Wo geht’s lang?

Vor allem der begrenzte Platz auf den Screens mobiler Devices hat dem Hamburger-Icon Vorschub geleis­tet – inzwischen ist allerdings klar, dass es nicht zur Universallösung taugt.

mehr

Illustrations-Künste anders umgesetzt: Hand Poked Tattoos von Studio Toto

Studio Toto aus Berlin nimmt sich dem Trend der Hand Poked Tattoos an: Mit einer Website, auf der man tätowieren kann. mehr

Web & Landing Page Design: So verbessern Sie Ihre Nutzersignale

Severin Lucks, SEO-Berater und Geschäftsführer von Delucks in München, zeigt im Gast-Beitrag, wie man die Absprungrate reduzieren und gleichzeitig Verweildauer, Klickrate, Conversions und Social Signals erhöhen kann.
mehr

Anzeige

Technische Begriffe, endlich verständlich erklärt

Bei schwierigen Vokabeln wie »Ransomware«, »Bitcoin« oder »DDos Attack« hilft jetzt ein neues Online-Lexikon.

mehr

Cascading Stylesheets, Cascading Style Sheets, Onepager, Screendesign, Grafikdesigner, modernes Webdesign, Kommunikationsdesign, Website erstellen, Grafikdesign, One-Pager

CSS-Grundlagen-Tutorial für Designer

In diesem Workshop führen wir Sie durch die Grundlagen von CSS. Also PAGE eDossier downloaden, durchlesen, Onepager bauen – los geht’s. mehr

Webdesign dient der visuellen Kommunikation im Internet. Entsprechend verfügen Webdesigner über Kenntnisse in den Bereichen Webtypografie, Grafikdesign und Mediengestaltung. In enger Zusammenarbeit mit der Webentwicklung entwerfen sie die Navigation, das Interface Design und die Benutzerführung einer Website. Immer mehr folgt das Webdesign auch ergonomischen Gesichtspunkten. Eine gute Usability und Accessability sowie Barrierefreiheit sind wichtig, um möglichst viele User im World Wide Web zu erreichen und ihnen angenehme Nutzungserfahrungen zu bescheren.

In den vergangenen Jahren hat sich das Internangebot und das damit verbundene Nutzungsverhalten stark gewandelt. Wo einst Nutzer Webseiten nur rezipierten, nutzen sie heute die dargebotenen Informationsangebote auch für Interaktionen – ob geschäftlich oder privat, jeder »liked«, »shared«, kommentiert oder schreibt seine Meinung ins Netz.

Dementsprechend hat sich das Tätigkeitsprofil eines Webdesigners verändert. Er muss nicht nur eine Benutzeroberfläche gestalten, sondern sich auch in den Prozess von Strukturierung und Konzeption einbringen. Responsive Webdesign lautet das Stichwort. Nutzer klicken Internetseiten auf dem Computer, dem Tablet oder auf dem Smartphone, und die Darstellung für jedes Medium ist längst zur Selbstverständlichkeit geworden.


Der folgende Beitrag wurde zuerst in PAGE 01.2016 veröffentlicht.
Hier im PAGE-Shop im Originallayout erhältlich.
Oder als PAGE-eDossier zum Download.

Autoren: Angelika Eckert | Arne Schätzle


INHALT

1 Webdesign heute
2 Ist High-Quality nur noch was für Gefahrensucher?
3 Maßanzüge waren schon immer teuer
4 Woher kommt die Kästchenpolitik?
5 Sind Templates der Tod des Webdesigns?
6 Designen ohne Code
7 Content und Kontext, die stillen Herrscher
8 Webdesign ist tot – es lebe das Webdesign!
9 Weiterführende Inhalte zum Thema


1 Quo vadis Webdesign?

Wo sind all die schönen flashy Websites hin, die noch vor ein paar Jahren das Netz zu einem bunten, abwechslungsreichen Ort machten? »Blocky« Websites haben das Web erobert und sich quer durch alle Online-Genres gegraben. Egal welches Produkt, wel­ches Unternehmen, welches Thema – irgendwie sehen alle Seiten gleich aus. »Webdesign verliert seine Seele«, klagt Neil Cooper in seinem Artikel »Are ›blocky wocky‹ sites killing web design?«. Cooper ist Kreativdirektor bei SapientNitro in London. Für ihn versprühen die meis­ten Sites nur noch die Illusion von Individualität und Persönlichkeit, das Web sei zum Abladeplatz für leere, seelenlose Seiten geworden – ein Container für Text, Bilder und Videos in Quad­raten. »Die Blöcke beeinflussen viel zu stark un­sere Möglichkeiten, schöne, reichhaltige, nützli­che, relevante und universelle Inhalte zu kreieren«, kritisiert er. Stimmt das? Und wenn ja, befinden wir uns damit schon jenseits von Qualitäts-Webdesign?

Top

2 Ist High-Quality nur noch was für Gefahrensucher?

Fürs Blocky Webdesign spricht die klare Usability. »Es ist effizient, sich allgemein anerkannter Web­si­te­struk­tu­ren zu bedienen. Der User versteht das Sys­tem und verarbeitet Informationen schneller«, sagt Elias Ren­dón Benger, Head of Product Management MyWebsite bei 1&1. Ans One-Pager-Navigationskonzept, Image Slider, Scroller und Co haben wir uns längst gewöhnt. So wie an den Einkaufswagen-Button oben rechts. Aber gilt deshalb schon die Devise »Never change a winning team«?

Man muss schon etwas suchen, aber es gibt sie noch, die beeindruckenden, aufwendigen, kreati­ven und meist kostspieligen Webdesigns. Die Mutigen stemmen sich gegen die Vereinheitlichung, kreieren atemberauben­de Erlebniswelten und ersinnen ungewöhnliche Navigationskonzepte – meist zulasten der Usability (siehe  hier).

Die volle kreative Kompetenz können Agenturen am besten unlimitiert auf der eigenen Website rauslassen, um zu beweisen, dass Responsiveness nicht blocky oder visuell beschränkt aussehen muss – das zeigt das Beispiel des Digitalstudios Legwork aus Denver, dessen ausge­spro­chen ungewöhnlich gestaltete und strukturier­te Agenturwebsite auch auf Smartphones flüssig läuft.

Top

3 Maßanzüge waren schon immer teuer

Dass Kunden für derart ausgefeilte responsi­ve Lö­sun­gen größere Budgets lockermachen müssen, liegt auf der Hand. Dabei geht es nicht allein um beeindruckendes Visual Design, sondern vor allem um eine individuell auf die Ziele und Bedürfnisse der Mar­ke angepasste Lösung. Für eine solche Qualitäts-Website wird man zuerst Faktoren wie Key-Performance-Indikatoren, Use Cases, SEO und die künf­ti­ge Contentstrategie der Marke betrachten, um eine passgenaue Modulliste sowie das richtige CMS für alle Anforderungen zu finden. Und da diese konzep­tionellen Schritte eine erhebliche Vorarbeit zum eigentlichen Designprozess darstellen,

»hat pro­fes­sio­nel­les Webdesign eben seinen Preis«

so Chris­tian Bartsch, Creative Partner der Hamburger Werbeagen­tur BOOM. Für eine Website von einer Agentur, hinter der Beratung, Konzeption, Design und Entwicklung stecken, müssten Unternehmen rund 15 000 Euro einplanen. Vor allem kleine Firmen und Start-ups wollten diese Investi­tion aber nicht leis­ten, wenn sie mittels Designvorlagen oder auf Facebook und Krea­tivnetzwerken wie Behance für klei­nes Geld selbst schnell eine Seite erstellen könnten.

Oder man lässt gleich einen Automaten wie The Grid den Job des Designers erledigen. Die Macher erheben den Anspruch, mit der Leistungsfähigkeit künstlicher Intelligenz alles zu nehmen, was man ihnen hinwirft – Videos, Bilder, Text, URLs und mehr – und diese Assets automatisch in eine benutzerdefinierte, einzigartig gestal­te­te Website zu verwandeln. Halleluja.

»The Grid als Inspiration und Ansporn zu verstehen, statt gleich den Teufel an die Wand zu malen«

ist für Chris Bartsch der richtige Weg, um als Digitalagentur lang­fristig relevant zu bleiben. Denn er kennt auch die gegenläufigen Bewegungen im Markt: »Es gibt genug Kunden, die individuelle und vor allem nachhaltige Lösungen haben wollen und die kann man über vorgefertigte Template-Engines nicht bedienen.«

Top

4 Woher kommt die Kästchenpolitik?

Es wäre zu kurz gesprungen, den visuellen Einheitsbrei im Web einfach auf die mangelnde Finanzierungsbereitschaft der Agenturkundschaft zu schieben. »Re­s­ponsive Sites basieren ganz oft auf Grid-Systemen. Da ist es ein typischer Reflex, das Raster mit gleich großen Boxen zu belegen und diese dann je nach Bildschirmgröße fröhlich umherzuschieben. Die negative Seite ist, dass dadurch in den letzten Jah­ren sehr viele sehr austauschbare Layouts entstanden sind«, gesteht Wolf Brüning, Principal UX Designer bei Otto in Hamburg. »Grids sind ein gutes Mit­tel, die Komplexität, die mit Responsive Webdesign ja stets ansteigt, zu reduzieren.« Heißt der Killer also Responsivität? Zumal das mobile Web noch immer langsam und zeitraubend ist?

Für aufwendig gestaltete Websites und reibungslose User Experience haben die mobilen Devices oft zu wenig Power, und erschöpfte Datennetze verringern die Performance.

»Das Webdesign hat sich stark den Device-Anforderungen angepasst, aber am Ende packen wir Designer alles in Kisten«

kommentiert Bartsch. »Das aus Custom-Built wieder mehr Customer-Built, also nutzer- und zweckorientierte Gestaltung wird«, würde er sich eher wünschen, als dass die Branche über zu viele Bauklötze staunt.

Top

5 Sind Templates der Tod des Webdesigns?

Der peruanische Designer Sergio Nouvel Castro, Mit­gründer der Digitalagentur Continuum in Lima, trat mit seinem Artikel »Why Web Design is Dead« eine weltweite De­bat­te los. Wie er wandern derzeit viele Designer im fins­tren Tal nicht selten selbst verschuldeter Langewei­le: Sie wissen genau, was sie visuell erreichen wollen, aber sie können ihre Ideen nicht zum Leben erwecken, weil ihnen die Coding-Kompetenz fehlt.

Da sind die vielen vorgefertigten Themes und Tem­plates von Plattformen wie 1&1 und Jimdo (siehe PAGE 01.2016, Seite 28 f.) oder GoDaddy, ThemeForest, Squarespace, Weebly, Wix, WordPress und Co eigentlich ein Segen! Sie bieten eine fertige Seitenstruktur inklusi­ve Verknüpfun­gen mit Shopsystemen, CMS und SEO, und dank begleitender Webinare gelingt auch gestal­terisch begab­ten Laien der Einstieg in Minuten. Die Vorlagen sind kostenlos oder preiswert zu erstehen, so bleibt mehr Zeit und Geld für die Inhalte. Warum also einen Webdesigner anheuern, wenn man mit ei­ner Vorlage ein akzeptables Design für einen Bruchteil der Kosten hinbekommt? Zudem ist die techni­sche Infrastruktur ordentlich getestet und wird in puncto Sicherheit stetig upgedatet.

Top

6 Designen ohne Code

Liegt dann die Chance freiberuflicher Webdesig­ner darin, derlei Instant-Websites mit wenig Aufwand zu veredeln? Kollegen mit guten HTML- und CSS-Kenntnissen jedenfalls eröffnet sich hier ein neues Geschäftsfeld. Der ukrainische Freelance-Web- und User Interface Designer Serhiy Hembarevskyy geht diesen Weg: Neben seiner tägli­chen Arbeit gestaltet er attraktive respon­sive Jimdo-Templates und handelt sie auf  hier. Freelance-Kollegen wie der Hamburger Timon Schlichenmaier oder kleine Agenturen erwerben sie für rund 150 Euro und passen sie Kundenbedürfnissen an. So kommt eine kleine Firma für 2000 bis 5000 Euro zu einer individuellen Website – und Hembarevskyy zu einem einträglichen passiven Einkommen.

»Sonderwünsche lassen sich am besten berücksichtigen, wenn man eine Site von Grund auf selber baut«, sagt Malcolm Bunge, Digital Creative in Berlin. Durch codefreie Web­site Buil­der wie rukzuk (siehe PAGE 01.2016, Seite 30) oder das Word­Press-Plug-in Advanced Custom Fields, das im Handumdrehen benutzerdefinierte Felder in allen denkbaren Formen für Beiträge, Seiten, Kategorien, Taxonomi­en und Post Types bereitstellt, könnten Kunden und deren Designern zwar Zeit sparen – »doch arbeite ich manchmal mit einer Agentur zusammen, deren Ent­wickler so unfassbar schnell und fähig ist, dass fertige Templates ihn beim Programmieren eher ein­schränken würden«, so Bunge.

Top

7 Content und Kontext, die stillen Herrscher

Chris Bartsch sieht die um sich greifende Gridomanie gelassen. Auch das Lamento über Blocky Webdesign findet er überflüssig: »Am Ende ist die Website doch nur ein Container. Auf den Inhalt und das Storytelling kommt es an.« Sergio Nouvel Castro scheint ähnlicher Ansicht zu sein:

»Es geht hier weniger um visuelle Gestaltung. Vielmehr müs­sen die Inhalte und ihre Relation zu den Nutzer­be­dürf­nis­sen überzeugen.«

Gerade im Bereich Information gehe die Entwicklung klar in Richtung ­di­gitaler Assistenten wie Siri und des Google-Suchdienstes, der schon seit einiger Zeit relevante Informationen wie Adresse, Telefonnummer und Öffnungszeiten bereits in den Suchergebnissen listet.

Ist das nicht fatal fürs Webdesign? Schließlich können die User sich einen Besuch auf der Website sparen! Aus Sicht von Christian Waitzinger, Vice Pre­sident, Executive Creative Director Continental Europe bei SapientNitro in München (siehe Interview), rückt diese Entwicklung eher ent­schei­den­de Dinge zurecht. Demnach haben wir es derzeit mit einer Verschiebung weg von den Websites hin zu den Webservices zu tun: Es gehe um autarke Informationseinheiten, die für andere Diens­te genutzt und kombiniert werden könnten. Man sucht ein Res­taurant und erhält die Telefonnummer bei Google, die Wegbeschreibung von Google Maps, die Bewertungen von Foursquare oder Yelp und die Verkehrssituation von Waze.

Auf der einen Seite gelte es, diese Komponenten zusammenzudenken und daraus Nutzungsszena­rien zu entwerfen – mit aller Offenheit für ein neues Webdesign. Auf der anderen Seite ergibt sich daraus eine riesen Chance fürs Webdesign, sich selbst zu befreien, weil es in seiner jetzigen Form an ein Ende gelangt ist. Phönix aus der Asche also?

Top

8 Webdesign ist tot – es lebe das Webdesign!

Das Ego des Webdesigners, die Website und die Zahl der Visits, räumt Christian Waitzinger ein, würden unter dieser Entwicklung etwas leiden, aber am Ende verbessert sich die User Experience. Klare Worte also: Content und Context, nicht das Visual Design, sind derzeit King and Queen! Für Webdesigner ändert sich damit einiges am Grundverständnis ihres Aufgabenfelds. Eine Tatsache aber bleibt laut Chris Bartsch bestehen:

»Wer eine hochwertige Produkt­inszenierung mit außergewöhnlichem Storytelling haben möchte oder eine Experience, die vorher noch niemand gesehen hat, muss sich auf die Kreativleis­tung einer erfahrenen Agentur stützen.«

Neil Cooper, der beklagt, dass die Bedeutung der Kreativität verloren gegangen sei und Agenturkunden und Konsumenten den wahren Wert von Design nicht mehr zu schätzen wüssten, setzt noch eins drauf: »Wir müssen wieder einen Weg zum emotionalen, individuellen Markenerlebnis finden und uns überlegen, welchen Stellenwert Inspiration im krea­tiven Prozess hat. Ohne eine grundlegende Idee und Kreativität, gestützt durch eine tiefe Einsicht in die Materie und eine durchdachte Strategie krepierst du an der Fülle der Möglichkeiten.«

Top


9 Weiterführende Inhalte in PAGE 01.2016 und PAGE Online:


PAGE zeigt Beispiele, die belegen, dass Kreativität immer noch angesagt ist:

In PAGE 01.2016, Seite 25: Was geht noch ohne Grids?


Clevere Vorschlagsysteme und Algorithmen, eine stimmige User Guidance und intuitive Bedienung gehören zu den Standards der jüngsten Website-Builder-Generation. Die Templates lassen sich universell anpassen – natürlich mit responsivem Output:

In PAGE 01.2016, Seite 28: So geht’s WYSIWYG (1&1 und Jimdo)


Christian Waitzinger, Vice President und Executive Creative Director Continental Europe bei SapientNitro in München, kommentiert:

Webdesign ist sicherlich nicht tot!


Webydo, rukzuk und Agentur-Toolbox:

In PAGE 01.2016, Seite 30: Instant-Tools für Agenturen


Lars Richter, Prototyper, Hybriddesigner und Coach aus Köln, im Interview:

»Ich nenne es Designprogrammierung«


Jen Simmons, Designer Advo­cate bei Mozilla und Betreiberin des Blogs »The Web Ahead«, im Interview:

»Webdesigner müssen verstehen, was Grafikdesign für sie tun kann«


 

Top