Co robi <meta http-equiv = „Kompatybilny z X-UA” = „IE = edge”>?

1436

Jaka jest różnica, jeśli zaczyna się jedna strona internetowa

<!DOCTYPE html> 
<html> 
  <head> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

i Jeśli strona zaczyna się od

<!DOCTYPE html> 
<html> 
  <head> 
     <!-- without X-UA-Compatible meta -->

Jeśli nie ma żadnej różnicy, przypuszczam, że mogę po prostu zignorować X-UA-Compatiblenagłówek meta, ponieważ chcę, aby był renderowany w większości standardowych trybów we wszystkich wersjach IE.

html internet-explorer browser x-ua-compatible Morgan Cheng
źródło

Odpowiedzi:

1703

Aktualizacja z października 2015 r

Ta odpowiedź została opublikowana kilka lat temu i teraz naprawdę powinno być pytanie, czy w ogóle warto rozważyć użycie X-UA-Compatibletagu na swojej stronie? wraz ze zmianami, które Microsoft wprowadził w swoich przeglądarkach (więcej o tych poniżej).

W zależności od obsługiwanych przeglądarek Microsoft może nie być konieczne dalsze używanie X-UA-Compatibleznacznika. Jeśli potrzebujesz obsługi IE9 lub IE8, polecam użycie tagu. Jeśli obsługujesz tylko najnowsze przeglądarki (IE11 i / lub Edge), rozważałbym całkowite usunięcie tego tagu. Jeśli używasz Bootstrap na Twitterze i chcesz wyeliminować ostrzeżenia sprawdzania poprawności, ten tag musi pojawić się w określonej kolejności. Dodatkowe informacje poniżej:

X-UA-CompatibleTag pozwala autorom internetowych do wyboru, jaka wersja programu Internet Explorer strona powinna być renderowane jako. IE11 wprowadził zmiany w tych trybach; patrz uwaga IE11 poniżej. Microsoft Edge , przeglądarka, która zastąpiła IE11, honoruje X-UA-Compatiblemetatag tylko w pewnych okolicznościach. Zobacz notatkę Microsoft Edge poniżej.

Według Microsoft, gdy używasz X-UA-Compatibleznacznika, powinien on być możliwie najwyższy w twoim dokumencie head:

Jeśli używasz tagu META zgodnego z X-UA, chcesz umieścić go jak najbliżej górnej części HEAD strony. Internet Explorer zaczyna interpretować znaczniki przy użyciu najnowszej wersji. Gdy Internet Explorer napotka znacznik META zgodny z X-UA, zaczyna od nowa za pomocą silnika wskazanej wersji. Jest to uderzenie wydajności, ponieważ przeglądarka musi zatrzymać i ponownie rozpocząć analizę zawartości.

Oto twoje opcje:

  • „IE = krawędź”
  • „IE = 11”
  • „IE = EmulujIE11”
  • „IE = 10”
  • „IE = EmulujIE10”
  • „IE = 9”
  • „IE = EmulujIE9
  • „IE = 8”
  • „IE = EmulujIE8”
  • „IE = 7”
  • „IE = EmulujIE7”
  • „IE = 5”

Aby spróbować zrozumieć, co to znaczy, oto definicje dostarczone przez Microsoft:

