DEV Community

guiadeti
guiadeti

Posted on • Originally published at guiadeti.com.br on

Evento sobre HTML Gratuito da Alura: Responsividade

O evento 7 Days de Responsividade, promovido pela Alura, oferece uma oportunidade gratuita para os participantes praticarem uma habilidade essencial: o desenvolvimento de páginas e aplicações com layouts responsivos.

Durante o evento, os participantes utilizarão seus conhecimentos de HTML e CSS para criar uma página real a partir de um layout no Figma, uma experiência que será valiosa em suas carreiras no mercado.

Serão explorados conceitos fundamentais, como Mobile First, media queries, unidades relativas e medidas responsivas em CSS, além de aprenderem sobre temas mais avançados, que são indispensáveis para quem está ingressando na área de Front-end.

7 Days de Responsividade

O evento 7 Days de Responsividade, promovido pela Alura, oferece uma oportunidade gratuita para os participantes praticarem uma habilidade essencial: o desenvolvimento de páginas e aplicações com layouts responsivos.


Imagem da página do evento

Este evento é ideal para quem deseja aprimorar suas competências na criação de interfaces que se adaptam a diferentes dispositivos.

Prática com HTML e CSS

Durante o evento, os participantes utilizarão seus conhecimentos de HTML e CSS para criar uma página real a partir de um layout no Figma.

Essa experiência prática será extremamente valiosa para suas carreiras no mercado de trabalho, permitindo que eles vivenciem o processo de desenvolvimento de forma direta e aplicada.

Conceitos Fundamentais e Desafios

Os participantes irão explorar conceitos fundamentais, como Mobile First, media queries, unidades relativas e medidas responsivas em CSS.

Os alunos terão a oportunidade de aprender temas mais avançados, que são indispensáveis para quem está ingressando na área de Front-end.

Serão 7 desafios em 7 dias, e quem estará à frente dessa jornada é Natália F. Dev, uma desenvolvedora Front-end que começou dando aulas de computação para crianças.

Apaixonada por aprender, Natália cria e compartilha conteúdo de tecnologia no YouTube e LinkedIn, com um foco especial em CSS.

Conteúdo Trabalhado

  • Dia 1: Já no primeiro dia, você vai ser apresentado com o layout de uma página no Figma, analisá-lo e usá-lo para criar o cabeçalho da sua aplicação, usando o conceito de Mobile First.
  • Dia 2: Aqui, você continuará o desenvolvimento a partir do que você fez no primeiro dia, e implementará o rodapé e o botão flutuante da aplicação. Além disso, você terá um Desafio Extra mais complexo, caso queira resolvê-lo.
  • Dia 3: Nesse dia o foco vai ser em CSS. Na aplicação que você desenvolveu até agora, o tamanho das fontes e outros elementos provavelmente está fixo para qualquer dispositivo, o que pode causar problemas em telas maiores. A sua tarefa será começar a ajustar a aplicação para usar unidades de medida relativas.
  • Dia 4: Chegou a hora de usar media queries! A sua tarefa nesse dia será reorganizar a lista de consultas da aplicação para que a mesma seja exibida em uma, duas ou três colunas, dependendo do tamanho da tela do usuário.
  • Dia 5: Nesse dia você irá alterar o CSS, a fim de transformar os itens que estavam no rodapé da versão Mobile em um formato de ‘menu lateral’ sempre que o site for acessado em dispositivos com telas maiores.
  • Dia 6: Continuando as adaptações para telas maiores, nesse dia você deverá trocar o paradigma de ‘botão flutuante’ para algo mais apropriado a telas de tablet e desktop, como um formulário.
  • Dia 7: No sétimo e último dia do desafio, você irá tornar a sua aplicação disponível de forma pública na internet. A sua tarefa será hospedar a sua página na nuvem, para que outras pessoas possam acessá-la e ela se torne acessível como um portfólio.

Como Participar

Essa iniciativa é voltada para quem tem interesse em tecnologia e programação, e deseja entender como praticar as habilidades exigidas pelo mercado de trabalho.

Após a inscrição, os participantes receberão um e-mail diário com o contexto, a tarefa e links de material extra sobre o assunto do dia.

