Koji je vaš CSS stil?

Jedan od najzbunjujućih aspekata rada s CSS-om (Cascading Style Sheets) je da možete pisati stilove na mnogo načina. Slično pisanju proze, samo zato što razumijete osnovna pravila gramatike i pravopisa ne znači da ste savladali pisanje sažete proze.

Iskusni CSS dizajneri troše dosta vremena na izradu kratkog, jasnog CSS-a koji je lako uređivati ​​i ažurirati. Ali oni koji su novi u CSS-u skloni su pisanju više stilova nego što je potrebno i stvaranju suvišnih stilova.

Ne samo da je potrebno više vremena za preuzimanje suvišnog koda u web-preglednik, već ga je i kasnije mnogo teže uređivati ​​ili revidirati. I, što je vaš kôd suvišniji, veća je vjerojatnost da ćete naići na sukobe stilova.

Evo pet savjeta za pisanje čistih, učinkovitih stilova:

• Nikad ne stvarajte dva stila kada je jedan dovoljan. Na primjer, možete stvoriti stil koristeći selektor oznaka za sve

  oznake koje mijenjaju obitelj fontova vaših naslova, a zatim stvorite drugi stil koristeći selektor klase koji možete primijeniti na svoje naslove da biste promijenili boju.

  Ali bilo bi učinkovitije definirati i boju i obitelj fontova u istom stilu. Zapamtite da se uvijek možete vratiti i urediti stil kako biste dodali još jedno pravilo ako želite promijeniti oblikovanje stila.

• Skraćeni heksadecimalni kodovi boja. Možete definirati boje u CSS-u uključivanjem cijelog heksadecimalnog koda boje. Međutim, kada koristite kodove boja koji se ponavljaju, morate uključiti samo prva tri znaka. Na primjer #fffff je isto što i #fff; oboje će stvoriti bijelu boju.

• Koristite vanjske stilove. Stilove možete definirati u internoj tablici stilova na vrhu svake web-stranice ili možete spremiti svoje stilove u vanjsku datoteku s nastavkom .css i priložiti taj stilski list svim svojim web stranicama. Vanjski stilski listovi su sami po sebi učinkovitiji jer vam omogućuju korištenje istog stila na bilo kojoj ili svim stranicama na vašoj web-lokaciji.

  Na primjer, ako definirate stil koji sve glavne naslove čini podebljanim, plavim i velikim, spremanje tog stila u vanjski stilski list omogućuje vam korištenje istog stila za svaki naslov. Zatim, ako kasnije odlučite da želite promijeniti svoje naslove u zelene, možete promijeniti stil u jednoj vanjskoj tablici stilova i promijeniti sve naslove odjednom.

  Ako ste stilove spremili u interni stilski list, morali biste urediti stil naslova u svakoj datoteci.

• Razvijte konvenciju imenovanja za svoje stilove. Iako stilovima stvorenim selektorima klase ili ID-a možete imenovati kako god želite, najbolje je odabrati stilove koji imaju značenje osim oblikovanja. Na primjer, ako stvorite stil pod nazivom .redHeadlines, a zatim kasnije odlučite da želite da svi vaši .redHeadlines budu plavi, na kraju ćete dobiti plavi stil naslova koji se zove .redHeadlines ili ćete morati preimenovati stil.

  A preimenovanje stila uključuje povratak i ponovnu primjenu tog stila svugdje gdje imate crveni naslov koji želite postati plavi, što na neki način negira moć stilova za globalna ažuriranja. Da biste izbjegli ovaj problem, stvorite nazive stilova koji se odnose na položaj ili važnost elemenata, kao što su .mainHeadlines ili .sidebarHeadlines.

• * Testirajte i potvrdite svoj kod. Čak i iskusni CSS dizajneri griješe, zbog čega Dreamweaver uključuje toliko sjajnih alata za testiranje i provjeru koda na vašim web stranicama. Provjerite jeste li testirali svoj CSS na uobičajene pogreške.

  Slijede dvije usluge online testiranja koje možete koristiti za provjeru grešaka u vašem CSS kodu. Jednostavno unesite URL bilo koje web stranice na Internetu u polje za adresu na bilo kojoj od ovih stranica i kliknite gumb Pošalji da biste primili izvješće koje pokazuje sve pogreške u vašem kodu:

  • Usluga W3C CSS validacije

  • XHTML-CSS : Budi valjan ili umri u učenju