Przejdź do treści

Tryb Quirks - CSS

X-UA-Compatible

Na co można sobie pozwolić, projektując stronę dla najnowszej wersji Internet Explorera? Jak wymusić tryb wstecznej kompatybilności na stronach, które wcześniej wyświetlały się prawidłowo?

Microsoft Internet Explorer 8.0 wprowadza aż trzy tryby renderowania dokumentów:

  1. Quirks Mode - niezgodny ze standardami (kompatybilny z MSIE 5)
  2. Compatibility View - tryb wstecznej zgodności ze standardami (kompatybilny z MSIE 7)
  3. Standards Compliance - zupełna zgodność (MSIE 8)

Przełączenie do trybu Quirks jest realizowane identycznie jak we wcześniejszych wersjach MSIE, tzn. poprzez odpowiednią deklarację DTD. We wszystkich innych przypadkach dokument powinien się wyrenderować w trybie Standards Compliance, który jest najbardziej zgodny ze standardami HTML i CSS. Natomiast w trybie Compatibility View dokumenty wyświetlają się tak jak w trybie zgodności ze standardami, który był dostępny w MSIE 7 - jak się okazało, wcale nie był on taki do końca "zgodny", jakby wskazywała uprzednia jego nazwa, ale Microsoft zdecydował się go zachować ze względu na kompatybilność wstecz.

Pewnym zaskoczeniem może być fakt, że użycie DTD innego niż dla trybu Quirks, może włączyć zarówno tryb MSIE 7 jak i MSIE 8. Standards Compliance (tryb najwyższej zgodności) jest domyślnym, jednak użytkownik przeglądający stronę może sam zdecydować - za pomocą specjalnego przycisku znajdującego się przy pasku adresu przeglądarki - że chce ją wyświetlić w trybie Compatibility View, czyli tak jak w MSIE 7. Jest to ostatnia deska ratunku, gdy dokument który usiłuje wyświetlić, nieprawidłowo renderuje się w założonym trybie najwyższej zgodności. W takim przypadku emulacja jest tak dokładna, że nie da się w ogóle rozpoznać, że tak naprawdę używany jest MSIE 8, ponieważ przeglądarka "przedstawia się" (za pomocą nagłówka HTTP "User-Agent" oraz dla skryptów JavaScript) jako MSIE 7.0.

Jak już wspomniano, Internet Explorer 8 wreszcie praktycznie w pełni obsługuje obowiązujące standardy. Paradoksalnie w pewnych przypadkach może to nam przysporzyć wiele kłopotów. Ze względu na całą masę błędów w poprzednich wersjach tej przeglądarki, często okazuje się, że strona zoptymalizowana tak, aby prawidłowo funkcjonowała np. w MSIE 6 lub 7, teraz wyświetla się nieprawidłowo, ponieważ wszystkie "obejścia", które wcześniej trzeba było zastosować, powodują teraz problemy. W takiej sytuacji doraźnym rozwiązaniem mogłoby być przynajmniej tymczasowe wymuszenie trybu renderowania dokumentu w trybie Compatibility View (kompatybilnym z MSIE 7), aż nie zdołamy wszystkiego poprawić. Można to zrealizować za pomocą specjalnego znacznika META:

<meta http-equiv="X-UA-Compatible" content="IE=wersja">
gdzie zamiast wersja można wpisać:
EmulateIE8
"Quirks Mode" lub "Standards Compliance" - w zależności od użytego DTD (domyślnie)
EmulateIE7
"Quirks Mode" lub "Compatibility View" - w zależności od użytego DTD
8
Zawsze "Standards Compliance" bez względu na DTD
7
Zawsze "Compatibility View" bez względu na DTD
5
Zawsze "Quirks Mode" bez względu na DTD
edge
Najwyższy możliwy ewentualny przyszły tryb zgodności niezależnie od DTD (IE=8, IE=9, IE=10...)

Inaczej niż przełączanie w tryb Quirks za pomocą DTD, który to sposób jest identycznie obsługiwany przez wszystkie liczące się przeglądarki, przedstawiony znacznik META działa tylko w MSIE 8. Powód jego ignorowania przez inne przeglądarki jest bardzo prosty: dla nich nie jest potrzebny żaden dodatkowy tryb, ponieważ odpowiednio wysoki poziom zgodności ze standarami HTML i CSS osiągnęły już dawno 🙂

Warto jeszcze zwrócić uwagę na kilka ważnych zagadnień:

  • Wstawienie przedstawionego tutaj znacznika META - z jakąkolwiek wartością - powoduje, że przycisk, za pomocą którego użytkownik samodzielnie może się przełączyć w tryb Compatibility View, staje się dla niego niedostępny. Dlatego używając tego znacznika należy dokładnie przetestować stronę, gdyż w razie problemów nie ma drogi odwrotu.
  • Inaczej niż w sytuacji, gdy użytkownik sam wybiera tryb Compatibility View za pomocą przycisku, wstawienie znacznika META nie zmienia sposobu "przedstawiania się" przeglądarki - nadal będzie to MSIE 8.0. Może to wywoływać pewne problemy, gdy niektóre elementy strony zależą od podanej wersji przeglądarki. Pojawia się wtedy rozbieżność pomiędzy sposobem renderowania dokumentu a oczekiwaną w takiej sytuacji wersją przeglądarki.
  • Aby opisany tutaj znacznik META funkcjonował prawidłowo, musi znajdować się w nagłówku strony, a przed nim mogą być wstawione tylko inne znaczniki <meta> lub element <title>...</title>!

Co zmienia przejście z trybu Compatibility View (MSIE 7) do trybu Standards Compliance (MSIE 8)?

HTML

  • Prawidłowe dodawanie cudzysłowów obejmujących tekst zawarty w znaczniku <q>...</q>
  • Zawartość atrybutu <img src="..." alt="..."> nie wyświetla się już w "dymku" narzędziowym (co było nieprawidłowe) - jak w przypadku title="..."
  • Domyślną wartością atrybutu <button type="...">...</button> jest "submit", a nie jak wcześniej - "button", tzn. jeśli wstawimy przycisk bez tego atrybutu, będzie on wysyłał formularz

CSS

Źródło: CSS Improvements in Internet Explorer 8

Inne przydatne artykuły:

Komentarze

Zobacz więcej komentarzy

Facebook