CSS nemusíme vpisovať priamo do dokumentu. Môžeme si vytvoriť samostatný CSS dokument, čiže súbor s príponou .css. Syntax takéhoto dokumentu je:
objekt1 {atribút1: hodnota; atribút 2: hodnota;}
{ atribút 3: hodnota; atribút 4: hodnota;}
objekt2 { atribút 5: hodnota; atribút 6: hodnota;}
{ atribút 7: hodnota; atribút 8: hodnota;}
Príklad:
A:link {font-size: 12px; font-family: comic sans ms; color: white;}
A:hover {font-size: 16px; color: black;}
Na tento dokument sa musíme v HTML dokumente odkázať značkou s atribútami: rel=text/css type=stylesheet href=”URL adresa”

Tvorba www stránky

Návrh obsahovej štruktúry stránky

O internete sa v súčasnosti hovorí hlavne ako o informačnom médiu. Napriek tomu že sa často využíva na zábavu už pri zakladaní tejto siete sa s ňou rátalo ako prostriedkom na prenos informácií. Preto som si najprv určil obsahovú štruktúru budúcej www stránky. Otázkou bolo ako obsahovo prispôsobiť stránku tak aby vyhovovala čo najviac ľuďom a aby tam neboli zbytočné informácie, ktoré by aj tak nikto nevyužil a len by zbytočne zvyšovali veľkosť súborov. Nakoniec som sa nevyhol ankete, ktorú som pôvodne vôbec nemal v úmysle robiť. Jedinou otázkou bolo: „Čo by podľa teba mala obsahovať www stránka našej školy.“ Anketu som rozdal 70-tim študentom nášho gymnázia. Po sčítaní všetkých odpovedí mi vyšli takéto výsledky:


Odpovede Počet odpovedí Percentuálne
Kontakty na školu 70 100%
Informácie o príjmacích skúškach a o maturitách 53 75,7%
Pozvánky na akcie, ktoré sa budú konať v Bytči, koncerty a pod. 39 55,71%
Obrázky 33 47,14%
Zoznam profesorov 31 44,2%
Rozvrhy hodín všetkých tried 28 40%


V tabuľke je len 6 najviac používaných odpovedí.



Podľa ankety som si navrhol základnú štruktúru stránky:

1. Úvod, privítanie
2. Kontakty na školu
3. Informácie o príjmacých skúškach, zoznamy prijatých žiakov, podmienky prijatia na školu
4. Informácie o maturitách, maturitné otázky, nové maturity
5. Akcie v škole, v celej Bytči
6. Rozvrhy hodín všetkých tried
7. Galéria fotiek týkajúcich sa Gymnázia
8. Odkazy na stránky iných škôl, ministerstva školstva, študentské stránky

Návrh grafickej podoby stránky

V smere návrhu grafickej podoby stránky som sa spoľahol sám na seba. Určil som si čo všetko by stránka mala obsahovať: Titulok, menu, plochu do ktorej sa bude zobrazovať text a plochu, do ktorej umiestním odkazy. Nakreslil som si rôzne varianty podoby stránky v rôznych farebných prevedeniach.