Videotraining: »CSS3 für Webdesigner«

CSS3 - Logo

Im Oktober 2014 ist bei video2brain ein neues Videotraining von mir erschienen: 

Das Videotraining fasst das Wichtigste zu CSS3 zusammen, und zwar für Normalsterbliche, die nicht in erster Linie professionelle Programmierer oder Frontend-Entwickler sind. Das Training besteht aus folgenden Teilen: 

  1. CSS3 im Überblick 
  2. Textgestaltung: Schriften, Schatten und Iconfonts
  3. Boxen gestalten: Border-Box, Farbverläufe und Animationen
  4. Workshop: Logo mit CSS3 erstellen 

Trailer

Das folgende Video zeigt im gut zweiminütigen Trailer einen Überblick über die Themen. 

Teil I: CSS3 im Überblick

Im ersten Teil des Videotrainings gibt es die folgenden Filme: 

  • Überblick zu CSS3 für Webdesigner
  • Die Geschichte von CSS3 
  • Die Module von CSS3 
  • Quellen und Nachschlagewerke 

Das folgende Video zeigt die Geschichte von CSS3 im Überblick. 

Teil II: Text gestalten mit CSS3

Der praktische Teil des Videotrainings beginnt dem Gestalten von Text: 

  • Webfonts mit @font-face 
  • Schrift gestalten mit text-shadow
  • Iconfonts - Grafiken als Schrift 

Der folgende Film zeigt ein paar nützliche Websites zum Thema Iconfonts. 

Teil III: Boxen gestalten - Border-Box, Farbverläufe und Animationen

Im dritten Teil des Trainings geht es um die Gestaltung von rechteckigen Boxen: 

  • Mehrspaltige Layouts mit der border-box 
  • Mehrere Spalten im Fließtext mit multi-column
  • Runde Ecken mit border-radius 
  • Einfache und komplexe Schlagschatten
  • Farbverläufe 
  • Flächendeckende Hintergrundgrafiken: background-size 
  • Transparenzen
  • Sanfte Übergänge mit transition 
  • Animationen 
  • Nützliche Online-Tools 
  • Workshop: Ein Logo mit CSS3 

Der folgende Film zeigt die Erstellung von flächendeckenden Hintergrundgrafiken, und zwar mit einem Leuchtturm vor der Küste von Porto (06:04min). Nach der Einbindung der Hintergrundgrafik wird dann im Film über Transparenzen der weiße Textbereich so gestaltet, dass der Leuchtturm zwar durchscheint, der Text aber trotzdem lesbar bleibt. 

Workshop: Ein Logo mit CSS3

Zum Abschluss zeige ich Ihnen, wie Sie das Gelernte anwenden können. Nur mit CSS erstellen Sie das Logo der Website groningen-info.de. 

Ich wünsche Ihnen viel Vergnügen.

Peter Müller - Autor und Dozent

Mein Name ist Peter Müller. Ich bin Autor diverser Fachbücher und Videotrainings, Dozent und Webworker.

Ab und an schreibe ich hier im Blog Beiträge zu den verschiedensten Themen, aber meistens hat es was mit dem Web zu tun.