O que o conteúdo do <meta http-equiv = "Compatível com X-UA" = "IE = borda"> faz?

1438

Qual é a diferença se uma página da web começa 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 X-UA-Compatiblemeta header, pois quero que ele seja renderizado no modo mais padrão em todas as versões do IE.

html internet-explorer browser x-ua-compatible Morgan Cheng
fonte

Respostas:

1703

Atualização de outubro de 2015

Esta resposta foi publicada há vários anos e agora a pergunta realmente deve ser , você deve considerar usar a X-UA-Compatibletag no seu site? com as alterações que a Microsoft fez em seus navegadores (mais sobre os abaixo).

Dependendo dos navegadores Microsoft suportados, talvez você não precise continuar usando a X-UA-Compatibletag. Se você precisar oferecer suporte ao IE9 ou IE8, recomendo o uso da tag. Se você oferecer suporte apenas aos navegadores mais recentes (IE11 e / ou Edge), consideraria abandonar essa tag por completo. Se você usa o Twitter Bootstrap e precisa eliminar os avisos de validação, essa tag deve aparecer na ordem especificada. Informações adicionais abaixo:

A X-UA-Compatiblemetatag permite aos autores da web escolher em qual versão do Internet Explorer a página deve ser renderizada. O IE11 fez alterações nesses modos; veja a nota do IE11 abaixo. O Microsoft Edge , o navegador que substituiu o IE11, apenas honra a X-UA-Compatiblemetatag em determinadas circunstâncias. Veja a nota do Microsoft Edge abaixo.

Segundo a Microsoft, ao usar a X-UA-Compatibletag, ela deve ser a mais alta possível no seu documento head:

Se você estiver usando a tag META compatível com X-UA, deseja colocá-la o mais próximo possível do topo do cabeçalho da página. O Internet Explorer começa a interpretar a marcação usando a versão mais recente. Quando o Internet Explorer encontra a marca META compatível com X-UA, ela inicia novamente usando o mecanismo da versão designada. Este é um problema de desempenho porque o navegador deve parar e reiniciar a análise do conteúdo.

Aqui estão as suas opções:

  • "IE = borda"
  • "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 significa, aqui estão as definições fornecidas pela Microsoft:

O Internet Explorer suporta vários modos de compatibilidade de documentos que habilitam recursos diferentes e podem afetar a maneira como o conteúdo é exibido:

  • O modo de borda informa ao Internet Explorer para exibir o conteúdo no modo mais alto disponível. Com o Internet Explorer 9, isso é equivalente ao modo IE9. Se uma versão futura do Internet Explorer oferecer suporte a um modo de compatibilidade mais alto, as páginas definidas no modo de borda aparecerão no modo mais alto suportado por essa versão. Essas mesmas páginas ainda apareceriam no modo IE9 quando exibidas no Internet Explorer 9. O Internet Explorer suporta vários modos de compatibilidade de documentos que habilitam recursos diferentes e podem afetar a maneira como o conteúdo é exibido:

  • O modo IE11 fornece o mais alto suporte disponível para padrões estabelecidos e emergentes do setor, incluindo HTML5, CSS3 e outros.

  • O modo IE10 fornece o mais alto suporte disponível para padrões estabelecidos e emergentes do setor, incluindo HTML5, CSS3 e outros.

  • O modo IE9 fornece o mais alto suporte disponível para padrões estabelecidos e emergentes do setor, incluindo HTML5 (Working Draft), W3C Cascading Style Sheets Level 3 Specification (Working Draft), Scalable Vector Graphics (SVG) 1.0 Specification e outros. [Nota do editor: O IE 9 não suporta animações CSS3].

  • O modo IE8 suporta muitos padrões estabelecidos, incluindo a especificação W3C Cascading Style Sheets Level 2.1 e a API W3C Selectors; ele também fornece suporte limitado para a especificação de nível 3 das folhas de estilo em cascata W3C (rascunho de trabalho) e outros padrões emergentes.

  • O modo IE7 renderiza o conteúdo como se ele fosse exibido no modo padrão pelo Internet Explorer 7, independentemente de a página conter ou não uma diretiva.

  • O modo Emular IE9 informa ao Internet Explorer para usar a diretiva para determinar como renderizar conteúdo. As diretivas do modo padrão são exibidas no modo IE9 e as diretivas do modo quirks são exibidas no modo IE5. Ao contrário do modo IE9, o modo Emular IE9 respeita a diretiva.

  • O modo Emular IE8 informa ao Internet Explorer para usar a diretiva para determinar como renderizar conteúdo. As diretivas do modo padrão são exibidas no modo IE8 e as diretivas do modo quirks são exibidas no modo IE5. Diferente do modo IE8, o modo Emular IE8 respeita a diretiva.

  • O modo Emular IE7 informa ao Internet Explorer para usar a diretiva para determinar como renderizar conteúdo. As diretivas do modo padrões são exibidas no modo de padrões do Internet Explorer 7 e as diretivas do modo quirks são exibidas no modo IE5. Ao contrário do modo IE7, o modo Emular IE7 respeita a diretiva. Para muitos sites, esse é o modo de compatibilidade preferido.

  • O modo IE5 renderiza o conteúdo como se ele fosse exibido no modo quirks pelo Internet Explorer 7, muito semelhante à maneira como o conteúdo foi exibido no Microsoft Internet Explorer 5.

