Nettsteder består av en rekke individuelle brikker, inkludert bilder, tekst og forskjellige dokumenter. Disse dokumentene inkluderer ikke bare de som kan lenkes til fra forskjellige sider, som PDF-filer, men også dokumentene som brukes til å lage sidene selv, som HTML-dokumenter for å bestemme strukturen til en side og CSS (Cascading Style Sheet) -dokumenter for å diktere utseendet på en side. Denne artikkelen vil fordype seg i CSS, og dekke hva det er og hvor det brukes på nettsteder i dag.
En CSS-historieleksjon
CSS ble først utviklet i 1997 som en måte for webutviklere å definere det visuelle utseendet til websidene de opprettet. Det var ment å tillate web-profesjonelle å skille innholdet og strukturen til en nettsides kode fra den visuelle designen, noe som ikke hadde vært mulig før denne tiden.
Separasjonen av struktur og stil gjør at HTML kan utføre mer av funksjonen den opprinnelig var basert på - markeringen av innhold, uten å måtte bekymre deg for utformingen og utformingen av selve siden, noe som er kjent som "utseendet og følelsen" av side.
Utviklingen av CSS
CSS ble ikke populært før rundt 2000 da nettlesere begynte å bruke mer enn de grunnleggende skrift- og fargeaspektene i dette markeringsspråket. I dag støtter alle moderne nettlesere hele CSS nivå 1, mesteparten av CSS nivå 2, og til og med de fleste aspekter av CSS nivå 3. Etter hvert som CSS fortsetter å utvikle seg og nye stiler introduseres, har nettlesere begynt å implementere moduler som gir ny CSS-støtte til disse nettleserne og gir webdesignere kraftige nye stylingsverktøy til å fungere med.
I (mange) år tidligere var det utvalgte webdesignere som nektet å bruke CSS til design og utvikling av nettsteder, men den praksisen er nesten borte fra bransjen i dag. CSS er nå en mye brukt standard innen webdesign, og du vil være hardt presset for å finne noen som jobber i bransjen i dag som ikke hadde minst en grunnleggende forståelse av dette språket.
CSS er en forkortelse
Som allerede nevnt står begrepet CSS for "Cascading Style Sheet." La oss bryte ned denne setningen litt for å forklare nærmere hva disse dokumentene gjør.
Ordet "stilark" refererer til selve dokumentet (som HTML er CSS-filer egentlig bare tekstdokumenter som kan redigeres med en rekke programmer). Stilark har blitt brukt til dokumentdesign i mange år. De er de tekniske spesifikasjonene for et oppsett, enten det er på trykk eller online. Trykkdesignere har lenge brukt stilark for å sikre at designene deres skrives ut nøyaktig etter spesifikasjonene. Et stilark for en webside tjener det samme formålet, men med den ekstra funksjonaliteten til å også fortelle nettleseren hvordan gjengi dokumentet som vises. I dag kan CSS-stilark også brukes mediespørsmål for å endre måten en side ser etter forskjellige enheter og skjermstørrelser. Dette er utrolig viktig siden det gjør at et enkelt HTML-dokument kan gjengis annerledes i henhold til skjermen som brukes for å få tilgang til det.
Kaskade er den virkelig spesielle delen av begrepet "cascading style sheet". Et nettstilark er ment å kaskade gjennom en serie stiler i det arket, som en elv over en foss. Vannet i elva treffer alle steinene i fossen, men bare de nederst påvirker nøyaktig hvor vannet vil strømme. Det samme gjelder kaskaden i nettstilsark.
Designer stilark Overstyr nettleserens standard stilark
Hver webside påvirkes av minst ett stilark, selv om webdesigneren ikke bruker noen stiler. Dette stilarket er brukerarkens stilark - også kjent som standardstiler som nettleseren vil bruke til å vise en side hvis ingen andre instruksjoner er gitt. For eksempel er hyperkoblinger som standard utformet i blått og de er understreket. Disse stilene kommer fra nettleserens standard stilark. Hvis nettdesigneren gir andre instruksjoner, må nettleseren imidlertid vite hvilke instruksjoner som har forrang. Alle nettlesere har sine egne standardstiler, men mange av disse standardinnstillingene (som de blå understrekede tekstkoblingene) deles over alle eller de fleste store nettlesere og versjoner.
For et annet eksempel på en nettleserstandard, er standardfonten vår nettleser "Times New Roman"vises i størrelse 16. Nesten ingen av sidene vi besøker displayet i den skriftfamilien og størrelsen, er det imidlertid. Dette er fordi kaskaden definerer at de andre stilarkene, som er satt av designerne selv, skal omdefinere skriftstørrelsen og familie, som overstyrer standardinnstillingene til nettleseren vår. Alle stilark du oppretter for en webside, vil ha mer spesifisitet enn standard nettstiler i nettleseren, så standardene gjelder bare hvis stilarket ditt ikke overstyrer dem. Hvis du vil at koblinger skal være blå og understreket, trenger du ikke gjøre noe siden det er standard, men hvis CSS-filen på nettstedet ditt sier at koblinger skal være grønne, vil fargen overstyre standardblått. Understreken forblir i dette eksemplet siden du ikke spesifiserte noe annet.
Hvor brukes CSS?
CSS kan også brukes til å definere hvordan websider skal se ut når de vises i andre medier enn a nettleser. For eksempel kan du lage et utskriftsark som vil definere hvordan websiden skal skrives ut. Siden nettsideartikler som navigasjonsknapper eller nettskjemaer ikke har noe formål på den utskrevne siden, kan et utskriftsark brukes til å "slå av" disse områdene når en side skrives ut. Selv om det ikke er vanlig på mange nettsteder, er muligheten til å lage stilark ark kraftig og attraktiv (i vår erfaring - de fleste web-profesjonelle gjør ikke dette bare fordi nettsteds budsjettomfang ikke krever dette tilleggsarbeidet bli ferdig).
Hvorfor er CSS viktig?
CSS er et av de kraftigste verktøyene en webdesigner kan lære fordi du med det kan påvirke hele det visuelle utseendet til et nettsted. Velskrevne stilark kan oppdateres raskt og tillate nettsteder å endre det som prioriteres visuelt på skjerm, som igjen viser verdi og fokus for besøkende, uten at det er behov for endringer i underliggende HTML-markering.
Hovedutfordringen med CSS er at det er ganske mye å lære - og når nettlesere endres hver dag, fungerer det som er bra i dag kan ikke være fornuftig i morgen da nye stiler blir støttet og andre blir droppet eller faller i unåde av en eller annen grunn en annen.
CSS-læringskurven er verdt det
Fordi CSS kan kaskade og kombineres, og vurderer hvordan forskjellige nettlesere kan tolke og implementere direktivene på en annen måte, kan CSS være vanskeligere å lære enn vanlig HTML. CSS endres også i nettlesere på en måte som HTML virkelig ikke gjør. Når du først begynner å bruke CSS, vil du imidlertid se at å utnytte kraften til stilark vil gi deg utrolig fleksibilitet i hvordan du utformer nettsider og definerer utseendet og følelsen. Underveis vil du samle en "pose med triks" med stiler og tilnærminger som har fungert for deg tidligere og som du kan vende deg til igjen når du bygge nye websider i fremtiden.