Design e layout - HTML - Desenvolvimento WEB UNIP

Resolução x Design e layout em projetos web

1

Resolução x design e layout
A resolução da tela determina o número de pixels que podem ser mostrados em cada dimensão, largura e altura
Ela tem um impacto no design e no layout da página.
Ter uma resolução maior significa que você terá mais pixels para apresentar as informações na tela, ou seja, mais espaço disponível. Isso faz com que as informações sejam apresentadas em um tamanho menor e com mais riqueza de detalhes. Observe como a exibição da página se modifica de acordo com a resolução empregada.

2

Layout: fixo, líquido/fluído ou elástico?

800 x 600
3

Layout: fixo, líquido/fluído ou elástico?

1024 x 768

4

Layout: fixo, líquido/fluído ou elástico?

5

Resolução
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úblicoalvo do site e a sua resolução de tela mais comum: geralmente 800×600 ou 1024×768.

6

Resolução
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’ (linha de dobra, na impressa) 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 scroll.

7

Resolução
É 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 conversão até 40% mais altas e melhores taxas de pageviews/visita.

8

Resolução
Resolução

Largura máx [sem scroll] Altura [visível]

Número de usuários