53h

Para conclusão

6
Cursos
3
Vídeos extras
1
Podcast
5
Artigos
O que você vai aprender nesta Formação?

Crie sites incríveis com HTML e CSS!

Nesta formação para iniciantes em Front-end, você aprenderá:

  • Ferramentas de desenvolvimento de layouts (ex: Figma) e publicação (ex: Github)
  • Estruturar uma página web com tags HTML
  • Compreender como HTML e CSS trabalham juntos
  • Descobrir como organizar o conteúdo com arquivos HTML
  • Organizar uma página com CSS Flexbox
  • Criar cabeçalhos, rodapés e aplicar estilos com CSS
  • Tornar seu site responsivo para diferentes tamanhos de tela

Transforme sua paixão por design em habilidades práticas e desenvolva páginas completas para web!

Clique aqui e acesse o Tech Guide para acompanhar sua evolução e matricule-se na formação para planejar à sua trilha de estudos com acesso direto pelo Dashboard.

Em caso de dúvidas, acesse o Fórum ou interaja com a comunidade no Discord.

Vamos começar?

Por que estudar esta formação?

  • Guia de aprendizado

    Conteúdos pensados para facilitar seu estudo

  • Do básico ao avançado

    Formação completa para o mercado

  • Você dentro do mercado

    Do zero ao sonhado emprego em sua área de interesse

Comece essa formação agora mesmo e capacite-se para seu próximo projeto!

Conheça os planos

Com quem você vai aprender?

  • Rafaella Ballerini

    Desenvolvedora de software, instrutora e criadora de conteúdo. Possui um canal com mais de 240 mil pessoas inscritas, onde ensina sobre os mais diversos temas relacionados a programação e tecnologia, como HTML, CSS, Javascript, Git, Github... É instrutora front-end na plataforma da Alura e também na Imersão Dev, projeto que leva o ensino inicial de programação para todo o Brasil gratuitamente.

  • Rafaella Ballerini

    Desenvolvedora de software, instrutora e criadora de conteúdo. Possui um canal com mais de 240 mil pessoas inscritas, onde ensina sobre os mais diversos temas relacionados a programação e tecnologia, como HTML, CSS, Javascript, Git, Github... É instrutora front-end na plataforma da Alura e também na Imersão Dev, projeto que leva o ensino inicial de programação para todo o Brasil gratuitamente.

  • Guilherme Lima

    Guilherme é desenvolvedor de software formado em Sistemas de Informação e possui experiência em programação usando diferentes tecnologias como Python, Javascript e Go. Criador de mais de 30 cursos de diferentes áreas da plataforma com foco no treinamento de profissionais de TI, como Data Science, Python para web com Django e Django Rest, jogos com Javascript, Infraestrutura como código com Terraform e Ansible, Orientação a Objetos com Go. Além disso, é um dos instrutores da Imersão Dev da Alura.

  • Guilherme Lima

    Guilherme é desenvolvedor de software formado em Sistemas de Informação e possui experiência em programação usando diferentes tecnologias como Python, Javascript e Go. Criador de mais de 30 cursos de diferentes áreas da plataforma com foco no treinamento de profissionais de TI, como Data Science, Python para web com Django e Django Rest, jogos com Javascript, Infraestrutura como código com Terraform e Ansible, Orientação a Objetos com Go. Além disso, é um dos instrutores da Imersão Dev da Alura.

  • Mônica Mazzochi Hillman

    Bacharela em Tecnologias Digitais, especialista em User Experience e pós graduanda em Docência e Performance na Educação a Distância com experiência em suporte técnico de T.I e com tecnologias front-end. Durante a graduação foi vice-presidente do diretório acadêmico e monitora de LIBRAS. Atualmente é instrutora na Alura. Nas horas vagas gosta de assistir animes e produções da marvel, ouvir kpop e post-hardcore, jogar Valorant e Genshin Impact e praticar culinária.

  • Mônica Mazzochi Hillman

    Bacharela em Tecnologias Digitais, especialista em User Experience e pós graduanda em Docência e Performance na Educação a Distância com experiência em suporte técnico de T.I e com tecnologias front-end. Durante a graduação foi vice-presidente do diretório acadêmico e monitora de LIBRAS. Atualmente é instrutora na Alura. Nas horas vagas gosta de assistir animes e produções da marvel, ouvir kpop e post-hardcore, jogar Valorant e Genshin Impact e praticar culinária.

  • Marcus Almeida

    Bacharelando em Engenharia Elétrica pelo Instituto Federal do Maranhão. Atuou como parte do Scuba Team da Escola de Dados na Alura, trabalhando com conteúdos voltados a Data Science, Machine Learning, Python e SQL. Adora conversar tecnologia, universo geek, games e também aprender coisas novas.

  • Marcus Almeida

    Bacharelando em Engenharia Elétrica pelo Instituto Federal do Maranhão. Atuou como parte do Scuba Team da Escola de Dados na Alura, trabalhando com conteúdos voltados a Data Science, Machine Learning, Python e SQL. Adora conversar tecnologia, universo geek, games e também aprender coisas novas.

