Logo von heise online

Suche
Abonnieren

Tägliche Top-News bei WhatsApp, Facebook Messenger, Telegram & Insta

preisvergleich_weiss

Recherche in 1.508.171 Produkten

Herbert Braun 76

Zahlen, bitte! Die 3-Faltigkeit der Cascading Style Sheets

Zahlen, bitte! 3 - Die Dreifaltigkeit von CSS

Der Siegeszug der Cascading Style Sheets für Webseiten begann vor 23 Jahren. Heute ist CSS aus dem Web nicht mehr wegzudenken. Wie CSS entstand und was die Zahl 3 für eine Rolle spielt:

Heute vor 23 Jahren stellte der norwegische Computerwissenschaftler Håkon Wium Lie, ein Kollege des HTML-Erfinders Tim Berners-Lee, den ersten Entwurf einer Sprache namens "Cascading HTML Style Sheets" vor. Das "HTML" fiel – ebenso wie einige der kühneren Ideen des Konzepts – bald weg, und als "CSS" eroberte die Sprache bald die Bildschirme der Welt.

Anzeige
Bitte Zahlen

Zahlen, bitte!

In dieser Rubrik stellen wir jede Woche Dienstag verblüffende, beeindruckende, informative und witzige Zahlen aus den Bereichen IT, Wissenschaft, Wirtschaft und der Mathematik selbst vor.

Für HTML-Inhalte stellt CSS die Kleidung dar, die sich wechseln lässt, die aus verschiedenen Quellen kommen kann, die es als Maßanfertigung oder von der Stange gibt. Und wie bei der Kleidung vernächlässigt mancher über der Beschäftigung mit dem Aussehen die inneren Werte, obwohl es technisch gesehen kein Problem ist, nackt auf die Straße zu gehen – nur gilt es als derart unfein, dass es kaum jemand tut. Und so hat sich zum Beispiel sogar in den Linux-Kernel eine CSS-Datei verirrt.

Eigentlich ist CSS nicht besonders Zahlen-affin. Wenn im Webdesign von "magischen Zahlen" die Rede ist, gilt das keineswegs als Kompliment. Gemeint sind damit präzise, aber rätselhafte Angaben zu Größe und Position von Elementen, deren Herleitung bei späteren Design-Anpassungen erhebliche Gehirngymnastik erfordert – und deren Änderung unweigerlich die Implosion des gesamten Layouts zur Folge hat. Streng genommen sind solche Längenangaben auch keine Zahlen, sondern mit einer Einheit versehene oder prozentuale Werte; eine blanke Zahl akzeptieren nur wenige CSS-Eigenschaften, etwa `z-index`, `opacity` oder auch `font-weight`.

Am ehesten passt die Zahl 3 zu CSS. Das liegt zum einen an der Dreifaltigkeit aus Selektor, Eigenschaft und Wert, die CSS ausmacht, zum anderen an der Sprachversion. Vermutlich wird "CSS 3" ähnlich wie "HTML5" die letzte einigermaßen sinnvolle Versionsnummer bleiben, denn die damit vollzogene Modularisierung wird es kaum möglich machen, ein "CSS 4" oder "CSS 5" als einheitliches Gebilde aufzufassen – auch wenn einzelne Module wie MediaQueries, Color und Fonts bereits die Versionsnummer 4 ("Level 4") tragen.

So sah das CSS-Boxmodell in der ersten W3C-Recommendation aus.
So sah das CSS-Boxmodell in der ersten W3C-Recommendation aus.

Auch der erste Browser, der CSS implementierte, trug die Nummer 3: Der Internet Explorer 3, erschienen am 13. August 1996, führte die CSS-Möglichkeiten seiner rasch wachsenden Nutzerschaft vor. Netscape hatte den Schuss nicht rechtzeitig gehört und schaffte mit dem Communicator 4 nur halbherzigen CSS-Support. Opera brauchte ein bisschen länger, legte dann aber mit Version 3.5 die damals führende CSS-Implementierung vor. Das lockte offenbar den CSS-Erfinder Lie, der 1999 bei der norwegischen Software-Firma anheuerte und dort bis heute als CTO arbeitet. Wobei Håkon Wium Lie CSS nicht allein und nicht aus dem blauen Himmel heraus geschaffen hat. Stylesheet-Sprachen wie DSSSL gab es schon in den 80er-Jahren, und Viola, der fortschrittlichste Browser der Web-Steinzeit, interpretierte Stylesheets, die ziemlich nach CSS aussahen. Während manche Puristen beim W3C die Idee scharf ablehnten, dass der Webseiten-Autor das Aussehen einer Seite en détail festlegen können sollte, türmten sich die Ideen für Web-Stylesheets auf: In seiner Dissertation kommt Håkon Wium Lie auf neun verschiedene Vorschläge.

Lies eigener CHSS-Entwurf ähnelte CSS nur entfernt. Angaben wie `window.margin.left = 2cm` sehen eher nach JavaScript aus. Ideen wie Berechnungen, Referenzierung anderer Eigenschaften (`space.first = space.left + 0.5cm`) und bedingte Stile setzten sich erst viel später durch oder lassen bis heute auf sich warten. Zukunftsweisend war jedoch der Gedanke, Stile von Browser, Webseite und Anwender "kaskadieren" zu lassen, sie also hierarchisch zu kombinieren. Darüber hinaus dachte Lie bereits an unterschiedliche Ausgabemedien wie Druck und Text to Speech.

