Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Boas práticas e carregamento do CSS

Olá,

Comecei a desenvolver um site responsivo e uma dúvida que fiquei é qual a melhor maneira de estruturar o código? Existe uma boa prática para isso?

Pelo que pude perceber é que quando temos uma abordagem mobile-first, conforme o tamanho da tela cresce existe uma tendência de fazermos mais regras no CSS (principalmente por termos mais espaço e possibilidades e organizar o conteúdo). Isso faz com que as regras para um elemento fiquem espalhadas pelo código o que dificulta a sua leitura posterior

Outra dúvida é: ao carregar uma página no celular o css para telas maiores é ignorado? (considerando que fiz pensando em mobile-first)

1 resposta
solução!

Oi Bernardo,

Há varias formas de agrupar seu codigo claro. O ideal é ver qual deixa as coisas mais organizadas pra vc e mais faceis de vc se encontrar depois.

Minha preferencia pessoal é quebrar em componentes pequenos da pagina (tipo header, menu, formulario etc). Aí coloco num .css tudo relacionado a ele, tanto estilo base qto as media queries daquele componente.

É o que seguimos aqui no Alura tbm. Se vc olhar o codigo fonte aqui vai ver um monte de arquivos css bem pequenos separados por componente.


Quanto a sua duvida final: sim, as media queries são ignoradas se nao bater o tamanho da tela. Entao o css de telas maiores é pulado pelos celulares.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software