Gestaltung und Code – CSS, SVG & Co. (webtech Conference)
Kurzbeschreibung
Viele grafische Bestandteile einer Website lassen sich heute vollständig, oder zumindest nahezu vollständig, über den Code realisieren. Dabei reicht die Palette von klassischen Layout-Elementen mit Hilfe von CSS, über komplexe Gestaltungsmöglichkeiten, Farbschemata und Styleguides mit Hilfe von Präprozessoren wie Sass oder Less bis hin zu »echten« grafischen Elementen mit Hilfe des codebasierten Dateiformats SVG.
In diesem Workshop erfahren Sie wie attraktive und robuste Grafiken im Browser entstehen. Neben den Grundlagen des »Design in the Browser«-Workflows, lernen Sie zahlreiche Tipps und Tricks kennen um mit geringem Aufwand erstaunliche grafische Effekte zu erreichen. Auch CSS-Animationen und Transformationen, browserübergreifende-, flexible- und semantisch wertvolle Gestaltung werden in diesem ganztägigen Seminar ausführlich behandelt. Außerdem erfahren Sie, welche Tools Ihnen die Arbeit spürbar erleichtern können.
Neben den gestalterischen Möglichkeiten von CSS und Sass, lernen Sie auch das SVG-Format detailliert kennen. Sie erfahren was es bei der Gestaltung in Illustrator und Co. zu beachten gibt und wie Sie SVG-Grafiken exportieren, einbinden und optimieren können. Darüber hinaus bietet das Format SVG faszinierende Möglichkeiten in Kombination mit CSS und JavaScript, denn Sie können SVGs umfärben, animieren und anderweitig manipulieren. Darüber hinaus ist es möglich nur Teile einer SVG zu laden, was es Ihnen wiederum ermöglicht mehrere Layout-Elemente in einer Datei zu verwalten und Performance schonend auf der Website einzusetzen.
Zum Abschluss des Seminars werfen wir noch einen Blick in die Zukunft und lernen einige experimentelle CSS-Styling-Techniken kennen, die Ihnen vielleicht schon bald ganz neue gestalterische Möglichkeiten bieten.
Zielgruppe
Webdesigner, Grafiker, Mediengestalter, Frontend-Entwickler und Projektleiter. Vorkenntnisse im Bereich HTML, CSS, Photoshop & Illustrator. sind sinnvoll (aber nicht notwendig), da im Rahmen des Workshops keine Grundlagen vermittelt werden.
Durchführung
Der Workshop ist als praxisorientiertes Seminar mit Diskussionscharakter geplant. Mit dem eigenen Notebook können die Beispiele live nachvollzogen werden, der Dozent verwendet die Creative Cloud von Adobe. Alle im Workshop entstandenen Beispiele sowie die Workshop-Inhalte werden den Teilnehmern nach dem Termin zur Verfügung gestellt. Die Sprache des Seminars ist Deutsch. Die Schulungsunterlagen werden ebenfalls in deutscher Sprache bereitgestellt.
Dozent: Jonas Hellwig
Kunden-Feedback zu unseren öffentlichen Schulungen
[testimonials kategorie=“Oeffentliche Schulung“ posts_per_page=“2″]