Přejít k navigační liště

Zdroják » Webdesign » Přepínání vykreslovacích režimů Internet Exploreru

Přepínání vykreslovacích režimů Internet Exploreru

Články Webdesign

Aby staré weby vypadaly stále stejně, přibývaly v prohlížečích další vykreslovací režimy. Internet Explorer 9 má takové režimy 4. Nově implementované části HTML5 jsou však dostupné jen v tom nejnovějším. V článku si ukážeme, jak ovlivnit, který vykreslovací režim Internet Explorer pro stránky použije.

Z války prohlížečů vzešlo mnoho odlišností v jejich vykreslovacích jádrech. Web postupně standardizoval a vykreslování prohlížečů bylo třeba upravit.

Internet Explorer 9 má celkem čtyři vykreslovací režimy. První se nazývá Quirks a jedná se o staré jádro Trident II. Je určené pro nejstarší weby, intranet a filesystém. Pokud webová stránka neobsahuje doctype, je použit právě tento režim. Je výchozí pro prostředí intranet a pro html soubory otevírané z místního disku. To je důležité například pro správnou funkčnost nápověd ve formátu html zabalených do jednoho souboru s příponou chm. Quirks mode zvládne CSS1 a základní úkony s JavaScriptem.

Vedle režimu Quirks, který pokrýval funkcionalitu čtvrté a páté verze IE, přibyl v šesté verzi režim standardů. Ten se liší zejména box modelem. Ten je sice trošku nelogický, hlavní ale je, že se v něm rozměry elementů počítají ve všech prohlížečích stejně. Rozhodnutí W3 prosadit jako standard něco, s čím nepočítala většina webů, přineslo mnoho problémů. Vedle toho byla také v IE 6 rozšířena podpora CSS. Tento režim byl (pozdě ale přece) vylepšen v IE 7. Vedle oprav nepříjemných chyb přibyla užitečná poloprůhlednost obrázků ve formátu PNG.

Osmá verze IE neměla mnoho možností a přinesla dva nové vykreslovací režimy. Důležitý je hlavně jejich dopad na JavaScript. IE 7 a starší používají svůj JScript, který až na několik odchylek vychází z ECMA Script 3. Situace byla podobná jako před tím s CSS. Kdyby se tyto odchylky odstranily, rázem by přestalo fungovat mnoho webů. A tak pro režimy Quirks a IE 7 Standards zůstal engine takový, jaký byl v IE 7. Režim IE8 Almost Standards je prakticky totožný s režimem IE8 Standards až na pozicování obrázků v tabulce, které je z režimu IE7 Standards.

Devátá verze se liší od svých předchůdců nejvíce. Javascriptový engine byl upraven a sjednocen pro všechny starší vykreslovací režimy. Ze dvou režimů IE8 Almost Standards a IE8 Standards vznikl jeden hybridní režim. Také jeden režim přibyl. Stále jsou tedy čtyři. V těch starších je k dispozici javascriptový engine podle ECMA Script 3, v tom nejnovějším podle ECMA Script 5. Ten přináší hlavně větší znovu použitelnost kódu, užitečné funkce nad polem a EventListener.

Nové vymoženosti HTML5 jako video tag, SVG, CSS3 či písma ve formátu WOFF jsou dostupné jen v nejnovějším režimu. U webových stránek vyvíjených úplně od začátku to problém není, pokud uvedou <!DOCTYPE html>. Je to totiž doctype pro HTML5, který jako kouzelná hůlka zařídí, že prakticky všechny prohlížeče použijí svůj nejnovější vykreslovací režim. Horší už je to s úpravami starších stránek, ve kterých chce mít firemní management nové prvky z HTML5. V tuto chvíli je užitečné znát všechny dostupné metody, jak nejlépe udělat úpravu stránek, které se vykreslovaly v Quirks režimu, na stránky stejně vypadající v režimu IE9 Standards.

Přepínání vykreslovacích režimů

Jak už bylo zmíněno, uvedení <!DOCTYPE html> na prvním řádku stránky přepne prohlížeč do nejnovějšího vykreslovacího režimu. Konkrétní vykreslovací režim lze také zvolit zasláním http hlavičky X-UA-Compatible. Avšak pozor, funguje až od osmé verze IE. Hodnoty hlavičky X-UA-Compatible popisuje následující tabulka:

