Construa um site moderno em CSS com efeitos!

Visão geral do curso

Construa um site moderno com efeitos em CSS usando os padrões mais recentes! Descubra as incríveis possibilidades que o CSS3 oferece aos desenvolvedores web. De animações e transições a layouts de conteúdo flexíveis, você pode alcançar tudo isso com o CSS3. Além disso, os sites em CSS3 também carregam mais rápido. Se você deseja criar serviços web modernos, este curso é perfeito para você!

Exemplos práticos

Ao longo do curso, trabalharemos em exemplos práticos para aplicar o conhecimento que você adquirir. Começaremos com exemplos simples para entender como o CSS3 funciona e suas funções. Em seguida, usaremos esse conhecimento para construir um site completo.

O que você aprenderá

Na primeira parte do curso, você aprenderá sobre ferramentas do CSS3 menos espetaculares, mas altamente úteis, como novos seletores e manipulação de texto. Essas propriedades já podem ser usadas para criar sites modernos e otimizar elementos gráficos, melhorando o tempo de carregamento de suas páginas. Na segunda parte, exploraremos novos recursos fantásticos, como transformações (incluindo 3D), animações, modelos de caixa flexíveis e consultas de mídia.

Animação em CSS3

Você aprenderá técnicas para criar animações usando apenas CSS3. Descubra como criar transições simples e animações de objetos usando transições. Você também aprenderá como usar keyframes para ter mais controle sobre suas animações. Aplicaremos esse conhecimento para criar animações interessantes em nosso site do curso. Além disso, você aprenderá truques e ferramentas para garantir que seus sites tenham uma aparência ótima, mesmo em navegadores mais antigos que possam não suportar todos os recursos do CSS3.

Transformações e transições

Uma das possibilidades mais empolgantes do CSS3 é a capacidade de criar transformações, como girar objetos, inclinar e dimensionar. Quando combinado com animações, isso abre infinitas possibilidades, com a vantagem adicional de tempos de carregamento mais rápidos. Neste curso, também exploraremos transformações 3D experimentais que moldarão o futuro dos efeitos visuais na web.

Criação de gráficos e efeitos

Com o CSS3, você pode gerar gráficos estruturalmente usando código, desde gradientes simples até formas e padrões complexos. Essa abordagem oferece escalabilidade, tamanhos de arquivo menores e flexibilidade em comparação com o uso de imagens, resultando em menos solicitações ao servidor. Também exploraremos geradores gráficos úteis e até mostraremos como exportar CSS3 do Photoshop. Você também aprenderá como criar efeitos como cantos arredondados e sombras de texto.

Sites para todos os dispositivos

Agora você pode criar sites flexíveis que se adaptam a diferentes dispositivos e resoluções. Isso significa que seu site será exibido corretamente em telefones e tablets. Em nosso projeto, usaremos o design responsivo de uma maneira única e combinaremos com um novo modelo de caixa que também pode responder a mudanças na orientação do dispositivo. Também enfrentaremos os desafios de adaptar nosso site do curso a diferentes telas, pois é um único documento HTML.

Tipografia e fontes da web

Dedicamos uma extensa seção do curso para explorar aplicações de tipografia criativa em sites. Você aprenderá como usar fontes personalizadas em seu site para que todos os usuários possam vê-las. Exploraremos soluções como @font-face e Google Web Fonts. Além disso, discutiremos efeitos de texto e trabalharemos com layouts de várias colunas. Por fim, aplicaremos todas as técnicas que aprendemos ao nosso site do curso.

O que você construirá

Ao final deste curso, você terá construído um site completo em CSS3 repleto de efeitos. Você terá aprendido como gerar gráficos e gradientes, aplicar técnicas tipográficas, criar efeitos usando código CSS, transformar objetos e animá-los usando transições. Você também será capaz de criar sites flexíveis para vários dispositivos usando o CSS3.