IE10 NOTA: A partir do IE10, o modo quirks se comporta de maneira diferente do que nas versões anteriores do navegador. No IE9 e nas versões anteriores, o modo quirks restringia a página da Web aos recursos suportados pelo IE5.5. No IE10, o modo quirks está em conformidade com as diferenças especificadas na especificação HTML5.

Pessoalmente, sempre escolho a http-equiv="X-UA-Compatible" content="IE=edge"meta tag, pois as versões mais antigas têm muitos bugs e não quero que o IE decida entrar no "Modo de compatibilidade" e mostre meu site como IE7 vs IE8 ou 9. Prefiro sempre a versão mais recente do IE.

IE11

Da Microsoft :

A partir do IE11, o modo de borda é o modo de documento preferido; representa o mais alto suporte para os padrões modernos disponíveis para o navegador.

Use a declaração de tipo de documento HTML5 para ativar o modo de borda:

<!doctype html>

O modo Edge foi introduzido no Internet Explorer 8 e está disponível em cada versão subsequente. Observe que os recursos suportados pelo modo de borda são limitados aos suportados pela versão específica do navegador que processa o conteúdo.

A partir do IE11, os modos de documento foram descontinuados e não devem mais ser usados, exceto temporariamente. Atualize sites que dependem de recursos herdados e modos de documento para refletir os padrões modernos.

Se você precisar direcionar um modo de documento específico para que seu site funcione enquanto o reformula para oferecer suporte a padrões e recursos modernos, saiba que 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 segmentar um modo de documento herdado, é possível que seu site não reflita a melhor experiência disponível no IE11.

Microsoft Edge (substituição para o Internet Explorer que acompanha o Windows 10)

Informações na X-UA-Compatiblemetatag para a versão "Edge" do IE. Da Microsoft :

Apresentando o modo de documento Edge “vivo”

Como anunciamos em agosto de 2013, estamos descontinuando os modos de documento a partir do IE11. Com nossas atualizações de plataforma mais recentes, a necessidade de modos de documentos herdados é limitada principalmente aos aplicativos Web herdados da empresa. Com as novas alterações arquiteturais, esses modos de documentos herdados serão isolados das alterações no modo "vivo" do Edge, o que ajudará a garantir um nível muito mais alto de compatibilidade para clientes que dependem desses modos e nos ajudará a avançar ainda mais rapidamente nas melhorias no Edge . O IE ainda respeitará os modos de documento atendidos pelos sites da intranet, sites na lista do Modo de Exibição de Compatibilidade e quando usados ​​apenas no Modo Empresarial.

