Strona słownika

Czy CSS4 istnieje? Co kryje się pod tą nazwą

10 min. czytania

Nie istnieje żadna oficjalna specyfikacja „CSS4” w rozumieniu kolejnej, wielkiej wersji języka CSS – i wszystko wskazuje na to, że nigdy jej nie będzie. Istnieją natomiast „poziomy 4” poszczególnych modułów CSS (np. Selectors Level 4), a określenie „CSS4” bywa używane potocznie jako hasło marketingowe na „nowoczesny CSS”.

Poniżej znajdziesz szczegółowe wyjaśnienie, skąd wzięło się zamieszanie z „CSS4”, jak dziś rozwija się CSS, co to oznacza w praktyce dla twórców stron oraz jakie są konsekwencje dla dostępności.

1. Skąd w ogóle wersje CSS – krótkie przypomnienie

CSS (Cascading Style Sheets) został zaprojektowany przez W3C w latach 90., aby rozdzielić strukturę dokumentu (HTML, XML) od jego prezentacji (wyglądu).

Klasyczny, „wersyjny” podział wyglądał tak:

  • CSS1 – pierwsza specyfikacja z 1996 r., podstawowe selektory, kolory, marginesy, czcionki itd.;
  • CSS2 – rozszerzenie m.in. o pozycjonowanie, media typy (druk, ekran), layout tabelkowy itp.;
  • CSS 2.1 – dopracowana, poprawiona wersja CSS2, długo traktowana jako „główny” stabilny standard;
  • CSS3 – i tu zaczyna się sedno sprawy.

Przez wiele lat programiści myśleli o CSS podobnie jak o HTML czy ECMAScript: jest wersja 1, 2, 3 – to naturalnie czekamy na… 4.

Problem w tym, że od CSS3 ten model się rozsypał – z premedytacją.

2. Co naprawdę stało się przy „CSS3”?

Pod hasłem „CSS3” kryje się nie jedna specyfikacja, ale zbiór wielu modułów, które mogą rozwijać się niezależnie.

Zamiast jednej monolitycznej specyfikacji CSS, mamy dziś dziesiątki modułów, m.in.:

  • selectors,
  • backgrounds and borders,
  • color,
  • image values and replaced content,
  • media queries,
  • flexbox,
  • grid,
  • transforms, transitions, animations,
  • i wiele innych.

Każdy taki moduł ma własny poziom (Level), na przykład:

  • Selectors Level 3, potem Selectors Level 4,
  • Media Queries Level 3 → Level 4,
  • Backgrounds & Borders Level 3 → Level 4.

Specjaliści z W3C – w tym edytorzy specyfikacji – podkreślają, że po CSS 2.1 nie ma kolejnych poziomów całego języka, a jedynie poziomy poszczególnych modułów.

Dlatego polska Wikipedia słusznie zaznacza, że „CSS 4 nie istnieje już jako jedna specyfikacja”.

3. Nie było i nie będzie CSS4 – oficjalne stanowisko

Jedną z najczęściej cytowanych wypowiedzi jest wpis Tab Atkinsa Jr. (członka grup roboczych CSS), w którym napisał wprost:

„Nigdy nie było CSS4. Nigdy nie będzie CSS4. CSS4 nie jest rzeczą, która istnieje.”

To samo stanowisko powtarzają m.in. te źródła:

  • CSS-Tricks – „Nigdy nie było CSS4. (…) CSS4 nigdy się nie wydarzy. To w ogóle nie istnieje.”;
  • Meta Stack Overflow – brak jednej, zintegrowanej specyfikacji „CSS4”, istnieją za to moduły poziomu 4;
  • Artykuły edukacyjne i blogi branżowe – zgodnie wyjaśniają modularny model rozwoju CSS.

Polskie źródła mówią to samo: JCubic („dlaczego nigdy nie będzie CSS4” – po CSS 2.1 wszystko zwykło nazywać się CSS3, a moduły mają własne poziomy, np. Selectors Level 4) oraz „Ach te Internety” („Data wydania CSS4 to… NIGDY. Nie ma i (z dużą dozą prawdopodobieństwa) nigdy nie będzie CSS4.”).

