Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Layout da Página

Ao construir o Layout da página que está sendo apresentada no curso, identifiquei uma diferença grotesca quando visualizo a página no meu notebook 15" para o monitor que possuo de 23'' (vide imagens abaixo).

No monitor de 23'', as informações ficam distribuídas exatamente como desejo e orientado seguindo o curso, mas na tela do notebook ficam "desconfiguradas", é necessário eu visulizar em 70% para poder ter a mesma visualização. Fiquei me perguntando como front-end faria para saber se visualização da página vai estar adequada em diferentes monitores. É algum problema de configuração em meu notebook que devo alterar?

Tela no Notebook 15''

Monitor 23''

2 respostas
solução!

Oi Iuri, tudo bem?

Muito legal a sua dúvida. É comum encontrar diferenças na exibição de uma página da web em diferentes dispositivos, como notebooks e monitores maiores. Isso ocorre porque os tamanhos de tela variam e, às vezes, as configurações de zoom ou a densidade de pixels podem afetar a aparência da página. Além disso, os front-end developers precisam lidar com a responsividade, que é a adaptação da página a diferentes tamanhos de tela.

Para garantir que sua página seja exibida de forma adequada em uma variedade de dispositivos, você pode adotar algumas práticas de design responsivo:

  • Usar Unidades Relativas: Evite tamanhos fixos em pixels; use unidades relativas como porcentagens, ems ou rems para melhor adaptação.

  • Media Queries: Use media queries para aplicar estilos diferentes com base no tamanho da tela.

  • Imagens Responsivas: Utilize imagens responsivas que se ajustem ao tamanho da tela.

Recomendo que realize o curso HTML e CSS: trabalhando com responsividade e publicação de projetos onde você vai conseguir entender mais sobre isso e aplicar no seu projeto.

Espero ter conseguido ajudar, qualquer dúvida estou à disposição.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

Muito obrigado!! Perfeito explicação.