Erros mais comuns de CSS: Redundância de código

Erros mais comuns de CSS: Redundância de código

A redundância consiste na repetição de códigos no CSS, gerando uma perda de tempo.

Maneira inadequada:

.titulo {font-weight: bold; }
.outro_titulo {font-weight:bold; color:red;}

Maneira correta – consiste em fazer o agrupamento:

.titulo, .outro_titulo {font-weight: bold; }
.outro_titulo {color:red;}

Também seria possível usar um nome comum para eles e adicionar um modificador de classe para ir com o título para mostrar que é uma cor diferente:

<h3 class=”titulo pop”>Meu título</h3>

Vamos a um outro exemplo de código redundante que poderia ser otimizado.

Código redundante:

.borda: {border-top: 1px solid #000; border-bottom: 1px solid #000; border-left: 1px solid #000; border-right: 1px solid #000;}

Poderia ser corrigido e otimizado para:

.borda: {border: 1px solid #000; }