Os sites públicos da Internet serão renderizados com a nova plataforma no modo Edge (ignorando o X-UA-Compatible). Nosso objetivo é que o Edge seja o modo de documento "vivo" daqui em diante e nenhum outro modo de documento seja introduzido daqui para frente.

Com as alterações no Microsoft Edge, para não oferecer mais suporte aos modos de documento, na maioria dos casos, a Microsoft possui uma ferramenta para verificar seu site e verificar se ele possui código incompatível com o Edge.

Chrome = 1 informações para o IE

Há também chrome=1que você pode usar ou utilizar em conjunto com uma das opções acima, como: <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">. chrome=1é para o Chrome Frame do Google, definido como:

O Google Chrome Frame é um plug-in de navegador de código aberto. Os usuários que possuem o plug-in instalado têm acesso às tecnologias da Web aberta do Google Chrome e ao rápido mecanismo JavaScript quando abrem as páginas no navegador.

O Google Chrome Frame aprimora perfeitamente sua experiência de navegação no Internet Explorer. Ele exibe sites habilitados para o Google Chrome Frame usando a tecnologia de renderização do Google Chrome, fornecendo acesso aos mais recentes recursos HTML5, bem como aos recursos de desempenho e segurança do Google Chrome, sem interromper o uso habitual do navegador.

Quando o Google Chrome Frame é instalado, a Web fica melhor sem que você precise pensar nisso.

Mas, para que esse plug-in funcione, você deve usar chrome=1a X-UA-Compatiblemetatag.

Mais informações sobre o Chrome Frame podem ser encontradas aqui .

Nota: O Google Chrome Frame funciona apenas para o IE6 até o IE9 e foi aposentado em 25 de fevereiro de 2014. Mais informações podem ser encontradas aqui . Obrigado a @mck pelo link.

Validação:

HTML5 :

A página será validada usando o W3 Validator apenas ao usar <meta http-equiv="X-UA-Compatible" content="IE=Edge">. Para outros valores, lançará o erro: A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge.Em outras palavras, se você o tiver IE=edge,chrome=1, não será validado. Eu ignoro esse erro completamente, pois os navegadores modernos simplesmente ignoram essa linha de código.

Se você deve ter um código completamente válido, considere fazer isso no nível do servidor, configurando o cabeçalho HTTP. Como uma observação, a Microsoft diz: 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). Consulte a resposta da olibre ou a resposta da bitinn para obter mais detalhes sobre como definir um cabeçalho HTTP.

XHTML

Não há problema com a validação ao usar <meta http-equiv="X-UA-Compatible" content="IE=Edge" />o tempo que a tag estiver devidamente fechada (por exemplo, />vs >).

Twitter Bootstrap

Essa tag é altamente recomendada pela equipe do Bootstrap desde pelo menos 2014, e o Bootlint , o linter criado pela equipe twbs, continua a emitir um aviso quando a tag é omitida. O linter distingue avisos e erros e, como tal, a gravidade de omitir essa tag pode ser considerada menor.

Para obter mais informações, X-UA-Compatibleconsulte o site da Microsoft, Definindo a compatibilidade de documentos .

Para mais informações sobre o que o IE suporta, consulte caniuse.com .

Para obter mais informações sobre os requisitos do Twitter Bootstrap, consulte a página wiki do projeto de bootlint .