Internet Explorer obsługuje wiele trybów zgodności dokumentów, które włączają różne funkcje i mogą wpływać na sposób wyświetlania zawartości:

  • Tryb krawędzi informuje program Internet Explorer, aby wyświetlał zawartość w najwyższym dostępnym trybie. W przypadku przeglądarki Internet Explorer 9 jest to odpowiednik trybu IE9. Jeśli w przyszłej wersji programu Internet Explorer obsługiwany będzie tryb wyższej zgodności, strony ustawione na tryb krawędzi pojawią się w trybie najwyższym obsługiwanym przez tę wersję. Te same strony nadal pojawiałyby się w trybie IE9 podczas przeglądania w Internet Explorerze 9. Internet Explorer obsługuje wiele trybów zgodności dokumentów, które włączają różne funkcje i mogą wpływać na sposób wyświetlania zawartości:

  • Tryb IE11 zapewnia najwyższą dostępną obsługę ustalonych i powstających standardów branżowych, w tym HTML5, CSS3 i innych.

  • Tryb IE10 zapewnia najwyższą dostępną obsługę ustalonych i powstających standardów branżowych, w tym HTML5, CSS3 i innych.

  • Tryb IE9 zapewnia najwyższą dostępną obsługę ustalonych i powstających standardów branżowych, w tym HTML5 (Robocza wersja robocza), Kaskadowe arkusze stylów W3C Specyfikacja poziomu 3 (Robocza wersja robocza), Skalowalna grafika wektorowa (SVG) 1.0 i inne. [Uwaga edytora: IE 9 nie obsługuje animacji CSS3].

  • Tryb IE8 obsługuje wiele ustalonych standardów, w tym specyfikację kaskadowych arkuszy stylów W3C poziomu 2.1 oraz interfejs API Selektorów W3C; zapewnia także ograniczoną obsługę specyfikacji kaskadowych arkuszy stylów W3C poziomu 3 (robocza wersja robocza) i innych nowych standardów.

  • Tryb IE7 renderuje zawartość tak, jakby była wyświetlana w trybie standardów przez Internet Explorer 7, niezależnie od tego, czy strona zawiera dyrektywę.

  • Tryb emulacji IE9 informuje program Internet Explorer, aby używał dyrektywy do określania sposobu renderowania treści. Dyrektywy trybu standardowego są wyświetlane w trybie IE9, a dyrektywy trybu dziwactwa są wyświetlane w trybie IE5. W przeciwieństwie do trybu IE9, tryb Emuluj IE9 jest zgodny z dyrektywą.

  • Tryb emulacji IE8 informuje program Internet Explorer, aby używał dyrektywy do określania sposobu renderowania treści. Dyrektywy trybu standardowego są wyświetlane w trybie IE8, a dyrektywy trybu dziwactwa są wyświetlane w trybie IE5. W przeciwieństwie do trybu IE8, tryb Emuluj IE8 jest zgodny z dyrektywą.

  • Tryb emulacji IE7 informuje program Internet Explorer, aby używał dyrektywy do określania sposobu renderowania treści. Dyrektywy trybu standardowego są wyświetlane w trybie standardowym programu Internet Explorer 7, a dyrektywy trybu dziwactwa są wyświetlane w trybie IE5. W przeciwieństwie do trybu IE7, tryb emulacji IE7 jest zgodny z dyrektywą. W przypadku wielu stron internetowych jest to preferowany tryb zgodności.

  • Tryb IE5 renderuje zawartość tak, jakby była wyświetlana w trybie dziwactw przez Internet Explorer 7, co jest bardzo podobne do sposobu wyświetlania zawartości w Microsoft Internet Explorer 5.

UWAGA IE10: Począwszy od IE10, tryb dziwactwa zachowuje się inaczej niż we wcześniejszych wersjach przeglądarki. W IE9 i wcześniejszych wersjach tryb dziwactw ograniczył stronę do funkcji obsługiwanych przez IE5.5. W IE10 tryb dziwactwa jest zgodny z różnicami określonymi w specyfikacji HTML5.

Osobiście zawsze wybieram http-equiv="X-UA-Compatible" content="IE=edge"metatag, ponieważ starsze wersje zawierają wiele błędów i nie chcę, aby IE decydowało się na przejście do „Trybu zgodności” i wyświetlało moją stronę jako IE7 vs. IE8 lub 9. Zawsze wolę najnowszą wersję TO ZNACZY.

IE11

Od Microsoft :

Począwszy od IE11, tryb krawędzi jest preferowanym trybem dokumentu; reprezentuje najwyższą obsługę nowoczesnych standardów dostępnych dla przeglądarki.

Użyj deklaracji typu dokumentu HTML5, aby włączyć tryb krawędzi:

<!doctype html>

Tryb Edge został wprowadzony w Internet Explorerze 8 i był dostępny w każdej kolejnej wersji. Pamiętaj, że funkcje obsługiwane przez tryb krawędzi są ograniczone do funkcji obsługiwanych przez określoną wersję przeglądarki wyświetlającą treść.

Począwszy od IE11, tryby dokumentów są przestarzałe i nie powinny być dłużej używane, z wyjątkiem tymczasowych. Zaktualizuj witryny oparte na starszych funkcjach i trybach dokumentów, aby odzwierciedlały współczesne standardy.

Jeśli musisz wybrać określony tryb dokumentu, aby Twoja witryna działała podczas jej przerabiania w celu obsługi nowoczesnych standardów i funkcji, pamiętaj, że używasz funkcji przejściowej, która może nie być dostępna w przyszłych wersjach.

Jeśli obecnie używasz nagłówka zgodnego ze standardem x-ua, aby kierować do starszego trybu dokumentu, możliwe, że Twoja witryna nie będzie odzwierciedlać najlepszych doświadczeń dostępnych w IE11.

Microsoft Edge (zamiennik dla Internet Explorera dostarczany z systemem Windows 10)

Informacje na temat X-UA-Compatiblemetatagu dla wersji IE „Edge”. Od Microsoft :

Przedstawiamy „żywy” tryb dokumentu Edge

Jak ogłosiliśmy w sierpniu 2013 r., Przestajemy używać trybów dokumentów od IE11. Dzięki najnowszym aktualizacjom platformy zapotrzebowanie na starsze tryby dokumentów ogranicza się przede wszystkim do starszych aplikacji internetowych Enterprise. Dzięki nowym zmianom architektonicznym te starsze tryby dokumentów zostaną odizolowane od zmian w „żywym” trybie Edge, co pomoże zagwarantować znacznie wyższy poziom kompatybilności dla klientów, którzy polegają na tych trybach i pomoże nam w szybszym wprowadzaniu ulepszeń w Edge . IE nadal będzie honorować tryby dokumentów obsługiwane przez witryny intranetowe, witryny znajdujące się na liście widoku zgodności i używane tylko w trybie korporacyjnym.

