Migração e Compatibilidade de aplicações para IE9 e IE10

Migração e Compatibilidade
de aplicações para IE9 e
IE10
WCL304
Alex Kondera
MVP Windows Internet Explorer
Company
Agenda
O Internet Explorer e Padrões Web
Posicionamento atual do IE
O que causa problema?
O que mudou e boas práticas
Mecanismo de Compatibilidade do IE9
Como o IE9 garante a compatibilidade
Ferramentas
Além do bloco de notas...
Compatibilidade além do IE8
Perspectiva de compatibilidade futura
Mas e o IE6?
IE e Padrões Web
IE e Padrões Web
Antes do IE9
Ajustar as páginas para diferentes navegadores
1. Identificar o
navegador
2. Atender à
página correta
Sou o IE6
Página
Construída
para o IE6
6
Sou o Firefox /
Safari / Chrome
Página
outros
brosers
Sou o IE7
Página
Construída
para o IE7
7
Página
Construída
para os
padrões
IE e Padrões Web
Depois do IE9
Suporte
HTML 5
CSS 3
JavaScript
APIs
Página Construída para os padrões
9
Sou o IE8
Sou o Firefox
Sou o Chrome
Sou o Safari
A compatibilidade e os sites:
Como é hoje:
Os desenvolvedores ajustam suas
páginas para diferentes navegadores
1. Identificar o
navegador
2. Atender à página
correta
Sou o IE6
Página
Construída
para o IE6
6
Sou o Firefox /
Safari / Chrome
Página
Construída
para o IE6
Sou o IE7
Página
Construída
para o IE7
7
Página
Construída
para os
padrões
A compatibilidade e os sites:
A tendência:
Padrão permite que uma única página funcione
em todos os navegadores que estejam de
acordo.
Sou o Firefox
Página Construída para os padrões
Sou o IE8
Sou o Safari
Sou o Chrome
9
Conteúdos criados para versões anteriores do
Internet Explorer (6, 7) podem ser incompatíveis
com o modo padrão do Internet Explorer 8 – mas o
modo de compatibilidade ajuda a resolver o
problema.
Compatibilizando uma
página
Name
Title
Group
Mecanismo de Compatibilidade
do IE9
Enfoque na compatibilidade
O enfoque na compatibilidade da Microsoft equilibra o desejo de promover
a adoção de padrões da web com a oferta da melhor experiência de usuário
com os sites atuais
Melhor Experiência de Usuário
Necessário um Maior Esforço do Site
Código para os
Padrões do IE9
Implantação da
X-UA- Compatible Tag
Boa Experiência de Usuário
Necessário um Menor Esforço do Site
Site na Lista
Compatibilidade
OIE 9 atende aos padrões mais amplos do W3C
Botão de
Compatibilidade
Mecanismo de compatibilidade
Para o usuário:
Mecanismo de compatibilidade
Tag META:
<meta http-equiv="X-UA-Compatible" content="IE=7" />
Nome
Valor
Quirks
IE=5
IE7 Standards
IE=7
IE7 Standards
IE=EmulateIE7
IE8 Standards
IE=8
IE8 Standards
IE=EmulateIE8
Assume o mais atual
IE=edge
Mecanismo de compatibilidade
Como o Document Mode é definido
Document Mode
Doctype
Tag Meta
DocumentMode
Nenhum
Nenhum
IE5
Doctype Antigo
Nenhum
IE5
Doctype
Recente/Desconhecido
Nenhum
IE8
Qualquer Doctype
IE=5
IE5
Qualquer Doctype
IE=7
IE7
Qualquer Doctype
IE=EmulateIE7
Depende do Doctype
Qualquer Doctype
IE=8
IE8
Qualquer Doctype
IE=EmulateIE8
IE8
Qualquer Doctype
IE=Edge
IE8
<script type="text/javascript">
// Qual Engine meu documento usa?
document.write("Meu documento usa o Engine do IE" + document.documentMode);
</script>
Ferramentas
Para teste, desenvolvimento e compatibilidade
Internet Explorer Developer Tools
Desenvolvimento
Teste
Compatibilidade
IE Compatibility and Test Tool
Parte do ACT (Application Compatiblity Toolkit)
Compatibilidade
Expression Web Super Preview for IE
Teste e Compatibilidade
IE Developer Tools e
Expression Web 4 Super
Preview
Name
Title
Group
Compatibilidade além do IE9
IE 10, IE 11....
Suporte aos padrões web
Como migrar para IE9 é o melhor caminho
Suporte total ao mecanismo de
compatibilidade
Compatibilidade com IE 10
Name
Title
Group
PowerPoint Guidelines
Font, size, and color for text have been
formatted for you in the Slide Master
This template uses Arial a standard font
included in Office 2007, Office 2010,
Windows Vista and Windows 7
Use the color palette shown below
Chart Example
6
5
Series 4
4
Series 3
3
Series 2
Series 1
2
1
0
Category 1
Category 2
Category 3
Category 4
Demo Title
Name
Title
Group
Video Title
Partner Title
Name
Title
Company
Customer Title
Name
Title
Company
Announcement Title
Title
Conteúdo Relacionado
Breakout Sessions (session codes and titles)
Interactive Sessions (session codes and titles)
Hands-on Labs (session codes and titles)
Product Demo Stations (demo station title and location)
Related Certification Exam
Find Me Later At…
Conteúdo Relacionado
http://msdn.microsoft.com/en-us/ie/cc405106
http://technet.microsoft.com/pt-br/library/gg699432.aspx
http://ie.microsoft.com/testdrive/
http://www.internetexplorer9.com.br/
Related Certification Exam
Find Me Later At…
Palestras Relacionadas
Resource 1
Resource 2
Resource 3
Resource 4
Get the free mobile app for your phone
http:/ / gettag.mobi
http://technet.microsoft.com/pt-br
Get the free mobile app for your phone
http:/ / gettag.mobi
http://msdn.microsoft.com/pt-br
Não esqueça de
preencher sua avaliação
online
www.teched.com.br/avaliacao
Get the free mobile app for your phone
http:/ / gettag.mobi
© 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market
conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT
MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.