Passo a passo
  1. 1 Aprenda HTML, CSS e boas práticas de desenvolvimento

    Um site profissional precisa de HTML e CSS bem estruturados. Aprenda a importância do código semântico, como potencializar informações com CSS e seguir boas práticas de desenvolvimento.

    • Curso HTML e CSS: ambientes de desenvolvimento, estrutura de arquivos e tags

      08h
      • Aprenda a fazer o download e instalar um ambiente para o desenvolvimento de páginas HTML e CSS
      • Saiba como estudar uma nova tecnologia com base na documentação
      • Crie um projeto com HTML e CSS do zero
      • Pratique estilizações com CSS
      • Entenda a importância do HTML semântico e boas práticas de desenvolvimento
    • Podcast TechGuide: Figma – Hipsters Ponto Tech #357

    • Curso HTML e CSS: Classes, posicionamento e Flexbox

      08h
      • Aprenda o que são classes CSS e sua importância
      • Conheça o Flexbox e aplique técnicas para posicionar seus elementos de forma prática
      • Saiba como estilizar seus textos, fontes e ícones
      • Entenda como posicionar os elementos de uma página com CSS
      • Descubra como aplicar efeitos de estilização alterando cores, arredondamentos e importar fontes para seu projeto
  2. 2 Organize sua página e deixe-a responsiva para diferentes telas

    Neste segundo passo você aprenderá a organizar uma página com CSS Flexbox, criar cabeçalhos, rodapés e aplicar estilos com CSS. E por fim, tornar o seu site responsivo para diferentes tamanhos de tela.

    • Curso HTML e CSS: cabeçalho, footer e variáveis CSS

      06h
      • Entenda o dia a dia de um desenvolvedor Front-end de forma prática
      • Saiba como criar um código HTML e CSS seguindo boas práticas de programação
      • Descubra como utilizar variáveis CSS para manter seu código sustentável e limpo
      • Trabalhe com mais de uma página HTML no mesmo projeto
      • Conheça as pseudo classes com exemplos reais e práticos
    • Curso HTML e CSS: trabalhando com responsividade e publicação de projetos

      06h
      • Saiba como tornar seu site responsivo para diferentes telas
      • Descubra o que é como usar a Media Query em seus projetos
      • Crie uma conta no GitHub para armazenar seu código na nuvem
      • Entenda a diferença de medidas absolutas e relativas
      • Publique seu projeto finalizado na web e mostre para todo o mundo
    • Alura+ GitHub: diferentes maneiras de compartilhar seu projeto

    • Curso HTML e CSS: praticando HTML/CSS

      08h
      • Construa um site utilizando HTML e CSS
      • Identifique elementos e estilos através do Figma
      • Aplique seus conhecimentos adquiridos até agora em um projeto real
      • Crie um repositório para armazenar o código do projeto
      • Realize o deploy de um site através do Github Pages ou Vercel
      • Compartilhe o seu projeto com o mundo
    • Artigo Como colocar seu projeto no ar com o Github Pages? | Alura

  3. 3 Aprimore os seus conhecimentos e desenvolva layouts modernos para web

    Você está quase lá! Neste último passo você aperfeiçoará os seus conhecimentos em HTML e CSS, criando páginas web modernas e responsivas. Com o aumento do uso da internet em dispositivos móveis, torna-se imprescindível desenvolver sites adaptáveis a diferentes tamanhos, formatos e resoluções de tela. Aprenda técnicas e melhore a experiência do usuário em diferentes cenários.

  4. 4 Desenvolva layouts modernos do Figma em páginas web reais

    Você está quase lá! Neste último passo você vai colocar em prática tudo o que aprendeu nos passos anteriores. Você aplicará conhecimentos de HTML e CSS para transformar um layout do Figma em uma página real, simulando uma tarefa comum no mercado de trabalho e também páginas e aplicações com layouts responsivos.

Escola

Front-end

Além dessa, a categoria Front-end conta com cursos de HTML, CSS, React, Angular, JavaScript, jQuery,e mais...

