Websites er en kombination af stil og struktur, og på dagens web er det en god praksis at holde disse to aspekter af et websted adskilt fra hinanden.
HTML har altid været, hvad der giver et websted med dets struktur. I de tidlige dage af internettet indeholdt HTML også stiloplysninger. Elementer som tag blev spildt over HTML-koden og tilføj udse og føle oplysninger sammen med strukturelle oplysninger. Webstandardbevægelsen skubbede os for at ændre denne praksis og i stedet skubbe alle stiloplysninger til CSS eller Cascading Style Sheets. Hvis du tager dette et skridt videre, er de nuværende anbefalinger, at du bruger det såkaldte "eksterne stilark" til dit website styling behov. Fordele og ulemper ved ekstern stilark
En af de bedste ting om Cascading Style Sheets er, at du kan bruge dem til at holde hele dit websted konsistent. Den nemmeste måde at gøre dette på er at forbinde eller importere et eksternt stilark. Hvis du bruger det samme eksterne stilark til hver side på dit websted, kan du være sikker på, at alle siderne vil have samme stil. Du kan også gøre det nemmere at foretage ændringer i fremtiden. Da hver side bruger det samme eksterne stilark, vil enhver ændring i det pågældende ark påvirke hver side side. Dette er meget bedre end at skulle skifte hver side individuelt!
Fordele ved eksterne stilark
- Du kan kontrollere udseendet af flere dokumenter på én gang.
- Dette er især nyttigt, hvis du arbejder med et team af mennesker til at oprette dit websted. Mange stilregler kan være svært at huske, og selvom du måske har en udskrivet stilguide, er det ineffektivt og kedeligt at vende løbende igennem det for at bestemme, om eksempeltekst skal skrives i 12 punkter Arial font eller 14 point kurér. Ved at have alt på ét sted, og siden det sted er også hvor du ville foretage ændringer, kan du gøre vedligeholdelse så meget lettere.
- Du kan oprette klasser af stilarter, som derefter kan bruges på mange forskellige HTML-elementer.
- Hvis du ofte bruger en bestemt skrifttypestyling til at lægge vægt på forskellige ting på din side, kan du bruge en klassetegn, som du har oprettet i stilarket for at få dette udseende og ikke i stedet for at definere en bestemt stil for hver forekomst af vægt.
- Du kan nemt gruppere dine stilarter for at være mere effektive.
- Alle grupperingsmetoder, der er tilgængelige for CSS, kan bruges i eksterne stilark, hvilket giver dig mere kontrol og fleksibilitet på dine sider.
Ulemper ved ekstern stilark
- Eksternt stilark kan øge downloadtiden, især hvis de er ekstremt store. Da CSS-filen er et separat dokument, der skal indlæses, vil det påvirke ydeevnen til at udføre denne download.
- Eksternt stilark bliver meget hurtigt, da det er svært at vide, hvornår en stil ikke længere er i brug, fordi den ikke slettes, når siden fjernes. Korrekt håndtering af dine CSS-filer er vigtig, især hvis flere personer arbejder på samme fil.
- Hvis du kun har et websted med en side, kan det ikke være nødvendigt at have en ekstern fil til CSS, da du kun har den ene side til at style. Mange af fordelene ved ekstern CSS går tabt, når du kun har en enkelt side side.
Sådan opretter du et eksternt stilark
Eksterne stilark er oprettet med en lignende syntaks til dokumentniveau stilark. Men alt hvad du skal medtage er vælgeren og erklæringen. Ligesom i et stilark på dokumentniveau er syntaksen for en regel:
selector {property: value;}
Gem disse regler i en tekstfil med udvidelsen .css. Dette er ikke påkrævet, men det er en god vane at komme ind, så du kan straks genkende dine stilark i en katalogfortegnelse.
Når du har et stylesheet-dokument, skal du linke det til dine websider. Dette kan gøres på to måder:
- Sammenkædning
- For at linke et stilark skal du bruge HTML-taggen. Dette har attributterne rel, type, og href. Rel attributten fortæller hvad du linker (i dette tilfælde et stylesheet), definerer typen MIME-Type til browseren, og href er stien til .css filen.
- Import
- Du ville bruge et importeret stilark i et stilark på dokumentniveau, så du kan importere attributterne til et eksternt stilark, mens du ikke mister nogen dokumentspecifikke. Du kalder det på samme måde som at kalde et linket stilark, men det skal kun kaldes inden for en dokumentformatformelerklæring. Du kan importere så mange eksterne stilark som du behøver for at opretholde dit websted.
Originalartikel af Jennifer Krynin. Redigeret af Jeremy Girard den 8/8/17