Spletna mesta so sestavljena iz številnih posameznih kosov, vključno s slikami, besedilom in različnimi dokumenti. Ti dokumenti ne vključujejo samo dokumentov, na katere je mogoče povezati različne strani, na primer datoteke PDF, temveč tudi dokumente, ki se uporabljajo za sestavo strani, na primer Dokumenti HTML za določitev strukture strani in CSS (Cascading Style Sheet) dokumentov, ki narekujejo videz strani. Ta članek se bo poglobil v CSS in zajemal, kaj je in kje se danes uporablja na spletnih mestih.
Lekcija zgodovine CSS
CSS je bil prvič razvit leta 1997 kot način, s katerim spletni razvijalci določijo vizualni videz spletnih strani, ki so jih ustvarjali. Namenjen je bil spletnim strokovnjakom ločite vsebino in struktura kode spletnega mesta iz vizualnega oblikovanja, kar prej ni bilo mogoče.
Ločitev strukture in sloga omogoča, da HTML izvede več funkcije, na kateri je prvotno temeljil - označevanje vsebine, ne da bi vam bilo treba skrbeti za oblikovanje in postavitev same strani, nekaj, kar je splošno znano kot "videz in občutek" strani strani.
Razvoj CSS
CSS je pridobil na popularnosti šele okoli leta 2000, ko so spletni brskalniki začeli uporabljati več kot osnovne vidike pisave in barv tega označevalnega jezika. Danes vsi sodobni brskalniki podpirajo CSS Level 1, večino CSS Level 2 in celo večino vidikov CSS Level 3. Ker se CSS še naprej razvija in se uvajajo novi slogi, so spletni brskalniki začeli izvajati module ki prinašajo novo podporo CSS v te brskalnike in dajejo spletnim oblikovalcem zmogljiva nova orodja za oblikovanje s.
V preteklih (mnogih) letih so bili izbrani spletni oblikovalci, ki niso želeli uporabljati CSS za oblikovanje in razvoj spletnih strani, vendar ta praksa danes skorajda ni več v industriji. CSS je zdaj pogosto uporabljen standard pri spletnem oblikovanju in težko bi našli koga, ki danes dela v tej panogi in ni vsaj osnovno razumel tega jezika.
CSS je okrajšava
Kot smo že omenili, izraz CSS pomeni "Cascading Style Sheet". Razčlenimo to besedno zvezo, da bomo bolj podrobno razložili, kaj delajo ti dokumenti.
Beseda "tabela slogi" se nanaša na sam dokument (na primer HTML, datoteke CSS so v resnici samo besedilni dokumenti, ki jih je mogoče urejati z različnimi programi). Stilni listi se že vrsto let uporabljajo za oblikovanje dokumentov. So tehnične specifikacije za postavitev, bodisi tiskano ali spletno. Oblikovalci tiska že dolgo uporabljajo slogovne liste, da zagotovijo, da se njihovi modeli natisnejo natančno po njihovih specifikacijah. List slogi za spletno stran ima enak namen, vendar z dodano funkcionalnostjo spletnega brskalnika tudi pove, kako upodabljati dokument, ki si ga ogledujemo. Danes lahko uporabljajo tudi sloge CSS medijska vprašanja da spremenite način iskanja strani različne naprave in velikosti zaslona. To je neverjetno pomembno, saj omogoča, da se posamezen dokument HTML upodablja drugače glede na zaslon, ki se uporablja za dostop do njega.
Cascade je res poseben del izraza "kaskadni slog". Spletni slog je namenjen kaskadnemu prehodu skozi vrsto slogov na tem listu, kot je reka nad slapom. Voda v reki zadene vse skale v slapu, vendar le tiste na dnu vplivajo točno na to, kam bo voda tekla. Enako velja za kaskado v slogovnih listih spletnih strani.
Oblikovalske sloge preglasijo privzete sloge brskalnika
Na vsako spletno stran vpliva vsaj en slog, tudi če spletni oblikovalec ne uporabi nobenega sloga. Ta slog je slogu uporabniškega agenta - znani tudi kot privzeti slogi, ki jih bo spletni brskalnik uporabljal za prikaz strani, če niso na voljo druga navodila. Hiperpovezave so na primer privzeto modro oblikovane in podčrtane. Ti slogi prihajajo iz privzetega slogovnega lista spletnega brskalnika. Če spletni oblikovalec poda druga navodila, pa mora brskalnik vedeti, katera navodila imajo prednost. Vsi brskalniki imajo svoje privzete sloge, vendar so številne privzete nastavitve (na primer modro podčrtane besedilne povezave) v skupni rabi med vsemi ali večino večjih brskalnikov in različic.
Za drug primer privzetega brskalnika je v našem spletnem brskalniku privzeta pisava "Times New Roman"prikazano pri velikosti 16. Skoraj nobena stran, ki jo obiščemo, ni prikazana v tej družini pisav in velikosti. To pa zato, ker kaskada določa, da je treba druge slogovne liste, ki jih oblikujejo sami oblikovalci, ponovno opredeliti velikost pisave in družina, ki preglasi privzete nastavitve našega spletnega brskalnika. Vsi slogovni listi, ki jih ustvarite za spletno stran, bodo bolj natančni kot privzeti slogi brskalnika, zato bodo te privzete vrednosti veljale le, če jih vaš slog ne preglasi. Če želite, da so povezave modre in podčrtane, vam ni treba storiti ničesar, saj je to privzeto, če pa datoteka CSS na vašem spletnem mestu pravi, da bi morale biti povezave zelene, bo ta barva preglasila privzeto modro. V tem primeru bo podčrtavanje ostalo, ker niste določili drugače.
Kje se uporablja CSS?
CSS lahko uporabimo tudi za določanje, kako naj bodo spletne strani videti, če jih gledamo v drugih medijih kot v Spletni brskalnik. Tako lahko na primer ustvarite slog s tiskanjem, ki bo določal, kako naj se spletna stran natisne. Ker elementi spletnih strani, kot so gumbi za krmarjenje ali spletni obrazci, na natisnjeni strani ne bodo imeli namena, lahko s stilskim listom tiskanja ta območja "izklopite", ko je stran natisnjena. Čeprav v resnici to ni običajna praksa na mnogih spletnih mestih, je možnost ustvarjanja slogovnih listov za tiskanje zmogljiva in privlačna (v našem izkušnje - večina spletnih strokovnjakov tega ne počne preprosto zato, ker proračun spletnega mesta ne zahteva tega dodatnega dela storiti).
Zakaj je CSS pomemben?
CSS je eno najmočnejših orodij, ki se ga lahko nauči spletni oblikovalec, saj lahko z njim vplivate na celoten videz spletnega mesta. Dobro napisane slogovne liste je mogoče hitro posodobiti in omogočiti spletnim mestom, da vizualno spremenijo prednost, ki ji je prednostno določeno zaslon, ki obiskovalcem pokaže vrednost in osredotočenost, ne da bi bilo treba spremeniti osnovno Oznaka HTML.
Glavni izziv CSS je, da se je treba kar nekaj naučiti - in z brskalniki, ki se spreminjajo vsak dan, kar danes dobro deluje morda jutri ne bo imel smisla, saj se novi slogi podprejo, drugi pa iz enega razloga izpadejo ali izpadejo drugo.
Krivulja učenja CSS je vredna tega
Ker se CSS lahko kaskadira in kombinira ter ob upoštevanju, kako si različni brskalniki različno razlagajo in izvajajo direktive, je CSS težje naučiti kot navaden HTML. CSS se spremeni tudi v brskalnikih na način, ki ga HTML v resnici ne. Ko začnete uporabljati CSS, pa boste videli, da vam bo izkoriščanje moči slogovnih listov omogočilo neverjetno prilagodljivost pri postavitvi spletnih strani in določanju njihovega videza in občutka. Na tej poti boste nabrali »vrečo trikov« stilov in pristopov, ki so vam v preteklosti že uspeli in na katere se lahko spet obrnete, ko zgraditi nove spletne strani v prihodnosti.