IE=5 Quirks režim
IE=7 IE7 Standards režim
IE=8 IE8 Standards režim
IE=9 IE9 Standards režim
IE=EmulateIE7 Rozhodne se tak, jak by to udělal IE7
IE=EmulateIE8 Rozhodne se tak, jak by to udělal IE8
IE=EmulateIE9 Rozhodne se tak, jak by to udělal IE9
IE=edge Použije nejnovější dostupný vykreslovací režim
IE=5; IE=8 Použije vyšší dostupný režim z uvedeného seznamu

Pokud z nějakých důvodů nejde zaslat HTTP hlavičku ze serveru, lze využít http-equiv meta tag.

<meta http-equiv="X-UA-Compatible" content="IE=7" />

IE 6 je naprogramován tak, že <?xml> deklarace shodí prohlížeč do Quirks režimu. U IE 7 už tomu tak není. Stránka, která posílá HTTP hlavičku content-type s hodnotou application/xhtml+xml, je v IE 9 vykreslena v nejnovějším režimu a nejde se ani přepnout do režimu staršího.

CSS jen pro určitou verzi IE

Od Internet Exploreru 5 můžou vývojáři používat podmíněné komentáře. Slouží k tomu, aby se určitá část HTML kódu interpretovala jen v určité verzi IE a ostatním verzím a prohlížečům se jevila jako komentář. Používá se to hlavně pro opravné CSS kódy.

<!--[if IE 6]>
<link rel="stylesheet" href="style.ie6.css" />
<![endif]-->

V podmínce komentáře nemusí být jen určité verze, ale dají se použít i výrazy „větší než“ a „menší než“. Příklady opět uvádí tabulka:

<!--[if IE 6]> Jen verze 6.
<!--[if gt IE 6]> Verze novější než 6.
<!--[if gte IE 7]> Od verze 7.
<!--[if lt IE 8]> Verze starší než 8.
<!--[if lte IE 7]> Do verze 7.

V těchto opravných CSS kódech je občas nutné použít klauzuli !important, která zajistí, že nebude hodnota CSS vlastnosti přepsána. Podmíněné komentáře se dají využít například k simulaci position: fixed pro IE 6. Velmi silnou zbraní jsou také dynamické CSS vlastnosti dostupné jen v režimech Quirks a IE7 Standards.

Přepínání box modelu

V CSS3 je jedna užitečná vlastnost box-sizing. Nastavením její hodnoty na border-box lze docílit toho, že se velikost elementu bude počítat stejně jako v Quirks režimu Internet Exploreru. Funguje to v režimech IE8 Standards i IE9 Standards a dokonce i v prohlížečích Opera od verze 7 a Konqueror od verze 3.3.2. Ve Firefoxu je nutné použít -moz-box-sizing a v Safari a Chrome pak -webkit-box-sizing. Hodnota vlastnosti zůstává stejná.

Web se vyvíjí a jeho standardy stále zpřesňují. Standard totiž není prohlášen za hotový, dokud neexistují dvě nezávislé implementace a velká sada testů. Tím se jejich implementace ve webových prohlížečích rozchází a je třeba je upravovat. HTML, CSS, DOM mají své vlastní verzování, ECMAScript dokonce spravuje úplně jiná organizace. To nejstálejší, co bylo, byl Quirks režim. U něj byla jistota, že se stránky správně zobrazí na nejširším spektru různých zařízení. Proto jsou pro něj napsány miliony stránek. Věřím, že jeho roli v následujících letech postupně převezme HTML5.

Komentáře

Subscribe
Upozornit na
guest
2 Komentářů
Nejstarší
Nejnovější Most Voted
Inline Feedbacks
View all comments
mnicky

Tolko vykreslovacich rezimov….. Kam sme sa to len dostali? …strasne ;-)

vidya

zasadny krok este len pride, v ie 10 urobia strategicke rozhodnutie a daju tam vykreslovacie jadro z wordu ako do outlooku :-)

Enum a statická analýza kódu

Mám jednu univerzální radu pro začínající programátorty. V učení sice neexistují rychlé zkratky, ovšem tuhle radu můžete snadno začít používat a zrychlit tak tempo učení. Tou tajemnou ingrediencí je statická analýza kódu. Ukážeme si to na příkladu enum.

Pocta C64

Za prvopočátek své programátorské kariéry vděčím počítači Commodore 64. Tehdy jsem genialitu návrhu nemohl docenit. Dnes dokážu lehce nahlédnout pod pokličku. Chtěl bych se o to s vámi podělit a vzdát mu hold.