icon-arrow-lefticon-arrow

Kurzbeschreibung

Das Thema »Responsive Web Design« bewegt wie Web-­Szene nun bereits seit einigen Jahren. Doch unter »responsive« verstehen sowohl Kunden als auch Agenturen oft lediglich die Optimierung einer Website für Smartphones und Tablets. In Wahrheit ist Responsive Web Design eine neue Philosophie im Web Design und erfordert ein Umdenken bei Kunden, Kundenberatern, Konzeptionern, Projektleitern, Designern und Entwicklern.

Dozent Jonas Hellwig im Gespräch mit Seminarteilnehmern der Webinale 2016 in Berlin
Dozent Jonas Hellwig im Gespräch mit Seminarteilnehmern der Webinale 2016 in Berlin. Foto: Stefan Kny

Erfolgreiche responsive Projekte werden interdisziplinär umgesetzt. Jeder Projekt-Mitarbeiter muss daher verstehen was die Kollegen machen und in welchen Bereichen sich Schwierigkeiten ergeben. Kundenberater und Projektleiter wiederum bilden die Schnittstelle zum Kunden und müssen dafür sorgen, dass der Kunde die Vorteile des »neuen« Workflows versteht und in jeder Phase des Projekts von der Agentur geleitet wird.

Angefangen bei den Grundlagen von Responsive Design über Layoutmuster, Touch-Screen-Optimierung und Navigationskonzepte bis hin konzeptionellen Ansätzen wie Mobile First und Progressive Enhancement werden Sie in diesem Seminar alle Aspekte von Responsive Design kennenlernen, ohne dabei tiefer als notwendig in die technischen Details einzusteigen. Sie lernen wo die Herausforderungen im Responsive Web Design liegen, wie Sie Fehler in Gestaltung und Entwicklung vermeiden können und was Sie bei der Planung und Kommunikation von responsiven Websites beachten sollten.


Agenda

Konzeptionelle Grundlagen

  • Das »Content First«-Prinzip
  • Das Nutzungsverhalten auf mobilen Endgeräten kennen und Konventionen berücksichtigen
  • Technische Lösungen für mobile Websites kennen und beurteilen können: m.dot-, adaptive- und responsive Website, Facebook Instant Articles, Google AMP etc.
  • Die Unterschiede kennen: Responsive Design, Adaptive Design, responsive Layout und adaptive Layout
  • Charakteristika des Responsive Web Design bzw. modernen Webdesigns
  • Klassischer & skalierter Viewport – Websites für unterschiedliche Geräte und für verschiedene Zoomstufen konzipieren
  • Die Layout-Typen einer Website – Fixed-, Fluid- und Elastic Layout
  • Statische Layouts in responsive Layouts überführen
  • Layouts mit Breakpoints & Media Queries umstrukturieren
  • Die Hintergründe von konzeptionellem, gestalterischem und technischem »Mobile First« verstehen

Responsive Workflow

  • Der neue Workflow im Überblick
  • Design im Browser
  • Atomic Design / Atomic CSS
  • Frameworks – Bootstrap & Co.
  • Gestaltung mit Style Tiles & Style Guides
  • »Graceful Degradation« & »Progressive Enhancement«
  • Teambuilding – was charakterisiert erfolgreiche Web-Teams?
  • Praxisbeispiele & Hilfsmittel
  • Adobe Muse, Adobe XD & Co.

Flexible Layouts

  • Flexible Gestaltungsraster im Responsive Web Design
  • Konzeptionelle Hintergründe von Float-basierte Rastern, Flexbox und CSS Grids kennen
  • Gestaltung für Touchscreens
  • Layout-Muster: Mostly Fluid, Column Drop, Off-Canvas & Co.
  • Content Choreography: Inhalte an verschiedenen Positionen anzeigen
  • Navigationsformen: DropDown, Mega Menu, Priority+ & Co.

Grafiken & Inhalte

  • Grafiken im Responsive Design – Herausforderungen beim Umgang mit Bildformaten, Bildausschnitten, Bildschirmauflösungen, Redakteuren und Technologien
  • Responsive Typography – Texte flexibel und lesbar gestalten
  • Tabellen für kleine Displays konzipieren und adaptieren
  • Videos im Responsive Design
  • Formulare für die Nutzung auf Smartphones und Tablets optimieren
  • Layouts und Inhalte für hochauflösende Displays vorbereiten

Optimierung

  • Tools zum Testen von flexiblen Websites
  • Die Arbeit mit Hilfe eine Performance-Budgets

