Kategorie
CSS

Co naprawdę wiesz o CSS?

Tworzenie stron internetowych to świetna praca, jednak wymaga wielkich umiejętności. Na początku XXI wieku znajomość technologii takich jak HTML, CSS oraz JavaScript była wystarczająca. Z biegiem czasu zmieniły się trendy w projektowaniu, wsparcie technologii przez przeglądarki oraz zakres obowiązków Programisty Front-end. Obecnie taka praca koncentruje się głównie wokół JS oraz wielu narzędzi wspomagających proces tworzenia, testowania i wdrażania aplikacji.

Ale jak dużo technologii, która na zawsze zmieniła tworzenie stron internetowych. Co naprawdę wiesz o CSS?

Poziom podstawowy

Podstawowa kwestia znajomości CSS dotyczy sposobu zastosowania tej technologii dla dokumentu HTML, bo możliwości jest kilka. Dalej poznajemy selektorami, właściwościami oraz wartościami, czyli podstawowymi pojęciami arkuszy stylów kaskadowych. Stosowanie kolorów, manipulowanie rozmiarem, kształtem oraz wyglądem tekstu przychodzi równie szybko. Wreszcie pojawia się konieczność zrozumienia modelu pudełkowego i sposobu określania rozmiarów elementów poprzez szerokość, wysokość, dopełnienie, margines, a także obramowanie. Kiedy opanujemy te wszystkie umiejętności to nasza znajomość CSS jest już na poziomie podstawowym.

Poziom średni

Dalszy rozwój umiejętności wymaga opanowania różnic między selektorami, które są obsługiwane przez przeglądarki z różnym priorytetem, w zależności od miejsca występowania lub stopnia skomplikowania. Grupowanie selektorów o tych samych właściwościach i stosowanie pseudo klas dla różnych stanów elementów to kolejny etap nauki. CSS pozwala na określanie wielu właściwości w sposób skrótowy przez łączenie wielu z nich w jednej często znacznie krótszej formie. Definiowanie tła, obramowania czy cech tekstu to właśnie takie przypadki. Psuedo selektory to następny aspekt wymagany do sprawnego tworzenia arkuszy stylów, który dodatkowo został jeszcze rozbudowany w CSS3. Sam CSS zawiera wiele właściwości związanych z tworzeniem układu strony i wyświetlaniem poszczególnych elementów. Zrozumienie tych różnic pozwoli na pewniejsze i łatwiejsze stosowanie ich w określonych sytuacjach.

Poziom zaawansowany

Kolejne sposoby zmiany wyglądu elementów naszej strony to kwestia czasu, oczywiści jeśli mamy już solidne podstawy. Używanie zaokrąglonych rogów, cieni dla tekstu czy gradientów dla tła to następne właściwości. Podobnie wygląda definiowanie kolorów z kanałem alfa lub formie HSL. Tworzenie stylów dla różnych typów mediów, czyli ekrany komputerów, urządzenia mobilne czy druk to bardzo przydatna umiejętność. CSS3 w dużym stopniu rozszerzył dostępne selektory. Znajomość selektorów atrybutu jest wymagana na poziomie zaawansowanym, podobnie jak stosowanie transformacji, animacji czy Web Fonts.

Podsumowanie

CSS3 jest coraz lepiej wspierany przez przeglądarki, ale ciągły rozwój internetu sprawia, że wymagania i oczekiwania każdej ze stron rosną. Specyfikacja CSS4 w przyszłości przestanie być szkicem, a stanie się rekomendacją W3C. Pytanie czy do tego czasu każdy ekspert CSS będzie znał wymienione techniki i możliwości kaskadowych arkuszy stylów?