L84
fonte
40
Se eu não tiver "X-UA-Compatible" nos cabeçalhos, o que aconteceria?
Morgan Cheng
45
Basicamente, o que acontece é que, quando você tem o X-UA-Compatible, ele informa ao IE como se comportar em relação ao valor definido (IE = edge etc.), se não estiver lá, o IE mostrará ao site como ele acha melhor que deve ser mostrado. . Pode ser o modo de compatibilidade ou a versão mais recente do IE. O que a Microsoft / IE achar melhor. Faz sentido?
L84 21/07
2
@TravisJ - Pelo meu entendimento, o modo mais alto disponível basicamente significa que o IE 8 pode suportar até os modos IE8, o IE9 pode suportar os modos IE9 e assim por diante. Eu adicionei algumas definições para cada modo fornecido pela Microsoft.
L84 24/09/12
10
@AdrienBe - concordo plenamente! Até agora, o IE 10 foi o melhor para mim, mas desprezo qualquer outra versão. Uma vez, tive uma configuração de página com alguns efeitos em torno de 200 a 300 linhas de HTML e cerca de 20 minutos de codificação. Para que o IE funcionasse, tive que adicionar outras 1.000 linhas de código (principalmente javascript de terceiros) e 2-3 horas de trabalho! Eu realmente odeio o IE =>
L84 28/03
9
O Google Chrome Frame será desativado em janeiro de 2014: blog.chromium.org/2013/06/retiring-chrome-frame.html
mck
339

Use content="IE=edge,chrome=1"   Ignorar outros X-UA-Compatiblemodos

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

  • Nenhum ícone de compatibilidade
    A barra de endereços do IE9 não exibe o botão Modo de exibição de compatibilidade
    e a página também não mostra uma variedade de menus, imagens e caixas de texto fora do local.

  • Recursos
    Essa metatag é necessária para ativar javascript::JSON.parse()no IE8
    (mesmo quando <!DOCTYPE html>houver)

  • Correção A
    renderização / execução de HTML / CSS / JavaScript moderno é mais válida (melhor).

  • Desempenho
    O mecanismo de renderização Trident deve funcionar mais rápido no modo de borda .

Uso

No seu HTML

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

Ou melhor, na configuração do seu servidor da web:
(veja também a resposta da RiaD )

  • Apache como proposto por 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 como proposto por Stef Pause

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

  • Proxy de verniz, como proposto por Lucas Riutzel

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

  • IIS (desde a v7)

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

A Microsoft recomenda o modo Edge desde o IE11

Conforme observado por Lynda (consulte os comentários), as alterações de compatibilidade no IE11 recomendam o modo Edge :

A partir do IE11, o modo de borda é o modo de documento preferido; representa o mais alto suporte para os padrões modernos disponíveis para o navegador.

Mas a posição da Microsoft não era clara. Outra página do MSDN não recomendou o modo Edge :

Como o modo Borda 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 usá-lo em todas as páginas exibidas no Internet Explorer. Não faça isso, pois o X-UA-Compatiblecabeçalho é suportado apenas a partir do Windows Internet Explorer 8.

Em vez disso, a Microsoft recomendou o uso de <!DOCTYPE html>:

Se você deseja que todas as versões suportadas do Internet Explorer abram suas páginas no modo padrão, use a declaração de tipo de documento HTML5 [...]

Como Ricardo explica (nos comentários abaixo) qualquer DOCTYPE (HTML4, XHTML1 ...) pode ser usado para acionar o modo Standards, não apenas o DOCTYPE do HTML5. O importante é sempre ter um DOCTYPE na página.

Clara Onager até percebeu em uma versão mais antiga de Especificando modos de documento herdados :

O modo Edge é destinado apenas para fins de teste; não o use em um ambiente de produção.

É tão confuso que Usman Y pensou que Clara Onager estava falando sobre:

O exemplo é [...] fornecido apenas para fins ilustrativos; não o use em um ambiente de produção.

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

Bem ... No restante desta resposta, dou mais explicações sobre por que usar content="IE=edge,chrome=1"é uma boa prática na produção.

História

Por muitos anos (2000 a 2008), a participação de mercado do IE foi superior a 80% . E o IE v6 foi considerado um padrão de fato (participação de mercado de 80% a 97% em 2003 , 2004, 2005 e 2006 somente para o IE6, mais participação de mercado em todas as versões do IE).

Como o IE6 não estava respeitando os padrões da Web , os desenvolvedores tiveram que testar seu site usando o IE6. Essa situação foi ótima para a Microsoft (MS), pois os desenvolvedores da Web precisaram comprar produtos da MS (por exemplo, o IE não pode ser usado sem a compra do Windows), e foi mais lucrativo permanecer em conformidade (ou seja, a Microsoft queria se tornar o padrão, excluindo outros empresas).