W skrócie: CSS jako całość przestał być wersjonowany w stylu 1, 2, 3, 4 – wersjonuje się poszczególne moduły.

4. Czym są moduły i poziomy CSS – i gdzie tu „CSS4”?

Od CSS3 cała specyfikacja została rozbita na moduły-tematy, które mogą dojrzewać we własnym tempie.

Typowa ścieżka modułu wygląda tak:

  1. Working Draft (WD) – szkic do dyskusji,
  2. Candidate Recommendation (CR) – propozycja do implementacji,
  3. Recommendation (REC) – stabilna rekomendacja.

W ramach modułu kolejne „wydania” oznacza się jako Level 1, 2, 3, 4…

Oto moduły, które osiągnęły poziom 4 lub są projektowane na poziomie 4:

  • Selectors Level 4 – nowe selektory, m.in. zaawansowane pseudo-klasy i rozszerzone możliwości dopasowywania elementów;
  • Image Values and Replaced Content Level 4 – rozwinięcie sposobu opisywania obrazów i treści podstawianych;
  • Backgrounds and Borders Level 4 – dalsze rozszerzenia tła i obramowań;
  • Media Queries Level 4 – m.in. nowe media features, np. preferencje użytkownika.

Dlatego w dyskusjach technicznych można spotkać sformułowanie:

„Nie ma CSS4 jako całości, ale istnieją moduły poziomu 4.”

To nie znaczy: „CSS4 wchodzi”, tylko: „konkretny moduł osiągnął poziom 4”.

5. Skąd więc wzięło się określenie „CSS4”?

Mimo że oficjalnie CSS4 nie istnieje, Google po wpisaniu „CSS4” zwraca mnóstwo wyników – artykułów, kursów, filmów na YouTube.

Najczęstsze powody są następujące:

  • przyzwyczajenie do wersjonowania – skoro był „CSS3”, naturalnie rodzi się pytanie: „kiedy wyjdzie CSS4?”;
  • marketing i clickbait – tytuły w stylu „CSS4 nadchodzi” czy „Nowości w CSS4” łapią uwagę; często chodzi po prostu o „nowoczesny CSS” – grid, flexbox, zmienne, nowe selektory itd.;
  • skrót myślowy – niektóre osoby używają „CSS4” jako zbiorczego określenia na moduły poziomu 4 lub zestaw funkcji wprowadzonych po „fali CSS3”.

Przykład z Frontend Masters: autor proponuje, żeby „CSS4” oznaczał właściwości i funkcje wprowadzone około 2013–2018, takie jak Flexbox, Grid, Writing Modes itd. To jednak prywatna propozycja „etykiety”, a nie oficjalny standard W3C.

„CSS4” nie ma żadnego technicznego znaczenia – wszystkie aktualne specyfikacje mają swoje własne wersje (Level 1–4), ale sam CSS nie ma już numeru wersji.

6. Jak „CSS4” bywa używane w praktyce (i dlaczego to mylące)

W praktyce można spotkać co najmniej trzy użycia tego skrótu:

  1. „CSS4” = poziomy 4 modułów

    Np. ktoś pisze „CSS4 selectors” mając na myśli Selectors Level 4. To skrót, akceptowalny w rozmowie technicznej – o ile wszyscy rozumieją, że chodzi o konkretny moduł, a nie „nową wersję CSS”.

  2. „CSS4” = „nowoczesny CSS po erze CSS3”

    W kursach i wpisach blogowych najczęściej chodzi o:

    • flexbox,
    • grid,
    • zmienne CSS (var() / --foo),
    • zaawansowane media queries (w tym preferencje użytkownika),
    • nowe pseudo-klasy (:is, :where, rozszerzone :not(), :focus-visible, :has),
    • funkcje kolorów, nowe jednostki oraz funkcje min(), max(), clamp().

    To faktycznie „nowsze” funkcje CSS, ale wrzucanie ich do worka „CSS4” zaciemnia obraz – każda z nich pochodzi z innego modułu, o innym poziomie dojrzałości i wsparcia.

  3. „CSS4” jako tytuł marketingowy

    W polskim internecie pojawiały się np. ironiczne wpisy z tytułem „CSS4 – znam datę wydania!”, które w treści wyjaśniają, że data to: NIGDY i tłumaczą zamieszanie wokół wersji CSS.

