Webdesign: CSS - Aufbaukurs

Aufbauend auf dem CSS-Grundlagenkurs und der HTML-Einführung stehen nun verschiedene Layout-Techniken im Zentrum. Absolute, relative, statische und fixe Positionierungen bei der Spaltenerstellung werden Sie kennen lernen. Ergänzt werden diese Techniken durch die die Vorstellung des CSS-Frameworks YAML.

Der CSS-Aufbaukurs wird vertieft durch einen YAML-Wochenendkurs!

Dieser Präsenzkurs wird durch die VHS-Lernplattform Moodle zur Vertiefung und Kooperation nach dem Kurs ergänzt. Näheres erfahren Sie vom Kursleiter. Eine Videodarstellung von Moodle finden Sie unter http://moodle.de Die VHS-Moodle-Lernplattform finden Sie unter: http://www.berliner-vhs.de

---

Seminarinhalte:

• Block- und Inline-Elemente: DIV und SPAN
• CSS-Layout
• CSS-Navigation
• Float-Techniken und die Float Theorie
• Import-Techniken
• Maßeinheiten: fixes (px), fließendes (%) und elastisches (em) Layout
• Relative, fixe und absolute Positionierungen
• YAML
• CSS 3 (W3C) und bei Stefan Münz

Voraussetzungen:
Grundkenntnisse in (X)HTML und CSS sowie gute Windowsgrundlagen werden vorausgesetzt.

Lernziel:
Die Erstellung eines CSS-Layouts lernen Sie an Hand unterschiedlicher Techniken kennen.

Zielgruppe:
Personen, die privat oder beruflich eine Website bearbeiten und pflegen möchten.

Methoden:
Vortrag, Übungen, Gruppenarbeit, Einzelarbeiten

Software:
Phase 5, TopStyle Lite

Termin: 2013

---

Quellen:

Die aktuelle, aber nicht mehr favorisierte CSS-Version ist CSS2 vom 12.Mai 1998. Eine deutsche Übersetzung ist auch erhältlich. Die CSS 2.1 Empfehlung vom 25. April 2004 wurde erneuert durch eine andere Fassung vom 12. April 2011 als Working Draft. Am 7. Juni 2011 wurde nun endlich die endgültige Empfehlung für CSS 2.1 veröffentlicht. Diese wird aktuell vom W3C empfohlen.

Die Einstiegsseite zu CSS ist auch beim W3C zu finden. Zusätzlich gibt es eine Seite zur aktuellen Arbeit.

---

Browserunterstützung:

• Acid 1-Test
• Acid 2-Test
• Acid 3-Test
• Browserarchiv
• Browsershots
• Browserstatistik
• Browserunterstützung
• Your Browser matters

Navigationen: Tools zur Erstellung

• CSS Menu Generator
• CSS Portal
• Free DHTML Menu Bilder

Templates: CSS-Layout

• Artisteer
  • Artisteer Forum
  • Artisteer Vor- und Nachteile und Alternativen
• Blue Robot
• CSS Creator
• CSS Intensivstation
• CSS Page Layout Templates
• CSS Play
• CSS Template Heaven
• doTemplate
• Freie CSS-Templates
• HP-G
• Make Template
• Multiplex-Templates
• Open Source Templates
• Simple CSS
• Template Hilfe
• Templato.de
• The Noodle Incident
• The Style works
• Yaml

Toolbars: Browsererweiterungen für Mozilla Firefox

• Firebug
  • Firebug-Tutorial deutsch
• Web Developer

Weiterführende Links

• Barrierefreies Webdesign
• Clearfix
• Creative Commons
• CSS Lint und die Regeln
• CSS Positionierung
• Einfach für Alle
• em-based Layout
• em Calculator
• Golem Specials
• Internet Explorer und hasLayout
• Table2CSS

---

Buchtipps:

Ingo Chao, Corina Rudel (2011): Fortgeschrittene CSS-Techniken inkl. Debugging und Performance-Optimierung. 4., aktualisierte und erweiterte Auflage. Galileo Press GmbH, Bonn.
Dirk Jesse (2008): CSS-Layouts. Praxislösungen mit YAML 3.0 - 2., aktualisierte und erweiterte Auflage. Galileo Press GmbH, Bonn.
Stefan Münz (2010): HTML5 Handbuch. Franzis Verlag, Poing. Eine kostenlose Version gibt es auf seiner Website