Conheça a Escola

Comece a estudar agora na maior escola de tecnologia do país

Plus

De
R$ 1.800
por
12X
R$109
à vista R$1.308
  • Acesso a TODOS os cursos por 1 ano

    Formações com mais de 1500 cursos atualizados e novos lançamentos semanais, em Programação, Inteligência Artificial, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Certificado

    A cada curso ou formação concluído, um novo certificado para turbinar seu currículo e LinkedIn.

  • Mentorias com especialistas

    No Discord, você tem acesso a eventos exclusivos, grupos de estudos e mentorias com especialistas de diferentes áreas.

  • Comunidade exclusiva

    Faça parte da maior comunidade Dev do país e crie conexões com mais de 120 mil pessoas no Discord.

  • Acesso ao conteúdo das Imersões

    Acesso ilimitado ao catálogo de Imersões da Alura para praticar conhecimentos em diferentes áreas.

  • App Android e iOS para estudar onde quiser

    Explore um universo de possibilidades na palma da sua mão. Baixe as aulas para assistir offline, onde e quando quiser.

Matricule-se

Pro

De
R$ 2.400
por
12X
R$149
à vista R$1.788
  • Acesso a TODOS os cursos por 1 ano

    Formações com mais de 1500 cursos atualizados e novos lançamentos semanais, em Programação, Inteligência Artificial, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Certificado

    A cada curso ou formação concluído, um novo certificado para turbinar seu currículo e LinkedIn.

  • Mentorias com especialistas

    No Discord, você tem acesso a eventos exclusivos, grupos de estudos e mentorias com especialistas de diferentes áreas.

  • Comunidade exclusiva

    Faça parte da maior comunidade Dev do país e crie conexões com mais de 120 mil pessoas no Discord.

  • Acesso ao conteúdo das Imersões

    Acesso ilimitado ao catálogo de Imersões da Alura para praticar conhecimentos em diferentes áreas.

  • App Android e iOS para estudar onde quiser

    Explore um universo de possibilidades na palma da sua mão. Baixe as aulas para assistir offline, onde e quando quiser.

  • Luri, a inteligência artificial da Alura

    Luri é nossa inteligência artificial que tira dúvidas, dá exemplos práticos, corrige exercícios e ajuda a mergulhar ainda mais durante as aulas. Você pode conversar com a Luri até 100 mensagens por semana.

  • Alura Língua - Inglês e Espanhol

    Aprenda um novo idioma e expanda seus horizontes profissionais. Cursos de Inglês, Espanhol e Inglês para Devs, 100% focado em tecnologia.

Matricule-se

Ultra

12X
R$209
à vista R$2.508
  • Acesso a TODOS os cursos por 1 ano

    Formações com mais de 1500 cursos atualizados e novos lançamentos semanais, em Programação, Inteligência Artificial, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Certificado

    A cada curso ou formação concluído, um novo certificado para turbinar seu currículo e LinkedIn.

  • Mentorias com especialistas

    No Discord, você tem acesso a eventos exclusivos, grupos de estudos e mentorias com especialistas de diferentes áreas.

  • Comunidade exclusiva

    Faça parte da maior comunidade Dev do país e crie conexões com mais de 120 mil pessoas no Discord.

  • Acesso ao conteúdo das Imersões

    Acesso ilimitado ao catálogo de Imersões da Alura para praticar conhecimentos em diferentes áreas.

  • App Android e iOS para estudar onde quiser

    Explore um universo de possibilidades na palma da sua mão. Baixe as aulas para assistir offline, onde e quando quiser.

  • Luri, com mensagens ILIMITADAS

    Mensagens ilimitadas para estudar com a Luri, a IA da Alura, disponível 24hs para tirar suas dúvidas, dar exemplos práticos, corrigir exercícios e impulsionar seus estudos.

  • Luri Vision, a IA que enxerga suas dúvidas

    Envie imagens para a Luri e ela te ajuda a solucionar problemas, identificar erros, esclarecer gráficos, analisar design e muito mais.

  • Alura Língua - Inglês e Espanhol

    Aprenda um novo idioma e expanda seus horizontes profissionais. Cursos de Inglês, Espanhol e Inglês para Devs, 100% focado em tecnologia.

  • 6 Ebooks da Casa do Código

    Escolha os ebooks da Casa do Código, a editora da Alura, que apoiarão a sua jornada de aprendizado para sempre.

Matricule-se
Conheça os Planos para Empresas

Acesso completo
durante 1 ano

Estude 24h/dia
onde e quando quiser

Novos cursos
todas as semanas