modern.IE – Um novo conjunto de ferramentas para ajudar a testar a compatibilidade de sites

Ontem lançamos o modern.IE, um novo conjunto de ferramentas e recursos para ajudar os desenvolvedores a testar seus sites para os mais de 50% de usuários que executam várias versões do Internet Explorer. O modern.IE inclui um assistente que examina a existência de problemas de interoperabilidade na URL de uma página da Web e sugere algumas ideias de como solucionar esses problemas para melhorar a experiência do usuário em navegadores modernos e antigos. O site também oferece três meses de testes gratuitos em vários navegadores, por meio de uma parceria com o BrowserStack. O modern.IE oferece novos suplementos do Chrome/Firefox e imagens de máquina virtual offline para ajudar os desenvolvedores a testar seu site independentemente do navegador ou plataforma que prefiram usar. O site modern.IE que será atualizado regularmente é outro passo à frente para ajudar os desenvolvedores a atingir a meta de interoperabilidade por meio da mesma marcação. Com esses esforços, desejamos que os desenvolvedores possam usar mais tempo com inovações na Web e menos tempo realizando testes.

Exame de problemas de codificação comuns (BETA)

Vamos começar pelo assistente. A nossa meta é ajudar os desenvolvedores a perder menos tempo com os testes do IE e ajudar a comunidade a caminhar para o uso da mesma marcação em navegadores e plataformas. A versão BETA da ferramenta detecta 10 problemas comuns na codificação de sites com os quais sabíamos que poderíamos ajudar. Eles se dividem em três grupos principais: problemas causados pelo suporte a versões modernas e mais antigas do IE, problemas de suporte a várias plataformas e navegadores, e algumas coisas que os desenvolvedores podem começar a considerar para oferecer a melhor experiência no Windows 8.

O assistente, que é baseado em um verificador que usamos na Microsoft há algum tempo, é uma versão BETA e planejamos melhorá-lo constantemente nos próximos meses, com base nos comentários da comunidade. Por exemplo, o modern.IE agora realiza uma verificação estática do código de sites. Embora traga inúmeros benefícios de desempenho, isso pode produzir resultados incompletos se um desenvolvedor estiver usando código condicional ou detecção de navegador. Ideias sobre como podemos facilitar o seu site no IE são bem-vindas.

Grupo 1: Corrija problemas comuns devido ao suporte a versões antigas e modernas do IE:

• Problemas de compatibilidade comuns – Com cada versão do IE, testamos sites influentes e com maior tráfego quanto a problemas de compatibilidade que impedem a renderização do site nas últimas versões do IE. Nós normalmente entramos em contato com esses desenvolvedores e trabalhamos com eles para ajudar a corrigir os problemas de compatibilidade gratuitamente. Com esse assistente, os desenvolvedores agora podem acessar os dados de compatibilidade mais facilmente, entrar em contato conosco quando precisam de ajuda e reduzir o tempo necessário para pesquisar documentos no MSDN para obter recomendações de correção.
• Modo de compatibilidade – A Lista Modo de Exibição de Compatibilidade indica quando o código criado para versões mais antigas do IE está causando problemas de compatibilidade com versões modernas do IE (como o IE9 e o IE10). Os desenvolvedores nem sempre sabem onde, quando e por que seu site é listado. Esse teste elimina o processo de adivinhação confirmando se um site está na lista; se estiver, ele sugere o uso do Compat Inspector – uma ferramenta em JS automatizada para a detecção e a remoção da marcação antiga, para que o site fique compatível com versões modernas do IE.
• Frameworks e bibliotecas – Como os navegadores, as versões mais antigas desses "blocos de construção" da Web podem causar problemas de compatibilidade. Esse teste procura jQuery, jQuery UI, jQuery Form, SWFObject, MooTools, Modernizr e Prototype.js, que causam a maioria dos problemas comuns de compatibilidade da biblioteca que observamos nos principais sites. Muitos frameworks e bibliotecas mudaram mais recentemente para um modelo de atualização automática que é semelhante ao que os navegadores modernos, incluindo o Internet Explorer, agora usam.
• Modo de documento dos padrões da Web – Esse teste pesquisa código de marcação DocType que avisa ao navegador para esperar padrões da Web modernos como o HTML5 e o CSS3. Os modos de documento mais antigos forçam todas as versões do IE a renderizar como o IE8, o que pode impactar o desempenho do site e dificultar a gravação de código que funcione em todos os navegadores modernos.

Grupo 2: Ajude o seu site a funcionar bem em vários navegadores e dispositivos:

• CSS-prefixes – Esse teste detecta quando o código de CSS deve testar os prefixos específicos do fornecedor (-moz, -ms, -o e –webkit) que poderiam aperfeiçoar a compatibilidade do código. Em todos os navegadores. Há práticas recomendadas específicas que os desenvolvedores podem seguir para evitar problemas de prefixação, especialmente em plataformas móveis.
• Plug-ins para navegador – Com o IE10, esboçamos a nossa visão de uma Web livre de plug-ins. Entretanto, também reconhecemos que se trata de uma prática emergente, e os desenvolvedores devem oferecer sua melhor experiência ao usuário. Esse teste analisa se um site requer plug-ins que possam não estar disponíveis em dispositivos móveis (como no Surface ou em um iPad). Se for detectado um plug-in, a ferramenta sugerirá como aprender mais sobre a criação de sites livres de plug-in. Se o site depender do Adobe Flash, a ferramenta explicará como adicionar o seu site à lista Flash CV
• Design da Web com grande capacidade de resposta – Uma prática recomendada recente, esse teste detecta se um site está usando consultas de mídia, uma tecnologia que é normalmente usada para detectar navegação em dispositivos de tela grande e pequena e que altera a experiência no site de forma "responsiva" para que ele seja exibido da melhor forma na sua tela. Há muitas maneiras de implementar sites com grande capacidade de resposta, portanto, esse teste foi criado principalmente para divulgar o que é possível na Web moderna.
• Detecção de navegador – O assistente também detecta padrões de codificação (como o navigator.useragent ou o $.browser) que podem detectar o navegador. Nessa versão da ferramenta, adotamos uma abordagem conservadora de detecção filtrando os resultados de scripts que referenciam um domínio diferente da página da Web (como um software analítico de terceiros). Sugerimos quando usar a detecção de recurso em vez da detecção do navegador no suporte a muitos navegadores e plataformas. Embora não seja exigido para todos os sites, a detecção de recurso pode facilitar o suporte a um site sem a necessidade de testar manualmente de novo cada versão de navegador.

Grupo 3: Considere a compilação com alguns novos recursos no Windows 8:

• Navegação por toque – Esse teste sugere definir o comportamento padrão quando um usuário visitar o seu site em um navegador habilitado para o toque. Ele informa ao navegador o que esperar quando um usuário usa gestos de toque comuns como a pinçagem, o zoom ou o toque duplo.
• Bloco do site na tela inicial – O assistente sugere uma nova maneira de os desenvolvedores inserirem o logotipo do seu site em um bloco na tela inicial do Windows 8. Os usuários podem “fixar” seu site favorito e colocá-lo ao lado de seus aplicativos da Windows Store.

As opções virtuais para testar o Internet Explorer

Embora versões modernas do Internet Explorer sejam atualizadas automaticamente, a realidade é que muitos usuários ainda usam uma versão antiga do IE, como o IE8, IE7 e o IE6. Há várias opções para configurar uma matriz de teste, incluindo a manutenção de PCs com versões antigas do Windows e IE ou o gerenciamento de um conjunto de imagens de virtualização como as que disponibilizamos no Centro de Download da Microsoft. No modern.IE, oferecemos duas opções para ajudar a facilitar os testes com navegadores, mesmo que você esteja desenvolvendo em outro navegador ou outra plataforma de sistema operacional.

Virtualização hospedada

Os serviços de virtualização hospedados ou baseados em nuvem facilitam o gerenciamento de PCs antigos ou um conjunto de imagens de teste. Com soluções como o BrowserStack, você pode realizar testes visuais do seu site diretamente do seu navegador. Se o seu site de teste não puder ser acessado publicamente via endereço IP ou pesquisa de DNS, você pode usufruir dos testes do servidor local do BrowserStack usando encapsulamento seguro baseado em Java. Nós também disponibilizamos complementos para o Chrome e o Firefox para facilitar os testes no IE de dentro desses navegadores.

Como exemplo, veja como o Blog do IE é exibido no IE7 usando o Windows XP:

A oferta de três meses disponível por meio do modern.IE inclui os serviços baseados no Windows do BrowserStack, incluindo a maioria das versões do IE, Firefox, Safari, Chrome e Opera. A oferta é boa para um período de três meses se você se inscrever no serviço no modern.IE. Você pode escolher quando ativar o seu período de três meses a qualquer momento no ano que vem.

Virtualização local

Nós também atualizamos as nossas imagens da máquina virtual de testes para incluir o IE e as versões do sistema operacional do Windows do IE6 até o IE10. Oferecemos imagens para estas plataformas de virtualização:

• Hyper-V no Windows Server 2008 R2
• Hyper-V no Windows Server 2012
• Virtual PC
• Parallels para o Windows e o Mac
• VirtualBox para o Windows, Mac e Linux
• VMWare Fusion para Mac
• VMWare Player para Windows

Essas são apenas as primeiras de muitas atualizações que ofereceremos no modern.IE. Estamos ansiosos para receber os seus comentários sobre o recurso até agora. Fale do que você gostou e o que ainda está faltando!

— Sandeep Singhal, gerente de programas de grupo, Internet Explorer