Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

O que é: Layout fluido

Nota editorial: Ganhamos uma comissão de links de parceiros no WPBeginner. As comissões não afetam as opiniões ou avaliações de nossos editores. Saiba mais sobre Processo editorial.

No desenvolvimento de temas do WordPress, um layout fluido é uma abordagem de design de site que usa valores proporcionais como unidade de medida para blocos de conteúdo, imagens e outros itens. Isso permite que o site se adapte a diferentes tamanhos de tela e dispositivos.

Os layouts fluidos usam unidades flexíveis, como porcentagens ou ems, para definir a largura dos elementos. Isso permite que o conteúdo seja redimensionado e reorganizado para se ajustar à tela em que está sendo visualizado.

Isso é diferente dos layouts fixos, em que cada aspecto do tema tem uma largura fixa em pixels.

Glossary: Fluid Layout

Quais são os benefícios dos layouts fluidos?

Ao criar um site ou tema do WordPress, os designers e desenvolvedores precisam decidir se desejam criar um design de largura fixa ou fluida.

Os designs de largura fixa são mais fáceis de criar, mas têm várias falhas. Em particular, eles não proporcionam a melhor experiência para usuários com telas muito grandes ou muito pequenas.

Atualmente, muitos usuários têm telas grandes com resolução superior a 1024×768 pixels. Os sites com um layout fixo podem deixar muito espaço em branco em ambos os lados do conteúdo do tema.

Para usuários com telas menores ou que usam dispositivos móveis, um design fixo também pode exigir uma barra de rolagem horizontal.

Esses problemas podem ser corrigidos com o uso de um layout fluido.

Quais são os desafios dos layouts fluidos?

Embora o design fluido resolva muitos problemas relacionados a vários tamanhos de tela, ele cria alguns problemas próprios.

O designer tem menos controle sobre o que o usuário vê e o conteúdo, como imagens, pode exigir várias larguras para ser exibido em diferentes resoluções.

Se a tela do usuário for extremamente grande, as páginas da Web com pouco conteúdo e um layout fluido podem não ter a melhor aparência possível.

Layouts fluidos e design responsivo

Com o aumento do uso de smartphones e tablets, o desenvolvimento responsivo se tornou importante.

Isso não é diferente dos layouts fluidos, e é o processo de criação de um site ou tema com todos os dispositivos e tamanhos de tela em mente.

As técnicas de design fluido, juntamente com as consultas de mídia CSS, geralmente são usadas para criar um site ou tema que seja “responsivo”.

Esperamos que este artigo tenha ajudado você a saber mais sobre layouts fluidos no WordPress. Talvez você também queira ver nossa lista de Leitura adicional abaixo para obter artigos relacionados sobre dicas, truques e ideias úteis do WordPress.

Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.

Leitura adicional

O kit de ferramentas definitivo WordPress

Obtenha acesso GRATUITO ao nosso kit de ferramentas - uma coleção de produtos e recursos relacionados ao WordPress que todo profissional deve ter!