Kurzbeschreibung

Das Thema »Responsive Web Design« bewegt die Web-­Szene nun bereits seit Jahren. Doch unter »responsive« verstehen sowohl beauftragende Unternehmen 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 in Beratung, Projektleitung, Konzeption, Design und Entwicklung.

Erfolgreiche responsive Projekte werden interdisziplinär umgesetzt. Jede am Projekt beteiligte Person muss daher verstehen, was das Team macht und in welchen Bereichen sich Schwierigkeiten ergeben. Beratung und Projektleitung wiederum müssen dafür sorgen, dass Kundinnen und Kunden die Vorteile des »neuen« Workflows verstehen und in jeder Phase des Projekts von der Agentur geleitet werden.

Angefangen bei den Grundlagen von Responsive Design über Layoutmuster, Touch-Screen-Optimierung und Navigationskonzepte bis hin zu konzeptionellen Ansätzen wie Purpose First, 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 »Purpose First«-Prinzip
  • Das Nutzungsverhalten auf mobilen Endgeräten kennen und Konventionen berücksichtigen
  • Responsive Websites im Vergleich zu PWA, AMP & Co.
  • Die Unterschiede kennen: Responsive Design, Adaptive Design, responsive Layout und adaptive Layout
  • Intrinsic Design
  • 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
  • Informationsarchitektur und Navigationsbereiche planen

Responsive Workflow

  • Der neue Workflow im Überblick
  • Design im Browser
  • Frameworks – Bootstrap & Co.
  • Gestaltung mit Design Tokens und Style Tiles
  • Design Systeme und »Atomic Design«
  • »Graceful Degradation« & »Progressive Enhancement«
  • Teambuilding – was charakterisiert erfolgreiche Web-Teams?
  • Praxisbeispiele & Hilfsmittel

Flexible Layouts

  • Flexible Gestaltungsraster im Responsive Web Design
  • Konzeptionelle Hintergründe von float-basierten Rastern, Flexbox und CSS Grids kennen
  • Gestaltung für verschiedene Bedienkonzepte (Touch, Voice etc.)
  • Layout-Muster: Mostly Fluid, Column Drop, Off-Canvas & Co.
  • Content Choreography: Inhalte an verschiedenen Positionen anzeigen
  • Navigationsformen: DropDown, Mega Menu, Priority+ & Co.
  • Responsive Navigationen planen
  • Responsive Website-Templates und -Komponenten planen
  • Moderne Design Tools (Sketch, XD, Figma etc.) im Zusammenhang mit Responsive Design

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«

Zielgruppe

Dieses Seminar richtet sich an Personen aus Konzeption, Design, Projektleitung und Kundenberatung sowie an alle Interessierten, die von konzeptioneller, strategischer und gestalterischer Seite in das Thema »Responsive Design« einsteigen möchten.

Das Seminar ist als lebhafter Vortrag mit starkem Diskussionscharakter geplant. Die Übungen werden mit Stift und Papier, am eigenen Rechner, bzw. gemeinsam an Beamer und Flipchart erarbeitet.

Die Sprache des Seminars ist Deutsch. Die Schulungsunterlagen werden ebenfalls in deutscher Sprache bereitgestellt.

Veranstaltungsort & Verpflegung

Das Seminar findet in der »WeiberWirtschaft« in der Anklamer Str. 38 in Berlin-Mitte statt.

Fotos des Seminarraums in der Weiberwirtschaft Berlin. Fotos: Weiberwirtschaft

Der Eingang befindet sich im Durchgang vom 1. Innenhof in den 2. Innenhof rechts im Aufgang. Sie finden die Seminarräume im 4. OG. Ein Aufzug ist vorhanden.

Kaffee, Tee, kalte Getränke, Obst und Gebäck stehen Ihnen den ganzen Schulungstag über zur Verfügung. In der Mittagspause gehen Sie gemeinsam mit dem Dozenten und den anderen Teilnehmern in einem Restaurant in der Nähe des Seminarraums essen. Dort werden neben fleischhaltigen auch vegetarische und vegane Gerichte angeboten. Die Kosten sind im Seminarpreis enthalten.

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 Workflow-Optimierungen im Design-Prozess 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 Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Website-Projekten.

Kunden-Feedback zu unseren öffentlichen Schulungen

Toll erklärt und ganz viel Wissen vermittelt. Jonas bringt die Dinge auf den Punkt und man kann sehr leicht folgen.

Mai 2017, Kerstin Müller, mueller macht web

Great course! I came with no background knowledge and what I learned in these 2 days was amazing! I can definitely recommend it!

Mai 2019, Joshua Barton, International Marketing, DKMS

Tolles Seminar! Sehr praxisnah, uptodate mit viel, viel Info. Toller Seminarstil. Ich habe in 2 Tagen extrem viel gelernt. Vielen Dank

Mai 2018, Dido Krämer, Grafik-Designerin

Tolles und kurzweiliges Seminar! Ich hätte nicht gedacht, in so kurzer Zeit so viel zu lernen und zu verstehen. Ich habe richtig viel Spaß am Thema gewonnen.

Mai 2019, Phil Hoffmann, International Marketing, DKMS GmbH

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 diesen Termin anmelden

Wenn Sie sich für »Responsive Web Design – Konzept, Design, Projektleitung (3 Tage)« am 30.11.2020 – 02.12.2020 in Berlin anmelden möchten, füllen Sie bitte das folgende Anmeldeformular sorgfältig aus. Wir verwenden diese Angaben für die Rechnung. Sie erhalten eine Kopie Ihrer Angaben per E-Mail.

Bitte beachten Sie, dass das Seminar nur stattfindet, wenn die Mindestteilnehmerzahl erreicht wird. Wir informieren Sie, sobald die Veranstaltung garantiert stattfindet – spätestens 30 Tage vor dem Termin. Sie erhalten die Rechnung sobald das Seminar zustandegekommen ist. Weitere Infos zur Veranstaltung senden wir Ihnen kurz vor dem Termin.

Details zu unserem Rabattsystem finden Sie hier.

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