Kommunikation

  • Verkaufsargumente für Responsive Design
  • Angebote verlässlicher kalkulieren
  • Kundenführung im responsive Workflow
  • Verkaufsargument »Workflow«

Diese Schulung bieten wir auch mit technischem Schwerpunkt an.
Detaillierte Informationen finden Sie hier.


Für wen ist das Seminar »Responsive Webdesign für Konzepter, Projektleiter und Designer« gedacht?

Das Seminar richtet sich an Konzeptioner, Kundenberater, Projektleiter, Designer und Entscheider ohne HTML und CSS-Kenntnisse. Das Seminar ist als lebhafter Vortrag mit starkem Diskussionscharakter geplant. Die Übungen werden am eigenen Rechner, bzw. gemeinsam an Beamer und Flipchart erarbeitet.


Dozent: Jonas Hellwig

Jonas HellwigJonas Hellwig arbeitet als Web Designer, Video-Trainer, Fachbuchautor und Dozent in Berlin. Neben UX/UI-, Frontend- & Responsive Design hat er sich auf WordPress und Workflow-Optimierungen im Web Design spezialisiert und ist Gründer der Agentur kulturbanause® (kulturbanause.de). Auf blog.kulturbanause.de veröffentlicht er interessante Artikel, Tipps und Tutorials zum Thema Web Design. Jonas Hellwig ist regelmäßig als Sprecher auf Veranstaltungen zum Thema Webdesign anzutreffen und unterstützt Digitalagenturen und Unternehmen bei der Planung und bei der technischen Umsetzung von Web-Projekten.


Kunden-Feedback zu unseren Inhouse-Schulungen

Das Responsive-Training fanden wir klasse präsentiert und sehr praxisbezogen. Trotz der Themen-Agenda ist Jonas immer wieder auf individuelle und Projekt-bezogene Fragen eingegangen. Besonders gefallen hat uns die gut verständliche Zusammenführung der beiden Welten Design und Programmierung. Im Anschluss haben wir gleich unser erstes Projekt zu 100% durchziehen können.

Dezember 2014, Mathias Weber, Senior Project Manager, AP Design GmbH

Herr Hellwig gestaltete das umfangreiche und auf uns individuell zugeschnittene Material spannend und mit vielen Beispielen (auch direkt von einem unserer aktuellen Projekte), so dass das Lernen leicht fiel. Auf all unsere Fragen hatte Herr Hellwig sofort eine Antwort sowie aktuelle Online-Beispiele zur Hand. Aufgrund der Praxisnähe war das Training äußerst authentisch und in sämtlichen Punkten eine große Bereicherung. Auch bei Fragen über Themen die den Workshop überstiegen, bekamen wir reichlich Informationen. Ein perfekter Workshop, der mit Sicherheit nicht der letzte sein wird. Auch die Betreuung im Nachhinein ließ keine Wünsche offen. Nachträglich auftretende Fragen wurden in den kommenden Wochen geduldig per Email beantwortet.

Juni 2013, Melanie Schupp, P8 Paulsen Media GmbH

Der Workshop zu SVG-Grafiken war spannend, zukunftsweisend und in einem breiten Arbeitsumfeld bereichernd. Jonas Hellwig gibt einen umfassenden Einblick in Anwendungsgebiete und fokussiert gekonnt die individuell relevanten Schwerpunkte. Ein intensiver und wertvoller Lehrgang – besonders an der Schnittstelle zwischen Gestaltung und Entwicklung, der zu neuen Ansätzen motiviert und mir als Designer technische Möglichkeiten verständlich und zugänglich macht.

April 2017, Miriam Stepper, Grafik-Designerin, infoclick.ch

Ein sehr interessantes, hilfreiches und praxisorientiertes Seminar. Didaktisch gut aufbereitet und motivierend präsentiert. Vielen Dank dafür.

November 2016, Dejan Perc, Leiter Digitales Marketing, ACE Auto Club Europa

Für mich das ideale Seminar um mich auf dem Gebiet des Responsive Design in der Theorie fit zu machen. Der Wissensanteil und Lerneffekt war sehr groß.

April 2017, Lars Zacharias, Business Analyst


Öffentliche Schulungen zu diesem oder einem ähnlichen Thema

Alle öffentlichen Schulungstermine anzeigen

Unsere Agentur in Berlin realisiert vom durchgestylten One-Pager bis zur funktionalen Konzern-Website Projekte mit sehr unterschiedlichem Umfang. Wir sind nicht auf eine Branche festgelegt und haben u.a. mit folgenden Kunden erfolgreich zusammengearbeitet: