Priviate vetrom

css a šablóny

 

Cascading Style Sheets

CSS je štýlovací jazyk používaný na opísanie vzhľadu a formátovania dokumentu napísaného v značkovacom jazyku. Jeho načastejšie uplatnenie je v štýlovaní web stránok napísaných v HTML a XHTML. Takisto sa može použiť na hocijaký iný značkovací jazyk, ako je XML, SVG alebo XUL. Primárne bol vytvorený na oddelenie obsahu dokumentu a vzhľadu dokumentu. Umožňuje zdielať určité charakteristiky stránky na všetkých stránkach webu, bez potreby duplicity tohoto značkovania. Napríklad: Všetky stránky majú rovnaký font pre nadpisy, umiestnenie loga je vždy rovnaké, odseky majú vždy rovnaké odsadenie, rovnaký font a medzeru medzi ďaľším odsekom a tak ďalej. Ak je potrebné niečo zmeniť, stačí to zmeniť na jednom mieste v css súbore a je to. V prípade redesignu celého webu stačí naštýľovať jeden CSS súbor a nahradiť starý súbor. Pre ten istý značkovací súbor (HTML) môžme vytvoriť viacero štýlov, dajme tomu jeden pre výstup na monitor, jeden pre tlačenie na tlačiarni, jeden pre čítačku hlasu, jeden pre zariadenie tvoriace Brailovo písmo. Aby som tu nespomínal len teóriu, pozrite si názorné uvedenie do praxe. Web CSS ZEN Garden má vždy to isté HTML a v pravom bočnom menu si môžete vybrať rôzne CSS súbory. Prečo kaskádové štýly? V CSS funguje dedenie štýlov, teda každý člen predošlého elementu dedi jeho štýlovanie (DOM). Takisto k jednému elementu môže byť priradených viacero štýlov. Vzniká tak vrstvenie štýlov (layers) a platí, že posledné štýlovanie prepíše to predošlé. Je to celkom podobné ako vo Photoshope.

CSS prešlo tiež nejakým vývojom a dnes sa už črtá koncept CSS4. V praxi sa ale stále používa CSS1 a CSS2. Každá ďaľšia verzia prináša nejaké nové štýlovanie a efekty. CSS spravované a štandardizované World Wide Web Konzorciom (W3C). Problém prečo sa najnovšie CSS3 ešte v praxi nevyužíva je v prehliadačoch. Samotnú stránku vykresľuje na strane užívateľa internetový prehliadač (Firefox, Chrome, Internet Explorer, Opera, Safari, a ďaľšie). Niektoré prehliadače, ako napríklad Internet Explorer nerešpektoval celé roky CSS štandardy a tak wev developeri dlho nemohli využívať výhody kaskádového štýlovania. Nemá zmysel využívať technológiu, ktorá nezabezpečuje rovnaké zobrazenie stránky všetkými jej návštevníkmi. V poslednej dobe sa situácia už zlepšuje. Konkurencia prehliadače prinútila súperiť o užívateľov a každý prehliadač sa snaží zobrazovať korektne čo najviac štandardov. Dnes sa najčastejšie kvalita prehliadača vyjadruje v schopnosti zobrazovať čo najväčšie množstvo CSS štýlov korektne, toto sa boduje a prehliadač s najväčším množstvom bodov je najlepší.

Template

Template alebo šablóna, je označenie kombinácie HTML a CSS pri dynamicky generovaných stránkach, najčastejšie php jazykom.

  • HTML kód definuje jednotlivé elementy, teda značkovanie, do ktorého budú dynamicky vkladané informácie, ktoré sa budú zobrazovať na danej stránke, napr.: logo, menu, obsah s nadpismi a odsekmi a päta s nejakými linkami.
  • CSS toto značkovanie oštýľuje, teda každá stránka s touto šablónou, bude mať rovnaký výzor, ale iný obsah.
  • PHP vloži do html elementov informácie, pre danú stránku.

Príklad šablóny: E-shop, ktorý predáva softvér, má v menu kategórie nazvané: grafické programy, textové editory, antivírusy, ... Keď si zobrazíte hociktorú kategóriu, uvidíte ten istý HTML kód, ten istý CSS súbor, ale php vloží do stránky informácie o produktoch v danej kategórii.

Jeden web zvyčajne využíva týchto šablón viac. Jednu pre zobrazenie domácej stránky, jednu pre zobrazenie kategórie, jednu pre zobrazenie produktu, ... Teraz už možno vidíte koľko práce je potrebnej na vytvorenie jedného webu. Od najjednoduchších webovm ako sú vizitkové stránky alebo blogy, ktoré využívajú len jednu šablónu, až po niekoľko šablónové ako sú stránky sociálnych webov, spravodajské weby a iné webové aplikácie.