HTML5/CSS3

Curso de HTML5 e CSS3

Programação de sites. É isto que você vai aprender no curso de HTML e CSS3 da Cadritech | DRC. Aqui você conhece todos os conceitos essenciais para a criação de páginas web, junto com os novos recursos e possibilidades que o HTML5 e CSS3 oferecem para a criação de sites com códigos limpos e estruturados com base nas melhores práticas de programação do mercado.

Objetivo

O curso de HTML e CSS3 da Cadritech | DRC proporcionam ao aluno o conhecimento necessário para a criação de sites através de codificação HTML e CSS, utilizando o editor Sublime Text.

A quem se destina

O curso de HTML5 e CSS3 da Cadritech | DRC São Paulo é destinado a pessoas que desejam criar web sites sem depender de nenhuma ferramenta visual, ou ainda se tornarem desenvolvedores de aplicações web.

Carga Horária

40 horas

Pré-Requisitos

Treinamento de Lógica de Programação, ou conhecimento equivalente.

WEB

• História
• Camadas
• Requisições
• Integrações
• Domínio
• Hospedagem
• Protocolos HTTP e FTP
• Página HTML
• Versões HTML
• Linguagens de Programação
• Padrões Web
• Navegadores
• Engines
• Cross-browser

Introdução à Linguagem

• Editores de Texto e IDEs
• Apresentação Geral do HTML
• Evolução da Linguagem HTML
• XHTML vs XML
• Tags
• Aninhamento de Tags
• Comentários

Elementos e Atributos

• Conceito
• Elementos
• Atributos
• Estrutura HTML

Tags HTML

• Fluxo de Interpretação do Navegador
• Árvore de Elementos
• Tipos de Tags
• Utilização
• DOCTYPE
• HTML

Tags de Cabeçalho

• Head
• Title
• Meta
• Atributo Charset
• Caracteres Reservados
• Style
• Link
• Script
• Noscript

Tags Semánticas

• Section
• Header
• Article
• Aside
• Nav
• Figure
• Footer

Tags de Exibição

• Body
• H1...H6
• Paragraph
• Image
• Button
• Ordered List
• Unordered List
• Div

Tags de Texto

• Anchor
• Paragraph
• Em
• Strong
• Small
• Mark
• Span
• Pre

Tags de Formulário

• Form
• Label
• Input
• Radio
• Checkbox
• Select
• Datalist
• Text Area
• Fieldset

Novos Tipos de Campos de Formulário

• Search
• URL
• Tel
• Email
• Number Step
• Range
• Date
• Time
• Week
• Month

Validação

• Importância
• Quando Validar
• O que Validar
• Papel do HTML vs Regras de Negócios

Mídia do HTML5

• Áudio
• Vídeo
• Configurações dos Atributos

Navegação

• Caminho Relativo e Absoluto
• Páginas Externas
• Âncoras na Própria Página

Conceitos de Requisições HTTP

• Front-end e Back-end
• Persistência dos Dados em Banco de Dados
• Cabeçalho da Requisição
• Introdução à Serviços RESTful
• Métodos – GET/POST/PUT/DELETE

Formulários HTML

• Configuração da Tag Form
• Controles de Formulário
• Novos Controles do HTML5
• Submetendo e Apagando os Dados do Formulário
• Validação HTML5

SVG

• Introdução ao SVG
• Estrutura de Código SVG
• Usando nas Páginas HTML

Referência CSS

• CSS
• Sintaxe
• Comentários
• Formas de Aplicação

Seletores CSS

• Type
• Class
• ID
• Universal
• Externo
• Interno
• Inline
• Adjacent
• Attribute
• Pseudo-elements
• Pseudo-classes

Precedência CSS

• Externo
• Interno
• Inline
• Seletores

Cores CSS

• Nomes
• Hexadecimal
• RGB
• RGBA
• HSL
• HSLA

Vendor Properties

• -webkit-
• -moz-
• -o-
• -ms-

Fontes

• Web Safe Fonts
• Famílias
• Unidades de Medidas

Propriedades CSS

• Shorthand
• Fundo
• Bordas
• Texto
• Tabela
• Listas
• Multi-colunas

At Rules

• @charset
• @import
• @media
• @font-face

Box Model

• Áreas e Espaçamentos
• Influência na Largura e Altura
• Calculando Tamanho Total
• CSS Reset
• Valores de Dimensões
• Propriedades de Dimensões

Construindo o Site

• Fluxo de Desenvolvimento
• Wireframes
• Bordas
• Texto
• Testes
• Deploy
• Versionamento

Posicionamento

• Exibição inline e block
• Visibilidade
• Static
• Relative
• Absolute
• Fixed
• z-index
• Float
• Clear
• Clearfix

Tipos de Layouts

• Fixo
• Líquido
• Elástico
• Hibrido
• Responsivo

Layout Responsivo

• Media Query
• Media Type
• Media Feature
• Logical Operators

Construindo o Site

• Fluxo de Desenvolvimento
• Wireframes
• Protótipos
• Testes
• Deploy
• Versionamento