Publiczne strony internetowe będą renderowane przy użyciu nowej platformy trybu Edge (ignorując X-UA-Compatible). Naszym celem jest, aby Edge był „żywym” trybem dokumentu odtąd i żadne dalsze tryby dokumentów nie zostaną wprowadzone w przyszłości.

Ponieważ zmiany w Microsoft Edge w większości przypadków nie obsługują już trybów dokumentów, Microsoft ma narzędzie do skanowania witryny w celu sprawdzenia, czy ma kod niezgodny z Edge.

Chrome = 1 Info dla IE

Istnieje również chrome=1, że można użyć albo stosować razem z jednym z powyższych opcji, takich jak: <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">. chrome=1jest dla Google Chrome Frame, który jest zdefiniowany jako:

Google Chrome Frame to wtyczka przeglądarki typu open source. Użytkownicy, którzy mają zainstalowaną wtyczkę, mają dostęp do otwartych technologii internetowych Google Chrome i szybkiego silnika JavaScript podczas otwierania stron w przeglądarce.

Google Chrome Frame bezproblemowo poprawia komfort przeglądania w Internet Explorerze. Wyświetla witryny obsługujące ramkę Google Chrome przy użyciu technologii renderowania Google Chrome, dając dostęp do najnowszych funkcji HTML5, a także do funkcji wydajności i bezpieczeństwa Google Chrome bez zakłócania zwykłego korzystania z przeglądarki.

Po zainstalowaniu Google Chrome Frame Internet staje się lepszy bez konieczności myślenia o tym.

Ale aby ta wtyczka działała, musisz użyć jej chrome=1w X-UA-Compatiblemetatagu.

Więcej informacji na temat Chrome Frame można znaleźć tutaj .

Uwaga: Google Chrome Frame działa tylko dla IE6 do IE9 i został wycofany 25 lutego 2014 r. Więcej informacji można znaleźć tutaj . Dzięki @mck za link.

Uprawomocnienie:

HTML5 :

Strona zostanie sprawdzona przy użyciu W3 Validator tylko podczas używania <meta http-equiv="X-UA-Compatible" content="IE=Edge">. W przypadku innych wartości zgłosi błąd: A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge.Innymi słowy, jeśli IE=edge,chrome=1go masz, nie będzie sprawdzany. Całkowicie ignoruję ten błąd, ponieważ nowoczesne przeglądarki po prostu ignorują ten wiersz kodu.

Jeśli musisz mieć całkowicie poprawny kod, rozważ zrobienie tego na poziomie serwera, ustawiając nagłówek HTTP. Jako notatkę Microsoft mówi: If both of these instructions are sent (meta and HTTP), the developer's preference (meta element) takes precedence over the web server setting (HTTP header). Zobacz odpowiedź olibre lub odpowiedź Bitinna, aby uzyskać więcej informacji na temat ustawiania nagłówka HTTP.

XHTML

Nie ma problemu z walidacją podczas używania, <meta http-equiv="X-UA-Compatible" content="IE=Edge" />dopóki tag jest odpowiednio zamknięty (np. />Vs >).

Bootstrap na Twitterze

Ten tag jest zdecydowanie zalecany przez zespół Bootstrap od co najmniej 2014 roku, a Bootlint , linter autorstwa zespołu twbs, nadal wyświetla ostrzeżenie, gdy znacznik zostanie pominięty. W linijce rozróżnia się ostrzeżenia i błędy, a zatem stopień pominięcia tego znacznika można uznać za niewielki.

Aby uzyskać więcej informacji, X-UA-Compatiblezobacz Witryna Microsoft Definiowanie zgodności dokumentów .

Aby uzyskać więcej informacji o tym, co obsługuje IE, zobacz caniuse.com .

Więcej informacji na temat wymagań Bootstrap na Twitterze znajduje się na stronie wiki projektu bootlint .

