Cosa fa <meta http-equiv="X-UA-Compatible" content="IE=edge">?

Che differenza c'è se una pagina web inizia con

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

e se una pagina inizia con

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

Se non c'è differenza, suppongo che posso semplicemente ignorare la meta intestazione X-UA-Compatible, dato che voglio solo che sia resa nella maggior parte delle modalità standard in tutte le versioni di IE.

Soluzione

Aggiornamento di ottobre 2015

Questa risposta è stata pubblicata diversi anni fa e ora la domanda dovrebbe davvero essere dovresti anche considerare di usare il tag X-UA-Compatible sul tuo sito? con i cambiamenti che Microsoft ha apportato ai suoi browser (più avanti). A seconda dei browser Microsoft che supporti potresti non aver bisogno di continuare ad usare il tag X-UA-Compatible. Se hai bisogno di supportare IE9 o IE8, allora ti consiglio di usare il tag. Se supportate solo i browser più recenti (IE11 e/o Edge) allora prenderei in considerazione di abbandonare del tutto questo tag. Se usi Twitter Bootstrap e hai bisogno di eliminare gli avvisi di validazione, questo tag deve apparire nell'ordine specificato. Ulteriori informazioni qui sotto:

Il meta tag X-UA-Compatible permette agli autori web di scegliere con quale versione di Internet Explorer la pagina deve essere resa. IE11 ha apportato dei cambiamenti a queste modalità; vedi la nota di IE11 qui sotto. Microsoft Edge, il browser che ha sostituito IE11, onora il meta tag X-UA-Compatible solo in certe circostanze. Vedi la nota di Microsoft Edge qui sotto. Secondo Microsoft, quando usi il tag X-UA-Compatible, dovrebbe essere il più in alto possibile nella head del tuo documento: Se stai usando il tag META X-UA-Compatible vuoi posizionarlo il più vicino possibile all'inizio dell'HEAD della pagina. Internet Explorer inizia a interpretare il markup usando l'ultima versione. Quando Internet Explorer incontra il tag X-UA-Compatible META, ricomincia ad usare il motore della versione designata. Questo è un colpo alle prestazioni perché il browser deve fermarsi e ricominciare ad analizzare il contenuto. Ecco le tue opzioni:

  • "IE=edge"
  • "IE=11"
  • "IE=EmulateIE11"
  • "IE=10"
  • "IE=EmulateIE10"
  • "IE=9"
  • "IE=EmulateIE9
  • "IE=8"
  • "IE=EmulateIE8"
  • "IE=7"
  • "IE=EmulateIE7"
  • "IE=5" Per cercare di capire cosa significa ciascuno, ecco le definizioni fornite da Microsoft:

    Internet Explorer supporta una serie di modalità di compatibilità dei documenti che abilitano diverse caratteristiche e possono influenzare il modo in cui il contenuto viene visualizzato:

    • La modalità Edge dice a Internet Explorer di visualizzare il contenuto nella modalità più alta disponibile. Con Internet Explorer 9, questo è equivalente alla modalità IE9. Se una futura versione di Internet Explorer supportasse una modalità di compatibilità superiore, le pagine impostate in modalità bordo apparirebbero nella modalità più alta supportata da quella versione. Quelle stesse pagine apparirebbero ancora in modalità IE9 quando vengono visualizzate con Internet Explorer 9. Internet Explorer supporta una serie di modalità di compatibilità dei documenti che abilitano diverse caratteristiche e possono influenzare il modo in cui il contenuto viene visualizzato:
    • La modalità IE11 fornisce il massimo supporto disponibile per gli standard di settore stabiliti ed emergenti, tra cui HTML5, CSS3 e altri. La modalità IE10 fornisce il massimo supporto disponibile per gli standard di settore consolidati ed emergenti, compresi HTML5, CSS3 e altri.
    • La modalità IE9 fornisce il massimo supporto disponibile per gli standard industriali consolidati ed emergenti, inclusi HTML5 (Working Draft), W3C Cascading Style Sheets Level 3 Specification (Working Draft), Scalable Vector Graphics (SVG) 1.0 Specification, e altri. [Nota dell'editore: IE 9 non supporta le animazioni CSS3].
    • La modalità IE8 supporta molti standard consolidati, inclusa la specifica W3C Cascading Style Sheets Level 2.1 e la W3C Selectors API; fornisce anche un supporto limitato per la specifica W3C Cascading Style Sheets Level 3 (Working Draft) e altri standard emergenti.
    • La modalità IE7 rende il contenuto come se fosse visualizzato in modalità standard da Internet Explorer 7, che la pagina contenga o meno una direttiva .
  • La modalità Emulate IE9 dice a Internet Explorer di usare la direttiva per determinare come rendere il contenuto. Le direttive in modalità standard sono visualizzate in modalità IE9 e le direttive in modalità quirks sono visualizzate in modalità IE5. A differenza del modo IE9, il modo Emulate IE9 rispetta la direttiva . Emulate IE8 mode dice a Internet Explorer di usare la direttiva per determinare come rendere il contenuto. Le direttive in modalità standard sono visualizzate in modalità IE8 e le direttive in modalità quirks sono visualizzate in modalità IE5. A differenza del modo IE8, il modo Emulate IE8 rispetta la direttiva . Emulate IE7 mode dice a Internet Explorer di usare la direttiva per determinare come rendere il contenuto. Le direttive in modalità standard sono visualizzate in modalità standard di Internet Explorer 7 e le direttive in modalità quirks sono visualizzate in modalità IE5. A differenza del modo IE7, il modo Emulate IE7 rispetta la direttiva . Per molti siti web, questa è la modalità di compatibilità preferita. Il modo IE5 rende il contenuto come se fosse visualizzato in modalità "quirks" da Internet Explorer 7, che è molto simile al modo in cui il contenuto veniva visualizzato in Microsoft Internet Explorer 5. IE10 NOTA: A partire da IE10, la modalità quirks si comporta in modo diverso rispetto alle versioni precedenti del browser. In IE9 e versioni precedenti, la modalità quirks limitava la pagina web alle caratteristiche supportate da IE5.5. In IE10, la modalità quirks è conforme alle differenze specificate nella specifica HTML5. Personalmente, scelgo sempre il meta tag http-equiv="X-UA-Compatible" content="IE=edge", poiché le vecchie versioni hanno molti bug, e non voglio che IE decida di andare in "Modalità compatibilità" e mostrare il mio sito come IE7 vs IE8 o 9. Preferisco sempre l'ultima versione di IE. IE11 Da Microsoft:

    A partire da IE11, l'edge mode è la modalità documento preferita; rappresenta il più alto supporto per gli standard moderni a disposizione del browser. Usa la dichiarazione del tipo di documento HTML5 per abilitare la modalità edge: ` La modalità edge è stata introdotta in Internet Explorer 8 ed è stata disponibile in ogni release successiva. Si noti che le caratteristiche supportate dalla modalità bordo sono limitate a quelle supportate dalla versione specifica del browser che rende il contenuto. A partire da IE11, le modalità documento sono deprecate e non dovrebbero più essere utilizzate, se non su base temporanea. Assicuratevi di aggiornare i siti che si basano su caratteristiche e modalità di documento legacy per riflettere gli standard moderni. Se devi puntare ad una specifica modalità di documento in modo che il tuo sito funzioni mentre lo rielabori per supportare gli standard e le caratteristiche moderne, sii consapevole che stai usando una caratteristica di transizione, una che potrebbe non essere disponibile nelle versioni future. Se attualmente usi l'intestazione x-ua-compatibile per puntare ad una modalità documento legacy, è possibile che il tuo sito non rifletta la migliore esperienza disponibile con IE11. ***[Microsoft Edge][3] (Sostituzione di Internet Explorer in dotazione con Windows 10) *** Informazioni sul meta tagX-UA-Compatibleper la versione "Edge" di IE. [Da Microsoft][4]: **Introduzione della modalità documento "vivente" di Edge** Come abbiamo annunciato nell'agosto 2013, stiamo deprecando le modalità documento a partire da IE11. Con i nostri ultimi aggiornamenti della piattaforma, la necessità di modalità documento legacy è principalmente limitata alle app web legacy Enterprise. Con le nuove modifiche architettoniche, queste modalità di documento legacy saranno isolate dai cambiamenti nella modalità Edge "vivente", il che aiuterà a garantire un livello molto più alto di compatibilità per i clienti che dipendono da queste modalità e ci aiuterà a muoverci ancora più velocemente sui miglioramenti in Edge. IE onorerà ancora le modalità di documento servite da siti intranet, siti nella lista di Compatibility View, e quando usato solo con Enterprise Mode. I siti Internet pubblici saranno resi con la nuova piattaforma di modalità Edge (ignorando X-UA-Compatible). Il nostro obiettivo è che Edge sia la modalità documento "vivente" da qui in avanti e non saranno introdotte ulteriori modalità documento. Con i cambiamenti in Microsoft Edge per non supportare più le modalità documento nella maggior parte dei casi, Microsoft ha uno [strumento][5] per scansionare il tuo sito per controllare e vedere se ha codice che non è compatibile con Edge. ***Chrome=1 Info per IE*** C'è anchechrome=1che puoi usare o usare insieme ad una delle opzioni di cui sopra come:<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">.chrome=1è per Google'Chrome Frame che è definito come: Google Chrome Frame è un plug-in del browser open source. Gli utenti che hanno il plug-in installato hanno accesso alle tecnologie web aperte di Google Chrome e al motore JavaScript veloce quando aprono le pagine nel browser. Google Chrome Frame migliora senza soluzione di continuità l'esperienza di navigazione in Internet Explorer. Visualizza i siti abilitati a Google Chrome Frame utilizzando la tecnologia di rendering di Google Chrome, dandoti accesso alle ultime caratteristiche HTML5 così come alle prestazioni e alle caratteristiche di sicurezza di Google Chrome senza interrompere in alcun modo l'uso abituale del browser. Quando Google Chrome Frame è installato, il web diventa semplicemente migliore senza che tu debba pensarci. Ma perché questo plug-in funzioni devi usarechrome=1nel meta tagX-UA-Compatible. Maggiori informazioni su Chrome Frame possono essere trovate [qui][6]. **Nota:** Google Chrome Frame funziona solo per [IE6 attraverso IE9][13], ed è stato ritirato il 25 febbraio 2014. Maggiori informazioni possono essere trovate [qui][7]. Grazie a @mck per il link. ***Validazione:*** **HTML5**: La pagina verrà validata usando il [W3 Validator][8] solo quando si usa<meta http-equiv="X-UA-Compatible" content="IE=Edge">. Per altri valori lancerà l'errore:Un meta elemento con un attributo http-equiv il cui valore è X-UA-Compatible deve avere un attributo content con il valore IE=edge.In altre parole, se aveteIE=edge,chrome=1non verrà validato. Ignoro completamente questo errore perché i browser moderni semplicemente ignorano questa linea di codice. Se dovete avere un codice completamente valido, allora considerate di farlo a livello di server impostando l'intestazione HTTP. Come nota, Microsoft dice,se entrambe queste istruzioni sono inviate (meta e HTTP), la preferenza dello sviluppatore (elemento meta) ha la precedenza sull'impostazione del server web (intestazione HTTP).Vedi [olibre'risposta][9] o [bitinn'risposta][10] per maggiori dettagli su come impostare un'intestazione HTTP. **XHTML** Non c'è un problema di validazione quando si usa<meta http-equiv="X-UA-Compatible" content="IE=Edge" />a patto che il tag sia chiuso correttamente (cioè/>vs>`). Twitter Bootstrap Questo tag è stato fortemente raccomandato dal team di Bootstrap almeno dal 2014, e Bootlint, l'interprete creato dal team twbs continua a lanciare un warning quando il tag viene omesso. Il linter distingue tra avvertimenti ed errori, e come tale la gravità dell'omissione di questo tag può essere considerata minore.

    Per maggiori informazioni su X-UA-Compatible vedi Microsoft's sito web che definisce la compatibilità dei documenti. Per maggiori informazioni su cosa supporta IE vedi caniuse.com. Per maggiori informazioni sui requisiti di Twitter Bootstrap, vedere il progetto bootlint pagina wiki.

Commentari (31)

Usa content="IE=edge,chrome=1"   Salta altre modalità `X-UA-Compatible

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
                                   -------------------------- 
  • Nessuna icona di compatibilità
    La barra degli indirizzi di IE9 non mostra il [pulsante Vista Compatibilità][MSICON]
    e la pagina non mostra anche un'accozzaglia di menu, immagini e caselle di testo fuori posto.
  • Caratteristiche
    Questo meta tag è richiesto per abilitare javascript::JSON.parse() su IE8
    (anche quando `` è presente)
  • Correttezza
    Il rendering/esecuzione del moderno HTML/CSS/JavaScript è più valido (più bello).
  • Performance
    Il motore di rendering Trident dovrebbe funzionare più velocemente nella sua modalità edge.

    Uso

    Nel tuo HTML




    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  • IE=edge significa che IE dovrebbe usare l'ultima versione (edge) del suo motore di rendering

  • chrome=1 significa che IE dovrebbe usare il motore di rendering Chrome se installato O meglio nella configurazione del tuo server web:
    (vedi anche la risposta di RiaD's)

  • Apache come proposto da pixeline

        IfModule mod_headers.c>
          BrowserMatch MSIE ie
          Intestazione impostata X-UA-Compatible "IE=Edge,chrome=1" env=ie
    
      IfModule mod_headers.c>
        Header append Vary User-Agent
      /IfModule>
  • Nginx come proposto da Stef Pause server {

    ...

        add_header X-UA-Compatible "IE=Edge,chrome=1";
      }
  • Varnish proxy come proposto da Lucas Riutzel sub vcl_deliver { if( resp.http.Content-Type ~ "text/html" ) { set resp.http.X-UA-Compatible = "IE=edge,chrome=1"; } }

  • IIS (dalla v7) configurazione

           httpProtocol>

Microsoft raccomanda la modalità Edge da IE11

Come notato da Lynda (vedi commenti), i Cambiamenti di compatibilità in IE11 raccomandano la modalità bordo:

A partire da IE11, la modalità bordo è la modalità documento preferita; rappresenta il massimo supporto per gli standard moderni disponibile per il browser.

Ma la posizione di Microsoft non era chiara. Un'altra [pagina MSDN non raccomanda la modalità Edge][noEdge]:

Perché la modalità Edge forza tutte le pagine ad essere aperte in modalità standard, indipendentemente dalla versione di Internet Explorer, potresti essere tentato di usarlo per tutte le pagine viste con Internet Explorer. Non farlo, poiché l'intestazione X-UA-Compatible è supportata solo a partire con Windows Internet Explorer 8. Invece, Microsoft raccomanda di usare ``: Se vuoi che tutte le versioni supportate di Internet Explorer aprano le tue pagine in modalità standard, usa la dichiarazione del tipo di documento HTML5 [...] Come spiega Ricardo (nei commenti qui sotto) qualsiasi DOCTYPE (HTML4, XHTML1...) può essere usato per attivare la modalità standard, non solo HTML5's DOCTYPE. L'importante è avere sempre un DOCTYPE nella pagina. Clara Onager ha anche notato in una vecchia versione di Specificare le modalità di documento legacy: La modalità Edge è intesa solo per scopi di test; non usarla in un ambiente di produzione. È così confuso che Usman Y pensava che Clara Onager stesse parlando di: L'esempio [...] è fornito solo a scopo illustrativo; non usarlo in un ambiente di produzione.

<meta http-equiv="X-UA-Compatible" content="IE=7,9,10" > **Bene... Nel resto di questa risposta do più spiegazioni sul perché usare `content="IE=edge,chrome=1"` è una buona pratica in produzione.** --------------------------------- Storia ------- Per molti anni (dal 2000 al 2008), [la quota di mercato di IE era superiore all'80%][IEMS]. E IE **v6** è stato considerato come uno standard *de facto* (80% al 97% di quota di mercato nel [2003][OneStat], [2004, 2005 e 2006][IE6] solo per IE6, più quota di mercato con tutte le versioni di IE). Poiché IE6 non rispettava i [Web standards](http://en.wikipedia.org/wiki/Web_standards), gli sviluppatori **dovevano** testare il loro sito web usando IE6. Questa situazione era ottima per Microsoft (MS) poiché gli sviluppatori web dovevano **acquistare** i prodotti MS (ad esempio IE non può essere usato senza comprare Windows), ed era più redditizio rimanere non conformi (cioè Microsoft voleva diventare **lo** standard escludendo le altre aziende). Quindi molti siti erano conformi solo a IE6, e siccome IE non era conforme allo standard web, tutti questi siti web non erano ben resi sui browser conformi agli standard. Ancora peggio, [molti siti richiedevano solo IE](http://hintsforums.macworld.com/showthread.php?t=111479). Tuttavia, in questo periodo, Mozilla ha iniziato lo sviluppo di Firefox rispettando il più possibile tutti gli standard web (altri browser sono stati implementati per rendere le pagine come fatto da IE6). Poiché sempre più sviluppatori web volevano usare le nuove caratteristiche degli standard web, sempre più siti web erano più supportati da Firefox che da IE. Quando la quota di mercato di IE stava diminuendo, MS ha capito che rimanere incompatibili con gli standard non era una buona idea. Quindi MS iniziò a rilasciare nuove versioni di IE (IE8/IE9/IE10) rispettando sempre più gli standard web. --------------------------------- Il problema dell'incompatibilità con il web --------------------------- Ma il problema sono tutti i siti web progettati per IE6: Microsoft non poteva rilasciare nuove versioni di IE incompatibili con questi vecchi siti web progettati per IE6. Invece di dedurre la versione di IE che un sito web è stato progettato, MS ha chiesto agli sviluppatori di aggiungere dati extra (`X-UA-Compatible`) nelle loro pagine. IE6 è ancora usato nel 2016 ------------------------- Oggi, IE6 è ancora usato [(0,7% nel 2016)][IE62014] (4,5% nel gennaio 2014), e alcuni siti internet sono ancora conformi solo a IE6. Alcuni siti web/applicazioni intranet sono testati usando IE6. Alcuni siti web intranet sono funzionali al 100% solo su IE6. Queste aziende/dipartimenti preferiscono rimandare il costo della migrazione: altre priorità, nessuno sa più come il sito web/applicazione è stato implementato, il proprietario del sito web/applicazione legacy è andato in bancarotta... La Cina rappresenta [il 50% dell'uso di IE6 nel 2013](www.ie6countdown.com/), ma potrebbe cambiare nei prossimi anni, dato che [la distribuzione Linux cinese è in diffusione](http://www.canonical.com/content/canonical-and-chinese-standards-body-announce-ubuntu-collaboration). Sii sicuro delle tue competenze web --------------------------------- Se si (cerca di) rispettare lo standard web, si può semplicemente usare sempre `http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"`. Per mantenere la compatibilità con i vecchi browser, basta evitare di usare le ultime caratteristiche del web: usa il sottoinsieme supportato dal browser più vecchio che vuoi supportare. Oppure, se volete andare oltre, potete adottare concetti come [Graceful degradation], [Progressive enhancement] e [Unobtrusive JavaScript]. (Potresti anche essere contento di leggere [Cosa dovrebbe considerare uno sviluppatore web?]. Non preoccupatevi del miglior rendering della versione di IE: questo non è il vostro lavoro poiché i browser devono essere conformi agli standard web. Se il tuo sito è conforme agli standard e usa caratteristiche moderatamente recenti, allora **i browser devono essere conformi al tuo sito**. Inoltre, dato che ci sono molte campagne per _uccidere_ IE6 ([IE6 no more](http://www.ie6nomore.com/), [campagna MS](http://www.webmonkey.com/2011/03/microsoft-kicks-off-campaign-to-kill-internet-explorer-6/)), oggi potete evitare di perdere tempo con i test di IE! Esperienza personale con IE6 ----------------------- Nel 2009-2012, ho lavorato per un'azienda che utilizzava IE6 come *solo browser ufficiale consentito*. Ho dovuto implementare un sito intranet solo per IE6. Ho deciso di rispettare lo standard web ma usando il sottoinsieme (HTML/CSS/JS) adatto a IE6. È stato difficile, ma quando l'azienda è passata a IE8, il sito era ancora ben reso perché avevo usato Firefox e [firebug][FB] per controllare la compatibilità con lo standard web ;) [Clara]: https://stackoverflow.com/users/1400368 [noEdge]: http://msdn.microsoft.com/library/jj676915.aspx#DCModes [MSICON]: http://windows.microsoft.com/en-US/internet-explorer/products/ie-9/features/compatibility-view [IEMS]: http://en.wikipedia.org/wiki/File:Internet-explorer-usage-data.svg [IE6]: http://en.wikipedia.org/wiki/Internet_Explorer#Desktop_Market_share_by_year_and_version [OneStat]: http://www.onestat.com/html/aboutus_pressbox23.html [IE62014]: http://marketshare.hitslink.com/report.aspx?qprid=3&qpaf=&qpcustom=Microsoft+Internet+Explorer+6.0&qpcustomb=0 [FB]: http://en.wikipedia.org/wiki/Firebug_%28software%29 [Degradazione graduale]: http://www.w3.org/wiki/Graceful_degredation_versus_progressive_enhancement [Miglioramento progressivo]: http://en.wikipedia.org/wiki/Progressive_enhancement [JavaScript non intrusivo]: http://en.wikipedia.org/wiki/Unobtrusive_JavaScript [Cosa dovrebbe considerare uno sviluppatore web?]: https://softwareengineering.stackexchange.com/questions/46716
Commentari (20)

Usalo per forzare IE a nascondere quel fastidioso pulsante di compatibilità del browser nella barra degli indirizzi:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Commentari (8)