SlideShare ist ein Scribd-Unternehmen logo
Mediengerechtes
Webdesign
Denkanstöße von Gerrit van Aaken
5.6.2010 / TypograVieh, Weimar
praegnanz.de
beides.
Designer oder
Entwickler?
Mediengerechtigkeit
Was ist’s?
Browser sind nicht
aus Papier
So klein ...
... oder so groß!
Mediengerechtes Webdesign
... besser als Papier!
http://www.flickr.com/photos/urbaning/CC BY-ND
Haptik
Leitwerte
Flexibilität
Flexibilität
Trennung von Inhalt
und Layout
ePub ≈ HTML
Kontrollverlust
Kontrollverlust
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Unsicherheits-
faktoren
• Breite des Browserfensters
• Höhe des Browserfensters
(Der Falz-Mythos)
• Eingestellte Schriftgröße
• Farbschema
• Vorhandene Schriften
• Schriftglättung
• Plugins
Ent
macht
ung?
Machtwechsel
• User erhalten mehr Macht über die
Darstellung des Inhalts.
• Designer geben nur noch Vorschläge
bzw. Gestaltungskorridore vor.
• Das ist eine gute Sache.
Das geht
gar nicht
(mehr):
http://www.flickr.com/photos/justinandelise/
CC BY-ND
Full Flash
Warum kein
Fullflash?
• keine echten Permalinks
• Inhalte nicht verarbeitbar/anpassbar
• Performanceschwäche
• kein mobiler Einsatz
Postkarten
Warum keine
Postkarten?
• Seitenscrolling ist okay (echt jetzt.)
• Kästchenscrolling ist scheiße.
• Scrollen ist einfacher als Klicken
Winz-
schriften
Warum keine
Winzschriften?
• Nicht alle kennen die
Vergrößerungsfunktion
• Seitenzoom ist (manchmal) scheiße
• Schriftglättung kann nicht
vorausgesetzt werden
Inverse Schrift
Explorative Navigation
Spielverderber!
Webdesign ist nicht
zum Spaß.
Aber es gibt Hoffnung!
Trend #1:
Kraftvoll überzeugen!
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Trend #2:
Kreativer
Minimalismus
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Trend #3:
Content fucks design
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Trend #4:
Desktop/Web-Hybriden
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Trend #5:
Magazin
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Mediengerechtes Webdesign
Alles erlaubt!
… solange Usability und
Mediengerechtigkeit gesichert sind.
Vielen
Dank!

Weitere ähnliche Inhalte

Andere mochten auch

Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AGQualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
Torsten Kleiber
 
Animalices
AnimalicesAnimalices
Animalices
alex
 
Kapazitätseffekte von E-Learning.
Kapazitätseffekte von E-Learning.Kapazitätseffekte von E-Learning.
Kapazitätseffekte von E-Learning.
e-teaching.org
 
Medienmanagerinnen und Medienmanager in Deutschland - Projektbericht
Medienmanagerinnen und Medienmanager in Deutschland - ProjektberichtMedienmanagerinnen und Medienmanager in Deutschland - Projektbericht
Medienmanagerinnen und Medienmanager in Deutschland - Projektbericht
Christopher Buschow
 
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
Christopher Buschow
 
Eröffnungspodium Opco12 - Fragebogen
Eröffnungspodium Opco12 - FragebogenEröffnungspodium Opco12 - Fragebogen
Eröffnungspodium Opco12 - Fragebogen
e-teaching.org
 
Schlachte coaching-tools-iii
Schlachte coaching-tools-iiiSchlachte coaching-tools-iii
Schlachte coaching-tools-iii
Christoph Schlachte
 
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
e-teaching.org
 
Gingerbread Men
Gingerbread MenGingerbread Men
Gingerbread Men
Cindy Rolf
 
ditact it summer school 2010 kurzvorstellung
ditact it summer school 2010 kurzvorstellungditact it summer school 2010 kurzvorstellung
ditact it summer school 2010 kurzvorstellung
Brigitte Jellinek
 
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
Christopher Buschow
 