L84
źródło
39
Jeśli nie mam nagłówka „Kompatybilny z X-UA”, co by się stało?
Morgan Cheng,
44
Zasadniczo dzieje się tak, gdy masz Kompatybilny z X-UA, który informuje IE, jak się zachować w odniesieniu do ustawionej wartości (IE = edge itp.), Jeśli jej nie ma, IE pokaże stronie, jak uważa, że ​​najlepiej powinna być pokazana . Może to być tryb zgodności lub najnowsza wersja IE. Cokolwiek Microsoft / IE uważa za najlepsze. Ma sens?
L84
2
@TravisJ - Z mojego zrozumienia, najwyższy dostępny tryb zasadniczo oznacza, że ​​IE 8 może obsługiwać tryby IE8, IE9 może obsługiwać tryby IE9 i tak dalej. Dodałem kilka definicji dla każdego trybu dostarczonego przez Microsoft.
L84,
10
@AdrienBe - całkowicie się zgadzam! Jak dotąd IE 10 był dla mnie najlepszy, ale gardzę każdą inną wersją. Pewnego razu miałem konfigurację strony z pewnymi efektami około 200-300 linii HTML i około 20 minut kodowania. Aby IE działał, musiałem dodać kolejne 1000 wierszy kodu (głównie javascript stron trzecich) i 2-3 godziny pracy! Naprawdę nienawidzę IE =>
L84,
9
Google Chrome Frame zostanie wycofany w styczniu 2014 r .: blog.chromium.org/2013/06/retiring-chrome-frame.html
od
339

Użyj content="IE=edge,chrome=1"   Pomiń inne X-UA-Compatibletryby

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
                                   --------------------------

  • Brak ikony zgodności
    Pasek adresu IE9 nie wyświetla przycisku Widok zgodności,
    a strona nie wyświetla również wielu nieistotnych menu, obrazów i pól tekstowych.

  • Funkcje
    Ten metatag jest wymagany do włączenia javascript::JSON.parse()w IE8
    (nawet jeśli <!DOCTYPE html>jest obecny)

  • Poprawność
    Renderowanie / wykonywanie nowoczesnych HTML / CSS / JavaScript jest bardziej poprawne (ładniejsze).

  • Wydajność
    Silnik renderujący Trident powinien działać szybciej w trybie krawędzi .

Stosowanie

W twoim HTML

<!DOCTYPE html> 
<html> 
  <head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  • IE=edge oznacza, że ​​IE powinien używać najnowszej (krawędziowej) wersji swojego silnika renderującego
  • chrome=1oznacza, że ​​IE powinien używać silnika renderującego Chrome, jeśli jest zainstalowany

Lub lepiej w konfiguracji twojego serwera:
(patrz także odpowiedź RiaD )

  • Apache zaproponowany przez pixeline

    <IfModule mod_setenvif.c>
  <IfModule mod_headers.c>
    BrowserMatch MSIE ie
    Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie
  </IfModule>
</IfModule>
<IfModule mod_headers.c>
  Header append Vary User-Agent
</IfModule>

  • Nginx zaproponowany przez Stef Pause

    server {
  #...
  add_header X-UA-Compatible "IE=Edge,chrome=1";
}

  • Lakier proxy według propozycji Lucasa Riutzela

    sub vcl_deliver {
  if( resp.http.Content-Type ~ "text/html" ) {
    set resp.http.X-UA-Compatible = "IE=edge,chrome=1";
  }
}

  • IIS (od wersji 7)

    <configuration>
  <system.webServer>
     <httpProtocol>
        <customHeaders>
           <add name="X-UA-Compatible" value="IE=edge,chrome=1" />
        </customHeaders>
     </httpProtocol>
  </system.webServer>
</configuration>

Microsoft zaleca tryb Edge od IE11

Jak zauważyła Lynda (patrz komentarze), zmiany kompatybilności w IE11 zalecają tryb Edge :

Począwszy od IE11, tryb krawędzi jest preferowanym trybem dokumentu; reprezentuje najwyższą obsługę nowoczesnych standardów dostępnych dla przeglądarki.

Ale stanowisko Microsoftu nie było jasne. Inna strona MSDN nie zaleca trybu Edge :

Ponieważ tryb Edge wymusza otwieranie wszystkich stron w trybie standardowym, niezależnie od wersji Internet Explorera, możesz mieć pokusę, aby używać tego do wszystkich stron przeglądanych za pomocą Internet Explorera. Nie rób tego, ponieważ X-UA-Compatiblenagłówek jest obsługiwany tylko w programie Windows Internet Explorer 8.

Zamiast tego Microsoft zalecił użycie <!DOCTYPE html>:

Jeśli chcesz, aby wszystkie obsługiwane wersje programu Internet Explorer otwierały strony w trybie standardowym, użyj deklaracji typu dokumentu HTML5 [...]

Jak wyjaśnia Ricardo (w komentarzach poniżej), dowolny DOCTYPE (HTML4, XHTML1 ...) może być użyty do uruchomienia Trybu Standardowego, nie tylko DOCTYPE HTML5. Ważne jest, aby zawsze mieć na stronie DOCTYPE.

Clara Onager zauważył nawet w starszej wersji Określanie starszych trybów dokumentów :

Tryb Edge jest przeznaczony wyłącznie do celów testowych; nie używaj go w środowisku produkcyjnym.

To tak mylące, że Usman Y myślał, że Clara Onager mówi o:

Przykład [...] podany jest wyłącznie w celach ilustracyjnych; nie używaj go w środowisku produkcyjnym.

<meta http-equiv="X-UA-Compatible" content="IE=7,9,10" >

