[W3Conf] Nicolas Gallagher: „Die Reinigung der Webentwicklung“

„Best Practices“ sind keine „absoluten Wahrheiten“.

Nicolas war länger Anthropologiestudent als Webentwickler.

Heraklit (535 v. Chr.): Philosoph. Verachtung für die Menschheit. Elend ist der Weg. Trauriger Keanu seiner Zeit. Starb, indem er Kuhmist auf sich rieb und sich in die Sonne legte. Hauptidee: Alles ist eine Illusion. „Man kann nicht zweimal in denselben Fluss treten; denn frisches Wasser fließt auf dich ein.“

Demokrit (460 v. Chr.): Auch Verachtung für die Menschheit. Der „lachende Philosoph“. Der erste Troll der Welt. Erhaltung von Masse und Energie. Atome.

Diese Ideen blieben Tausende von Jahren liegen, bis die Wissenschaft sie entdeckte. Platon und Aristoteles lehnten diese Ideen ab, aber man kann es ihnen nicht verübeln. Die Ideen kamen zurück, als die Zeit reif war.

Die Webentwicklung ist ebenfalls eine Welt sich ständig ändernder Kontexte. Nicolas zweifelt weiterhin an Annahmen, die selbst vor sechs Monaten noch wahr waren.

HTML-Klassenattribute wurden für CSS1 hinzugefügt, „um die Granularität der Kontrolle über Elemente zu erhöhen“.

Der CSS Zen Garden (2003) bestand aus einer HTML-Seite, aber es gab viele verschiedene Designs dafür, bei denen nur das CSS geändert wurde.

Echte Aussagen von echten Leuten und echten Spezifikationen

„Verwenden Sie keine unsemantischen Klassennamen.“

„Ihr HTML ist wie Diamanten, für immer.“

„Autoren werden ermutigt, Klassenattributwerte zu verwenden, die die Art des Inhalts beschreiben, anstatt Werte, die die gewünschte Darstellung des Inhalts beschreiben.“

Das ist für Nicolas verrückt. Er hat seinen Blog einmal mit null Klassen gestaltet. Er machte (sogenannte „perfekte Semantik“). Aber Änderungen vorzunehmen wurde unpraktisch. Schwer zu lesen. Schwer zu verstehen. Schwer, Stiländerungen vorzunehmen.

Das ist wahrer

„Klassennamen sind für uns, nicht für Maschinen.“ — @necolas #w3conf

— Carwin Young (@carwin) 22. Februar 2013

Es gibt jedoch die Vorstellung von „hässlichen“ HTML-Klassennamen. Diese Art von Klassennamen ist im Moment angesagt: `hyphenated-lowercase-4-life`. Z.B.

.button { }
.button-group {}
.button-primary {}
.button-group-item {}

Diese Art von Dingen vermittelt nicht viel. Vergleichen Sie das mit diesen „hässlichen“ Klassennamen

.Button {}
.ButtonGroup {}
.Button--primary {}
.ButtonGroup-item {}

Diese Namenskonvention vermittelt viel mehr. Doppelte Bindestriche sind ein Modifikator. Ein einfacher Bindestrich ist ein Elementkind. Diese sind nicht hässlich. Sie sind im Moment vielleicht nicht angesagt, aber vielleicht werden sie es ja. Dieses Muster stammt vom russischen Suchmaschinenanbieter Yandex.

#W3Conf Also nach der ungarischen Notation für C schlägt @necolas die russische Notation für CSS-Klassen vor (von Yandex)

— Kevin Marks (@kevinmarks) 22. Februar 2013

Hinweis: Möglicherweise gibt es historische Gründe dafür, warum Klassennamen bestimmte Zeichen haben

#w3conf Es gibt tatsächlich einen historischen Grund, warum wir Unterstriche in Klassen- (und ID-)Namen vermieden haben: developer.mozilla.org/en-US/docs/Und…

— Eric A. Meyer (@meyerweb) 22. Februar 2013

Eine weitere alte Best Practice lautet: „Verwenden Sie keine zusätzlichen Elemente.“ Nicolas ist tief in die Welt der Pseudo-Elemente eingetaucht, um die Verwendung zusätzlicher Elemente zu vermeiden. Rückblickend hat dies das Verständnis dessen, was vor sich geht, erheblich erschwert. Nicht, dass „Junk“-Markup gut ist, aber Dinge wie Web Components ergeben viel mehr Sinn.

CSS ist das falsche Werkzeug, um dem Inhalt/Design Struktur zu verleihen. HTML ist dafür da. Web Components gibt uns die Möglichkeit, die richtigen Werkzeuge zu verwenden, ohne sich Gedanken über „Junk“-Markup machen zu müssen.