Criação de Aplicações Web Responsive com CSS3

Apresentação

Saiba como criar aplicações web responsive e acessíveis com uma UI rica que atua na mais ampla gama possível de dispositivos compatíveis com a internet. Neste curso, obterá as competências para desenhar conteúdo compatível com WCAG, criando navegação, conteúdo, tabelas de dados e formulários desmontáveis. Empregará técnicas de design modernas, mobile-first, flexbox, funções CSS3 e pseudo-seletores, explorando ainda a integração CSS com frameworks JavaScript modernos como Angular e jQuery.

Destinatários

Todos os utilizadores que pretendam desenvolver aplicações web responsive com CSS3.

Objetivos

No final deste curso, os formando serão capazes de:

• Desenhar sites web acessíveis, utilizando as Diretrizes de Acessibilidade padrão da indústria
• Criar Layouts responsivos que se adaptem a qualquer tamanho de dispositivo ou sistema operacional
• Aproveitar a tipografia Web e unidades de medida modernas e responsivas
• Capturar user input com formulários e tabelas de dados responsivas e acessíveis
• Implementar SASS através da Ruby CLI e criar um modelo de design Bootstrap 4
• Gerir CSS em frameworks populares MVC e DOM como Angular e jQuery

Pré-requisitos

Os participantes ter os seguintes conhecimentos:

• Experiência em HTML como a fornecida pelo curso Desenvolvimento de Websites

Programa

Introdução às Cascading Style Sheets

• Formalizar o relacionamento entre HTML, JavaScript e CSS
• Definir browser moderno e acessibilidade da Web
• Desenvolva classes reutilizáveis
• O CSS Inheritance Model
• Otimização de código com CSS interno e externo
• Atualização do browser com recursos de desenvolvimento

Criar o estilo das CSS Box Model

• Criar o estilo do HTML container box
• Potenciar as diferenças entre blocos e elementos inline
• Manipular cores e transparências
• Desenvolver reinicializações de estilo globais e consistentes

Seleção de elementos e atributos DOM

• Fazer seleções com base na hierarquia DOM
• Select com base no comportamento do elemento DOM
• Seleções de Cadeia e aplicação de funções de CSS

Posicionamento com precisão e consistência

• Manipular as regras de posição estática, absoluta, relativa e fixa
• Flutuar e limpar recipientes flutuados
• Aplicar técnicas flexible box model
• Exploração de colunas e grelhas CSS

Tipografia da Web

• Distinguir fonte do tipo de letra e aplicar propriedades de fonte
• Aplicar texto, letra e propriedades de linha
• Utilizar fontes da Web

Formulários acessíveis e responsivos e tabelas de dados

• Explorar as interpretações regionais de Acessibilidade
• Criar formulários acessíveis e responsivos com base no WCAG
• Aproveitamento e prorrogação do HTML5 para validação
• Criação de tabelas de dados acessíveis e responsivas com base no WCAG

Templates com SASS, MENOS e Bootstrap

• Qualificação dos pontos fortes das estruturas de pré-processamento das CSS
• Instalação de Ruby e SASS no Windows e criação de um documento SCSS
• Compilação SCSS para CSS e investigação de ferramentas alternativas de pré-processamento
• Biblioteca Bootstrap 4 CSS

DOM e MVC JS Frameworks

• Animar conteúdo DOM com CSS puro
• Adicionar menu toggles com JavaScript
• Gestão da sintaxe do seletor CSS com jQuery e Angular
• Implementar scrolling responsivo e infinito