Cóż ... W dalszej części tej odpowiedzi podam więcej wyjaśnień, dlaczego używanie content="IE=edge,chrome=1"jest dobrą praktyką w produkcji.

Historia

Przez wiele lat (2000–2008) udział w rynku IE wynosił ponad 80% . I IE v6 został uznany za de facto standard (80% do 97% udziału w rynku w 2003 , 2004, 2005 i 2006 tylko dla IE6, większy udział w rynku we wszystkich wersjach IE).

Ponieważ IE6 nie przestrzegał standardów sieciowych , programiści musieli przetestować swoją stronę internetową przy użyciu IE6. Taka sytuacja była świetna dla Microsoft (MS) jako developerzy musieli kupować produkty MS (np IE nie może być używany bez konieczności zakupu systemu Windows), i było to więcej zarobkowego pobytu niezgodne (czyli Microsoft chciał zostać standardowy wyłączeniem innych firmy).

Dlatego wiele witryn było zgodnych tylko z IE6, a ponieważ IE nie był zgodny ze standardem internetowym, wszystkie te witryny nie były dobrze renderowane w przeglądarkach zgodnych ze standardami. Co gorsza, wiele witryn wymaga tylko IE .

Jednak w tym czasie Mozilla rozpoczęła prace nad Firefoksem, przestrzegając w jak największym stopniu wszystkich standardów internetowych (inne przeglądarki zostały zaimplementowane w celu renderowania stron tak, jak robi to IE6). Ponieważ coraz więcej twórców stron internetowych chciało korzystać z nowych funkcji standardów internetowych, coraz więcej stron internetowych było obsługiwanych przez Firefoksa niż IE.

Kiedy udział w rynku IE spadał, MS zdało sobie sprawę, że pozostawanie niezgodnym standardem nie było dobrym pomysłem. Dlatego MS zaczął wypuszczać nową wersję IE (IE8 / IE9 / IE10), respektując coraz więcej standardów internetowych.

Problem niezgodny z Internetem

Problemem są jednak wszystkie witryny zaprojektowane dla IE6: Microsoft nie mógł wydać nowych wersji IE niezgodnych z tymi starymi stronami zaprojektowanymi dla IE6. Zamiast wnioskować o wersji IE, zaprojektowano witrynę internetową, MS poprosiło programistów o dodanie dodatkowych danych ( X-UA-Compatible) na swoich stronach.

IE6 jest nadal używany w 2016 r

Obecnie IE6 jest nadal używany (0,7% w 2016 r.) (4,5% w styczniu 2014 r.), A niektóre strony internetowe są nadal zgodne tylko z IE6. Niektóre witryny / aplikacje intranetowe są testowane przy użyciu IE6. Niektóre witryny intranetowe są w 100% funkcjonalne tylko w IE6. Te firmy / działy wolą odłożyć koszty migracji: inne priorytety, nikt nie wie już, w jaki sposób strona internetowa / aplikacja została wdrożona, właściciel starej strony / aplikacji zbankrutował ...

Chiny reprezentują 50% wykorzystania IE6 w 2013 r., Ale może się to zmienić w następnych latach w miarę nadawania chińskiej dystrybucji Linuksa .

Bądź pewny swoich umiejętności internetowych

Jeśli (próbujesz) przestrzegać standardu internetowego, możesz po prostu zawsze użyć http-equiv="X-UA-Compatible" content="IE=edge,chrome=1". Aby zachować zgodność ze starymi przeglądarkami, po prostu unikaj korzystania z najnowszych funkcji internetowych: użyj podzestawu obsługiwanego przez najstarszą przeglądarkę, którą chcesz obsługiwać. Lub jeśli chcesz pójść dalej, możesz przyjąć takie koncepcje, jak: pełna wdzięku degradacja , stopniowe ulepszanie i dyskretny JavaScript . (Być może z przyjemnością przeczytasz, co powinien rozważyć programista internetowy ).

Nie przejmuj się najlepszym renderowaniem wersji IE: to nie jest twoje zadanie, ponieważ przeglądarki muszą być zgodne ze standardami internetowymi. Jeśli Twoja witryna jest zgodna ze standardem i używa umiarkowanie najnowszych funkcji, dlatego przeglądarki muszą być zgodne z Twoją witryną .

Co więcej, ponieważ istnieje wiele kampanii mających na celu zabicie IE6 ( nie ma już IE6 , kampania MS ), w dzisiejszych czasach możesz uniknąć marnowania czasu na testowanie IE!

Osobiste wrażenia z IE6

W latach 2009-2012 pracowałem dla firmy używającej IE6 jako oficjalnej dozwolonej pojedynczej przeglądarki . Musiałem wdrożyć stronę intranetową tylko dla IE6. Postanowiłem przestrzegać standardu internetowego, ale używając podzestawu obsługującego IE6 (HTML / CSS / JS).

