Kakšen je vaš slog CSS?

Eden najbolj zmedenih vidikov dela s CSS (kaskadnimi slogovnimi listami) je, da lahko sloge pišete na toliko načinov. Podobno kot pri pisanju proze, samo zato, ker razumete osnovna pravila slovnice in črkovanja, še ne pomeni, da ste obvladali pisanje jedrnate proze.

Izkušeni oblikovalci CSS porabijo veliko časa za izdelavo kratkega, jasnega CSS, ki ga je enostavno urejati in posodabljati. Toda tisti, ki so novi v CSS, so nagnjeni k pisanju več slogov, kot je potrebno, in k ustvarjanju odvečnih slogov.

Ne samo, da odvečna koda traja dlje, da se prenese v spletni brskalnik, pozneje jo je veliko težje urejati ali revidirati. In bolj kot je vaša koda odveč, večja je verjetnost, da boste naleteli na slogovne konflikte.

Tukaj je pet nasvetov za pisanje čistih in učinkovitih slogov:

• Nikoli ne ustvarjajte dveh stilov, ko je dovolj eden. Ustvarite lahko na primer slog z izbirnikom oznak za vse

  oznake, ki spremeni družino pisav vaših naslovov, in nato ustvarite drugi slog z uporabo izbirnika razreda, ki ga lahko uporabite za svoje naslove, da spremenite barvo.

  Vendar bi bilo učinkoviteje, če bi barvo in družino pisav opredelili v istem slogu. Ne pozabite, da se lahko vedno vrnete in uredite slog, da dodate drugo pravilo, če želite spremeniti oblikovanje sloga.

• Skrajšane šestnajstiške barvne kode. Barve lahko definirate v CSS tako, da vključite celotno šestnajstiško barvno kodo. Če pa uporabljate ponavljajoče se barvne kode, morate vključiti samo prve tri znake. #fffff je na primer isto kot #fff; oboje bo ustvarilo belo barvo.

• Uporabite zunanje slogovne liste. Sloge lahko definirate v notranji tabeli s slogi na vrhu vsake spletne strani ali pa svoje sloge shranite v zunanjo datoteko s pripono .css in to slogovno tabelo priložite vsem svojim spletnim stranem. Zunanje slogovne liste so same po sebi učinkovitejše, ker vam omogočajo uporabo istega sloga na kateri koli ali vseh straneh vašega spletnega mesta.

  Če na primer definirate slog, pri katerem so vsi glavni naslovi krepki, modri in veliki, vam s shranjevanjem tega sloga v zunanji slogovni list omogočite uporabo istega sloga za vsak naslov. Potem, če se pozneje odločite, da želite svoje naslove spremeniti v zelene, lahko spremenite slog v eni zunanji tabeli s slogi in spremenite vse naslove hkrati.

  Če bi sloge shranili v interni slogovni list, bi morali urediti slog naslova v vsaki datoteki.

• Razvijte konvencijo o poimenovanju za svoje sloge. Čeprav lahko sloge, ustvarjene z izbirniki razreda ali ID-jev, poimenujete karkoli želite, je najbolje izbrati sloge, ki imajo poleg oblikovanja pomen. Če na primer ustvarite slog z imenom .redHeadlines in se pozneje odločite, da želite, da so vsi vaši .redHeadlines modri, boste na koncu dobili modri slog naslova, imenovan .redHeadlines, ali pa boste morali slog preimenovati.

  In preimenovanje sloga vključuje vrnitev nazaj in ponovno uporabo tega sloga povsod, kjer imate rdeč naslov, ki ga želite obarvati modro, kar nekako izniči moč slogov za globalne posodobitve. Če se želite izogniti tej težavi, ustvarite imena slogov, ki se nanašajo na položaj ali pomen elementov, na primer .mainHeadlines ali .sidebarHeadlines.

• * Preizkusite in potrdite svojo kodo. Tudi izkušeni oblikovalci CSS delajo napake, zato Dreamweaver vključuje toliko odličnih orodij za testiranje in preverjanje kode na vaših spletnih straneh. Prepričajte se, da preizkusite svoj CSS za pogoste napake.

  Sledi dve spletni storitvi testiranja, ki ju lahko uporabite za preverjanje napak v kodi CSS. Preprosto vnesite URL katere koli spletne strani na internetu v naslovno polje na katerem koli od teh spletnih mest in kliknite gumb Pošlji, da boste prejeli poročilo, ki prikazuje morebitne napake v vaši kodi:

  • Storitev preverjanja CSS W3C

  • XHTML-CSS : Bodi veljaven ali se uči