Você realmente projeta para 800×600?
Publicado em 20.07.2006 na categoria Design
Este artigo não se dedica a discutir se o melhor é realizar projetos web pensando em uma resolução de 800×600 pixels ou 1024×768 pixels e superiores. É sim uma discussão sobre se os supostos projetos feitos para 800×600 estão realmente sendo pensados para esta resolução, baseada numa premissa simples: projetar para 800×600 não é somente evitar a barra de rolagem horizontal.
Navegando pela rede, é possível encontrar dezenas de sites cujas larguras são menores que 780 pixels (geralmente 777 de largura). A pergunta é: será que é preciso somente isso para considerar que o projeto foi feito para 800×600? Digo isso porque, em vários desses mesmos sites, vêem-se topos enormes, fontes grandes e pouca margem nas laterais.
Tomemos como exemplo o site da agência americana Styromedia. Vendo em 1024×768 ou mais, fica tudo ótimo. O topo não ocupa o espaço inteiro da tela, o texto é agradável de ler e sobra muito espaço nas laterais. O problema é que quem usa 800×600 - público para o qual o site foi supostamente projetado - tem uma visão bem diferente. O topo pega quase a tela inteira. As fontes ficam demasiadamente grandes e as margens laterais quase inexistem.
Se pensarmos em design centrado no usuário, esse é um dos problemas mais fáceis de serem resolvidos. Se em muitos casos é difícil o desenvolvedor se colocar no lugar do usuário, neste basta alterar a resolução para 800×600 (se for em um monitor de 15 polegadas, melhor) e navegar para ver se realmente o design está adequado e se não se tem um site 1024×768 disfarçado de 800×600.
Leia também
- Projetar layout líquido é justiça com o usuário (Artigo no Fator W)
- Resolução de 1.024 x 768 pixels é a mais popular, diz estudo (Matéria da Folha Online)
- W3Counter Global Web Stats - July 19, 2006 (Estatísticas globais mostrando que 1024×768 é a resolução mais usada. Não fala sobre área do browser)
Eu projeto para 800 x 600 ainda… pq a maioria dos meus clientes ainda usam essa resolução… e para evitar a mudança tão grande para um site… ao mudar a resolução… eu cofiguro blz….
Vai depender muito do projeto.
Mas eu projeto ainda para 800×600 ou com layout líquido. É claro que nem sempre se pode aplicar layouts líquidos por aí, vai depender muito da possibilidade de cada caso.
Outra maneira, ainda, é o uso de 800×600 com algum JavaScript que verifique se a resolução é maior, e acrescentar mais conteúdo ao site.
Acho que o Joares e o Ciro não entenderam bem o objetivo do artigo, ainda fica naquela de 800×600 vs 1024×768, depende disso e daquilo.
Já viu aqueles sites que têm topos tão grande que colocam um link do tipo “skip to content” chamando o usuário de 800×600 de cego? (alguns não deixam de ser) :)
Pois é, eu sempre notei isso. Antigamente o site da DialHost era assim, e são incontáveis os sites que exageram no tamanho do topo.
Muito bem notado. :).
Walmar quando eu li o titulo do post já percebi que ia tocar no quesito altura hehehehehe… Isso acontece bastante =D
O topo não me encomoda tanto… mais as letras gigantes me encomoda bastante… mais prefiro um topo pequeno também…
1.
Mesmo considerando os dados do estudo da OneStat, que diz 1024×768 ser a mais popular, vamos imaginar o cenário:
E se o usuário estiver usando 1280×960 mas a janela não maximizada?
Fazer javascript para preencher os espaços de acordo com o innerHeight, innerWidth?
Generalizando, embora a maioria de usuários de PC use tudo maximizado e usuários de Mac usem janelas soltas, cada um gosta da janela do jeito que é melhor.
2.
O problema é que o layout liquido é assim apenas para largura. Não há liquidez na altura (coisa bem difícil de ser prevista). O ideal é que houvesse alguma proporcionalidade entre largura/altura, na variação do layout.
Talvez o caso de prever, em layout e em HTML um elemento cujo background-image do topo (geralmente apenas decorativo) seja escalonável, ou seja, com 100% de janela ele aparece inteiro, com 75% um pouco da parte inferior some - mas a leitura e compreensão da imagem permanece, e assim por diante.
Seria uma boa idéia?
Ou então a estratégia que me é favorita: KISS. Keep it simple, stupid.
Vale lembrar que estes números são globais. Aqui no Brasil a realidade ainda é diferente.
A resolução de 1.024 x 768px está bastante difundida por aqui, é verdade, mas acredito estar longe dessa percentagem toda. Pior!!! 800 x 600px com apenas 11%??? :S 1.280 x 1.024px aqui no Brasil é raridade ainda, nunca estaria na frente de 800 x 600px.
@Rodrigo Muniz: O recurso de “Skip to content” está longe de apenas subjulgar a capacidade de visão do usuário. Pense em Acessibilidade e sobretudo em soluções para dispositivos móveis.
Quanto ao artigo, não entendi a abordagem. Até porque não é o fato de se usar 777px de largura para um container que faz de um site diretamente projetado para 800 x 600px…. Já vi sites com apenas 500px de largura… Acho q nada tem a ver… Depende muito da característica que o criador quer dar ao site.
[]’s
Ramon, realmente acho que você não entendeu a abordagem. Não estamos discutindo se é melhor 800×600 ou 1024×768, nem qual das resoluções é a mais usada no Brasil.
O tema do artigo é: projetar para 800×600 vai muito além de somente evitar a barra de rolagem horizontal.
Sobre o estudo de resolução mais popular, não acho que devemos levar muito em conta, principalmente em regiões fora dos grandes centros. Cerca de alguns dias atrás, estive em uma agência de publicidades e em uma emissora de rádio, onde além de ter encontrado o jurássico IE 5.0, usavam resolução de 640×480!
E foi neste mesmo dia que percebi justamente o tema a que este artigo refere, que eu havia desenvolvido o meu site pensando em 800×600, mas obtendo resultados satisfatórios somente em 1024, principalmente em relação ao topo.
Já tenho um protótipo de redesenho, e teu artigo me fez levar bem a sério esta cuidado.
Vlw T+
uma das coisas chatas de fazer sites para uma resolução eh o tamanho da fonte… na minha opinião, tinha q ter algo em css que pegasse uma percentagem a partir da resolução do usuário, com isso, naum teria problema de setar um tamanho legal pra 1280×1024 e em 800×600 ficar gigante ou ao contrário, tamanho bom pra 800×600 e minúsculo para 1280×1024.
essa abordagem da altura do topo também é legal… em 800×600, a altura da área útil do browser geralmente chega no máximo a 450px… se um cara coloca 225pc d altura no topo, ferrou, jah comeu metade da área…
o problema eh q pessoal, geralmente, faz sites para 800×600 mas naum vêem nessa resolução… acontece… ;)
akele abraço walmar…
Pessoal,
Já eu penso que essa questão de resolução, área visível do usuário, 800×600 vs 1024×768, etc. é tudo bobagem.
Onde está determinado que os usuários querem (ou precisam) ver todo o conteúdo do site na tela de uma vez só, sem usar a barra de rolagem?
Tudo isso não significa necessariamente maior usabilidade. Em todos os casos é o desenvolvedor quem decide pelo usuário. Ele impõe qual a melhor forma do usuário ver o conteúdo do site. E acho que isso não é muito interessante pra todos. Às vezes o que é bom para uns não é bom para outros.
Vejam o exemplo da Styromedia, mencionada pelo autor deste post. O tamanho das fontes nem precisaria ser alterado se fosse possível reduzí-las com comandos nativos dos navegadores mais modernos (Ctrl - no FF, por exemplo). Isto acontece com o site do UOL por exemplo, na nova versão, onde o cuidado com a usabilidade foi além desse papo de “resolução”.
Dar ao usuário a possibilidade de escolher o melhor formato para as suas “reais necessidades” (entre aspas porque estas jamais serão detectadas através de scripts ou cálculos matemáticos) é o que, de fato, deveria ser a preocupação básica dos desenvolvedores.
PS: Usar um monitor de 15″ adotando resolução de 800×600 para testar o site, acho que não é uma solução completa. É apenas a solução para usuários com esta configuração.
Recentemente o Yahoo! mudou o seu layout mas drasticamente, mas manteve flexibilidade nas cores, resolução e navegabilidade. O Google também nem se fala. É tão acessível que já é líqüido de nascença.
É isso aí.
Eu projeto pensando no 800×600 pois essa resolução ainda é uma realidade no Brasil. Nem todo mundo usa 1024 e poucos (em geral desenvolvedores e designers) trabalham com algo superior a 1152.
O que você falou sobre as fontes é verdade, o problema eventualmente é explicar para o cliente que se eu usar uma fonte um pouo maior no topo dele aquele texto vai ficar enorme em uma tela de 800×600… E infelizmente muita gente ainda usa este padrão de resolução, então para mantermos uma visualização mais agradável é melhor mantermos as coisas um pouco menores…
Além do tamanho das fontes temos que observar também o tamanho das imagens, ou as coisas ficarão enormes e muito feias…
Como foi mencionado, nada substitui uma visualização em 800×600. Trocar a resolução do nosso monitor é rapido e no final do projeto compensa ver tudo direitinho.
Aqui eu uso 1280×1024 e sempre faço testes em 1024×768 e 800×600, além de testar em vários navegadores no Windows e uns 2 no Linux.
Abraços!