aquinolima / aluraeniac---html-css

Micro-certificação Eniac-Alura

AluraEniac---HTML-CSS

Micro-certificação Eniac-Alura

• Curso HTML5 e CSS3 parte 1: A primeira página da Web

  • Faça esse curso de HTML e CSS e:

    • Aprenda o que é o HTML e o CSS;
    • Entenda a estrutura básica de um arquivo HTML;
    • Utilize o navegador para inspecionar elementos;
    • Aprenda a definir estilos para elementos usando o CSS;
    • Desenvolva um página Web.

  • Conteúdo Detalhado:

  1- Marcação do primeiro texto: - Introdução; - Download do texto base; - Definindo texto; - Uso de tags; - Melhorando o texto; - Estrutura de ênfase correta. 2- Separando o conteúdo e informações: - Estrutura básica; - Estrutura do HTML; - Passando dados para o navegador; - Lidando com a acentuação; - Separando conteúdo e informações; - Estrutura de conteúdo. 3- Trabalhando com CSS: - Começando com CSS; - Propriedade e o seu valor no CSS; - Organizando o estilo; - Mesmo CSS em várias páginas; - Mudando a cor; - Estilo em cascata; - Extra: Cores hexadecimais; - Representando cores no CSS. 4- Estilizando imagens: - Identificador de elemento e tag de imagem; - Adicionando uma imagem; - CSS para imagens; - Alterando a largura de um elemento; - Extra: Time de Front-End. 5- Listas e divisões de conteúdo: - Trabalhando com listas; - Estrutura de uma lista em HTML; - Divisões de conteúdo; - Criando blocos de conteúdo; - Inline e Block; - Quando usar a propriedade class. 6- Finalizando a página: - Projeto da aula anterior; - Cabeçalho; - Tag de cabeçalho.

• Curso HTML5 e CSS3 parte 2: Posicionamento, listas e navegação

  • Faça esse curso de HTML e CSS e:

    • Aprenda a estrutura da página HTML;
    • Navegue entre páginas web;
    • Conheça reset.css e o posicionamento pelo CSS;
    • Entenda a diferença entre inline e block;
    • Lide com bordas e pseudo-classes CSS.

  • Conteúdo Detalhado:

  1- Criando uma nova página: - Introdução; - Revisão; - Nova página; - Estrutura de uma página HTML; - Novo cabeçalho; - Logo do site. 2- Navegação entre páginas: - Estruturando a navegação; - Navegando entre as páginas; - Arrumando a lista; - Texto em maiúsculo. 3- Posicionamento dos elementos: - Download do reset.css; - Limpando o CSS; - Como deixar o CSS limpo; - Como funciona o posicionamento; - Posicionamento; - Posicionando o cabeçalho; - Centralizar elementos. 4- A tag section: - Divisões semânticas; - Por que usar as tags semânticas?; - Criando listas complexas; - Itens de lista; - Reforçando o inline-block; - Comportamentos de blocos; - Ajustando o tamanho dos elementos; - Espaçamento interno. 5- Lidando com bordas: - Aplicando bordas; - Funcionamento das bordas; - Bordas arredondadas; - CSS para os cantos arredondados. 6- Pseudo-classes CSS: - Pseudo-classes de estado; - Comportamentos dos elementos; - Aplicando hover e active; - Comportamento do mouse. 7- Finalizando a página de produtos: - Rodapé; - Imagem de fundo; - Caracteres especiais; - Tipos de caracteres especiais; - Conclusão.

• Curso HTML5 e CSS3 parte 3: Trabalhando com formulários e tabelas

  • Faça esse curso de HTML e CSS e:

    • Crie formulários complexos;
    • Trabalhe com campos para celulares;
    • Apresente informações em tabelas;
    • Use estilos para formulários, campos e tabelas;
    • Entenda a hierarquia no CSS;
    • Trabalhe com transformações e transições.

  • Conteúdo Detalhado:

  1- Criando uma nova página: - Começando a página de contato; - Funcionamento de formulários. 2- Começando um formulário: - Campos básicos; - Estrutura básica; - Estilos para o formulário; - Input com espaço entre a borda e o conteúdo. 3- Tipos de campos diferentes: - Formulários mais completos; - Campos complexos; - CSS para formulários complexos; - CSS repetido; - Hierarquia no CSS; - Cor final do parágrafo; - Selecionando opções; - Selects e options. 4- Melhorando a semântica: - Inputs para celulares; - Celulares e formulários; - Dados importantes nos inputs; - Formulários mais fáceis de serem preenchidos; - Melhorando a semântica do formulário; - Título de um grupo de campos do formulário. 5- CSS avançado: - Entendendo Transições; - Transição com duração de 3 segundos; - Como funcionam transformações?; - Aumentando um elemento proporcionalmente. 6- Estrutura de tabelas: - Tabela básica; - Criando linhas em uma tabela; - Tags semânticas para tabelas; - Como dividir uma tabela; - Estilos na tabela; - Para saber mais: Juntando células da tabela.

