Thank you @chrispattle!
Danke für den Start dieser Reihe! Wenn ich es richtig sehe, wird das eine hervorragende Einführung in State-of-the-Art Web-Entwicklung. Empfehle sie den COS-Studenten und werde so viel für möglich für meine noch ganz rudimentäre erste Eleventy-Site (off_gallery graz) stehlen.
Gestern habe ich zum ersten Mal versucht, in einer Einführung in HTML und CSS auf die Erstellung komplexer, Grid-basierter Seiten mit der Technik von One True Layout einzugehen. Eine mutige Studentin führte in das Thema ein; anschließend versuchten die Studierenden, jeweils selbst eine mehrspaltige Beispielseite mit dem Layout-Generator zu erstellen, den Alex Robinson in seinem Aufsatz mitliefert. Bei vielen hat das überraschend schnell geklappt.
Es handelte sich um eine Veranstaltung für angehende Journalisten und PRler, nicht für Designer. Ich bin mir immer noch nicht sicher, wie viel HTML- und CSS-Wissen diese Gruppe braucht, und wie man diese Themen so unterrichtet, dass sie auch für die nicht technikaffinen Studenten verdaulich sind. Es führt wohl weiter, exemplarisch mit komplexen, aber realistischen Layout-Techniken zu arbeiten, als nur Basics zu behandeln, die die meisten praktisch kaum verwenden werden.
Gestern habe ich zum ersten Mal Firebug beim Anpassen von CSS verwendet, und ich kann nur sagen: es ist ein Supertool. Ein paar Details: Ein Mouseover über die DOM-Darstellung bewirkt, dass die entsprechenden Blöcke im Dokument gehilited werden. Man sieht nicht nur, welche CSS-Regeln es gibt, sondern auch, welche überschrieben wurden. Numerische Werte im Stylesheet lassen sich mit den Pfeiltasten verändern.
Mehr dazu: YUI Theater: Joe Hewitt, Welcome to Firebug 1.0 und Lauren Garcias Zusammenfassung der im Video gezeigten Präsentation. Beschrieben wird z.B., wie Veränderungen eines Dokuments dynamisch angezeigt werden. Eindrucksvoll ist es, mit Firebug die Client-Server-Kommunikation beim Eintragen eines Termins in den Google-Kalender zu verfolgen.
Die Anregung, Firebug zu verwenden, verdanke ich Dirk Jesses guter Zusammenstellung von Firefox-Extensions zur CSS-Entwicklung.
Vor Monaten bin ich auf einen Hinweis Eric Meyers auf Alex Robinsons In search of the One True Layout gestoßen. Meyer bezeichnet Alex Robinsons Methode CSS-Layouts zu definieren als "Layout-Revolution" und ersten zufriedenstellenden Versuch, mit CSS beliebige Grid-orientierte Layouts zu erzeugen, also mit Spalten und horizontal angeordneten Blöcken zu arbeiten.
Am Wochenende habe ich Robinsons Artikel zum ersten Mal gelesen. Die Methoden, die er vorschlägt, sind tatsächlich verblüffend simpel. Bei Kolumnen werden z.B. einfach float
s verwendet, deren Position durch einen negativen Wert für margin
festgelegt wird. Dadurch ist das Layout unabhängig von der Position des Abschnitts im Quelltext. Auch bei den übrigen Komponenten von Robinsons Layout-Konzept besteht das Hauptziel darin, das Layout konsequent vom Quelltext zu trennen. Der HTML-Autor kann so auf Markup verzichten kann, das nur aus gestalterischen Gründen eingefügt wird. Für ein Layout, das in allen gängigen Browsern funktioniert, braucht Robinson lediglich ein wrapper-div
und eine Klasse (vertical align
).
Robinsons Technik interessiert mich aus zwei Gründen: Ich hoffe, dass sie es leichter macht, HTML und CSS zu unterrichten, und ich möchte sie auch für Projekte verwenden. Zuerst zum Unterricht:
Durch Anne van Kesteren auf die Web Hypertext Application Technology Working Group (WHTWG) gestoßen. Sie beschäftigt sich mit der Entwicklung von Techniken für Web-Applikationen; beteiligt sind Verantwortliche für die Browser Mozilla, Opera und Safari. Die Gruppe strebt Rückwärts-Kompatibilität vor allem zum Internet Explorer 6 an. Die Spezifikationen werden dem W3C vorgelegt, um dort standardisiert zu werden. Dieses Verfahren wurde gewählt, weil der Standardisierungsprozess des W3C zu langsam sei, um proprietären Entwicklungen zuvorzukommen.
Die Arbeitsgruppe hat u.a. bereits Entwürfe für Web Forms 2.0 und Web Applications 1.0 vorgelegt.
Es handelt sich um eine Arbeitsgruppe von Web-Praktikern, die das sich an XHTML, CSS und dem Document Object Model orientiert. Der Begriff der Web-Applikation erinnert an das AJAX -Konzept
.