Uma dúvida que muitas vezes aparece na hora em que inicia-se um novo projeto é qual a melhor largura usar para que o site não tenha aquela indesejável rolagem horizontal. Esta pergunta é claro tem ligação direta com o público-alvo do site e a sua resolução de tela mais comum: geralmente 800×600 ou 1024×768.
Outra questão à respeito de rolagem que não aparece com tanta frequência, mas que pode ser tão relevante quanto a largura do layout, é a sua ‘altura’, ou mais precisamente o posicionamento de elementos importantes acima da área de ‘corte’ da tela do browser, aqueles que ficarão visíveis logo no início da página sem que seja necessário que o usuário ‘role’ o conteúdo. É essencial ter em mente que esta área é a responsável por causar a primeira impressão no usuário com relação ao site, quando trata-se ainda da primeira visita desse usuário a importância do que está ali é ainda maior. É comprovado que conteúdos otimizados visando esse fato tem taxas de convesão até 40% mais altas e melhores taxas de pageviews/visita.
Então segue aqui uma tabela que eu costumo usar na hora de decidir estes dois fatores, largura e altura:
| Resolução | Largura máx [sem scroll] | Altura [visível] | Número de usuários atendidos |
|---|---|---|---|
| 800×600 | 760px | 420px | 86% |
| 1024×768 (recomendado) | 960px | 550px | +79% |
| 1024×768 (máximo) | 1002px | 600px | 79% |
| 1280×1024 | 1210px | 855px | 31% |
Alguns bons links onde procurar mais informações sobre o assunto:
Jakob Nielsen – Screen Resolution and Page Layout
Screen Resolutions and Better User Experience – Smashing Magazine
Methodologie Browser Size Test