• Curso HTML5 e CSS3 parte 4: Avançando no CSS

  • Faça esse curso de HTML e CSS e:

    • Importe conteúdo externo na sua página HTML, como fontes, vídeos e mapas;
    • Conheça pseudo-classes e pseudo-elementos;
    • Use seletores de CSS avançados;
    • Saiba como lidar com opacidade e sombra;
    • Entenda sobre o Viewport e design responsivo.

  • Conteúdo Detalhado:

  1- Adaptando a página inicial: - Refazendo a página inicial; - Revisando o conteúdo; - Adaptando o CSS; - Boas práticas de CSS; - Usando o float; - Utilidade do float. 2- Conteúdo externo: - Fontes externas; - Benefícios de usar fontes externas; - Trabalhando com mapas; - Importando vídeo. 3- Melhorando o CSS: - Pseudo-classes; - Marcando o primeiro item de uma lista; - Aplicando gradientes; - Degradê de cinco cores em um elemento; - Pseudo-elementos; - Criando um elemento antes de outro, com CSS. 4- Selecionando qualquer coisa: - Seletores avançados; - Selecionando um elemento específico; - Cálculos com CSS; - Medidas proporcionais. 5- Opacidade e sombra: - Opacidade nos elementos; - Quem pode receber uma camada de opacidade?; - Sombra nos elementos; - Sombra interna em um elemento. 6- Design responsivo: - Meta tag de Viewport; - Apresentando um elemento de outra forma; - Adaptar uma página para celular; - Não perdendo tempo com layouts responsivos.

• Curso JavaScript: Programando na linguagem da web

  • Faça esse curso de JavaScript e:

    • Entenda mais como funciona esta popular linguagem do mercado;
    • Aprenda a manipular os elementos de sua página;
    • Trabalhe bem com eventos do navegador;
    • Entenda como utilizar e validar formulários;
    • Conheça boas práticas de organização de código Javascript;
    • Busque dados em outro servidor com AJAX.

  • Conteúdo Detalhado:

  1- Introdução: - Por que aprender Javascript; - As plataformas que suportam Javascript; - O primeiro script; - Boas práticas: script no local certo; - Entendendo o DOM; - A função seletora querySelector; - Acessando os textos de um elemento. 2- Variáveis e Operadores: - Buscando dados dentro de um elementos; - As variáveis no Javascript; - Os operadores aritméticos; - Os operadores lógicos; - Precedência de operadores; - Validando os pacientes. 3- Arrays, Loop e Estilos: - Selecionado diversos elementos da página; - Array de elementos; - Iterando com um loop for; - Limitando as casas decimais; - Alterando o estilo dos elementos; - Manipulando classes; - Boas práticas com estilos e Javascript. 4- Eventos, Formulários e Criando Elementos: - Escutando eventos do navegador; - O clássico evento de click; - Prevenindo os comportamentos padrões; - Obtendo dados de um formulário; - Criando elementos com Javascript; - Adicionando elementos na página. 5- Boas Práticas com Javascript: - Quebrando o código em arquivos; - Importando múltiplos arquivos; - Extraindo código para funções; - Reaproveitamento de código; - Objetos em Javascript; - Princípio da Responsabilidade Única. 6- Validação de Formulários: - Validando campos; - O operador lógico NOT; - Validando o formulário; - Capturando erros; - Exibindo mensagens de erro para o usuário. 7- Remoção, Delegação e Animação: - O evento de duplo clique; - Removendo elementos com Javascript; - A variável implícita this; - Boas práticas: a delegação de eventos; - Animando a remoção com CSS e Javascript. 8- Filtrando uma tabela: - O evento de digitação; - Escondendo elementos da página; - Buscando texto com Javascript; - Melhorando a busca com Expressões Regulares. 9- Buscando pacientes com AJAX: - O objeto XMLHttpRequest; - Configurando a requisição; - A técnica AJAX; - Enviando uma requisição GET; - Escutando a resposta; - Tratando erros da rede; -Uma mensagem de erro para o usuário.