Jeśli ktoś mówi „CSS4”, prawie na pewno nie ma na myśli oficjalnej specyfikacji, tylko luźny zbiór „nowych” funkcji CSS albo konkretne moduły poziomu 4.

7. Dlaczego W3C nie chce „CSS4” – korzyści z modularnego podejścia

Rezygnacja z „CSS4” nie jest przypadkiem – za modularnym podejściem stoją konkretne powody:

  • niezależny rozwój modułów – selektory, kolory, layout, media queries mogą rozwijać się w swoim tempie, bez czekania na „wielką wersję”;
  • szybsze dostarczanie funkcji do przeglądarek – implementowane są pojedyncze moduły lub ich części, a nie „cały pakiet”;
  • łatwiejsze zarządzanie złożonością – jedna gigantyczna specyfikacja byłaby nie do ogarnięcia dla autorów i implementatorów;
  • lepszy model dla dostępności – funkcje jak prefers-reduced-motion czy prefers-color-scheme mogą być rozwijane tam, gdzie mają sens, i wdrażane niezależnie.

W efekcie mamy dziś ciągłą, modułową ewolucję CSS, a nie „duże wydania” co kilka lat.

8. Co to wszystko znaczy dla twórców stron (i jak się w tym nie pogubić)

Nie myśl w kategoriach „CSS4”, tylko „modułów” i „funkcji”

Zamiast pytać „czy przeglądarka X obsługuje CSS4?”, sensowniej pytać:

  • czy obsługuje grid layout (moduł CSS Grid Layout)?,
  • czy obsługuje :focus-visible (Selectors Level 4)?,
  • czy obsługuje prefers-reduced-motion (Media Queries Level 4)?.

To bliższe temu, jak naprawdę dokumentowane i wdrażane są funkcje CSS.

Śledź konkretne moduły i poziomy

Jeśli piszesz bardziej zaawansowany CSS, warto wiedzieć:

  • że np. Selectors Level 4 wprowadza nowe pseudo-klasy i rozszerzone możliwości selektorów,
  • że Media Queries Level 4 pozwala odpytać o preferencje użytkownika i lepiej wspierać dostępność,
  • że Backgrounds and Borders Level 4 to kolejne możliwości dekoracji tła i obramowań.

W dokumentacjach (MDN, specyfikacje W3C) zawsze znajdziesz informację, z jakiego modułu pochodzi dana funkcja.

Korzystaj z narzędzi do sprawdzania wsparcia

Ponieważ nie ma „CSS4” jako jednej wersji, musisz sprawdzać wsparcie per funkcja:

  • czy dana właściwość lub selektor ma wsparcie w przeglądarkach, które cię interesują,
  • czy wymaga prefiksów,
  • czy można zastosować progressive enhancement (najpierw prosty, dostępny layout, potem opcjonalne ulepszenia).

To kluczowe także z perspektywy dostępności.

9. „CSS4” a dostępność – co warto wiedzieć

Brak „CSS4” jako wersji nie oznacza stagnacji – przeciwnie, wiele nowoczesnych funkcji CSS poprawia dostępność, jeżeli są odpowiednio użyte.

Media Queries Level 4 i preferencje użytkownika

prefers-reduced-motion – użytkownicy mogą ograniczyć animacje; CSS może to uszanować, minimalizując ruch.

prefers-color-scheme – wsparcie dla trybu jasnego/ciemnego, przydatne dla komfortu wzrokowego.

To wszystko pojawia się w nowych poziomach specyfikacji, a nie w „CSS4” jako całości.

Nowe pseudo-klasy i fokus