Portanto, muitos sites eram compatíveis apenas com o IE6 e, como o IE não era compatível com o padrão da web, todos esses sites não eram bem renderizados em navegadores compatíveis com os padrões. Pior ainda, muitos sites precisavam apenas do IE .

No entanto, neste momento, a Mozilla iniciou o desenvolvimento do Firefox respeitando, tanto quanto possível, todos os padrões da web (outro navegador foi implementado para renderizar as páginas conforme o IE6). À medida que mais e mais desenvolvedores da Web desejavam usar os novos recursos de padrões da Web, mais e mais sites eram mais suportados pelo Firefox do que o IE.

Quando o compartilhamento de mercado do IE estava diminuindo, a MS percebeu que permanecer incompatível com o padrão não era uma boa idéia. Portanto, a MS começou a lançar a nova versão do IE (IE8 / IE9 / IE10), respeitando cada vez mais os padrões da web.

O problema incompatível com a web

Mas o problema são todos os sites criados para o IE6: a Microsoft não pôde lançar novas versões do IE incompatíveis com esses sites antigos criados pelo IE6. Em vez de deduzir a versão do IE, um site foi projetado, a MS solicitou aos desenvolvedores que adicionassem dados extras ( X-UA-Compatible) em suas páginas.

O IE6 ainda é usado em 2016

Atualmente, o IE6 ainda é usado (0,7% em 2016) (4,5% em janeiro de 2014) e alguns sites da Internet ainda são compatíveis apenas com o IE6. Alguns sites / aplicativos 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 da migração: outras prioridades, ninguém sabe mais como o site / aplicativo foi implementado, o proprietário do site / aplicativo herdado faliu ...

A China representa 50% do uso do IE6 em 2013, mas pode mudar nos próximos anos à medida que a distribuição Linux chinesa estiver sendo transmitida .

Seja confiante com suas habilidades na web

Se você (tentar) respeitar o padrão da web, poderá simplesmente usar sempre http-equiv="X-UA-Compatible" content="IE=edge,chrome=1". Para manter a compatibilidade com navegadores antigos, evite usar os recursos mais recentes da Web: use o subconjunto suportado pelo navegador mais antigo que você deseja suportar. Ou, se você quiser ir mais longe, pode adotar conceitos como degradação graciosa , aprimoramento progressivo e JavaScript discreto . (Você também pode ler o que deve considerar um desenvolvedor da web?. )

Não se preocupe com a melhor renderização da versão do IE: esse não é o seu trabalho, pois os navegadores precisam estar em conformidade com os padrões da web. Se o seu site for compatível com o padrão e usar recursos moderadamente mais recentes, os navegadores deverão ser compatíveis com o seu site .

Além disso, como existem muitas campanhas para matar o IE6 ( IE6 , campanha da MS ), hoje em dia você pode evitar perder tempo com os testes do IE!

Experiência pessoal no IE6

Em 2009-2012, trabalhei para uma empresa que usava o IE6 como o navegador único oficial permitido . Eu tive que implementar um site na intranet apenas para o IE6. Decidi respeitar o padrão da Web, mas usando o subconjunto compatível com IE6 (HTML / CSS / JS).

Foi difícil, mas quando a empresa mudou para o IE8, o site ainda estava bem renderizado porque eu havia usado o Firefox e o firebug para verificar a compatibilidade com o padrão da web;)