Sonderbeilage Berliner Zeitung Festival of Lights
Sonderbeilage Berliner Zeitung Festival of LightsSonderbeilage Berliner Zeitung Festival of Lights
Sonderbeilage Berliner Zeitung Festival of Lights
Christian Oblasser
 
Medienkompetenz und Wikipedia an Hochschulen.
Medienkompetenz und Wikipedia an Hochschulen.Medienkompetenz und Wikipedia an Hochschulen.
Medienkompetenz und Wikipedia an Hochschulen.
e-teaching.org
 
Green Meetings - How?
Green Meetings - How?Green Meetings - How?
Green Meetings - How?
Christian Oblasser
 
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
Christoph Schlachte
 
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
e-teaching.org
 
Auto Brand Horst 3 Juli 2008
Auto Brand Horst 3 Juli 2008Auto Brand Horst 3 Juli 2008
Auto Brand Horst 3 Juli 2008
mmm112
 
Podium Mathe-Online 2: Folien Anne Rickert
Podium Mathe-Online 2: Folien Anne RickertPodium Mathe-Online 2: Folien Anne Rickert
Podium Mathe-Online 2: Folien Anne Rickert
e-teaching.org
 
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
e-teaching.org
 

Andere mochten auch (20)

Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AGQualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
Qualitätssicherung in ADF Projekten der IKB Deutschen Industriebank AG
 
Animalices
AnimalicesAnimalices
Animalices
 
Kapazitätseffekte von E-Learning.
Kapazitätseffekte von E-Learning.Kapazitätseffekte von E-Learning.
Kapazitätseffekte von E-Learning.
 
Medienmanagerinnen und Medienmanager in Deutschland - Projektbericht
Medienmanagerinnen und Medienmanager in Deutschland - ProjektberichtMedienmanagerinnen und Medienmanager in Deutschland - Projektbericht
Medienmanagerinnen und Medienmanager in Deutschland - Projektbericht
 
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
Social TV in Deutschland - Synthese der IJK-Expertenbefragung aus dem Jahr 2012
 
Eröffnungspodium Opco12 - Fragebogen
Eröffnungspodium Opco12 - FragebogenEröffnungspodium Opco12 - Fragebogen
Eröffnungspodium Opco12 - Fragebogen
 
