Flexibilität ist alles

Wenn mich jemand fragt, wie man am besten HTML und CSS lernen kann, verweise ich fast schon traditionell auf Peter Müllers Einsteigerwerk „Little Boxes“ – durch die Ereignisse im Pearson-Verlag ist das Werk kaum noch erhältlich, der Nachfolger ist unter dem Namen „Einstieg in CSS bei Rheinwerk erschienen.

Ganz so grundlegend geht es bei „Flexible Boxes“ nicht zur Sache – wer noch nie HTML oder CSS gesehen hat, benötigt auf jeden Fall zunächst ein Einsteiger-Werk. „Flexible Boxes“ richtet sich an Webentwickler, die bereits „klassische“ Websites geschrieben haben und nun einen Wegweiser in modernere Technologien suchen – und für genau diesen Zweck ist es hervorragend geeignet.

Grundlagen: „Veränderung ist das einzig Beständige“

Im ersten Kapitel wird der Rahmen abgesteckt und der Paradigmenwechsel im Webdesign erläutert: „Nichts Genaues weiß man nicht“. Wer heute Webseiten baut, kann sich kaum noch auf so profane Dinge wie optimale Bildschirmgrößen oder wenige Browser verlassen – Flexibilität ist das Gebot der Stunde, und diese Stärke des Webs wird immer offensichtlicher. Wichtige Grundlagen zu diesem Themenaspekt behandelt das erste Kapitel, bevor sich das Buch in drei Teile aufgliedert.

Teil 1: Neue Strukturen mit HTML5

Wer in modernes Webdesign einsteigen möchte, kommt nicht am neuen Standard HTML5 herum – Peter Müller nimmt sich folgerichtig drei Kapitel Zeit, um die Grundlagen der neuen HTML-Version zu beschreiben. Besonders gut gefallen hat mir, wie es dem Autor gelingt, auch die trockenen Themen rund um die semantischen Elemente wie <strong> und <em> zu erklären.

Letztlich ist all das jedoch nur die Vorstufe, um endlich in die Praxis einzusteigen – und die hat es in sich. Peter Müller entwickelt eine Beispielseite, die sich wie ein roter Faden durch das weitere Werk zieht. Die Stringenz dabei ist beeindruckend – das Gelernte wird direkt angewendet, und fast nebenbei werden adaptive Bilder praxistauglich behandelt.

Lizenz: HTML5 Logo von W3C, CC BY

Teil 2: Moderne Gestaltung mit CSS3

Die Beispielseite dient ab dem zweiten Teil Grundgerüst, auf dem aufbauend CSS3 gelernt wird. Nachdem hilfreiche Tools und Skripte erläutert worden sind, geht es in den Kapitel 8 bis 11 darum, Schritt für Schritt verschiedene Aspekte von CSS3 zu erlernen: Selektoren, Schrift, Boxen und Möglichkeiten für die mobile Navigation.

Besonders gut gefallen hat mir das Kapitel über die mobile Navigation, denn dieses Thema ist durchaus komplex – Peter Müller gelingt eine praxistaugliche und leicht nachvollziehbare Darstellung verschiedener Lösungsansätze.

Teil 3: Responsive Webdesign

Modernes Webdesign kommt kaum ohne das Thema „Responsive Webdesign“ aus – folgerichtig bildet es den letzten Teil von „Flexible Boxes“. Zunächst geht es um die grundlegenden Media Queries und den Meta-Viewport, ohne die im Responsive Webdesign nichts geht, bevor sich zwei Kapitel dem wichtigen Thema „Raster im Webdesign“ widmen – zunächst in der fixen, dann in der flexiblen Variante.

Dass Peter Müller ein Perfektionist ist, der auf Details achtet, beweist das 15. Kapitel, in dem es um die vielen Feinheiten geht: Wie schaffe ich eine optimale Zeilenlänge trotz variabler Breite? Wie realisiere ich flexible Videos und Slider? Und wie erlaube ich meinen Nutzern Interaktionen mit dem Text, etwa über den beliebten Accordeon-Effekt?

Den Abschluss macht ein Kapitel, dass zu meinen Favoriten gehört: CSS-Frameworks, anschaulich erklärt an den beliebten Vertretern YAML4 und Foundation.

Sinnvolle Ergänzungen in der zweiten Auflage

In der zweiten Auflage hat Peter Müller sein Werk an vielen Stellen aktualisiert und um sinnvolle Entwicklungen ergänzt – besonders um die Layouttechnologie Flexbox sowie responsive Bilder.

Fazit: Gutes Buch für Webentwickler

„Flexible Boxes“ zeigt Peter Müller als Webentwickler auf der Höhe der Zeit – die wichtigsten aktuellen Entwicklungen der Webtechnologie sind enthalten, und die vielen Link- und Tooltipps alleine lohnen bereits die Anschaffung. Gleichzeitig beweist „Flexible Boxes“, warum Peter Müller als einer der wichtigsten Webdesign-Lehrer in deutscher Sprache gilt: Sein Werk ist didaktisch hervorragend aufgebaut. Das Beispielprojekt zieht sich wie ein roter Faden durch das Buch, erläutert verschiedenste Aspekte der Technik und wird flexibel variiert, ohne dass es aufgesetzt wirkt. Das ist wunderbar zu lesen und wird niemals langweilig.

Gut gelöst sind die vielen Code-Beispiele, die sich durch „Flexible Boxes“ hindurchziehen – selten habe ich ein Webentwicklung-Buch gesehen, dem ich so gut und ganz ohne den Rechner neben mir zu haben folgen konnte. Zahlreiche Workshops strukturieren das Gelernte und machen Lust darauf, Code-Fragmente direkt in die eigenen Projekte zu kopieren.

In eine Rezension gehört natürlich auch zu sagen, was Peter Müllers Buch nicht ist: Es ist keine HTML- und CSS-Einführung – Grundkenntnisse in HTML und CSS sind Pflicht. Auch behandelt der Autor keine gestalterischen Aspekte – er erklärt, was und wie etwas geht; nicht, wann man etwas einsetzen sollte. Das ist aber kein Makel – kein Buch kann alle Aspekte eines umfangreichen Themas wie Webdesign abdecken.

„Flexible Boxes“ ist ein Technik-Buch rund um modernes, flexibles Webdesign, von dem ich extrem viel gelernt habe – ein klarer Lesetipp für Webentwickler, die auf unterhaltsame Weise ihr Wissen um die neuen technischen Herausforderungen im Web aufbessern möchten.

Kleines Update: Eine Leseprobe gibt es drüben bei Peter.