Rakenteellinen merkkaus; koodaa, mitä tarkoitat ja tarkoita sitä, mitä koodaat.

Vaikkakin tyylitiedoston kirjoittaminen on yksinkertaista, CSS-taitto vaatii hieman erilaista ajattelua kuin mihin olemme tottuneet.

Sen sijaan, että ajattelisimme tyyliin " tämä menee tänne ja tuo tuonne" kun työskentelemme sivumme kanssa, meidän pitäisi paneutua siihen, minkälaista informaatiota sivullemme haluamme ja miettiä tämän informaation rakennetta.

Tärkein otsikko saa <h1>-tägin, alaotsikot merkataan <h2>-tägeillä ja kappaleet merkataan kappaletägillä.

Tämä tyyli tunnetaan nimellä "rakenteellinen" tai "semanttinen" merkkaus.

Sen sijaan, että laittaisin sisältösi taulukon soluihin, kääritkin sen div -elementin sisään. Anna div -elementeillesi id- tai class-määrite, joka kuvaa niiden sisältöä ja/tai funktiota ennemin kuin niiden ulkonäköä.