olibre
fonte
2
O modo Edge é destinado apenas para fins de teste; não o use em um ambiente de produção. ' Consulte msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx
Carl Onager
5
Por favor, o @ClaraOnager dedique algum tempo para explicar o que está errado na minha resposta (do seu ponto de vista). Mesmo que a MS não recomende o uso do modo Edge no ambiente de produção, existem boas razões para usá-lo no ambiente de produção. É importante esclarecer tecnicamente nossas melhores práticas. Eu gosto de compartilhar meus conhecimentos e experiências. Eu espero que você também. Podemos melhorar juntos;) Cheers
olibre
2
Olá @ Ricardo, eu concordo com você. A Microsoft diz "Se você deseja que todas as versões suportadas do Internet Explorer abram suas páginas no modo padrão, use o HTML5" [...] " na seção Compreendendo os modos de documentos herdados (consulte a Dica ). Talvez minha explicação não esteja clara ... Talvez eu tenha entendido algo errado ... Eu mudei meu texto ... O que você acha das minhas alterações? está tudo bem para você? O que você aconselha a mudar / melhorar dentro da minha resposta? Obrigado pelo seu feedback! Cheers ;-)
olibre
5
@ClaraOnager ... na sua primeira resposta, você está apontando incorretamente, na página de referência. A Microsoft diz para não usar no ambiente de produção para: <meta http-equiv = "Conteúdo compatível com X-UA" = "IE = 7, 9,10 "> não as outras coisas do Edge.
perfil completo de Usman Younas
3
Sobre o Edge Mode sendo usado no ambiente de produção. Da 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

A diferença é que, se você especificar apenas DOCTYPE, as Configurações de exibição de compatibilidade do IE terão precedência. Por padrão, essas configurações forçam todos os sites da intranet para o Modo de Exibição de Compatibilidade, independentemente de DOCTYPE. Há também uma caixa de seleção para usar o Modo de Exibição de Compatibilidade para todos os sites, independentemente DOCTYPE.

Caixa de diálogo Configurações de exibição de compatibilidade do IE

X-UA-Compatiblesubstitui as configurações do modo de exibição de compatibilidade, para que a página seja renderizada no modo padrão, independentemente das configurações do navegador. Isso força o modo de padrões para:

  • páginas da intranet
  • páginas da Web externas quando o administrador do computador escolheu "Exibir todos os sites no Modo de Exibição de Compatibilidade" como padrão - pense em grandes empresas, governos, universidades
  • quando você involuntariamente acaba na lista de exibição de compatibilidade da Microsoft
  • casos em que os usuários adicionaram manualmente seu site à lista em Configurações de exibição de compatibilidade

DOCTYPEsozinho não pode fazer isso; você terminará em um dos modos de exibição de compatibilidade nesses casos, independentemente DOCTYPE.

Se a metatag e o cabeçalho HTTP forem especificados, a metatag terá precedência.

Esta resposta é baseada no exame das regras completas para decidir o modo de documento no IE8 , IE9 e IE10 . Observe que observar o DOCTYPEé o último substituto para decidir o modo de documento.

andrewdotn
fonte
1
No cenário da intranet, por padrão, o IE10 é renderizado no modo de compatibilidade. Consulte stackoverflow.com/questions/13284083/…. Essa tag não é necessária por padrão para a Internet, mas é necessária (por padrão) ao usar myintenralserver / myapp . Eu queria adicionar esse comentário, porque a diferença entre Internet e intranet era clara apenas no texto da captura de tela, não no texto de qualquer resposta na página.
yzorg
Você está certo, eu deveria ter sido mais claro sobre isso. Eu reescrevi a postagem; deixe-me saber se há mais alguma coisa que eu deva abordar. Obrigado!
precisa saber é o seguinte
Obrigado! essa resposta é muito mais clara do que outras respostas sobre sites da intranet. Outras respostas entram em detalhes técnicos sobre por que e como. Eu odeio o MS IE. Também é bom escrever: um parágrafo deixa claro o motivo pelo qual precisamos da metatag. Bravo
Aniket Inge
3
Eu gostaria de poder votar esta resposta cem vezes. Captura de tela salva-vidas ali.
Redução da
Awesome awesome awesome! Muito obrigado por esta resposta.
Seanosapien
25

