kenzie-academy-brasil-developers / m1_sprint1_entrega_blog-lucassoaresol

m1_sprint1_entrega_blog-lucassoaresol created by GitHub Classroom

🏁 Entrega: Blog Kenzie HTML

Importante!

Lembre-se de que essa entrega é individual e qualquer suspeita de plágio ou interferência na entrega de outro aluno pode ser questionada pela equipe de ensino.

Nessa entrega vamos criar estrutura de um blog com HTML, iremos utilizar o blog da kenzie como referência para criar os posts.

🤔 Como irá funcionar esse site?

Esse site será um compilado de links externos, ou seja, haverá o título e subtítulo da postagem, mas ao usuário clicar no post o site levá-lo para outro site para visualizar o artigo completo.

Após os posts, teremos um formulário solicitando o email do usuário, para caso deseje receber notícias em seu e-mail.

Então, vamos lá, segue as orientações:

🗒️ Posts

Escolha quatro postagens do blog da kenzie e crie os posts no seu HTML sendo:

• Título do post: Título do post extraído no blog da Kenzie
• Descrição: Máximo de 200 caracteres. Você pode extrair o início do texto do post
• Autor: Autor do post extraído no blog da Kenzie
• Link: Contendo a URL do post no site da Kenzie

👨🏿‍💻 Newsletter

Após os posts, você precisará criar uma seção que solicita a assinatura do usuário para a newsletter do seu blog, contendo:

• Título: Ex: Deseja receber nossas notícias em primeira mão?
• Descrição: Explicação do que é necessário para receber as notícias
• Campo de email: Campo obrigatório
• Botão para assinar a newsletter: Botão para enviar o formulário

Para dar uma melhor referência visual de como deverá ser disponibilizado os conteúdos, segue um protótipo:

Dica!

Caso deseje uma visualização mais interessante do layout acima, acesse por meio do aplicativo de criação de interfaces Figma, no seguinte link: Protótipo entrega - Figma

👨🏿‍💻 O que será avaliado?

• Utilização das metags para título e descrição da página

• Utilização do ícone da página, você pode utilizar a logotipo da kenzie: Fazer download , ou outro de sua preferência

• Utilização das tag semânticas do HTML

• Por exemplo:

  <article></article> <!-- Para os posts -->
  <form></form> <!-- Para o formulário -->
  

• Validação do input utilizado no formulário da Newsletter

• Por exemplo:

😎 Vamos nessa!

Qualquer dúvida, solicite seu facilitador

Carregando…