Było ciężko, ale kiedy firma przeszła na IE8, strona nadal była dobrze renderowana, ponieważ użyłem Firefoksa i firebuga do sprawdzenia zgodności ze standardami internetowymi;)

olibre
źródło
2
„Tryb Edge jest przeznaczony wyłącznie do celów testowych; nie używaj go w środowisku produkcyjnym ”. Zobacz msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx
Carl Onager
5
Proszę @ClaraOnager poświęcić trochę czasu na wyjaśnienie, co jest złego w mojej odpowiedzi (z twojego punktu widzenia). Nawet jeśli MS nie zaleca używania trybu Edge w środowisku produkcyjnym, istnieją dobre powody, aby używać go w środowisku produkcyjnym. Ważne jest techniczne wyjaśnienie naszych najlepszych praktyk. Lubię dzielić się swoją wiedzą i doświadczeniami. Mam nadzieje, że Ty też. Możemy poprawić razem;) Pozdrawiam
olibre
2
Cześć, Ricardo, zgadzam się z tobą. Microsoft mówi „Jeśli chcesz, aby wszystkie obsługiwane wersje Internet Explorera otwierały twoje strony w trybie standardowym, użyj HTML5 [...]” w sekcji Zrozumienie starszych trybów dokumentów (zobacz Poradę ). Może moje wyjaśnienie jest niejasne ... Może coś źle zrozumiałem ... Zmieniłem tekst ... Co sądzisz o moich zmianach? Czy to ci odpowiada? Co radzisz zmienić / poprawić w mojej odpowiedzi? Dziękuję za twój komentarz. Pozdrawiam ;-)
olibre
5
@ClaraOnager ... w pierwszej odpowiedzi wskazujesz niepoprawnie, na stronie referencyjnej. MS mówi, aby nie używać w środowisku produkcyjnym dla: <meta http-equiv = "X-UA-Compatible" content = "IE = 7, 9,10 "> nie inne rzeczy Edge.
Usman Younas,
3
Informacje o trybie krawędzi używanym w środowisku produkcyjnym. Od Microsoft:Starting with IE11, edge mode is the preferred document mode; it represents the highest support for modern standards available to the browser.
L84
58

Różnica polega na tym, że jeśli określisz tylko DOCTYPE, ustawienia widoku zgodności IE mają pierwszeństwo. Domyślnie te ustawienia wymuszają wyświetlanie wszystkich witryn intranetowych w widoku zgodności niezależnie od tego DOCTYPE. Jest także pole wyboru, aby używać widoku zgodności dla wszystkich stron internetowych, niezależnie od tego DOCTYPE.

Okno dialogowe Ustawienia widoku zgodności z IE

X-UA-Compatiblezastępuje ustawienia widoku zgodności, więc strona będzie renderowana w trybie standardowym niezależnie od ustawień przeglądarki. Wymusza to tryb standardów dla:

  • strony intranetowe
  • zewnętrzne strony internetowe, gdy administrator komputera wybrał opcję „Wyświetl wszystkie witryny w widoku zgodności” jako domyślną - pomyśl duże firmy, rządy, uniwersytety
  • gdy przypadkowo trafisz na listę widoków zgodności Microsoft
  • przypadki, w których użytkownicy ręcznie dodali Twoją witrynę do listy w Ustawieniach widoku zgodności

DOCTYPEsam nie może tego zrobić; w takich przypadkach znajdziesz się w jednym z trybów widoku zgodności, niezależnie od tego DOCTYPE.

Jeśli określono zarówno metaznacznik, jak i nagłówek HTTP, metaznacznik ma pierwszeństwo.

Ta odpowiedź opiera się na sprawdzeniu kompletnych reguł decydowania o trybie dokumentu w IE8 , IE9 i IE10 . Zauważ, że patrzenie na to DOCTYPEjest ostatnią awarią przy podejmowaniu decyzji o trybie dokumentu.

andrewdotn
źródło
1
W scenariuszu intranetowym domyślnie IE10 renderuje w trybie zgodności. Zobacz stackoverflow.com/questions/13284083/…. Ten tag nie jest domyślnie wymagany w przypadku Internetu, ale jest wymagany (domyślnie) podczas korzystania z myintenralserver / myapp . Chciałem dodać ten komentarz, ponieważ różnica między internetem a intranetem była widoczna tylko w tekście na zrzucie ekranu, a nie w tekście odpowiedzi na stronie.
yzorg
Masz rację, powinienem był to wyjaśnić. Przepisałem post; daj mi znać, jeśli jest jeszcze coś, co powinienem rozwiązać. Dzięki!
andrewdotn
Dzięki! ta odpowiedź jest o wiele jaśniejsza niż inne odpowiedzi dotyczące witryn intranetowych. Inne odpowiedzi dotyczą szczegółów technicznych, dlaczego i jak. Nienawidzę MS IE. Również dobre pisanie: jeden akapit wyjaśnia, dlaczego potrzebujemy metatagu. Bravo
Aniket Inge
3
Chciałbym móc głosować tę odpowiedź sto razy. Chwytaj ekran ratujący życie właśnie tam. Obniżenie ciśnienia krwi podczas pisania tego ...
EvilDr
Wspaniale wspaniale wspaniale! Dziękuję bardzo za tę odpowiedź.
Seanosapien
25

