CSS entwickelt sich schnell. Statt einer langen Sammlung zufälliger Links helfen wenige, gepflegte Referenzen und ein strukturierter Lernpfad. Moderne Layouts basieren auf Flexbox, Grid, logischen Eigenschaften, responsiven Einheiten und zugänglichen Zuständen.
Inhalt
Verlässliche Referenzen
- MDN Web Docs für Syntax, Beispiele und Browserkompatibilität.
- W3C CSS für Standards.
- web.dev Learn CSS für Lernmodule.
- Can I Use für gezielte Kompatibilitätsprüfung.
Moderner Lernpfad
- Kaskade, Spezifität und Vererbung.
- Box-Modell und normale Flussdarstellung.
- Flexbox und Grid.
- Responsive Design und Container Queries.
- Custom Properties und Farbsysteme.
- Animation mit Rücksicht auf reduzierte Bewegung.
Barrierefreiheit
Fokusmarkierungen dürfen nicht entfernt werden. Prüfe Kontrast, Zoom, Tastaturbedienung, Textumbruch und prefers-reduced-motion. Semantisches HTML bleibt die Grundlage; CSS ersetzt keine Struktur.
Wartbarer Code
- Komponenten und Design-Tokens verwenden.
- Niedrige Spezifität bevorzugen.
- Browser-Reset bewusst wählen.
- Ungenutztes CSS messen.
- Build-Werkzeuge nur bei echtem Bedarf einsetzen.
Links regelmäßig prüfen
Speichere Quellen mit Titel und Zweck, entferne tote oder veraltete Links und bevorzuge Primärdokumentation. Beispielcode sollte in aktuellen Browsern und ohne proprietäre Präfix-Sammlungen getestet werden.
Fazit
Mit MDN, W3C und einem strukturierten Lernpfad bleibt CSS-Wissen aktuell. Gute Stylesheets sind responsiv, zugänglich und bewusst einfach gehalten.
