Projektowanie i tworzenie stron internetowych

Style CSS Cascading Style Sheets (Kaskadowe Arkusze Stylów), to elementy strony internetowej określające nam wygląd, położenie a nawet animację danych elementów strony www, a dokładniej zdefiniowanych elementów kodu HTML. Dzięki CSS możemy określić np. kolor danego elementu, wielkość czcionki, animację po najechaniu czy kliknięciu, położenie względem innych elementów, wymiary i inne wartości budujące całą stronę internetową. Kod HTML buduje nam strukturę witryny a styl CSS określa właściwości tej struktury.

Istnieją dwie metody wdrażania stylów CSS, pierwszy to pisanie bezpośrednio w kodzie strony a drugi to umieszczania kody CSS w oddzielnym pliku i wczytywanie go na każdej stronie. Pierwszy sposób jest już praktycznie nie używany, tą metodę stosuje się wyłącznie przy budowie np. szablonów Allegro, gdzie nie mamy innego wyjścia. Przy tworzeniu strony internetowej o wiele lepszym sposobem jest metoda druga a więc umieszczania arkuszu stli w oddzielnym pliku. Robi się to dlatego, że wyobraźmy sobie rozbudowaną stronę www, która zawiera 1000 podstron. Zmiana stylu jednego elementu witryny wiązałaby się z wprowadzeniem poprawki na 1000 podstronach a tak mamy jeden plik który edytujemy i w którym wprowadzamy zmiany widoczne na wszystkich podstronach serwisu. Kolejnym atutem takiego rozwiązania jest wielkość plików. W pierwszym rozwiązaniu, każda z podstron zawierałaby powtórzenie kodu, a więc nasz arkusz CSS zajmowałby 1000 razy więcej pamięci. Tak więc wybór co do metody umieszczenia Kaskadowego Arkuszu Stylów na naszej stronie jest dość prosty.

Aby umieścić nasz arkusz stylów wystarczy jedna linijka kodu w sekcji head strony internetowej np.

W tym przypadku nasz plik stylów znajduje się w katalogu głównym naszej strony, jeśli chcemy go umieścić w jakimś podkatalogu to np.

gdzie css jest stworzonym podkatalogiem w którym znajduje się nasz arkusz.

Przy bardziej zaawansowanych projektach możemy podczepić dowolna ilość plików ze stylami CSS, odpowiedzialnymi za poszczególne elementy występujących na stronie internetowej, np.

Całość powinna wyglądać:

Istnieje wiele programów do tworzenia stylów CSS na potrzeby stron www, jednym z najlepszych jest Dreamweaver http://www.adobe.com/pl/products/dreamweaver.html lecz jest to dość drogie rozwiązanie. Istnieje wiele darmowych programów pozwalających pisać kod CSS na potrzeby naszej strony internetowej. Osoby dobrze obeznane z zagadnieniem CSS mogą je pisać w zwykłym notatniku.

Najważniejszymi zadaniami które spełniają Kaskadowe Arkusze Stylów to:

1. szybkość ładowania strony;
2. łatwość zmian każdego elementu na stronie internetowej;
3. spójność witryny, np. wszędzie ta sama czcionka;

Tak naprawdę obecnie nie ma możliwości stworzenie poprawnej strony internetowej bez arkuszy stylów a więc jeśli chcesz budować witryny internetowe temat CSS nie może być Ci obcy. W czasach prehistorycznych (10 – 15  lat temu) strony opierały się na tabelach i wtedy style CSS nie były aż tak ważnym elementem składającym się na stronę internetową lecz obecnie to standard bez którego nasze strony nie będą funkcjonować poprawnie  a każda zmiana to szybki proces zmiany fragmentu kodu znajdującego się w jednym pliku.