Schlachte coaching-tools-iii
Schlachte coaching-tools-iiiSchlachte coaching-tools-iii
Schlachte coaching-tools-iii
 
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
Mobiles Lernen” - ein Überblick über Szenarien und Technologien (Folien Prof....
 
Gingerbread Men
Gingerbread MenGingerbread Men
Gingerbread Men
 
ditact it summer school 2010 kurzvorstellung
ditact it summer school 2010 kurzvorstellungditact it summer school 2010 kurzvorstellung
ditact it summer school 2010 kurzvorstellung
 
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
Strategische Institutionalisierung als Wertbeitrag für Medienunternehmungen -...
 
Sonderbeilage Berliner Zeitung Festival of Lights
Sonderbeilage Berliner Zeitung Festival of LightsSonderbeilage Berliner Zeitung Festival of Lights
Sonderbeilage Berliner Zeitung Festival of Lights
 
Georg (saksakeelne)
Georg  (saksakeelne)Georg  (saksakeelne)
Georg (saksakeelne)
 
Medienkompetenz und Wikipedia an Hochschulen.
Medienkompetenz und Wikipedia an Hochschulen.Medienkompetenz und Wikipedia an Hochschulen.
Medienkompetenz und Wikipedia an Hochschulen.
 
Green Meetings - How?
Green Meetings - How?Green Meetings - How?
Green Meetings - How?
 
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
Wenn es zu komplex wird im Coaching – über den Gebrauch von Werkzeugen zur Un...
 
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
E-Prüfungs-Szenarien: Im Klausurraum, mit Prüfungslaptop und am eigenen Lapto...
 
Auto Brand Horst 3 Juli 2008
Auto Brand Horst 3 Juli 2008Auto Brand Horst 3 Juli 2008
Auto Brand Horst 3 Juli 2008
 
Podium Mathe-Online 2: Folien Anne Rickert
Podium Mathe-Online 2: Folien Anne RickertPodium Mathe-Online 2: Folien Anne Rickert
Podium Mathe-Online 2: Folien Anne Rickert
 
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
Über die Wertschöpfung hinaus ... Future EduTech im Dialog von Wirtschaft und...
 

Ähnlich wie Mediengerechtes Webdesign

Creasoft c-Day 2009 - Webtechnologien der Zukunft
Creasoft c-Day 2009 - Webtechnologien der ZukunftCreasoft c-Day 2009 - Webtechnologien der Zukunft
Creasoft c-Day 2009 - Webtechnologien der Zukunft
Creasoft AG
 
Web Design - Inhalte, Interfaces und Interaktion
Web Design - Inhalte, Interfaces und InteraktionWeb Design - Inhalte, Interfaces und Interaktion
Web Design - Inhalte, Interfaces und Interaktion
Björn Wilmsmann
 
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
Werbeplanung.at Summit
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Andreas Wissel
 
SEO Produktspezifikation für RWD
SEO Produktspezifikation für RWDSEO Produktspezifikation für RWD
SEO Produktspezifikation für RWD
Conny Stier
 
Browserstrategien und Progressive Enhancement
Browserstrategien und Progressive EnhancementBrowserstrategien und Progressive Enhancement
Browserstrategien und Progressive Enhancement
Aperto Nachname
 
HTML5-Features
HTML5-FeaturesHTML5-Features
HTML5-Features
Francesco Schwarz
 
Echte Lösungen, keine Tricks
Echte Lösungen, keine TricksEchte Lösungen, keine Tricks
Echte Lösungen, keine Tricks
Jens Grochtdreis
 
Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)
Eric Eggert
 
Hightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign TestenHightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign Testen
Peter Rozek
 
Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010
SharepointUGDD
 
DNUG Dresden Blend
DNUG Dresden BlendDNUG Dresden Blend
DNUG Dresden Blend
Martin Hey
 
GUIs mit Expression Blend
GUIs mit Expression BlendGUIs mit Expression Blend
GUIs mit Expression Blend
.NET User Group Dresden
 
Plone im Kontext des WCMS Marktes
Plone im Kontext des WCMS MarktesPlone im Kontext des WCMS Marktes
Plone im Kontext des WCMS Marktes
Alexander Loechel
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Stephan Hamberger
 
Webseiten sind keine Gemälde
Webseiten sind keine GemäldeWebseiten sind keine Gemälde
Webseiten sind keine Gemälde
Jens Grochtdreis
 
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Stefan Seifarth
 
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Eric Eggert
 
Digitale Revolution fuer Verlage und lineare Medien
Digitale Revolution fuer Verlage und lineare MedienDigitale Revolution fuer Verlage und lineare Medien
Digitale Revolution fuer Verlage und lineare Medien
neveroff.net
 

Ähnlich wie Mediengerechtes Webdesign (20)

Creasoft c-Day 2009 - Webtechnologien der Zukunft
Creasoft c-Day 2009 - Webtechnologien der ZukunftCreasoft c-Day 2009 - Webtechnologien der Zukunft
Creasoft c-Day 2009 - Webtechnologien der Zukunft
 
Web Design - Inhalte, Interfaces und Interaktion
Web Design - Inhalte, Interfaces und InteraktionWeb Design - Inhalte, Interfaces und Interaktion
Web Design - Inhalte, Interfaces und Interaktion
 
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
20140703 Display & Video Reloaded mit HTML 5 adbalancer Hantschel
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
 
SEO Produktspezifikation für RWD
SEO Produktspezifikation für RWDSEO Produktspezifikation für RWD
SEO Produktspezifikation für RWD
 
Browserstrategien und Progressive Enhancement
Browserstrategien und Progressive EnhancementBrowserstrategien und Progressive Enhancement
Browserstrategien und Progressive Enhancement
 