Użyj tego, aby zmusić IE do ukrycia tego irytującego przycisku zgodności przeglądarki na pasku adresu:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
George Filippakos
źródło
1
„Tryb Edge jest przeznaczony wyłącznie do celów testowych; nie używaj go w środowisku produkcyjnym ”. Zobacz msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx
Carl Onager
4
Dla pewności używam <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">tej chrome=1dyrektywy, więc zachęca ona użytkowników IE6, 7, 8 do zainstalowania / używania Chrome Frame . Używa go nawet HTML5 Boilerplate .
Ricardo Zea
10
@ClaraOnager Chociaż Microsoft to mówi, niekoniecznie oznacza to, że mają rację. Używam <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">od dnia, w którym wyszło bez problemu. Właściwie już uratowałem mój zespół i siebie setki problemów, zmuszając IE użytkowników do korzystania z najnowszego silnika do renderowania stron, które tworzymy. W przeciwieństwie do Ciebie i Microsoftu, polecam każdemu używanie powyższego metatagu za każdym razem . Tak długo, jak IE będzie nadal dostępny, będziemy „zmuszeni” do używania tego metatagu: p
Ricardo Zea
Zmieniło się to wraz z IE11. Ta wersja radykalnie przeniosła się do świata przeglądarek zgodnych z oficjalnymi standardami. Doszedł do skrajności, nawet nie identyfikując się jako Internet Explorer! Teraz mówi, że to „Netscape” i nie zawiera niczego w informacjach przeglądarki, aby zdradzić swoją prawdziwą tożsamość. Jeśli nadal występują jakieś dziwactwa w przeglądarce IE od tej wersji, musisz zmusić ją do IE10 poprzez ustawienie <meta http-equiv="X-UA-Compatible" content="IE=10">. Następnie zgłasza się jako Microsoft Internet Explorer.
respekt
w obliczu tego samego powiązanego problemu, jeśli ktoś może mi pomóc: stackoverflow.com/questions/22013880/...
dsi
25

Ponieważ nie mogę dodać komentarza do zaznaczonej odpowiedzi, opublikuję to tutaj.

Oprócz poprawnej odpowiedzi można ją rzeczywiście potwierdzić. Ponieważ ten metatag jest skierowany tylko dla IE, wystarczy dodać warunkowe IE.

<!--[if IE]>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<![endif]-->

Wykonanie tego jest jak dodanie dowolnej innej instrukcji warunkowej IE i działa tylko dla IE i nie wpłynie to na inne przeglądarki.

EMurph78
źródło
4
Komentarze warunkowe nie powinny być używane Z WYJĄTKIEM do kierowania HTML na <= IE9. (Było tak nawet wtedy, gdy napisano tę odpowiedź)
EKW
18

Myślę, że ten schemat od Microsoft wyjaśnia wszystko. Aby powiedzieć IE, jak renderować treść,! DOCTYPE musi współpracować z metatagiem zgodnym z X-UA. Sam DOCTYPE nie ma wpływu na zmianę trybu dokumentu IE.

wprowadź opis zdjęcia tutaj

http://ie.microsoft.com/testdrive/ieblog/2010/Mar/02_HowIE8DeterminesDocumentMode_3.png

James Tsai
źródło
3
Oto zaktualizowana wersja zawierająca IE9. OMG ... ie.microsoft.com/testdrive/ieblog/2010/Jun/...
spiralis
3
I ten zawiera IE10: msdn.microsoft.com/en-us/library/ff406036%28v=vs.85%29.aspx Różne rozdziały mają własne oddzielne schematy blokowe ...
Spiralis
Źle odczytałeś ten schemat przepływu. W przypadku braku zgodności z X-UA przeglądarka będzie szukać <! DOCTYPE>. Jeśli je znajdzie, renderuje w trybie standardowym (aka „EmulateIE8”). Jeśli nie, powraca do „Trybu dziwactwa”.
Chuck Le Butt,
Dziękujemy za przesłanie obrazu do Stackoverflow. Oryginalne linki do Microsoft są martwe.
Elmue
12

Tylko dla kompletności, tak naprawdę nie musisz dodawać go do swojego HTML (co jest nieznane http-equiv w HTML5)

Zrób to i nigdy nie oglądaj się za siebie (pierwszy przykład dla apache , drugi dla nginx )

Header set X-UA-Compatible "IE=Edge,chrome=1"

