Jakie masz pytanie?

lub

Wprowadzenie których niestandardowych rozwiązań do języka HTML przez Internet Explorer spowodowało, że twórcy nowoczesnych przeglądarek musieli stworzyć tzw. Quirks Mode?

historia modelu pudełkowego działanie quirks mode standardy wyświetlania stron
avatar

Gość (83.4.*.*)



Odpowiedź:

Historia rozwoju przeglądarek internetowych to fascynująca opowieść o rywalizacji, innowacjach i... chaosie, który do dziś odbija się echem w kodzie stron WWW. Jeśli kiedykolwiek zastanawialiście się, dlaczego współczesne przeglądarki, takie jak Chrome czy Firefox, muszą czasem „udawać”, że są starymi programami z lat 90., odpowiedź kryje się pod nazwą Quirks Mode. Ten specyficzny tryb renderowania powstał jako bezpośrednia odpowiedź na niestandardowe rozwiązania wprowadzone przez Internet Explorera w czasach jego absolutnej dominacji.

Największy winowajca: Model pudełkowy (Box Model)

Najważniejszą i najbardziej kłopotliwą różnicą, która wymusiła powstanie Quirks Mode, był sposób, w jaki Internet Explorer (szczególnie w wersji 5.5 i starszych) interpretował model pudełkowy CSS. W standardzie W3C, który jest fundamentem dzisiejszego internetu, szerokość elementu (width) dotyczy wyłącznie jego zawartości. Jeśli dodasz do niego marginesy wewnętrzne (padding) lub obramowanie (border), całkowita szerokość elementu na ekranie się zwiększy.

Internet Explorer podszedł do tego inaczej. W jego interpretacji width oznaczało całkowitą szerokość elementu, wliczając w to już padding i border. Dla programistów tworzących strony pod IE było to rozwiązanie dość intuicyjne, ale kompletnie niezgodne z rodzącymi się standardami. Gdyby nowoczesne przeglądarki nagle zaczęły wyświetlać stare strony zgodnie z nowymi wytycznymi, cały układ elementów (layout) po prostu by się „rozsypał”, bo pudełka stałyby się szersze niż planowali to twórcy.

Problemy z tabelami i dziedziczeniem stylów

Kolejnym wyzwaniem były tabele, które w latach 90. służyły nie tylko do prezentacji danych, ale przede wszystkim do budowania całych układów stron. Internet Explorer wprowadził specyficzne zachowania, które stały się standardem dla ówczesnych webdeveloperów:

  • Brak dziedziczenia czcionek: W IE style zdefiniowane dla elementu <body> (np. krój pisma czy kolor) często nie przenosiły się do wnętrza tabel. Twórcy musieli definiować style osobno dla każdej komórki lub całej tabeli.
  • Obsługa białych znaków: IE ignorował białe znaki (spacje, entery) wewnątrz tabel w sposób, który pozwalał na tworzenie bardzo ciasnych układów graficznych. Standardowe podejście W3C traktowało te znaki jako treść, co powodowało powstawanie niechcianych przerw między grafikami.

Dlaczego Quirks Mode był konieczny?

Kiedy na przełomie wieków standardy W3C zaczęły zyskiwać na znaczeniu, twórcy przeglądarek stanęli przed ogromnym dylematem. Z jednej strony chcieli implementować nowoczesne, poprawne rozwiązania, z drugiej – nie mogli pozwolić na to, by miliony istniejących stron internetowych przestały działać lub wyglądać poprawnie.

Rozwiązaniem okazał się „tryb osobliwości” (Quirks Mode). Jest to mechanizm, który pozwala przeglądarce zdecydować: „Czy mam wyświetlić tę stronę zgodnie z nowoczesnymi standardami, czy mam udawać starego Internet Explorera, żeby nic się nie popsuło?”.

Ciekawostka: Przełącznik DOCTYPE

Jak przeglądarka wie, którego trybu użyć? Kluczem jest deklaracja DOCTYPE na samym początku kodu HTML. Jeśli strona posiada nowoczesną deklarację (np. <!DOCTYPE html>), przeglądarka uruchamia tryb standardowy. Jeśli deklaracji brakuje lub jest ona bardzo stara (odnosząca się do wczesnych wersji HTML), przeglądarka przechodzi w Quirks Mode, aktywując stare błędy i niestandardowe zachowania IE dla dobra kompatybilności.

Inne „wynalazki” Internet Explorera

Choć model pudełkowy był najważniejszy, IE wprowadził też szereg innych funkcji, które nie były częścią standardów, ale wymuszały na konkurencji dostosowanie się:

  1. Filtry CSS: Zanim mieliśmy opacity czy blur w standardzie, IE używał specyficznej składni filter: alpha(opacity=50).
  2. Scrollbary: Możliwość kolorowania pasków przewijania za pomocą CSS była unikalną cechą IE, którą inne przeglądarki musiały ignorować lub emulować w specyficzny sposób.
  3. Własnościowe tagi: Słynny <marquee> (przesuwający się tekst) czy <bgsound> (muzyka w tle) to pomysły Microsoftu, które choć stały się kultowe, nigdy nie były częścią oficjalnego standardu HTML w pierwotnej formie.

Dziś, dzięki Quirks Mode, możemy przeglądać archiwalne strony z lat 90. i cieszyć się ich (często wątpliwą) estetyką dokładnie tak, jak widzieli ją użytkownicy kilkadziesiąt lat temu. To swoisty „emulator” dawnego internetu zaszyty w każdej nowoczesnej przeglądarce, którą mamy na dysku.

Podziel się z innymi: