Neste curso o aluno irá conhecer a linguagem HTML 5, o CSS3, entender como uma é responsável pela semântica do site, enquanto a outra especifica o layout, e analisar diversos sites em HTML.
O curso também aborda o Bootstrap, um framework para agilizar o desenvolvimento de sites responsivos.
Contratação de Disciplina Avulsa
Consulte o valor ou faça a contratação online:
Apostilas gratuitas da Alfamídia relacionadas:
- Apostila de HTML, CSS & Javascript
- Apostila de HTML 5
Aula 1
- Uma breve história do HTML
- Nossa primeira página html
- Comentários em html
- Criando links em html
- Alguns comandos de formatação de parágrafos
- Agora propomos nosso primeiro desafio, para fixar os conteúdos já vistos e trabalhar algumas novas tags.
- Ferramenta de Corte (CROP)
- Introdução aos Web Standards
- Criando uma página html - Solução do desafio
- Declaração Doctype
- Estrutura Mínima de uma Página XHTML
- Títulos e Parágrafos em XHTML
- Links em páginas XHTML
Aula 2
- Imagens em XHTML
- Utilizando imagens no HTML 5
- Ajustes de Brilho e Contraste
- Listas em XHTML
- Elementos de agrupamento, incluindo listas ordenadas e não ordenadas
- Exemplo de Ajustes de Brilho e Contraste
- Uso de Iframe no html 5
- Histograma de Cores
- Introdução a tabelas
- Ajustes de Níveis
- Introdução a tabelas - colspan e rowspan
- Exemplo de Ajuste de Nível 1
- Exemplo de Ajuste de Nível 2
- Equilibrio de Cores
- Exemplo de Equilibrio de Cores
Aula 3
- Restauração de Imagens
- Introdução ao CSS
- Ferramenta de olhos Vermelhos
- Tabelas em XHTML
- Especificando CSS diretamente na página HTML
- Ferramenta de Carimbo
- Inspecionando elementos no Chrome
- Seletores - Parte 1
- Seletores - Parte 2
- Content Aware - exemplo1
- Representação de cor em CSS
- Content Aware - exemplo2
Aula 4
- Introdução ao CSS
- Uso de Filtros
- Fontes em CSS - Os 5 tipos genéricos
- Redução de Ruído em Imagens
- Fontes em CSS - Selecionando uma fonte
- Suavização de Pele
- Fontes em CSS - font-style, font-variant, font-weright, font-size
- Tornar Imagens Nítidas
- Efeito de Grafite em Imagem
Aula 5
- Cor e imagem no fundo em CSS
- Atributos de texto
- Layout de links em CSS
- Mensagem de final de curso
Aula 6
- Introdução a formulários em HTML
- Introdução a formulários em HTML - Parte 2
- Introdução a formulários em HTML - Parte 3
- Introdução a Formulários em HTML - parte 4
Aula 7
- Posicionamento em CSS - margin e padding
- Posicionamento em CSS - Largura e centralização de elementos
- Posicionamento em CSS - Atributo float
- Posicionamento em CSS - Atributo display
Aula 8
- Estudo de um formulário com layout CSS
- Estudo de um formulário com layout CSS - Continuação
Aula 9
- Posicionamento em CSS - Atributo position - Parte I
- Posicionamento em CSS - Atributo position - Parte II
- Posicionamento em CSS - Atributo position - Parte III
Aula 10
- Desafio - Página com layout simples e duas colunas
- Solução desafio
Aula 11
- Desenvolvimento web responsivo
- Linguagens para desenvolvimento de sites responsivos
- Design Responsivo
- Começando a configurar o css para um site responsivo
- Configurando o css para a adaptação de imagens
- Configurando o menu
- Inserindo um texto ao lado do menu
- Inserindo imagens
- Configurando o rodapé
- Ajustando o layout para uma tela de no máximo 600px
- Ajustando as imagens para uma tela de no máximo 600px
Aula 12
- CSS3 Flexible Box
- Fazendo a estrutura do site
- Configurando a div tudo
- Configurando as div's cont1, cont2 e cont3
- Incluindo conteúdo dentro da div cont3
- Incluindo conteúdo dentro das div’s cont2 e cont1
- Configurando o css do menu
Aula 13
- Apresentação do Curso
- Construção do HTML do Texto Principal
- Construção do CSS do Texto Principal
- Definição das Fontes
- Posicionamento da Imagem Principal
- CSS da Imagem Principal
- Criação do Rodapé
- Criação do Menu
- Criação do Menu - 2
- Formulário do Template
- Responsividade
- Desafios
Aula 14
- Site de Cursos - Apresentação
- Site de Cursos - Estrutura do Site
- Site de Cursos - Topo do Site
- Site de Cursos - Posicionando o menu
- Site de Cursos - Configurando as tags
- Site de Cursos - Inserindo imagens
- Site de Cursos - Configurando o elemento footer
- Site de Cursos - Configurando o layout para dispositivos móveis
- Site de Cursos - Transições
- Site de Cursos - Desafio
Aula 15
- Site de Viagens - Apresentação
- Site de Viagens - Topo do Site
- Site de Viagens - Código HTML das imagens
- Site de Viagens - Código CSS das imagens
- Site de Viagens - Ajustando as imagens
- Site de Viagens - Rodapé
- Site de Viagens - Layout para telas com no máximo 800 pixels
Aula 16
- templates e frameworks - bootstrap, font-awesome
- templates e frameworks - ícones do font-awesome
- templates e frameworks - layout do menu
- templates e frameworks - grid do bootstrap
- templates e frameworks - grid em diferentes tamanhos
- templates e frameworks - container e container-fluid
- templates e frameworks - aprendendo a utilizar
Aula 17
- O que é o Bootstrap
- O site oficial do Bootstrap
- Criação de um novo documento HTML
- Colocando no código os links de CSS, jQuery e JavaScript
- Configurando o menu
- Realizando ajustes no menu
Aula 18
- Incluindo uma imagem no cabeçalho
- Realizando ajustes na borda
- Incluindo o conteúdo do site
- Fontes
- Incluindo mais conteúdo no site
Aula 19
- Criação das demais páginas do site
- Realizando ajustes no menu
- Incluindo mais conteúdo na página Quem Somos
- Configuração do formulário de contato
- Explicação do código da configuração do formulário de contato
- Utilização do JavaScript
- Aplicação do modal
Aula 20
- Lançando o desafio 1
- Solução do desafio 1
