Qual's a diferença se uma página web começar com
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
e se a página começar com
<!DOCTYPE html>
<html>
<head>
<!-- without X-UA-Compatible meta -->
Se não houver diferença, suponho que posso simplesmente ignorar o meta header X-UA-Compatível
, já que eu só quero que ele seja renderizado na maioria dos modos padrão em todas as versões do IE.
Actualização Outubro 2015
X-UA-Compatível
no seu site? com as mudanças que a Microsoft fez nos seus navegadores (mais sobre aqueles abaixo).
Dependendo dos navegadores Microsoft que você suporta, talvez você não precise continuar utilizando a tag X-UA-Compatível
. Se você precisa suportar o IE9 ou IE8, então eu recomendo o uso da tag. Se você só suporta os navegadores mais recentes (IE11 e/ou Edge), então eu consideraria deixar esta tag completamente de lado. Se você usar o Twitter Bootstrap e precisar eliminar avisos de validação, esta tag deve aparecer em sua ordem especificada. Informações adicionais abaixo:A meta tag X-UA-Compatível
permite aos autores da web escolher como versão do Internet Explorer a página deve ser renderizada. O IE11 fez alterações nestes modos; veja a nota do IE11 abaixo. [Microsoft Edge][1], o navegador que substituiu o IE11, só honra a meta tag X-UA-Compatível
em certas circunstâncias. Veja a nota do Microsoft Edge abaixo.
De acordo com a Microsoft, ao utilizar a tag X-UA-Compatível
, ela deve estar o mais alta possível no seu documento head
:
Se você estiver utilizando a tag META compatível com X-UA, você quer colocá-la o mais próximo possível do topo da página's HEAD. O Internet Explorer começa a interpretar a marcação utilizando a versão mais recente. Quando o Internet Explorer encontra a tag X-UA-Compatível META, ele começa novamente usando o motor designado's HEAD. Isto é um golpe de desempenho porque o navegador deve parar e reiniciar a análise do conteúdo. Aqui estão as suas opções:
- "IE=edge"
- "IE=11"
- "IE=EmulateIE11"
- "IE=10"
- "IE=EmulateIE10"
- "IE=9"
- "IE=EmulateIE9
- "IE=8"
- "IE=EmulateIE8"
- "IE=7"
- "IE=EmulateIE7"
- "IE=5" Para tentar entender o que cada um deles significa, aqui estão as definições fornecidas pela Microsoft: Internet Explorer suporta uma série de modos de compatibilidade de documentos que permitem diferentes funcionalidades e podem afectar a forma como o conteúdo é apresentado:
- O modo Edge diz ao Internet Explorer para exibir o conteúdo no modo mais alto disponível. Com o Internet Explorer 9, isto é equivalente ao modo IE9. Se uma versão futura do Internet Explorer suportasse um modo de compatibilidade mais elevado, as páginas definidas para o modo Edge apareceriam no modo mais elevado suportado por essa versão. Essas mesmas páginas ainda apareceriam no modo IE9 quando visualizadas com o Internet Explorer 9. o Internet Explorer suporta uma série de modos de compatibilidade de documentos que permitem diferentes recursos e podem afetar a forma como o conteúdo é exibido:
- O modo IE11 oferece o mais alto suporte disponível para padrões estabelecidos e emergentes do setor, incluindo o HTML5, CSS3 e outros.
- O modo IE10 oferece o mais alto suporte disponível para padrões estabelecidos e emergentes do setor, incluindo o HTML5, CSS3 e outros.
- O modo IE9 fornece o mais alto suporte disponível para padrões estabelecidos e emergentes da indústria, incluindo o HTML5 (Working Draft), W3C Cascading Style Sheets Level 3 Specification (Working Draft), Scalable Vector Graphics (SVG) 1.0 Specification, e outros. Nota do Editor: IE 9 * não suporta animações CSS3].
- O modo IE8 suporta muitos padrões estabelecidos, incluindo a Especificação W3C em Cascata Nível 2.1 e a API W3C Selectors; também fornece suporte limitado para a Especificação W3C em Cascata Nível 3 (Working Draft) e outros padrões emergentes.
- O modo IE7 torna o conteúdo como se fosse exibido no modo padrão pelo Internet Explorer 7, quer a página contenha ou não um <!DOCTYPE> diretriz.
- Emular o modo IE9 diz ao Internet Explorer para usar o <!DOCTYPE> diretriz para determinar como renderizar conteúdo. As diretrizes do modo padrão são exibidas no modo IE9 e as diretrizes do modo quirks são exibidas no modo IE5. Ao contrário do modo IE9, o modo Emulate IE9 respeita a diretiva <!DOCTYPE> diretriz.
- O modo Emulate IE8 diz ao Internet Explorer para usar o <!DOCTYPE> diretriz para determinar como renderizar conteúdo. As diretrizes do modo padrão são exibidas no modo IE8 e as diretrizes do modo quirks são exibidas no modo IE5. Ao contrário do modo IE8, o modo Emulate IE8 respeita a diretiva <!DOCTYPE> diretriz.
- O modo Emulate IE7 diz ao Internet Explorer para usar o <!DOCTYPE> diretriz para determinar como renderizar o conteúdo. As diretrizes do modo padrão são exibidas no modo padrão do Internet Explorer 7 e as diretrizes do modo quirks são exibidas no modo IE5. Ao contrário do modo IE7, o modo Emulate IE7 respeita a diretiva <!DOCTYPE> diretriz. Para muitos sites da Web, este é o modo de compatibilidade preferido.
O modo IE5 torna o conteúdo como se fosse exibido no modo quirks pelo Internet Explorer 7, que é muito semelhante à forma como o conteúdo foi exibido no Microsoft Internet Explorer 5. IE10 NOTA: A partir do IE10, o modo quirks comporta-se de forma diferente do que nas versões anteriores do navegador. No IE9 e versões anteriores, o modo quirks restringe a página web às funcionalidades suportadas pelo IE5.5. No IE10, o modo quirks está de acordo com as diferenças especificadas na especificação HTML5. Pessoalmente, eu sempre escolho o
http-equiv="X-UA-Compatível" content="IE=edge"
meta tag, já que versões antigas têm muitos bugs, e eu não quero que o IE decida ir para "modo de compatibilidade" e mostrar meu site como IE7 vs IE8 ou 9. Eu sempre prefiro a última versão do IE. *IE11*** De Microsoft: A partir do IE11, o modo edge é o modo de documento preferido; representa o mais alto suporte aos padrões modernos disponíveis para o navegador. Use a declaração do tipo de documento HTML5 para ativar o modo de borda:<!doctype html>
O modo Edge foi introduzido no Internet Explorer 8 e tem estado disponível em cada versão subseqüente. Observe que os recursos suportados pelo modo Edge estão limitados aos suportados pela versão específica do navegador que renderiza o conteúdo. A partir do IE11, os modos de documento são depreciados e não devem mais ser utilizados, exceto temporariamente. Certifique-se de atualizar os sites que dependem de recursos legados e modos de documentos para refletir os padrões modernos. Se você tiver que direcionar um modo de documento específico para que seu site funcione enquanto você o retrabalha para suportar padrões e recursos modernos, esteja ciente de que você'está usando um recurso de transição, que pode não estar disponível em versões futuras. Se você atualmente usa o cabeçalho compatível com x-ua para direcionar um modo de documento legado, é possível que seu site ganhou't reflita a melhor experiência disponível com o IE11. Microsoft Edge (Substituição do Internet Explorer que vem junto com o Windows 10) Informações sobreX-UA-Compatible
meta tag for the "Edge" versão do IE. Da Microsoft: Introduzindo o modo de documento "vivo" Edge Como anunciado em agosto de 2013, estamos depreciando os modos de documentos a partir do IE11. Com nossas últimas atualizações de plataforma, a necessidade de modos de documentos legados está limitada principalmente aos aplicativos web legados corporativos. Com novas mudanças na arquitetura, esses modos de documentos legados serão isolados das mudanças no modo "vivo" Edge, o que ajudará a garantir um nível muito maior de compatibilidade para os clientes que dependem desses modos e nos ajudará a avançar ainda mais rapidamente nas melhorias no Edge. O IE ainda irá honrar os modos de documentos servidos pelos sites da intranet, sites na lista de Compatibility View, e quando usados apenas com o modo Enterprise Mode. sites públicos da Internet serão renderizados com a nova plataforma Edge mode (ignorando X-UA-Compatible). É nosso objectivo que o Edge seja o " living" modo documento a partir daqui e não serão introduzidos mais modos de documento a partir de agora. Com as mudanças no Microsoft Edge para não suportar mais os modos de documentos na maioria dos casos, a Microsoft tem uma ferramenta para digitalizar o seu site para verificar e ver se ele tem um código que não é compatível com o Edge. Chrome=1 Informação para IE Há tambémchrome=1
que você pode utilizar ou utilizar em conjunto com uma das opções acima, como por exemplo:<meta http-equiv="X-UA-Compatível" content="IE=Edge,chrome=1">
.chrome=1
é para Google's Chrome Frame que é definido como: Google Chrome Frame é um plug-in de código aberto para navegador. Os utilizadores que têm o plug-in instalado têm acesso às tecnologias web abertas do Google Chrome's e ao rápido motor JavaScript quando abrem páginas no browser. o Google Chrome Frame melhora a sua experiência de navegação no Internet Explorer sem problemas. Ele exibe sites habilitados para o Google Chrome Frame utilizando a tecnologia de renderização do Google Chrome, dando-lhe acesso às mais recentes funcionalidades HTML5, bem como às funcionalidades de desempenho e segurança do Google Chrome, sem interromper de forma alguma a utilização habitual do seu navegador. Quando o Google Chrome Frame é instalado, a Web fica melhor sem que tenha de pensar no assunto. Mas para que esse plug-in funcione, você deve utilizarchrome=1
na meta tagX-UA-Compatible
. Mais informações sobre o Chrome Frame podem ser encontradas aqui. Note: O Google Chrome Frame só funciona para IE6 até IE9, e foi aposentado em 25 de fevereiro de 2014. Mais informações podem ser encontradas aqui. Obrigado ao @mck pelo link. Validação:* *HTML5: A página validará utilizando o W3 Validator apenas quando utilizar<meta http-equiv="X-UA-Compatible" content="IE=Edge">
. Para outros valores ele irá lançar o erro:Um meta elemento com um atributo http-equiv cujo valor é X-UA-Compatível deve ter um atributo content com o valor IE=edge.
Em outras palavras, se você tiverIE=edge,chrome=1
ele não irá validar. Eu ignoro este erro completamente como os navegadores modernos simplesmente ignoram esta linha de código. Se você precisa ter um código completamente válido, então considere fazer isso no nível do servidor, definindo o cabeçalho HTTP. Como nota, a Microsoft diz,Se ambas as instruções forem enviadas (meta e HTTP), a preferência do desenvolvedor's (meta elemento) tem precedência sobre a configuração do servidor web (cabeçalho HTTP).
Veja olibre's answer ou bitinn's answer para mais detalhes sobre como definir um cabeçalho HTTP. XHTML Existe't um problema com validação ao utilizar<meta http-equiv="X-UA-Compatível" content="IE=Edge" />
desde que a tag esteja devidamente fechada (i.e./>
vs>
). Twitter Bootstrap Esta tag tem sido fortemente recomendada pela equipe Bootstrap desde pelo menos 2014, e Bootlint, o linter de autoria da equipe twbs continua a lançar um aviso quando a tag é omitida. O linter distingue entre advertências e erros, e como tal a gravidade da omissão desta tag pode ser considerada menor.Para mais informações sobre
X-UA-Compatível
veja Microsoft's Website Defining Document Compatibility. Para mais informações sobre o que o IE suporta veja caniuse.com. Para mais informações sobre os requisitos do Bootstrap do Twitter, veja o projeto bootlint página wiki.
Utilize content=
"IE=edge,chrome=1"
Salte outros modos X-UA-Compatível
.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
--------------------------
javascript::JSON.parse()
no IE8 <!DOCTYPE html>
está presente)**No seu HTML***
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
IE=edge
significa que o IE deve utilizar a última versão (edge) do seu motor de renderizaçãochrome=1
significa que o IE deve utilizar o Chrome rendering engine se estiver instalado
Or melhor na configuração do seu servidor web: add_header X-UA-Compatible "IE=Edge,chrome=1";
}
Mas a posição da Microsoft não estava clara. Outra [página MSDN não recomendava Edge mode][noEdge]:
Porque o modo Edge força todas as páginas a serem abertas no modo padrão, independentemente da versão do Internet Explorer, você pode ser tentado a usar isso para todas as páginas visualizadas com o Internet Explorer. Don' não faça isto, pois o cabeçalho
<meta http-equiv="X-UA-Compatível" content="IE=7,9,10" > **Bem... No resto desta resposta eu dou mais explicações porque utilizar `content="IE=edge,chrome=1"` é uma boa prática na produção.** --------------------------------- História ------- Durante muitos anos (2000 a 2008), [a quota de mercado do IE foi superior a 80%][IEMS]. E o IE **v6** foi considerado como um padrão *de facto* (80% a 97% de quota de mercado em [2003][OneStat], [2004, 2005 e 2006][IE6] apenas para o IE6, mais quota de mercado com todas as versões do IE). Como o IE6 não estava respeitando [os padrões Web](http://en.wikipedia.org/wiki/Web_standards), os desenvolvedores **deviam*** testar seu site usando o IE6. Essa situação era ótima para a Microsoft (MS), pois os desenvolvedores web tinham que **comprar** produtos da MS (por exemplo, o IE não pode ser usado sem a compra do Windows), e era mais lucrativo ficar fora de conformidade (ou seja, a Microsoft queria se tornar **a norma** excluindo outras empresas). Portanto, muitos sites eram apenas compatíveis com o IE6, e como o IE não estava em conformidade com o padrão web, todos esses sites não eram bem apresentados em navegadores compatíveis com o padrão. Pior ainda, [muitos sites exigiam apenas o IE](http://hintsforums.macworld.com/showthread.php?t=111479). No entanto, neste momento, a Mozilla iniciou o desenvolvimento do Firefox respeitando o máximo possível todos os padrões web (outros navegadores foram implementados para renderizar páginas como feito pelo IE6). Como mais e mais desenvolvedores web queriam usar as novas funcionalidades dos padrões web, mais e mais sites eram mais suportados pelo Firefox do que pelo IE. Quando o compartilhamento de mercado do IE estava diminuindo, a MS percebeu que manter o padrão incompatível não era uma boa idéia. Portanto, a MS começou a lançar uma nova versão do IE (IE8/IE9/IE10) respeitando cada vez mais os padrões web. --------------------------------- A questão da incompatibilidade com a web --------------------------- Mas o problema são todos os sites concebidos para o IE6: a Microsoft não poderia lançar novas versões do IE incompatíveis com estes antigos sites concebidos para o IE6. Ao invés de deduzir a versão do IE que um website foi projetado, a MS solicitou aos desenvolvedores que adicionassem dados extras (`X-UA-Compatível') em suas páginas. O IE6 ainda é utilizado em 2016. ------------------------- Atualmente, o IE6 ainda é utilizado [(0,7% em 2016)][IE62014] (4,5% em janeiro de 2014), e alguns sites da internet ainda são compatíveis apenas com o IE6. Alguns sites/aplicações da intranet são testados usando o IE6. Alguns sites da intranet são 100% funcionais apenas no IE6. Essas empresas/departamentos preferem adiar o custo de migração: outras prioridades, ninguém mais sabe como o site/aplicativo foi implementado, o dono do site/aplicativo legado faliu... A China representa [50% do uso do IE6 em 2013](www.ie6countdown.com/), mas pode mudar nos próximos anos, pois [a distribuição Linux chinesa está sendo transmitida](http://www.canonical.com/content/canonical-and-chinese-standards-body-announce-ubuntu-collaboration). Seja confiante com suas habilidades na web --------------------------------- Se você (tente) respeitar o padrão web, você pode simplesmente utilizar `http-equiv="X-UA-Compatível" content="IE=edge,chrome=1"`. Para manter a compatibilidade com navegadores antigos, evite usar as últimas características da web: use o subconjunto suportado pelo navegador mais antigo que você deseja suportar. Ou se você quiser ir mais longe, você pode adotar conceitos como [Graceful degradation], [Progressive enhancement] e [Unobtrusive JavaScript]. (Você também pode ficar satisfeito em ler [O que um desenvolvedor web deve considerar?]). Não se preocupe com a melhor renderização da versão do IE: este não é o seu trabalho, pois os navegadores têm que estar em conformidade com os padrões da web. Se o seu site é compatível com os padrões e usa as últimas funcionalidades moderadamente, portanto **os navegadores têm de estar em conformidade com o seu site**. Além disso, como existem muitas campanhas para _kill_ IE6 ([IE6 não mais](http://www.ie6nomore.com/), [campanha MS](http://www.webmonkey.com/2011/03/microsoft-kicks-off-campaign-to-kill-internet-explorer-6/)), hoje em dia você pode evitar perder tempo com testes do IE! Experiência pessoal com o IE6 ----------------------- Em 2009-2012, trabalhei para uma empresa utilizando o IE6 como o *browser único oficial permitido*. Tive de implementar um site de intranet apenas para o IE6. Decidi respeitar o padrão web, mas usando o subconjunto de capacidades do IE6 (HTML/CSS/JS). Foi difícil, mas quando a empresa mudou para o IE8, o site ainda estava bem renderizado porque eu tinha usado Firefox e [firebug][FB] para verificar a compatibilidade com o padrão web ;) [Clara]: https://stackoverflow.com/users/1400368 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 [Degradação graciosa]: http://www.w3.org/wiki/Graceful_degredation_versus_progressive_enhancement [Melhorias progressivas]: http://en.wikipedia.org/wiki/Progressive_enhancement [Javascript discreto]: http://en.wikipedia.org/wiki/Unobtrusive_JavaScript [O que um desenvolvedor web deve considerar?]: https://softwareengineering.stackexchange.com/questions/46716X-UA-Compatível' só é suportado a partir de com Windows Internet Explorer 8. Em vez disso, a Microsoft recomendou utilizar
<!DOCTYPE html>`: Se você quiser que todas as versões suportadas do Internet Explorer sejam abertas suas páginas em modo padrão, use a declaração do tipo de documento HTML5 [...] Como Ricardo explica (nos comentários abaixo) qualquer DOCTYPE (HTML4, XHTML1...) pode ser usado para acionar o Modo Padrão, não apenas HTML5's DOCTYPE. O importante é ter sempre um DOCTYPE na página. Clara Onager até já notou em uma versão antiga de Especificando modos de documentos legados: O modo Edge destina-se apenas a fins de teste; não o utilize em um ambiente de produção. É tão confuso que Usman Y pensou que Clara Onager estava falando sobre isso: O exemplo [...] é fornecido apenas para fins ilustrativos; don' não usá-lo em um ambiente de produção.