É recomendado que cada um reserve pelo menos 1 (uma) hora para visualizar todo o material e completar o exercício, garantindo assim uma experiência de aprendizado enriquecedora.

        Você pode gostar




                                <span><img src="https://guiadeti.com.br/wp-content/uploads/2024/11/Evento-sobre-HTML-Alura-280x210.png" alt="Evento sobre HTML Alura" title="Evento sobre HTML Alura"></span>

                        <span>Evento sobre HTML Gratuito da Alura: Responsividade</span> <a href="https://guiadeti.com.br/evento-html-gratuito-alura-responsividade/" title="Evento sobre HTML Gratuito da Alura: Responsividade"></a>





                                <span><img src="https://guiadeti.com.br/wp-content/uploads/2024/11/Back-End-Java-280x210.png" alt="Back-End Java" title="Back-End Java"></span>

                        <span>Curso de Back-End Java Gratuito para PCD’s da Ada Tech</span> <a href="https://guiadeti.com.br/curso-back-end-java-gratuito-pcds-ada-tech/" title="Curso de Back-End Java Gratuito para PCD’s da Ada Tech"></a>





                                <span><img src="https://guiadeti.com.br/wp-content/uploads/2024/11/live-guiadeti-280x210.png" alt="" title=""></span>

                        <span>1ª Live do Guia de TI – Carreira, Tecnologia e Cursos</span> <a href="https://guiadeti.com.br/1a-live-do-guia-de-ti-carreira-tecnologia-e-cursos/" title="1ª Live do Guia de TI – Carreira, Tecnologia e Cursos"></a>





                                <span><img src="https://guiadeti.com.br/wp-content/uploads/2024/11/Tecnologia-da-Informacao-Beta-hub-280x210.png" alt="Tecnologia da Informação Beta hub" title="Tecnologia da Informação Beta hub"></span>

                        <span>Curso Sobre Tecnologia da Informação Gratuito da Beta hub: Conheça essa área!</span> <a href="https://guiadeti.com.br/curso-tecnologia-da-informacao-gratuito-beta-hub/" title="Curso Sobre Tecnologia da Informação Gratuito da Beta hub: Conheça essa área!"></a>
Enter fullscreen mode Exit fullscreen mode

HTML

HTML, ou HyperText Markup Language, é a linguagem de marcação padrão utilizada para criar páginas da web.

Ele fornece a estrutura básica para a apresentação de conteúdo na internet, permitindo que desenvolvedores organizem textos, imagens, links e outros elementos em um formato compreensível para navegadores.

Sem o HTML, a web como conhecemos não existiria, pois é a base sobre a qual todas as páginas são construídas.

Estrutura Básica de um Documento HTML

Um documento HTML típico começa com a declaração do tipo de documento, seguida pela estrutura básica que inclui as seções principais: cabeçalho e corpo.

O cabeçalho contém metadados, como o título da página e links para estilos e scripts, enquanto o corpo é onde o conteúdo visível da página é colocado.

Elementos e Tags HTML

HTML é composto por uma série de elementos, que são definidos por tags. As tags são geralmente agrupadas em pares, como parágrafos e suas respectivas finalizações, ou podem ser auto-fechadas, como imagens.

Os elementos podem conter atributos que oferecem informações adicionais sobre o comportamento ou a aparência do elemento. Por exemplo, a tag de imagem pode incluir um atributo que especifica a fonte da imagem.

A Importância da Semântica

A semântica em HTML refere-se ao uso de tags que transmitem significado sobre o conteúdo que elas envolvem.

Por exemplo, usar cabeçalho para o cabeçalho de uma página, rodapé para o rodapé e artigo para um conteúdo independente é uma prática recomendada.

Isso melhora a acessibilidade e a otimização para motores de busca (SEO), tornando o conteúdo mais fácil de entender para usuários e mecanismos de busca.

HTML5 e Novas Funcionalidades

HTML5 é a versão mais recente da linguagem e trouxe diversas melhorias e novas funcionalidades. Com HTML5, os desenvolvedores agora podem incorporar vídeos e áudio diretamente nas páginas sem a necessidade de plugins adicionais, utilizando as respectivas tags.

HTML5 introduziu novas APIs que permitem o armazenamento local de dados e a criação de aplicativos web mais interativos e dinâmicos.

Alura

A Alura é uma plataforma de educação online que se destacou no Brasil por oferecer cursos de tecnologia, design e negócios.

Com um portfólio abrangente, a Alura se propõe a capacitar profissionais e estudantes que desejam se atualizar ou iniciar suas carreiras em áreas em constante evolução, como programação, marketing digital, e desenvolvimento de produtos.

Abordagem de Ensino

A Alura adota uma abordagem prática e dinâmica de ensino. Os cursos são estruturados em módulos que combinam teoria e prática, permitindo que os alunos aprendam fazendo.

A plataforma oferece projetos reais e desafios que ajudam os alunos a aplicar o conhecimento adquirido em contextos práticos, preparando-os melhor para o mercado de trabalho.

Variedade de Cursos

A diversidade de cursos oferecidos pela Alura é um dos seus principais atrativos. Com mais de 1.000 opções de cursos, os usuários podem escolher entre tópicos como desenvolvimento web, mobile, ciência de dados, design, e muito mais.

A Alura também frequentemente atualiza seu conteúdo para refletir as últimas tendências e tecnologias do mercado, garantindo que os alunos estejam sempre aprendendo o que há de mais relevante.

Link de inscrição ⬇️

As inscrições para o 7 Days de Responsividade devem ser realizadas no site da Alura.

Compartilhe seu conhecimento e inspire outros a aprender com a Alura!

Gostou do conteúdo sobre o evento gratuito de HTML? Então compartilhe com a galera!

O post Evento sobre HTML Gratuito da Alura: Responsividade apareceu primeiro em Guia de TI.

Top comments (0)