Kurs języka HTML i CSS

Poradnik webmastera

  • Zwiększ rozmiar czcionki
  • Domyślny  rozmiar czcionki
  • Zmniejsz rozmiar czcionki

Dlaczego style są ważne

Email Drukuj PDF
Języki służące do budowy stron WWW (zarówno HTML, jak i jego bezpośredni następca, czyli XHTML) zostały uzupełnione o potężne narzędzie do formatowania dokumentów internetowych - kaskadowe arkusze stylów (CSS - Cascading Style Sheets). Jest to rewolucyjna idea, w zasadniczy sposób zwiększająca elastyczność narzędzi i możliwości autorów stron. Warto zauważyć, że style leżą także u podstaw dynamicznego HTML (z technicznego punktu widzenia jest to połączenie stylów z językami skryptowymi, np. JavaScript, a także Document Object Model) oraz decydują o wizualizacji dokumentów XML.

Style, zwłaszcza na najczęściej stosowanym poziomie CSS1, są niezbyt skomplikowane w konstrukcji, dając zarazem zaawansowane możliwości manipulowania postacią dokumentów, jakich brakowało w tradycyjnym języku HTML. Umiejętne stosowanie stylów pozwala całkowicie odmienić wygląd strony, nie szkodząc zarazem przeglądarkom, które stylów nie interpretują. Podkreślmy też wyraźnie, że CSS2 (obecnie w wersji 2.1) jest bardzo poważnym krokiem do przodu w stosunku do CSS1.

Jest to naturalny etap rozwoju języka i jego pojawienie się było łatwe do przewidzenia dla osób interesujących się głębiej edytorami tekstów, w których style zajmują bardzo eksponowane miejsce. Styl, będący zespołem kodów formatujących (jednego czy kilku), pozwala obecnie globalnie lub lokalnie zmieniać sposób formatowania wybranego fragmentu dokumentu. 

Zwróćmy od razu uwagę na pewien istotny motyw powstania stylów. Język SGML, którego HTML jest pochodną, zajmuje się strukturą dokumentów i ich stroną semantyczną. Nie zajmuje się natomiast ich stroną wizualną, formatowaniem. HTML przekroczył tę barierę i z czysto praktycznych przyczyn od początku zaczął się rozszerzać o polecenia formatujące, dzięki którym dokumenty HTML są wizualnie dość różnorodne. Jednak ubocznym skutkiem tej sytuacji stał się "dziki wyścig" firm mających największy wpływ na rynku oprogramowania - Netscape i Microsoft, pewne swej silnej pozycji i roszcząc sobie prawo do swoistego ustawodawstwa zaczęły narzucać rozmaite rozszerzenia, interpretowane tylko przez ich przeglądarki, jak np. migotanie tekstu (NC) czy animacja Marquee (IE). Niektóre z tych rozszerzeń okazały się trafne i były sankcjonowane przez kolejne specyfikacje HTML, inne okazały się ślepym zaułkiem. Dobrym przykładem jest znacznik <font face>, który sterował czcionkami w dokumencie - w HTML 4 jest on określony jako przestarzały i odradza się jego stosowanie, zalecając przenoszenie informacji o czcionkach do stylów.

Arkusze stylów są próbą "powrotu do źródeł". Dzięki nim będzie można stopniowo rezygnować z formatowania bezpośrednio za pomocą HTML, przerzucając odpowiedzialność na style. W ten sposób HTML pozostanie w swej czystej, kanonicznej postaci i nie będzie już ryzyka niekontrolowanego rozbudowywania zestawu znaczników. Specyfikacja CSS2 jest narzędziem mocnym i wszechstronnym - problem jedynie w tym, aby ważniejsze przeglądarki poprawnie interpretowały wszystkie polecenia.

Choć "niedzielny webmaster" może z powodzeniem tworzyć strony w tradycyjny sposób, korzystając wyłącznie z poleceń klasycznego języka HTML, poznanie CSS pozwoli mu wejść w zupełnie inny świat, o możliwościach daleko wykraczających poza tę tradycję. Webmaster nieco bardziej zaawansowany wręcz musi je poznać, jeśli chce mieć pełną swobodę tworzenia stron. W Sieci jest sporo niezmiernie ciekawych witryn poświęconych CSS, których autorzy popisują się wręcz kapitalnymi przykładami - niech za próbkę możliwości posłuży choćby CSS PLaY, gdzie znajdziesz m.in. świetne przykłady efektownego wykorzystania stylów do tworzenia menu strony.

Podsumowując, do zalet stosowania CSS można zaliczyć:

  • oddzielenie struktury witryny od jej prezentacji, co ułatwia jej tworzenie i utrzymywanie
  • dużo większe możliwości formatowania za pomocą stylów niż za pomocą znaczników i ich atrybutów
  • znaczące zmniejszenie ilości kodu użytego do wizualizacji
  • łatwość manipulowania całymi kompleksami stron
  • łatwość ujednolicenia wyglądu dokumentów opartych na tym samym arkuszu stylów

Na marginesie uwaga: jest niemal pewne, że podstawowe sposoby formatowania z HTML zawsze będą interpretowane, gdyż miliony dokumentów w WWW są formatowane za pomocą klasycznego HTML i konieczne by było ich przetworzenie, zgodnie ze specyfikacją stylów - raczej nie jest to możliwe, więc konieczność zgodności "w dół" spowoduje, że te zaszłości będą zawsze honorowane przez przeglądarki.

Niniejszy opis powstaje na podstawie specyfikacji stylów poziomu pierwszego i drugiego (CSS1 i CSS2). Najnowsza wersja specyfikacji tego ostatniego (Cascading Style Sheets, level 2 revision 1 CSS 2.1 Specification), została zaprezentowana przez World Wide Web Consortium 11 kwietnia 2006 roku. 

Nie uwzględniamy rozwijanej powoli specyfikacji CSS3, która jest jeszcze dość daleka od implementacji w przeglądarkach.


Uwaga: Przeglądarki internetowe implementują interpretację stylów stopniowo, więc przy kolejnych aktualizacjach przeglądarek można się spodziewać następnych poprawek. Trzeba jednak podkreślić, że w interpretacja w najnowszych wersjach przeglądarek jest już bardzo zaawansowana.

Obszerny test znajdziesz w serwisie Web Devout, gdzie możesz sprawdzić zgodność przeglądarek ze standardami, w tym także przestestować obsługę stylów w ważniejszych przeglądarkach.

 

CSS. Tworzenie nowoczesnych stron WWW.

CSS3. Tworzenie nowoczesnych stron WWW
(czerwiec 2012)

HTML5 i CSS3. Standardy przyszłości

HTML5 i CSS3
Standardy przyszłości

CSS3. Szybki start. Wydanie V

CSS3. Szybki start.
Wydanie V