add_header X-UA-Compatible "IE=Edge,chrome=1";
bitinn
źródło
2
@HueiTan - Myślę, że plakat mówi, że kiedy spróbujesz zweryfikować stronę za pomocą W3 Validatora , wyświetli błąd: Bad value X-UA-Compatible for attribute http-equiv on element meta.- To nie znaczy, że nie zadziała. To po prostu niepoprawny kod.
L84,
10

Wystarczy jedno zdanie, aby poinstruować Internet Explorera, aby używał najnowszego silnika renderującego

<meta http-equiv="x-ua-compatible" content="ie=edge">
Bipon Biswas
źródło
7 
<meta http-equiv="X-UA-Compatible" content="IE=Edge">

Aby ta linia działała zgodnie z oczekiwaniami, upewnij się, że:

  1. To pierwszy element zaraz po <head>
  2. Przed metatagiem nie są używane żadne komentarze warunkowe , np. Na <html>elemencie

W przeciwnym razie niektóre wersje IE po prostu go zignorują.

AKTUALIZACJA

Te dwie zasady są uproszczone, ale łatwo je zapamiętać i zweryfikować. Pomimo dokumentów MSDN stwierdzających, że możesz umieścić tytuł i inne metatagi przed tym, nie polecam tego robić.

Jak to działa z komentarzami warunkowymi.

Ciekawy artykuł o kolejności elementów w głowie. (blogs.msdn.com, dla IE)

ODNIESIENIE

Z dokumentacji MSDN :

X-UA-Compatible[...] muszą pojawić się w nagłówku strony (sekcji head) przed wszystkimi innymi elementami z wyjątkiem elementu tytułowej i innych elementów meta.

ToniTornado
źródło
5

jeśli używasz swojej witryny w tej samej sieci, co serwer, IE lubi przełączać się w tryb zgodności pomimo DOCTYPE.
Dodanie meta http-equiv="X-UA-Compatible" content="IE=Edge" wyłącza to niepożądane zachowanie.

Łukasz Jakóbiec
źródło
Innym słowem określającym „tę samą sieć co serwer” jest intranet ... więc w zasadzie IE10 jest domyślnie uszkodzony we wszystkich witrynach intranetowych. Zobacz zrzut ekranu w odpowiedzi @AndrewNeitsch.
yzorg,
3

To jest dosłownie 1 zapytanie google , ale oto:

http://msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx

Zrozumienie starszych trybów dokumentów

Użyj poniższej wartości, aby wyświetlić stronę internetową w trybie krawędzi, który jest trybem o najwyższych standardach obsługiwanym przez Internet Explorer, od Internet Explorer 6 do IE11.

<meta http-equiv="x-ua-compatible" content="IE=edge"

Zauważ, że jest to funkcjonalnie równoważne z użyciem typu HTML5. Ustawia Internet Explorera w najwyżej obsługiwanym trybie dokumentów. Edge najbardziej jest najbardziej przydatny w przypadku regularnie obsługiwanych stron internetowych, które są rutynowo testowane pod kątem interoperacyjności między wieloma przeglądarkami, w tym Internet Explorerem.

Uwaga Począwszy od IE11, tryb krawędzi jest uważany za preferowany tryb dokumentu. (We wcześniejszych wersjach uznawano to za eksperymentalne). Aby dowiedzieć się więcej, zobacz Tryby dokumentów są przestarzałe. Począwszy od Windows Internet Explorer 8, niektórzy programiści używali meta elementu trybu krawędzi, aby ukryć przycisk Widok zgodności na pasku adresu. Od IE11 nie jest to już konieczne, ponieważ przycisk został usunięty z paska adresu. Ponieważ wymusza to otwieranie wszystkich stron w trybie standardowym, niezależnie od wersji Internet Explorera, możesz mieć ochotę używać trybu krawędzi dla wszystkich stron przeglądanych za pomocą Internet Explorera. Nie rób tego, ponieważ nagłówek zgodny z X-UA jest obsługiwany tylko od przeglądarki Internet Explorer 8.

Wskazówka Jeśli chcesz, aby wszystkie obsługiwane wersje programu Internet Explorer otwierały strony w trybie standardowym, użyj deklaracji typu dokumentu HTML5, jak pokazano we wcześniejszym przykładzie.

Wśród wyników wyszukiwania znajduje się również:

Joe Mike
źródło
2

2.1.3.5 Metatag X-UA-Compatibility i nagłówek odpowiedzi HTTP

Ta funkcja nie zostanie zaimplementowana w żadnej wersji Microsoft Edge.

<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />

Zobacz https://msdn.microsoft.com/en-us/library/ff955275(v=vs.85).aspx

Tak, wiem, że spóźniłem się na przyjęcie, ale miałem tylko pewne problemy i dyskusje, a ostatecznie mój szef kazał mi usunąć X-UA-Compatibleznacznik usunąć ze wszystkich dokumentów, nad którymi pracowałem.

Jeśli te informacje są nieaktualne lub nieaktualne, proszę mnie poprawić.

Shawn Spencer
źródło