3 – Design for Everyone
Info
Responsive? Ja klar! Aber wie? Was gehört alles dazu, wenn ich eine Seite designen will,
die komplett responsive ist? Und wie schaffe ich es, dass jede*r meine Seite einfach und
produktiv nutzen kann? In Workshop Nummer 3 soll es darum gehen, sich intensiv mit
Fragen zu Responsive Design und Accessibility auseinanderzusetzen. Was genau versteht
man unter Accessibility? Und für wen ist das eigentlich relevant? Was muss alles
beachtet werden, wenn eine Seite sowohl für Desktops als auch für Mobilgeräte entwickelt
wird – und gibt es diese Trennung überhaupt noch?
Let's find out!
Kursinhalte
-
Responsive Design
- Verhalten von UI-Elementen
- Lesbarkeit & Typografie
- Probleme und Schwierigkeiten
- Mobile First
-
Accessibility
- Erklärung und Definition
- Relevanz und Zielgruppen
- Möglichkeiten des barrierefreien Designs
- Umsetzung
Materialien
- Übung 01: Accessibility Redesign Download ▼
- Übung 02: Große Taten Download ▼
Mehr Stuff
- Präsentationsfolien
- Feedback Workshop 3
- Beispiel-Lösung Accessibility Redesign (yulp)
- Beispiel Responsive Design (lieferandu)
- AXE – Accessibility (A11y) Testsuite mit Browser-Erweiterung
- WAVE – Accessibility Testsuite, funktioniert auch im Browser
- Figma Plugins, die bei Accessible Design helfen, bspw. Color Contrast
- Nette kleine Responsive Animation