HTML5-Features
HTML5-FeaturesHTML5-Features
HTML5-Features
 
Echte Lösungen, keine Tricks
Echte Lösungen, keine TricksEchte Lösungen, keine Tricks
Echte Lösungen, keine Tricks
 
Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)
 
Hightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign TestenHightway to Hell - Responsive Webdesign Testen
Hightway to Hell - Responsive Webdesign Testen
 
Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010Dnug dresden blend 5. 5. 2010
Dnug dresden blend 5. 5. 2010
 
DNUG Dresden Blend
DNUG Dresden BlendDNUG Dresden Blend
DNUG Dresden Blend
 
GUIs mit Expression Blend
GUIs mit Expression BlendGUIs mit Expression Blend
GUIs mit Expression Blend
 
Plone im Kontext des WCMS Marktes
Plone im Kontext des WCMS MarktesPlone im Kontext des WCMS Marktes
Plone im Kontext des WCMS Marktes
 
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
Netd@ys 08/09 Workshop - "Von der kreativen Idee zum innovativen Projekt"
 
Barrierefreiheit
BarrierefreiheitBarrierefreiheit
Barrierefreiheit
 
Webseiten sind keine Gemälde
Webseiten sind keine GemäldeWebseiten sind keine Gemälde
Webseiten sind keine Gemälde
 
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
Morning Session: Qualitätskriterien für erfolgreiche Websites - für "Nicht-Te...
 
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
 
Digitale Revolution fuer Verlage und lineare Medien
Digitale Revolution fuer Verlage und lineare MedienDigitale Revolution fuer Verlage und lineare Medien
Digitale Revolution fuer Verlage und lineare Medien
 

Mehr von Gerrit van Aaken

Web-Branding in der Usability-Diktatur
Web-Branding in der Usability-DiktaturWeb-Branding in der Usability-Diktatur
Web-Branding in der Usability-Diktatur
Gerrit van Aaken
 
Webfonts in the wild
Webfonts in the wildWebfonts in the wild
Webfonts in the wild
Gerrit van Aaken
 
Webfonts im Jahr 2010
Webfonts im Jahr 2010Webfonts im Jahr 2010
Webfonts im Jahr 2010
Gerrit van Aaken
 
Videotechnik im web
Videotechnik im webVideotechnik im web
Videotechnik im web
Gerrit van Aaken
 
Die 7 Todsünden des Blogdesign
Die 7 Todsünden des BlogdesignDie 7 Todsünden des Blogdesign
Die 7 Todsünden des Blogdesign
Gerrit van Aaken
 
Design im Immer- und Ueberall-Web
Design im Immer- und Ueberall-WebDesign im Immer- und Ueberall-Web
Design im Immer- und Ueberall-Web
Gerrit van Aaken
 
(Web ) Typography
(Web ) Typography(Web ) Typography
(Web ) Typography
Gerrit van Aaken
 

Mehr von Gerrit van Aaken (8)

11designer
11designer11designer
11designer
 
Web-Branding in der Usability-Diktatur
Web-Branding in der Usability-DiktaturWeb-Branding in der Usability-Diktatur
Web-Branding in der Usability-Diktatur
 
Webfonts in the wild
Webfonts in the wildWebfonts in the wild
Webfonts in the wild
 
Webfonts im Jahr 2010
Webfonts im Jahr 2010Webfonts im Jahr 2010
Webfonts im Jahr 2010
 
Videotechnik im web
Videotechnik im webVideotechnik im web
Videotechnik im web
 
Die 7 Todsünden des Blogdesign
Die 7 Todsünden des BlogdesignDie 7 Todsünden des Blogdesign
Die 7 Todsünden des Blogdesign
 
Design im Immer- und Ueberall-Web
Design im Immer- und Ueberall-WebDesign im Immer- und Ueberall-Web
Design im Immer- und Ueberall-Web
 
(Web ) Typography
(Web ) Typography(Web ) Typography
(Web ) Typography
 

Mediengerechtes Webdesign