Como estamos usando um mesmo arquivo css (style.css) para duas páginas, qual a melhor maneira de organizar as marcações neste arquivo? Por exemplo, no projeto do curso: devemos colocar o main antes do .produtos e as outras marcações referentes à página contato antes do footer? No vídeo foi feito no final do arquivo, mas entendo que aí ficará em desacordo com a ordem usada na página contato.html
Oi, Solange, tudo bem?
A sequência em que os estilos são adicionados, não precisam de uma sequência como no html, na hora do carregamento da página, os estilos são direcionados para cada tag, classe, id, etc. Mas por uma questão organizativa, você pode sequenciar, num exemplo de uma página construída dessa forma: começando pela body, header, main, como você observou.
Se ficou alguma dúvida é só falar!
Oi Laís, Agradeço a resposta.
Eu entendi que a sequência do CSS não importa, mas que é boa prática estruturar o arquivo .css na mesma ordem das marcações do .html.
A minha dúvida é se há alguma indicação de boa prática para quando o arquivo .css está sendo usado em mais de uma página e cada página tem elementos diferentes.
Eu pensei em organizar na sequência em que aparecem no site, ou seja, seguindo a ordem das páginas apresentadas no menu.
Só queria saber mesmo se há alguma orientação para este caso ou se fica a critério do desenvolvedor.
Oi, Solange!
Sim, essa forma como você pensou e estruturou é lógica e faz sentido, o importante é manter o padrão dentro de um projeto desenvolvido. Nesse curso, o foco não é focar sobre metodologia de organização do css, mas temos um curso que foca em como aplicar a metodologia BEM para organização de arquivos e classe em CSS: https://www.alura.com.br/curso-online-arquitetura-css
Para saber mais: https://www.alura.com.br/artigos/criando-componentes-css-com-padrao-bem
https://www.alura.com.br/artigos/css-funcional-e-outros-nomes