Resolução de Tela

800×600? 1024×768? Ou será q já dá pra fazer em 1280×960? E as resoluções wide-screen, como ficam?
Essas dúvidas costumam causar muita dor de cabeça a todos os envolvidos com o projeto de interface, especialmente os designers.

Por não causar problemas para os programadores, tanto web quanto desktop, a resolução de tela é um ponto muito pouco discutido nos projetos de desenvolvimento, tratado geralmente apenas como um mero detalhe. O problema é que este “detalhe” tem um papel muito mais importante do que os projetistas de software imaginam, afetando, principalmente, a parte mais interessada: o usuário final.

De modo geral, os usuários não sabem identificar este tipo de problema assim que se defrontam com sites com conteúdo “bagunçado”, ou barras de rolagem que os obrigam a rolar a tela horizontalmente para chegar ao final da linha e rolar no sentido contrário para voltar ao início da próxima linha. Nestes casos o problema é ainda mais grave, haja vista que o usuário, em seu ponto de vista, virá um site mal organizado, ou até mesmo mal feito, sem saber que se trata de um “simples” problema de resolução de tela.

Muitas pessoas têm a mentalidade de que a resolução da tela é problema do usuário, sendo que os desenvolvedores devem criar as telas do tamanho que acharem melhor e colocarem como resolução recomendada, passando o problema para o outro lado… Só que não podemos esquecer que quem está do outro lado geralmente não recebe bem a idéia de que para a aplicação que ele pretende comprar “rodar direito”, será necessário alterar a resolução da tela, possivelmente irá até precisar trocar o monitor, caso a “resolução recomendada” não seja suportada pelo atual.

Apesar de não ser raro encontrar problemas de resolução de tela em aplicações desktop, a grande maioria destes problemas ocorrem em ambientes web. Mas por que isso acontece? Por que não se pode adaptar a aplicação ao vídeo do usuário, como acontece com os jogos, onde há várias opções de resolução onde o usuário seleciona a mais adequada para ele?
No caso dos jogos, a solução é mais simples, uma vez que, proporcionalmente, todos os elementos são afetados da mesma forma, sendo que, ao alterar a resolução da tela para o jogo, todos os elementos irão mudar de tamanho na mesma proporção, fazendo com que não ocorram distorções. Neste caso pode-se fazer uma analogia com o caso das televisões, de forma que não importa se uma TV mede 14 ou 42 polegadas, em ambas a imagem será a mesma, com as mesmas proporções, diferindo apenas pelo tamanho.
O problema dos sites é mais complicado, pois geralmente não se deseja que os elementos aumentem de tamanho conforme a resolução da tela aumenta, ou seja, conforme aumenta o “espaço” na tela. Aqui podemos fazer uma analogia com uma revista impressa. Imaginem que o cliente de uma gráfica solicite que o tamanho da página da sua revista seja aumentado. O problema aqui é que não se pode apenas aumentar todos os elementos na mesma proporção que aumentou o tamanho da página. A fonte dos textos deverá permanecer do mesmo tamanho, talvez as imagens também! O ponto chave deste caso é que o conteúdo não irá mudar de tamanho, ao invés disso haverá espaço para mais conteúdo. Para resolver este problema a única saída é remodelar cada página da revista, obedecendo às novas especificações de tamanho da página. Efeito semelhante se obtém, por exemplo, ao alterar o tamanho da página de um arquivo de texto que já esteja pronto e bem formatado. Provavelmente todo o texto ficará bagunçado, parágrafos quebrados em duas páginas, figuras que caíram para a página seguinte, etc.

A saída mais comum para este tipo de problema é construir o site em uma resolução mínima, na qual todo o espaço da tela seja ocupado. Alterando-se para resoluções maiores não há problemas de visualização, pois os elementos não alteram de tamanho, apenas barras verticais são inseridas nos espaços “vazios” que sobram.

Site com resolução mínima de 1024x768 acessado por um monitor com resolução 1680x1050

De certa forma este problema foi agravado pela chegada dos monitores wide-screen, sendo que, nestes monitores, os espaços vazios na tela são ainda maiores, fazendo com que muitos usuários fiquem insatisfeitos por ter um monitor (mais caro) que tenha apenas um pedaço da tela utilizado. Este pensamento pode acabar forçando um aumento na resolução mínima na qual o site é construído. Porém, não é assim tão simples, pois, ao aumentar esta resolução mínima, os usuários que não puderem acompanhar este aumento serão prejudicados, provavelmente pelas desagradáveis barras de rolagem horizontais.

O ideal seria construir um site para cada possível resolução de tela, assim todos os usuários ficariam contentes e este tipo de problema não iria mais ocorrer. Obviamente esta solução é totalmente inviável, principalmente devido ao dinamismo que os sites têm atualmente, não haveria tempo nem recursos suficientes para tal.

Creio que a melhor saída para este tipo de problema seria aquela citada anteriormente, ou seja, fixar uma resolução mínima e adicionar as barras laterais para resoluções maiores. Também não é tão simples definir qual será esta resolução, uma vez que o público alvo do site ou aplicação deve ser bastante estudado, sendo que a resolução de tela média pode variar de acordo com o perfil de cada grupo de usuários. Vale lembrar que este estudo deve ser feito regularmente, uma vez que a evolução tecnológica também atinge os monitores, sendo que os usuários de forma geral tendem a adquirir monitores maiores e melhores (wide-screen), fazendo com que o perfil de certos grupos possa mudar com o passar do tempo.

Felipe Massardo
Consultoria: felipe_massardo@yahoo.com.br