Use isso para forçar o IE a ocultar esse botão irritante de compatibilidade do navegador na barra de endereços:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
George Filippakos
fonte
1
O modo Edge é destinado apenas para fins de teste; não o use em um ambiente de produção. ' Consulte msdn.microsoft.com/en-us/library/jj676915(v=vs.85).aspx
Carl Onager
4
Para uma boa medida, uso <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">com a chrome=1diretiva, solicitando que os usuários do IE6, 7, 8 instalem / usem o Chrome Frame . Até o HTML5 Boilerplate o usa.
Ricardo Zea
10
@ClaraOnager Embora a Microsoft diga isso, isso não significa necessariamente que eles estão certos. Eu uso <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">desde o dia em que saiu sem nenhum problema. Na verdade, já salvei minha equipe e centenas de dores de cabeça ao fazer o IE dos usuários usar seu mecanismo mais recente para renderizar as páginas que construímos. Ao contrário de você e a Microsoft, recomendo a todos que usem a metatag acima toda vez . Enquanto IE ainda está por aí, vamos ser "forçado" a utilizar esta tag meta: p
Ricardo Zea
Isso mudou com o IE11. Esta versão deu um passo dramático para o mundo dos navegadores, seguindo os padrões oficiais. Ele chegou ao extremo de nem mesmo se identificar como Internet Explorer! Agora, ele diz que é "Netscape" e não inclui nada nas informações do navegador para revelar sua verdadeira identidade. Se você ainda encontrar alguma peculiaridade no navegador IE a partir desta versão, precisará forçá-lo ao IE10 configurando <meta http-equiv="X-UA-Compatible" content="IE=10">. Em seguida, ele se reporta como Microsoft Internet Explorer.
temor
enfrentando o mesmo problema relacionado, se alguém puder me ajudar: stackoverflow.com/questions/22013880/…
dsi
25

Como não consigo adicionar um comentário à resposta marcada, postarei isso aqui.

Além da resposta correta, você pode validar isso. Como essa metatag é direcionada apenas para o IE, tudo o que você precisa fazer é adicionar uma condicional ao IE.

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

Fazer isso é como adicionar qualquer outra declaração condicional do IE e funciona apenas para o IE e nenhum outro navegador será afetado.

EMurph78
fonte
4
Comentários condicionais não devem ser usados ​​EXCETO para direcionar HTML para <= IE9. (Isto era verdade mesmo quando esta resposta foi escrito)
EKW
18

Eu acho que esse diagrama da Microsoft explica tudo. Para informar ao IE como renderizar o conteúdo, o! DOCTYPE precisa trabalhar com a metatag compatível com X-UA. O DOCTYPE por si só não afeta a alteração do modo de documento do IE.

insira a descrição da imagem aqui

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

James Tsai
fonte
3
Aqui está uma versão atualizada que inclui o IE9. OMG ... ie.microsoft.com/testdrive/ieblog/2010/Jun/...
Spiralis
3
E este inclui IE10: msdn.microsoft.com/en-us/library/ff406036%28v=vs.85%29.aspx Os diferentes capítulos têm seus próprios fluxogramas separados ...
Spiralis
Você leu errado esse diagrama de fluxo. Na ausência de X-UA-Compatible, o navegador procurará <! DOCTYPE>. Se encontrar um, é renderizado no modo de padrões (também conhecido como "EmulateIE8"). Caso contrário, reverte para o "Modo Quirks".
precisa saber sobre o chuck le
Obrigado por fazer o upload da imagem no Stackoverflow. Os links originais para a Microsoft estão todos mortos.
Elmue
12

Apenas para completar, você realmente não precisa adicioná-lo ao seu HTML (que é desconhecido como http-equiv no HTML5)

Faça isso e nunca olhe para trás (primeiro exemplo para apache , segundo para nginx )

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

add_header X-UA-Compatible "IE=Edge,chrome=1";
bitinn
fonte
2
@HueiTan - Acho que o pôster está dizendo que, quando você tenta validar a página usando o W3 Validator , gera um erro: Bad value X-UA-Compatible for attribute http-equiv on element meta.- Isso não significa que não funcionará. Simplesmente não é um código válido.
L84
10

