Uma web designer feminina trabalhando em seu computador em um escritório moderno
Crédito da imagem: monkeybusinessimages / iStock / Getty Images
A especificação original do Cascading Style Sheets, bem como sua revisão CSS3 muito mais recente, são tecnologias usadas para aprimorar e formatar páginas da Web em HTML. CSS foi inicialmente projetado para lidar com a camada de apresentação de uma página da Web de uma maneira mais eficiente do que formatação com HTML, que nunca teve a intenção de lidar com a complexa construção da Web contemporânea. Como CSS2 é uma extensão universalmente adotada de CSS1, o termo CSS sem um número implica a inclusão de CSS2. A especificação CSS3 ainda está em desenvolvimento em julho de 2014, portanto, os desenvolvedores da Web precisam considerar que o suporte ao recurso varia entre os navegadores.
CSS3 é compatível com versões anteriores de CSS
CSS3 é uma atualização do CSS2 que mantém a compatibilidade com todos os recursos do CSS - o CSS3 não desaprova nenhum código CSS. O código CSS3 foi projetado para melhorar a aparência das páginas da Web e carregá-las com mais rapidez, além de reduzir o tempo de desenvolvimento para construir páginas no navegador do usuário. CSS3 torna o Web design menos dependente de arquivos de imagem para elementos de design de página e reduz as solicitações de transferência de arquivos e o tempo de download usando menos imagens. CSS1 focava na formatação de aparência, enquanto CSS2 adicionava recursos de posicionamento para texto e objetos. Versões mais antigas do navegador, como o IE 9 e anteriores, não suportam amplamente os recursos adicionais do CSS3, o que pode exigir tempo extra de desenvolvimento para manter o código CSS substituto.
Vídeo do dia
CSS3 adiciona cantos arredondados e gradientes
Antes do CSS3, os desenvolvedores da Web precisavam projetar arquivos de imagem para adicionar coisas como cantos arredondados para bordas estruturais e gradientes de imagem de fundo; CSS3 inclui recursos comparáveis que podem ser adicionados com algumas linhas de código. Em CSS, um desenvolvedor da Web deve projetar uma borda ou gradiente, enviá-lo para o servidor de imagem, colocar a imagem na página e usar CSS para posicionar corretamente a borda. No CSS3, o desenvolvedor da Web pode realizar algo semelhante com código como ".roundBorder {border-radius: 10px;}". Gradientes de fundo são um pouco mais complicados e requerem códigos diferentes para navegadores diferentes. Por exemplo, um gradiente de branco para preto para Chrome e IE usa código como ".gradBG {background: liner-gradient (white, black);}".
CSS3 adiciona recursos de animação e efeitos de texto
CSS3 tem um punhado de recursos não presentes no CSS para melhorar a aparência dos elementos da sua página. Com CSS3, os desenvolvedores da Web podem adicionar uma sombra de texto ao texto para torná-lo mais fácil de ler ou adicionar um toque visual e podem forçar quebras de linha em palavras mais longas para fazê-las caber nas colunas com quebra automática de linha. Antes do CSS3, os desenvolvedores da Web precisavam codificar a animação em linguagens de script como JavaScript e jQuery; CSS3 adiciona vários recursos de animação à camada de design. O W3C ainda está trabalhando em um padrão de animações da Web para resolver problemas de compatibilidade entre as diferentes técnicas de animação.
CSS3 define colunas de texto
CSS3 adiciona a capacidade de dividir seções de texto em várias colunas para ler como um jornal. Na especificação CSS2, os desenvolvedores da Web têm dificuldade em construir seções de texto com várias colunas porque o padrão não está equipado para dividir texto automaticamente. Particularmente com sites que apresentam design responsivo, uma técnica de desenvolvimento que reorganiza e redimensiona o conteúdo com base no visualizar a resolução da tela do dispositivo, pessoas com monitores maiores podem ter dificuldade em ler linhas de texto que se espalham pelo tela.
