CSS3

CSS3 ist neben HTML5 eine der neuen Schlüsseltechnologien im Browser. Mit CSS3 lassen sich viele vorher nur schwer umsetzbare Designs leicht ins Web bringen, manche Grafikdatei lässt sich einsparen und mit CSS3-Transformationen hält sogar 3D Einzug ins Webdesign – dank Hardware-Beschleunigung schnell, akkuschonend und ansehnlich.

Diese Schulung bietet einen umfassenden Einstieg in jene Teile von CSS3, die man heute schon in modernen Browsern verwenden kann. Für die weniger modernen Browser gibt es Hacks und Tricks, für den täglichen Einsatz Tipps und Best Practices.

Zielgruppe:
Webdesigner und -entwickler.

Voraussetzungen:
Grundkenntnisse in CSS.

Inhalt:
Die folgenden Module bilden die Standard-Agenda des CSS3-Workshops. Sie bauen in aller Regel nicht aufeinander auf und können fast beliebig kombiniert, gestrichen oder ausgetauscht werden. Auf Sonderwünsche gehe ich gerne ein.

• Hintergründe und Entstehung von CSS und CSS3
  Ähnlich wie HTML5 hat CSS3 eine bewegte Geschichte hinter sich – so ist CSS3 nicht etwa die dritte Ausfertigung des CSS-Standards, sondern die vierte. Des weiteren zeigen viele Tendenzen in modernem CSS eindeutig in die Vergangenheit und vieles ist gar nicht so neu, wie es den Anschein hat.
• CSS3-Selektoren
  Heutiges HTML-Markup ist häufig von sogenannter „Classitis“ geplagt, also einer Vielzahl von Klassen, die einfach nur als Hooks für das Design dienen. Classitis verletzt die Trennung von Markup und Design und macht die Wartung von Webseiten unnötig schwer. Die Lösung für dieses Problem sind die neuen CSS3-Selektoren, die ganz neue Möglichkeiten für die gezielte Ansprache von DOM-Elementen bieten.
• 2D- und 3D-Transformationen
  Auch mit CSS3 besteht Webdesign im wesentlichen aus lauter kleinen Boxen, doch dank Transformationen lassen sich diese Boxen erstmals transformieren. Neben 2D-Transformationen (verschieben, verzerren, rotieren) öffnet sich für CSS-Autoren in modernen Browsern auch die dritte Dimension.
• Boxen und Rahmen
  Abgerundete Ecken von Boxen sind das Vorzeige-Feature von CSS3, allerdings bei weitem nicht das einzige, was CSS in Zukunft für die Gestaltung von Boxen und Rahmen bereit hält – auch skalierbare Hintergründe, Sprite-Borders und vieles mehr stehen auf dem Programm.
• Farben und Farbverläufe
  Neben einer handvoll neuer Farbmodelle führt CSS3 auch Farbverläufe ein. Dieses in jedem Fall nützliche, aber auf den ersten Blick etwas unspektakuläre Feature bietet mehr als man meinen möchte, denn neben einfachen Farbübergängen kann man aus CSS3-Farbverläufen auch komplexe Texturen
  zaubern.
• Schrifteinbettung und -gestaltung
  Schrifteinbettung mit @font-face wird oft zu CSS3 gezählt, ob wohl die Technologie eigentlich steinalt ist und selbst im Internet Explorer 6 funktioniert. Ungeachtet dessen gibt es allerlei Fußangeln, die bei der Einbettung zu beachten sind und CSS3 bringt für die Schriftgestaltung durchaus auch eine oder andere wirklich neue Feature mit.
• Effekte und Animationen
  Animationen werden heutzutage meist per jQuery und andere JavaScript-Bibliotheken umgesetzt. Da dies langsame JavaScript-Engines und das noch langsamere DOM nutzt, sind diese Animationen langsam und ineffizient – ganz anders als die einfachen und vor allem sehr schnellen CSS3-Animationen und -Transitionen.
• CSS-Tools und -Compiler
  Als wäre CSS3 an sich nicht komplex genug, verkomplizieren Vendor-Prefixes, alte Browser und die Notwenigkeit von kreativen Hacks die Umsetzung von Webdesigns zunehmend. Abhilfe können hier nur die richtigen Tools schaffen, die vom einfachen, webbasierten Code-Generator über JavaScript bis hin zum CSS-Compiler reichen.
• Media Queries und Mobile/Responsive Design
  CSS3 und vor allem HTML5 werden wahre Wunderdinge für die mobile Webentwicklung nachgesagt und Media Queries halten dieses Versprechen. Mit nur wenigen Zeilen CSS-Code lassen sich Regeln ganz gezielt je nach Art und Formfaktor des Ausgabegeräts anwenden. Wichtig ist dies für Responsive Design, polyvalentes Webdesign, das Nomal- Tablet- und Handy-Layout auf einmal ist.
• CSS3-Layout
  Heutiges Webseiten-Layout – egal ob es Tabellen, Floats, oder andere Techniken einsetzt – besteht nur aus Notbehelfen. Echte Layout-Techniken werden nämlich erstmals mit CSS3 eingeführt. Egal ob Mehrspaltigkeit oder Grid-Layout – am Ende fragt man sich, wie man je ohne CSS3-Layouts arbeiten konnte.
• Ausblick
  Obwohl manche Browser bis heute CSS3 nicht voll unterstützen, ist bereits CSS4 in Arbeit. Erste Spezifikationen für CSS4-Selektoren, Variablen werden bereits geschrieben und auch jenseits der W3C-Gremien tut sich einiges. Präprozessoren verwandeln CSS in ein reines Compiler-Ziel und die stetig wachsende Komplexität wird auch den Beruf der Webdesigner und -entwickler verändern.

Schulungsunterlage:
Sie erhalten zusätzlich zu den Präsentationsunterlagen ein vom Dozenten empfohlenes Fachbuch zum Thema CSS.

Preis:

900.00 EUR netto (1071.00 EUR inkl. MwSt.)
(beachten Sie unsere Sonderpreise für Studierende)

Termine für diese Veranstaltung:

Zur Übersicht