Responsive Webdesign – die technische Umsetzung
Von Jonas In diesem Workshop zum Thema »Responsive Webdesign« lernen Sie neueste Techniken zur Erstellung von flexiblen Websites kennen.
Kurzbeschreibung
Das Thema »Responsive Design« beschäftigt Webdesigner bereits seit einigen Jahren. Neben großen, konzeptionellen Herausforderungen müssen sich auch Entwickler mit neuen Techniken vertraut machen, um flexible und robuste Layouts entwickeln zu können.
In diesem Seminar erfahren Sie, wie moderne Weblayouts technisch umgesetzt werden. Unabhängig von der Größe des Displays, von der Bildschirmauflösung oder dem verwendeten Browser. Anhand einzelner in sich abgeschlossener Übungen entwickeln Sie flexible Layouts und Komponenten, gestalten optimal lesbare Texte, lernen die neuen CSS-Layout-Module Grid und Flexbox kennen und setzen Breakpoints und Media-Queries sinnvoll und zukunftssicher ein.
Auch die Optimierung von Grafiken für hochauflösende Displays und anspruchsvolle Themen wie Responsive Images stellen für Sie nach diesem Seminar keine Hindernisse mehr dar.
Agenda
- Grundlagen
- Klassischer & skalierter Viewport
- @viewport
- Die Layout-Typen einer Website
- Breakpoints & Media Queries
- Adaptive Layout & Responsive Layout
- »Progressive Enhancement«
- »Mobile First« & »Content First«
- Design im Browser
- Flexible Layouts entwickeln
- Flexible Gestaltungsraster entwickeln
- Ein verändertes Box-Modell
- Verschachtelte Gestaltungsraster
- Content Choreography
- Das Flexbox-Modul von CSS
- Das Grid-Layout-Modul von CSS
- Tipps und Tricks mit display:table
- Responsive Typography
- Den Workflow optimieren
- Rapid Prototyping – Schnell funktionale Protoypen entwickeln
- Platzhalter und Code-Vorlagen
- Responsive Design testen
- Zukunftssichere Websites entwickeln
- Breakpoints »richtig« setzen
- Technische Einzellösungen
- Grafiken im Responsive Design – picture, srcset & Co.
- Videos im Responsive Design
- Tabellen im Responsive Design
- Formulare
- Optimierung für hochauflösende Displays
- SVG und Webfonts
- Performance-Optimierung
Voraussetzungen & Zielgruppe
Das Seminar richtet sich an Web-Designer. Solide HTML und CSS-Kenntnisse werden erwartet.
Es ist ein Workshop mit Diskussionscharakter geplant. Wir können für das Seminar insgesamt acht Apple iMacs bereitstellen. Wenn Sie Ihr eigenes Laptop nutzen wollen bzw. können, geben Sie dieses bitte bei der Anmeldung an. Die maximale Teilnehmerzahl ist 10.
Veranstaltungsort & Verpflegung
[info_location_haus_der_wissenschaft_bremen]
[info_catering]
Dozent
Jonas Hellwig ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.
Kunden-Feedback zu unseren öffentlichen Schulungen
[testimonials kategorie=“Oeffentliche Schulung“ posts_per_page=“5″ slider=“true“]
Geschrieben von Jonas
Jonas ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.