Nettsteder er en kombinasjon av stil og struktur, og på dagens nettside er det en god praksis å holde disse to aspektene av et nettsted skilt fra hverandre.
HTML har alltid vært det som gir et nettsted med sin struktur. I de tidlige dagene av Internett inneholdt HTML også stilinformasjon. Elementer som tag ble spylt over HTML-koden, og legger til utseendet og informasjonen sammen med strukturell informasjon. Webstandardbevegelsen presset oss til å forandre denne praksisen og i stedet skyve all stilinformasjon inn i CSS eller Cascading Style Sheets. Ved å ta dette et skritt videre, er nåværende anbefalinger at du bruker det som er kjent som et "eksternt stilark" for nettstedets stylingbehov.
Fordeler og ulemper ved ekstern stilark
En av de beste tingene med Cascading Style Sheets er at du kan bruke dem til å holde hele nettstedet ditt konsistent. Den enkleste måten å gjøre dette på er å koble eller importere et eksternt stilark. Hvis du bruker det samme eksterne stilarket for hver side på nettstedet ditt, kan du være sikker på at alle sidene har samme stil. Du kan også gjøre det lettere å gjøre endringer for fremtiden. Siden hver side bruker det samme eksterne stilarket, vil enhver endring i det aktuelle arket påvirke hver side side. Dette er mye bedre enn å måtte bytte hver side individuelt!
Fordeler med eksterne stilark
- Du kan kontrollere utseendet på flere dokumenter samtidig.
- Dette er spesielt nyttig hvis du jobber med et team av mennesker for å lage ditt nettsted. Mange stilregler kan være vanskelig å huske, og mens du kanskje har en utskriftstilguide, er det ineffektivt og kjedelig å kontinuerlig bla gjennom det for å avgjøre om eksempeltekst skal skrives i 12 poeng Arial font eller 14 punkt kurir. Ved å ha alt på ett sted, og siden det stedet også er der du ville gjøre endringer, kan du gjøre vedlikehold så mye lettere.
- Du kan lage klasser av stiler som deretter kan brukes på mange forskjellige HTML-elementer.
- Hvis du ofte bruker en bestemt skriftstyling for å legge vekt på ulike ting på siden din, kan du bruke et klassetributt som du har satt opp i stilarket ditt for å få dette utseendet, i stedet for å definere en bestemt stil for hver forekomst av vektlegging.
- Du kan enkelt gruppere stilene dine for å være mer effektiv.
- Alle gruppemetoder som er tilgjengelige for CSS, kan brukes i eksterne stilark, og dette gir deg mer kontroll og fleksibilitet på sidene dine.
Ulemper med ekstern stilark
- Eksterne stilark kan øke nedlastingstiden, spesielt hvis de er ekstremt store. Siden CSS-filen er et eget dokument som må lastes, vil det påvirke ytelsen for å utføre den nedlastingen.
- Eksternt stilark blir veldig raskt, da det er vanskelig å fortelle når en stil ikke lenger er i bruk, fordi den ikke slettes når siden er fjernet. Riktig styring av CSS-filene dine er viktig, spesielt hvis flere personer jobber på samme fil.
- Hvis du bare har en nettside, kan det hende at det ikke er nødvendig å ha en ekstern fil for CSS siden du bare har den ene siden som skal stiles. Mange av fordelene ved ekstern CSS går tapt når du bare har en enkelt side-side.
Slik lager du et eksternt stilark
Ekstern stilark er opprettet med en lignende syntaks til dokumentnivå stilark. Alt du trenger å ta med er selgeren og erklæringen. På samme måte som i et stilark på dokumentnivå, er syntaksen for en regel:
selector {property: value;}
Lagre disse reglene i en tekstfil med utvidelsen .css. Dette er ikke nødvendig, men det er en god vane å komme inn, slik at du umiddelbart kan gjenkjenne stilarkene dine i en katalogoppføring.
Når du har et stilarkdokument, må du koble det til websidene dine. Dette kan gjøres på to måter:
- Kobling
- For å koble et stilark bruker du HTML-taggen. Dette har attributter rel, type, og href. Rel-attributten forteller hva du knytter (i dette tilfellet et stilark), definerer typen MIME-Type for nettleseren, og href er banen til .css-filen.
- importerer
- Du vil bruke et importert stilark i et stilark for dokumentnivå, slik at du kan importere attributter til et eksternt stilark mens du ikke mister noen dokumentspesifikke. Du ringer det på en lignende måte som å kalle et koblet stilark, bare det må kalles innenfor en stedsdeklarasjon på dokumentnivå. Du kan importere så mange eksterne stilark som du trenger for å opprettholde ditt nettsted.
Opprinnelig artikkel av Jennifer Krynin. Redigert av Jeremy Girard på 8/8/17