Außer CHSS machte Bert Bos mit seinen "Stream-based Style Sheet Proposal" (SSP) den meisten Eindruck beim W3C. Dieser Entwurf hatte seine Stärken vor allem im Bereich der visuellen Formatierung und führte zum Beispiel die Idee der Floats ein. Lie und Bos taten sich zusammen und brachten ihre vereinten und vereinfachten Ideen bis Weihnachten 1996 zur Recommendation-Reife. Bis allerdings die zwischenzeitlich durch Mosaic und Netscape eingeschleppten `<font>`- und `<center>`-Tags, die `<spacer>`-Platzhalter und vor allem die Tabellenlayouts aus dem Webdesign verschwanden, dauerte es noch ein paar Jahre länger. (Herbert Braun) / (vza)

76 Kommentare

Themen:

Anzeige
  1. Visual Studio Code 1.7.1 bringt neue Layoutoptionen und CSS-Hilfen

    Visual Studio Code 1.7.1 bringt neue Layoutoptionen und CSS-Autovervollständigung

    Nachdem Microsoft die Patzer beim Update von Visual Studio Code behoben hat, können Entwickler die Neuerungen wie horizontal geteilte Editorfenster und Hilfen beim Bearbeiten von CSS verwenden.

  2. NativeScript 2.4 bringt Web Worker für Hintergrund-Threads

    NativeScript 2.4 bringt Web Workers für Hintgergrund-Threads

    Außer der JavaScript-API zur getrennten Ausführung von Code im Hintergrund hat es das zuvor als Preview integrierte FlexBox-Layout als vollwertige Funktion in das Framework zur plattformübergreifenden Entwicklung mit JavaScript und CSS geschafft.

  3. Chrome 57 senkt Energiebedarf der Tabs

    Chrome 57

    Chrome 57 schont den Laptop-Akku und beschränkt die Energie-Ressourcen für Hintergrund-Tabs. Der Browser unterstützt außerdem die neuen CSS-Grid-Layouts.

  4. Web-IDE: Orion 15 hat einen verbesserten Node.js-Server

    Web-IDE: Orion 15 hat einen verbesserten Node.js-Server

    Bald soll der Node.js- den derzeitigen Java-Server als bevorzugte Implementierung ablösen. Außerdem hat das Team den Fokus auf bessere Bedienung mit der Tastatur gelegt und die Assistenten für CSS, HTML, JavaScript und Docker erweitert.

  1. Zukunft der Webentwicklung: Webkomponenten und Progressive Web Apps, Teil 1

    Zukunft der Webentwicklung: Webkomponenten und Progressive Web Apps, Teil 1

    Bei Webanwendungen ist ein Umbruch im Gange. Wer sich künftig den Quelltext einer Webseite ansieht, könnte von einem einzelnen my-app-Element im Body der Seite überrascht werden. Keine Spur des üblichen Sammelsuriums hunderter Divs und anderer Elemente.

  2. Tipps und Tricks mit Angular, Teil 10: Mehrdimensionale Navigationsstrukturen

    Mehrdimensionale Navigationsstrukturen in Angular

    Routing an sich ist in Single-Page-Anwendungen nicht kompliziert. Benötigen Navigationsstrukturen Hierarchieebenen, gibt es dafür in Angular zwei Ansätze für unterschiedliche Bedürfnisse: Child Routes und Aux Routes.

  3. Desktopanwendungen mit JavaScript entwickeln

    Desktopanwendungen mit JavaScript entwickeln

    JavaScript gilt als eierlegende Wollmilchsau unter den Programmiersprachen. Mittlerweile macht sie auch im Bereich der Desktopanwendungen eine gute Figur.

  1. Vorstellung: Audi A7

    Audi A7

    Audi macht mit dem zweiten A7 keinen Neuanfang im Design. Doch technisch tut sich mehr als optisch. Bis zu 39 Assistenten sollen dem Fahrer vieles abnehmen. Auf Innovationen im Antriebsbereich muss der Kunde aber noch warten

  2. Der "Baby-Hitler" schlägt zurück!

    Läutet der absurde Kult um Österreichs blutjungen starken Mann das Ende der Satire ein?

  3. Meinungsfreiheit: Raspi als anonymer Webserver

    Meinungsfreiheit: Raspi als anonymer Webserver

    Das Internet ist grenzenlos, die vom Grundgesetz garantierte Meinungsfreiheit hingegen gilt nur in Deutschland. Kritiker müssen mit Repressalien rechnen – selbst innerhalb Europas. Mit einem Raspi Zero W können Sie Inhalte anonym veröffentlichen.

  4. Activision-Patent für Mikrotransaktionen: Matchmaking benachteiligt Spieler ohne Ingame-Käufe

    Activision-Patent für Mikrotransaktionen: Matchmaking benachteiligt Spieler ohne Ingame-Käufe

    Aus einem Patent von Activision geht hervor, dass Matchmaking künftig Spieler ohne kostenpflichtige Ingame-Gegenstände benachteiligen könnte. Sie werden in Arenen mit stärkeren Spielern geworfen, die bereits Zusatzwaffen besitzen.

Anzeige