Tutorial Blog

Fluido, fixos e elásticos Web Design, explicou

25 de novembro de 2008 por Philip Beel »1 Comentário Post to Twitter Post a Yahoo Buzz Post to Digg Post to Reddit Post to StumbleUpon




Ao usar o CSS para o estilo de um site, existem três tipos de distribuição primária disponível para web designers. Este tutorial tem como armá-lo com a informação que você precisa saber para ajudar a tomar uma decisão mais informada ao escolher como conceber seus projetos web.

As Opções

Os três estilos de layout básico para determinar a largura de websites - líquidos, fixos e elásticos. Todos têm os seus próprios méritos. Há também desvantagens para estes padrões de projeto, por isso é importante saber qual a melhor situação em que usar cada tipo de layout.

Layout Fluid

Também referido como um layout líquido, a atração popular para esse estilo de layout é a plena utilização do espaço de ecrã para que possa obter uma grande quantidade de conteúdo na sua página web. O layout líquido permite que os designers não especificar uma largura de invólucro. Em vez disso o conteúdo do seu site é determinada pela largura da visualização do browser do usuário, o que significa que você não precisa se preocupar com o dimensionamento mínimo e máximo de informações. Sites que usam um design de layout fluido incluem a Amazônia e biblioteca.

O layout líquido pode causar problemas para os navegadores como o IE que não suporta as propriedades que você pode desejar usar para definir as larguras máximas de conteúdo. Isso aliado ao fato de que as páginas web com conteúdo de enchimento pode ser ruim a partir de uma perspectiva de usabilidade, muitas vezes afasta as pessoas, que adopta o formato do layout.

Layout Fixo

Como o nome sugere fixo layouts parar o navegador de ter a liberdade para formatar o texto, como entender, esta é uma das técnicas mais populares da web, com sites como o Facebook eo BBC aplicação do projeto. Isto significa basicamente que a largura do seu conteúdo é contido e permanece fixo, não importa o quê, isso é geralmente conseguido usando algo chamado um invólucro ou recipiente, que contém todo o conteúdo dentro dela. O projeto de largura fixa podem ser definidos para a esquerda, centro ou direita da página um, muito facilmente.

O bônus real de trabalhar com um projeto de largura fixa é que você pode definir imagens e design em torno da consideração de que a sua largura será sempre o mesmo. Este é um real positivo, se você quiser uma imagem da bandeira, por exemplo, que precisa ser 900px, você não terá problemas ao redimensionar, questões que você iria encontrar com um design fluido.

A desvantagem de um projeto fixo, porém, é o espaço que você é deixado com que seu design não preencher a página. Um projeto de largura fixa também pode forçar designers para priorizar. Conforme o site cresce e conteúdo concorre para a colocação de cima, ele ainda deve caber dentro de uma largura específica.

Layout elástico

O estilo de desenho final é conhecido como elástico. Muitas vezes confundida com layouts fluidos, layouts elásticos permitir um web site para proporcionalmente caber na tela é visualizada. Isto pode ser conseguido usando ems ou%. Quando um usuário se expande o tamanho do texto de seu navegador web o restante da página web vai ampliar também porque as medições são baseados em variáveis como oposição para definir os tamanhos. Hotmail desenvolveu recentemente seu site usar um projeto elástica. Se você olhar para o tamanho da fonte, você vai notar que eles são definidos em porcentagens para aproveitar ao máximo a instalação usuários.

Dos três estilos de design este é o menos popular, porque é o menos benéfico para a experiência dos usuários. Sua natureza variável pode tornar problemático para uma experiência do usuário. Combinado com a falta de suporte do browser em plataformas como o IE6, isso torna o projeto impopular com os designers que querem dirigir claramente dos problemas de incompatibilidade do navegador.

Roundup

Há pontos fortes e fracos de todos os padrões de design que mencionei. Ponderando os prós e os contras que você pode fazer uma decisão educada antes de embarcar em seu projeto web que vem. Você vai conhecer os problemas e as soluções para os problemas antes de encontrá-los.



Comentários

Uma resposta para "líquidos, fixos e elásticos Web Design, explicou"
  1. Carol - http://www.imageworksstudio.com says:

    É muito bom ter um enorme espaço disponível para o website em layout.Thanks fluido para a informação.

Tutorial Blog