Normalize x Reset

Olá Diego, tudo bem?

Os navegadores fornecem a página HTML um conjunto de estilos que vem como padrão, mas essas opções de estilo nem sempre são consistentes em todos os navegadores, o que interfere diretamente no nosso layout.

Para solucionar essa questão, existem duas abordagens que são usadas, uma terá como função limpar os estilos padrão (reset) e a outra normalizar os estilos padrão (normalize).

Sei que ambas a primeira vista parecem que são a mesma coisa, mas elas atuam de uma maneira sutilmente diferente. Explicarei melhor a seguir!

Reset CSS

Essa proposta traz como intuito de zerar todas as configurações padrão do navegador, ou seja, é um método voltado para eliminar todos os estilos padrão ("cortar e queimar").

Veja um trecho de código presente nesse arquivo:

button {
    border:none;
    background:transparent;
}

Com essas propriedades fazemos com que a borda seja inexistente e o plano de junto transparente, lembra da ideia de zerar?

• Documentação do Reset CSS.

Normalize CSS

Já essa abordagem, vem com um tom menos extremista de eliminação, a ideia é que essas diferenças dos padrões de estilo entre os navegadores existam de uma forma mais consistente.

Nesse arquivo, os estilos padrão não são completamente retirados, mas passam a existir de forma mais harmônica e também há a preservação de padrões de estilo úteis.

Além disso, o normalize tem outras funcionalidades que o reset não tem, como corrigir alguns bugs e os seus estilos não aparecem na ferramenta do desenvolvedor (F12), o que para muitos isso incomoda no reset.

• Documentação do Normalize.

Então, qual dos dois usar?

A minha resposta é: depende.

A minha preferência é utilizar o reset em projetos pequenos e em maiores já usei os dois, mas isso é muito individual e com o tempo você irá perceber qual prática é mais adequada para você.

Espero ter ajudado, em caso de dúvidas fique a vontade para perguntar. Bons estudos!