:focus-visible pozwala wyświetlać obramowanie fokusu tylko wtedy, gdy jest ono rzeczywiście potrzebne (np. przy nawigacji klawiaturą), nie utrudniając przy tym używania strony myszą czy dotykiem.

Dzięki temu można łączyć estetykę z realnym wsparciem dla osób korzystających z klawiatury czy czytników ekranu.

Progressive enhancement zamiast „czekania na CSS4”

Wielu użytkowników sprawia wrażenie, jakby „czekało na CSS4”, po czym nastąpi „rewolucja”. W rzeczywistości – z perspektywy dostępności – dużo ważniejsze jest:

  • zaplanowanie sensownych, prostych, dostępnych podstaw (baseline),
  • stopniowe dodawanie nowoczesnych funkcji CSS, jeśli środowisko je wspiera,
  • dbanie o czytelne kontrasty, widoczny fokus, możliwość powiększania treści oraz fallbacki dla „fajerwerków” wizualnych.

Modularny rozwój CSS świetnie się z tym modeluje: funkcje istotne dla dostępności (jak preferencje ruchu czy koloru) mogą pojawiać się niezależnie od „wielkiej wersji” i być użyte od razu tam, gdzie są dostępne.

10. Jak o tym pisać i mówić w polskim internecie

  1. Unikaj tytułów typu „CSS4 – co nowego?”, chyba że zamierzeniem jest ironia połączona z wyjaśnieniem, dlaczego CSS4 nie istnieje. Lepsze są na przykład takie sformułowania:

    • „Nowoczesny CSS: selektory poziomu 4 w praktyce”,
    • „Media Queries Level 4 – jak wykorzystać preferencje użytkownika”,
    • „Grid, Flexbox i spółka – przegląd współczesnego CSS”.
  2. Jeśli używasz skrótu „CSS4”, doprecyzuj, co masz na myśli – np. „potocznie nazywam tu CSS4 zestaw nowszych funkcji CSS, takich jak grid, flexbox i zmienne. Oficjalnie CSS4 nie istnieje – są tylko moduły i ich poziomy”.

  3. W treściach edukacyjnych tłumacz modularność CSS – pokaż czytelnikom, że:

    • Selectors mają swoje poziomy, Media Queries swoje, Layout swoje,
    • nowe funkcje CSS nie muszą „czekać na CSS4”,
    • ważniejsze jest zrozumienie, skąd pochodzi dana funkcja (który moduł), niż „do której wersji CSS należy”.
  4. Łącz temat wersji CSS z dostępnością – podkreśl, że nowoczesne moduły CSS dają narzędzia do lepszego wspierania użytkowników (preferencje ruchu, tryb ciemny, fokus, responsywność). Każdą „nowość” warto weryfikować pod kątem:

    • wsparcia przeglądarek,
    • wpływu na czytelność,
    • wpływu na użytkowników korzystających z technologii asystujących.

To nie tylko porządkuje wiedzę, ale też realnie wpływa na jakość i dostępność polskich serwisów.

11. Co z tego wynika w praktyce dla programisty

Jeżeli tworzysz front-end dziś, rozsądne podejście można streścić w kilku punktach:

  • mów po prostu „CSS”, a gdy trzeba – doprecyzuj moduł: „Selectors Level 4”, „Media Queries Level 4”, „Grid Layout”;
  • traktuj „CSS3” jako historyczny etap, a nie żywą etykietę na wszystko po „2.1”; w praktyce wszystko po 2.1 bywało nazywane „CSS3”, co doprowadziło do nieporozumień;
  • nie czekaj na CSS4 – nowe funkcje już są i będą pojawiać się stopniowo, moduł po module;
  • dbaj o dostępność przy każdej nowości – sprawdzaj skutki dla użytkowników (np. zawroty głowy przy animacjach) i przygotuj sensowne fallbacki;
  • ucz innych właściwego modelu – im rzadziej mówimy „CSS4” jak o realnym standardzie, tym mniej zamieszania wśród początkujących.