Apenas uma frase para dizer Instrua o Internet Explorer a usar seu mais recente mecanismo de renderização

<meta http-equiv="x-ua-compatible" content="ie=edge">
Bipon Biswas
fonte
7 
<meta http-equiv="X-UA-Compatible" content="IE=Edge">

Para que esta linha funcione conforme o esperado, verifique se:

  1. É o primeiro elemento logo após <head>
  2. Nenhum comentário condicional é usado antes da meta tag, por exemplo, no <html>elemento

Caso contrário, algumas versões do IE simplesmente o ignoram.

ATUALIZAR

Essas duas regras são simplificadas, mas são fáceis de lembrar e verificar. Apesar dos documentos do MSDN afirmando que você pode colocar o título e outras metatags antes deste, eu não recomendaria isso.

Como fazê-lo funcionar com comentários condicionais.

Artigo interessante sobre a ordem dos elementos na cabeça. (blogs.msdn.com, para IE)

REFERÊNCIA

Na documentação do MSDN :

O X-UA-Compatible[...] deve aparecer no cabeçalho da página (a seção HEAD) antes de todos os outros elementos, exceto o elemento de título e outros meta-elementos.

ToniTornado
fonte
5

se você usar seu site na mesma rede que o servidor IE, ele gosta de mudar para o modo de compabilidade, apesar do DOCTYPE.
A adição meta http-equiv="X-UA-Compatible" content="IE=Edge" desativa esse comportamento indesejado.

Łukasz Jakóbiec
fonte
Outra palavra para 'mesma rede que o servidor' é intranet ... então basicamente o IE10 é quebrado por padrão para todos os sites da intranet. Veja a captura de tela na resposta @AndrewNeitsch.
yzorg
3

Esta é literalmente uma consulta do Google , mas aqui vai:

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

Noções básicas sobre modos de documento legado

Use o seguinte valor para exibir a página da Web no modo de borda, que é o modo de mais alto padrão suportado pelo Internet Explorer, do Internet Explorer 6 ao IE11.

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

Nota que isso é funcionalmente equivalente ao uso do doctype HTML5. Ele coloca o Internet Explorer no modo de documento mais alto suportado. O Edge é mais útil para sites mantidos regularmente, testados rotineiramente quanto à interoperabilidade entre vários navegadores, incluindo o Internet Explorer.

Nota A partir do IE11, o modo de borda é considerado o modo de documento preferido. (Nas versões anteriores, era considerado experimental.) Para saber mais, consulte Os modos de documento estão obsoletos. A partir do Windows Internet Explorer 8, alguns desenvolvedores da Web usaram o meta-elemento do modo de borda para ocultar o botão Modo de exibição de compatibilidade na barra de endereços. A partir do IE11, isso não é mais necessário, pois o botão foi removido da barra de endereço. Como força todas as páginas a serem abertas no modo padrão, independentemente da versão do Internet Explorer, você pode usar o modo de borda para todas as páginas exibidas no Internet Explorer. Não faça isso, pois o cabeçalho Compatível com X-UA é suportado apenas a partir do Internet Explorer 8.

Dica Se você deseja que todas as versões suportadas do Internet Explorer abram suas páginas no modo de padrões, use a declaração de tipo de documento HTML5, conforme mostrado no exemplo anterior.

Também entre os resultados da pesquisa está:

Joe Mike
fonte
2

2.1.3.5 Metatag de compatibilidade com X-UA e cabeçalho de resposta HTTP

Essa funcionalidade não será implementada em nenhuma versão do Microsoft Edge.

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

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

Sim, eu sei que estou atrasado para a festa, mas só tive alguns problemas e discussões e, no final, meu chefe me mandou remover a X-UA-Compatibletag de todos os documentos em que estava trabalhando.

Se essas informações estiverem desatualizadas ou não forem mais relevantes, corrija-me.

Shawn Spencer
fonte