Flexbox - projeto-huddle-base

Community feedback

• 

  Rosana Pedra•20

  @rosanapedraPosted 5 months ago

  Obrigada Bernardo, por esse feedback. Eu não prestei atenção enquanto estava resolvendo. Então, retiro a <div> e a class que estava nela, eu posso colocar no <header> e no <footer> a mesma coisa né isso? Irei fazer essas alterações para na próxima não cometer mais esses erros. Nesse projeto não achei que ficou parecido com o modelo que eles pediram. 😔

  1

  ---

  

  Bernardo Poggioni•5,360

  @R3ygoskiPosted 5 months ago

  Olá novamente Rosana, não há de que, fico sempre feliz em ajudar outros devs.

  E sim, você entendeu corretamente, removemos as <div> e pegamos a classe que estavam nelas e passamos para o <header> e <footer>.

  Sobre ficar parecido, não se preocupe, com o tempo você acaba pegando o jeito, tanto que tem uma extensão de navegador que ajuda bastante a replicar o design, se chama PerfectPixel, recomendo dar uma olhada depois.

  1

  

  Rosana Pedra•20

  @rosanapedraPosted 5 months ago

  Obrigada novamente, irei instalar essa extensão. @R3ygoski

  0
• 

  Bernardo Poggioni•5,360

  @R3ygoskiPosted 5 months ago

  Olá Rosana, parabéns pela conclusão do projeto, ele ficou muito bem feito.

  Algumas sugestões quanto ao seu projeto. A primeira é que eu notei que você não utilizou um <h1> na sua página mas pulou direto para o <h2>, claro, isso em estrutura não tem problema, mas isso acaba sendo um erro para acessibilidade. O mais correto é que sempre se comece pelo <h1> e todas páginas devem conter um <h1>.

  Ainda sobre o HTML, notei também que você utilizou algumas tags com <div> dentro, por exemplo na sua tag <header>, isso não era necessário, ao invés de aplicar a estilização na <div>, você poderia ter aplicado diretamente na <header>, e isso também vale para o <footer>, tanto que se você tirar a classe da <div> dentro do <footer> e colocar essa mesma classe no seu <footer> o resultado será o mesmo. Uma dica seria, pense sempre nessas tags semânticas como se elas fossem <div> só que com um nome descritivo.

  Também sobre suas tags <a>, elas estão com um hrefvazio, o mais correto é colocar um valor nelas, mesmo que esse valor não leve a nenhum lugar, por exemplo: href="#". E também lembre-se sempre de colocar um aria-label em <a> que não possuem conteúdo de texto, para poder ajudar os leitores de tela a lerem aquele elemento.

  Agora sobre seu CSS, você fez dessa forma por exemplo para estilizar um elemento:

  .header .logo { }

  Isso não está errado, mas caso você ache que esteja ficando grande, ou que esteja verboso e confuso, saiba que você pode usar só um .logo nesse exemplo, pois você já estará direcionando para a classe desejada, e também já que existe só uma classe logo.

  E novamente, parabéns pela conclusão do seu projeto, caso tenha ficado alguma duvida, por favor, pergunte abaixo que tentarei ajudar da melhor forma possível.

  1