Como os sites modernos usam CSS - dummies

As folhas de estilo externo são arquivos fora de (mas vinculados para) páginas HTML que fornecem estilo e layout para páginas da web. As folhas de estilo em cascata são um exemplo de folhas de estilo externas. Os seguintes são os motivos pelos quais incluir folhas de estilo externas em suas páginas da web é uma coisa boa:

• Os estilos CSS são muito mais poderosos do que as ferramentas antigas e baseadas em HTML para o design da página. Por exemplo, o layout com tabelas HTML exige que designers contorem linhas e colunas de tabela em contêineres para conteúdo. Com HTML, você tem pouco controle sobre parâmetros como o espaçamento entre e dentro dessas células da tabela, ou as bordas específicas na parte superior, inferior ou lateral da célula da tabela.

• CSS, por outro lado, pode transformar uma marca HTML bastante genérica - uma etiqueta DIV - em um recipiente quase infinitamente formatável para qualquer tipo de conteúdo.

• As classes CSS e IDs são estilos especiais que estão no coração do design moderno da página. Estas classes CSS e IDs substituíram tabelas HTML como a técnica padrão para a apresentação de páginas da web. As tabelas utilizaram células, criadas pela interseção de linhas e colunas, como espaços reservados para conteúdo. Esta técnica foi desajeitada e limitada, em comparação com a liberdade disponível com layouts de página definidos pela ID e classe.

• Folhas de estilo externo, como CSS, permitem o estilo global, que tem elementos comuns em todas as páginas HTML em um site. Precisa mudar o esquema de cores em 17, 412 páginas em 5 minutos? Não há problema com uma folha de estilo externa - você simplesmente atualiza o arquivo CSS e todos os arquivos HTML que se ligam a essa folha de estilo instantaneamente atualizam nos navegadores.

Ao usar CSS, você pode

• Facilmente faça alterações globais sobre como o seu conteúdo é apresentado. Se os estilos forem aplicados usando folhas de estilo externas, eles podem ser usados ​​para alterar instantaneamente a aparência de cada página à qual eles estão vinculados. Esta é uma ferramenta de produtividade indispensável em grandes sites.

  Imagine ter que encontrar todas as tags de fonte e alterá-las em um extenso site. O uso de um esforço simples de Localizar e Substituir geralmente não funciona porque as marcas de caminho inconsistentes são codificadas. É possível ter centenas de variações das tags de fonte - que todos parecem iguais na página da Web, mas são codificados de forma diferente - o que torna inútil o uso de utilitários Find e Replace.

• Perceba facilmente o significado original do seu conteúdo. Ao trabalhar com técnicas mais antigas, "qualquer coisa que faz parecer bom", que empregam tags HTML para formatação e design, você geralmente não pode dizer quais são as diferentes partes do conteúdo da página apenas olhando isso.

  O HTML de estilo antigo permite o uso indevido de tags, como a aplicação de propriedades a uma tag de fonte que faz uma exibição de tag de parágrafo como se fosse um título. Não é fácil consertar. Se você conseguir retirar as tags de fonte antigas, você também tira as pistas visuais que podem ajudá-lo a recodificar a página corretamente.

  Por exemplo, se você configurar sua página como um bloco de conteúdo com tags

  para separá-la visualmente em parágrafos e tags para que os títulos sejam diferentes, é difícil descobrir o que era se as tags fossem interrompidas ou excluído.

• Faça o seu site amigável para todos os que visitam, independentemente de onde estão ou quais são suas situações. Cada vez mais, as pessoas que usam a web não usam um computador tradicional. Em vez disso, eles usam tablets, smartphones e outros dispositivos digitais. Com CSS e HTML, você pode detectar o ambiente de navegação de um visitante e fornecer diferentes folhas de estilos que exibem conteúdo em uma forma apropriada para a mídia do visitante.

• Baseando-se em CSS e HTML também torna os sites mais acessíveis para usuários deficientes auditivos e com visão, que possuem software de leitor ou outras ferramentas especiais que funcionam melhor se você evitar o uso de tags HTML para formatação.

  Novamente, alguns usuários terão folhas de estilo personalizadas para que elas possam usar a Internet. Alguém pode precisar ampliar os tamanhos das fontes ou especificar como um leitor de tela sinaliza sinais auditivos de partes diferentes de um documento para compensar deficiências visuais. Informações sobre folhas de estilo aural podem ser encontradas no site do World Wide Web Consortium (W3C).