CSS (Cascading Style Sheets - Folhas de Estilo em Cascata) tornou-se a maneira mais fácil de estilizar e organizar sites. Os designers usam folhas de estilo para informar a um navegador como um site deve ser exibido em termos de aparência, cobrindo fatores como cor, espaçamento, fontes e muito mais.
Estilos CSS podem ser implantados de duas maneiras:
- Inline - dentro da codificação da própria página web, individualmente, elemento por elemento
- Em um documento CSS autônomo, ao qual o site está vinculado
Práticas recomendadas para CSS
"Melhores práticas" são os métodos de projetar e construir sites que provaram ser os mais eficazes e dar o máximo de retorno para o trabalho envolvido. Segui-los em CSS em web design ajuda sites a aparência e função, bem como possível. Eles evoluíram ao longo dos anos, juntamente com outras linguagens e tecnologias da Web, e a folha de estilo CSS independente tornou-se o método preferido de uso.
Seguir as práticas recomendadas para CSS pode melhorar seu site das seguintes maneiras:
- Separa o conteúdo do design.Um dos principais objetivos do CSS é remover elementos de design do HTML e colocá-los em outro local para o designer manter. Isso também serve para separar designers de desenvolvedores para que cada um possa se concentrar em suas áreas de especialização. Um designer não precisa ser um desenvolvedor para manter a aparência de um site.
- Facilita a manutenção.Um dos elementos mais negligenciados do web design é a manutenção. Ao contrário dos materiais impressos, um site nunca é "um e pronto". Conteúdo, design e função podem e devem evoluir ao longo do tempo. Ter o CSS em um lugar central, em vez de espalhado pelo site, torna as coisas muito mais fáceis de manter.
- Mantém seu site acessível.O uso de estilos CSS ajuda os mecanismos de pesquisa e pessoas com deficiências a interagir com seu site.
- Mantém seu site atual por mais tempo.Ao usar as melhores práticas com CSS, você está aderindo a padrões comprovadamente estáveis, mas flexíveis o suficiente para acomodar mudanças no ambiente de web design.
Estilos Inline não são melhores práticas
Os estilos in-line, embora tenham uma finalidade, geralmente não são a melhor maneira de manter seu website. Eles vão contra todas as melhores práticas:
- Estilos in-line não separam o conteúdo do design.Os estilos inline são exatamente os mesmos que as fontes incorporadas e outras tags de design desajeitadas com as quais os desenvolvedores modernos se deparam. Os estilos afetam apenas os elementos individuais específicos aos quais são aplicados; enquanto isso pode lhe dar um controle mais granular, também torna outros aspectos de design e desenvolvimento - como consistência - mais difíceis.
- Estilos inline causam dores de cabeça de manutenção.Quando você está trabalhando com folhas de estilo, descobrir onde um estilo está sendo definido pode ser difícil. Quando você está lidando com uma mistura de estilos embutidos, incorporados e externos, você tem muitos locais para verificar. Se você trabalha em uma equipe de web design ou tem que redesenhar ou manter um site construído por outra pessoa, então você terá ainda mais problemas. Depois de encontrar o estilo e alterá-lo, você terá que fazer isso em todos os elementos em todas as páginas em que ele foi colocado. Isso aumenta o tempo e os orçamentos de trabalho astronomicamente.
- Estilos inline não são tão acessíveis.Embora um leitor de tela moderno ou outro dispositivo auxiliar possa manipular atributos e tags inline com eficiência, alguns dispositivos mais antigos não podem, o que pode resultar em algumas páginas da Web exibidas de maneira estranha. Caracteres e textos extras podem afetar a forma como sua página é visualizada por um robô do mecanismo de pesquisa, portanto, sua página não se sai tão bem em termos de otimização de mecanismos de pesquisa (SEO).
- Os estilos in-line aumentam suas páginas.Se você quiser que todos os parágrafos do seu site apareçam de uma determinada maneira, faça isso uma vez com seis linhas ou mais de código em uma folha de estilos externa. Se você fizer isso com estilos embutidos, no entanto, terá que adicionar esses estilos a todos os parágrafos do seu site. Se você tem cinco linhas de CSS, são cinco linhas multiplicadas por cada parágrafo no seu site. Essa largura de banda e tempo de carregamento podem aumentar rapidamente.
A alternativa para estilos inline: folhas de estilo externas
Em vez de usar estilos in-line, use folhas de estilo externas. Eles oferecem todos os benefícios das melhores práticas de CSS e são fáceis de usar. Empregado dessa maneira, todos os estilos usados em seu site são exibidos em um documento separado que é vinculado a um documento da Web com uma única linha de código. As folhas de estilo externas afetam qualquer documento ao qual elas estão anexadas. Isso significa que, se você tiver um site de 20 páginas no qual cada página usa a mesma folha de estilo - que normalmente é como é feito -, você pode fazer uma alteração em cada uma dessas páginas simplesmente editando esses estilos uma vez, em um só lugar. Alterar estilos em um ponto é infinitamente mais conveniente do que procurar por esse código em todas as páginas do seu site. Isso facilita muito o gerenciamento de sites de longo prazo.
