Artigo da revista Espírito Livre de 05/09/2014

Ao navegarmos pela internet nos deparamos com diversos conteúdos como vídeos, imagens, scripts, entre outros elementos que tornam a internet mais dinâmica. Por trás de tudo isso há uma estrutura bastante complexa que pode acabar consumindo bastante banda principalmente em dispositivos móveis. Contudo, em breve as imagens que vemos sofrerão alterações com o objetivo de tornar a internet mais rápida,principalmente em samrphones.

Normalmente quando um site demora para carregar, há três possíveis culpados: a operadora de banda larga, a estrutura que você montou para receber a internet ou as imagens que demoram para carregar nos sites. As fotos são responsáveis por mais da metade do tráfego de dados que seu celular utiliza ao navegar na internet. Portanto, o tamanho dessa imagem e sua resolução são fatores importantes para se navegar bem pela web.

Em um aparelho celular não há necessidade de um site exibir uma imagem de alta resolução para o usuário, mas mesmo assim o navegador irá exibi-la a menos que você ative alguma ferramenta disponível para economizar dados. De acordo com o site, ArsTechina, os sites estão cada vez mais adotando o design responsivo, que se adapta a qualquer tamanho de tela, em vez de adotar uma url diferente, como m.site.com. por exemplo.

Este tipo de site, o responsivo, é interessante por se adaptar em diferentes telas, seja em computadores, smartphones ou tablets. No entanto, ele não resolve o problema da transferência desnecessária de uma imagem grande que atrapalha o carregamento de uma página. Mas isso pode mudar.

Mat Marquis e alguns desenvolvedores da Opera e Google criaram uma solução bastante interessante, um novo elemento HTML chamado “Picture”. Ele oferecerá diferentes tamanhos para uma única imagem dependendo do tamanho e resolução da tela em que o site será aberto.

Um desenvolvedor da Opera, Yoav Weiss, sugere um exemplo:

Exemplo HTML

Como pode analisar acima, a seção “scrset” lista diferentes arquivos com a mesma imagem, porém em diversos tamanhos. Já a seção “sizes” serve para analisar a resolução e tamanho da tela. Desta forma, um notebook carregaria a versão com 1.600 pixels de largura, enquanto um smartphone exibiria a versão menor de 200 pixels. Se o navegador não entender este novo elemento, ele carregará a imagem como fazia anteriormente, no padrão atual.

Este é um passo importante para agilizar o acesso à internet em aparelhos que não contam com um plano de dados rápido e com pouca franquia.

Recentemente, a Mozilla divulgou um projeto para comprimir e, consequentemente, diminuir o tamanho de imagens JPEG. O Facebook já estaria testando a tecnologia, no entanto ela parece não ser utilizada em ampla escala, pelo menos até agora.

Já esta nova tecnologia presente no código HTML de uma página na web já tem dois dos principais navegadores do mercado mundial, Google Chrome e Mozilla Firefox, como apoiadores. Ambas as empresas se comprometeram em utilizar este novo recurso em seus browsers até o fim deste ano. Com isso a internet está prestes a se tonar consideravelmente mais rápida.