Site funcionando em todas as resoluções

Dia desses recebi um email do nosso querido leitor Raenner, de Itabira – MG. No email ele pergunta:

Bruno, queria saber como fazer que um site funcione em
todas as resoluções. usando Dreamweaver. Se não der para colocar no
Avante, pelo menos dê uma dica, irá ser muito interessante um post no
Avante sobre este assunto.

Ok, Raenner, então vamos lá. Existe muito, mas muitos textos, artigos e dicas referentes a este assunto na Internet. O que vou fazer aqui é comentar um deles. Primeiro leia o texto  publicado no Fator W, Projetar layout líquido é justiça com o usuário, de Leonardo Procópio. Nesse artigo, Leonardo nos mostra as vantagens de utilizar um layout líquido.  Layout líquido ou fluído  é nada mais do que um site diagramado com valores de largura em porcentagem. Um exemplo, sem frescura, é quando você coloca tudo dentro de divs com larguras em porcentagem. Capiche?

Pois então, no texto Leonardo cita também as desvantagens do layout líquido.

A desvantagem do layout líquido é que ele é bem mais difícil de projetar que o fixo. O desenvolvedor tem que observar diferentes resoluções, não pode usar posicionamento absoluto para os objetos e uma série de outros fatores.

É, em algumas resoluções o site pode ficar feio, o texto muito solto e comprido e todo o site ficar com aspecto de “linguiça”. Por isso que até hoje o layout líquido não pegou. Talvez uma prova disso esteja no próprio layout do Fator W. Veja o que Leonardo disse em 2005:

Aqui no fator W, uso layout líquido. A coluna de informações varia de acordo com a área disponível na tela. Isso permite que tanto quem usa 800×600, 1024×768 ou 1152×864 vejam o site usando todo o espaço disponível na tela.

É, mas se você notar, ao entrar no Fator W, o site não é mais líquido. Quem entra no site utilizando resolução 800 x 600 tem que apelar para a barra de rolagem horizontal. Acho que até o Leonardo cansou do layout líquido por conta da dificuldade de trabalhar com esse tipo de construção. O texto foi escrito em 2005, portanto, de lá pra cá o layout do Fator W deve ter mudado.

Bem, ainda prefiro o layout fixo, prevendo uma resolução mínima. Como sei por estatística que mais de 90% dos meus visitantes usam resoluções acima de 1024 x 768, trabalho com essa resolução mínima, criando o layout baseando-se nessa resolução.  Porém, daqui a um tempo essa minha preferência pode ser mudada. Há 10 anos criava sites baseados em resoluções 640 x 480. O que precisamos então é ficar antenados nas mudanças.

Para o alto e Avante!

Por Bruno Ávila » DreamWeaver, Usabilidade, Webdesign

4 comentarios on “Site funcionando em todas as resoluções”

  • Jonathan

    Muito bom esse artigo.
    Não vou m meter a besta de fazer um layout líquido… rsrsrs

    Abraços!
    fuix…

    16-07-08 » 12:06 am »

  • Wellison

    Brunao, me diga se eu estiver errado, mas Layout liquido mesmo so em Flash né? Pq fazendo o site todo em flash tudo diminuiu ou aumenta sem desorganizar nada né!? O ruim disso é justamente fazer tudo em Flash, pra atualizar nao é tao pratico. Abracao.

    16-07-08 » 4:26 pm »

  • Guilherme

    Realmente , um fato a se pensar , eu já até utilizei alguns scripts de javascript que de adequam com a resolução de cada browser visitante , assim vendo suas configurações de resolução e o layout ajustando-se de acordo com o que ele possui no micro , mais , não aconselharia.

    muito bom Brunão :D

    22-07-08 » 12:14 am »

  • valter donizeti melo

    Bruno:
    Em resumo, como faço para que um site com css permaneça fixo, examente com os mesmos 950px em todos resoluções.
    Ah.. o site tem imagens.
    Quantdo tiver tempo, dê um olhadinha.

    http://www.feriaseviagens.com.br abra a página de monte verde e
    dê uma olhada no código fonte.

    Por favo me dê essa força.
    Valter

    06-12-09 » 5:20 pm »

Comente!