Ajustar pgina web a resoluo do monitor

1 TAMANHO E RESOLUO DA PGINA DA WEB

A resoluo do monitor de um dispositivo digital indica o nmero de pontos (ou pixels) que compem a imagem que aparece na tela. Uma tela com 1024 x 768 mostra 1024 pontos em cada uma das 768 linhas do monitor, ou seja, 786.432 pontos. A qualidade da definio de uma imagem ou texto que aparece na tela depende da relao entre o nmero de pontos por polegada quadrada (ppi, pixels per inch) com que a tela est configurada, sua resoluo nativa e o tamanho fsico do monitor. Normalmente, quanto maior o monitor, maior a resoluo ou densidade dos pontos com que se pode configur-lo embora o iPad 3, com monitor de resoluo 264 PPI, quebre um pouco esta regra. De qualquer forma, quanto maior o nmero de pontos (bits), mais definidas aparecem as imagens. Do mesmo modo, quando um monitor grande configurado com baixa resoluo de pontos, pode mostrar imagens embaadas e indefinidas, pois precisa criar pontos falsos da imagem de menor tamanho. Em alguns casos, pode "estic-la", para ocupar toda a sua rea, ou mostrar a rea ocupada pela imagem com espaos laterais neutros at os limites laterais da tela.

2 VARIAES DE TAMANHO E RESOLUO

Os formatos dos dispositivos digitais esto ficando cada vez mais heterogneos, variando entre as grandes telas para uso de PCs desktop e as telas menores para uso em movimento. O espao de publicao de contedo de sites e plataformas online precisa considerar o aumento das diferenas entre largura mxima e mnima das telas de PCs, que variam entre 320 a 2560 pixels ou mais (quando os usurios usam mais de um monitor). O layout das interfaces web precisa tambm considerar a proporo entre a largura e da altura dos monitores, que apresenta grandes variaes. Esta vai desde 4:3, padro dos aparelhos de TV e PCs, comum nas larguras de 1024 a 1280dpi, at a proporo dos monitores de HDTV, wide screen (16:9, resoluo 1280x720 ou 16:10, resoluo 1280x800, chegando a 1680x1050 e 2560x 1600). Em PCs, telas com a largura de 1280dpi, por exemplo, podem ter proporo mais quadrada (como a 1280 x 1024, proporo 5:4) ou mais larga. Estas diferenas de resoluo e proporo aumentam ainda mais quando se considera as telas dos dispositivos mveis.

3 USABILIDADE (DISPOSITIVOS MVEIS)

Visitantes de web sites ou aplicativos por dispositivos mveis costumam acess-los no nibus, no metr, na fila do banco, na lanchonete do shopping, no aeroporto, e precisam de informaes e interfaces adequadas para atender necessidades imediatas.

Apesar da facilidade do acesso internet pelos smartphones, a experincia de uso das interfaces nestes dispositivos ainda pode melhorar. Pesquisa da Gomez, Inc. divulgada no final de 2009, ainda atual, mostra que a velocidade das conexes web foi o principal problema de acesso apontado. (3)

Outros motivos para a insatisfao dos usurios: Sites feitos para a web na tela pequena nem sempre apresentam design que facilite o o uso dos programas. O contedo pouco adaptado para o uso em movimento, sendo muitas vezes aproveitados diretamente de sites para desktop.

4 OBTER A MELHOR VISUALIZAO NO MONITOR

O Windows escolhe as melhores definies de visualizao, incluindo resoluo do ecr, taxa de atualizao e cores, com base no monitor. Estas definies diferem de um monitor LCD para um monitor CRT. Se pretender ajustar as definies de visualizao ou se estas definies forem alteradas e pretender restaurar as predefinies, utilize as seguintes recomendaes.

Os monitores LCD, tambm chamados monitores de ecr plano, substituram a grande maioria dos monitores CRT. Eles so muito mais leves e finos do que os volumosos monitores CRT, que contm pesados tubos de vidro. Os monitores LCD tambm so fornecidos numa gama mais vasta de formas e tamanhos, incluindo ecrs panormicos e ecrs de largura padro, com relaes largura-altura de 16:9 ou 16:10 para os modelos panormicos e 4:3 para os modelos de largura padro. Os portteis tambm utilizam ecrs planos.

5 CRT
Para um monitor CRT, importante alterar a resoluo da tela para a maior resoluo disponvel que fornea cores de 32 bits e uma taxa de atualizao de pelo menos 72 Hertz. Para mais informaes, consulte Alterar a resoluo da tela. Se a tela piscar ou for desconfortvel olhar para a tela, aumente a taxa de atualizao at que fique confortvel. Quanto maior a taxa de atualizao, menor a probabilidade de que haja cintilao visvel. (Como os monitores de LCD no criam cintilao, eles no precisam ser definidos com altas taxas de atualizao.

6 LCD
Se tiver um monitor LCD, verifique a resoluo do ecr. Isto ajuda a determinar a nitidez das imagens apresentadas no ecr. normalmente recomendado que um monitor LCD seja definido para a respectiva resoluo nativa a resoluo em que o monitor foi concebido para funcionar com base no respectivo tamanho. Para ver a resoluo nativa do seu monitor, verifique as definies de visualizao no Painel de Controlo.

7 RESOLUO NATIVA
A resoluo nativa de um projetor, comumente informada na embalagem do produto ou facilmente encontrada nas especificaes tcnicas do mesmo, se refere resoluo mxima da imagem que ser exibida na projeo. Isto, vale ressaltar, no diz respeito equivalncia em medidas mtricas, pois esta depende da distncia em que o projetor colocado e sua potncia em lmens para manter uma qualidade razovel da projeo.

Para exemplificarmos melhor todas estas explicaes, vamos ver o que acontece com uma mesma imagem em diferentes resolues. Neste primeiro exemplo, vamos ver como a imagem de uma TV, com 250 pixels de largura por 165 de altura se comporta em uma densidade de 300dpi e em uma densidade de 72dpi:

Resoluo com densidade de 300DPI

Resoluo com densidade de 72DPI

Apesar de uma diferena considervel, pela baixa resoluo, no podemos perceber grandes distores, apenas pequenas diferenas na qualidade e na pixelizao das imagens.

8 LAYOUT FLUIDO OU LQUIDO

A ideia de se fazer sites que se adaptem ao tamanho do monitor do usurio j existe. Esta tcnica conhecida como Layout Fluido ou Lquido. Quando o layout Fluido temos que planejar o que pode e o que no pode ter seu tamanho alterado, seno o resultado no ser satisfatrio, pois o que queremos um projeto usvel, acessvel e ainda sim, belo.

Pontos positivos: Maior acessibilidade. Os contedos adaptam-se melhor resoluo de ecr do utilizador; Os contedos ocupam toda a rea visvel do ecr, permitindo transmitir mais informao; Deixa de haver espao vazio volta do website;