Design comparison
Solution retrospective
Neste projeto eu fixei meus conhecimentos sobre flex e aprendi a usar a função hsl() para declarar cores
What challenges did you encounter, and how did you overcome them?Eu não sabia o tamanho exato do cartão, então fui alterando a altura e a largura até parecer que era igual ao design fornecido
What specific areas of your project would you like help with?Eu gostaria de receber ajuda na parte de estilização do código
Community feedback
- @R3ygoskiPosted 5 months ago
Olá Isabela, parabéns pela conclusão do seu projeto, ele ficou perfeitamente idêntico ao design proposto, parabéns mesmo!
Sobre a sua pergunta, sinceramente eu não entendi ela muito bem, você quis dizer que queria ajuda na parte do CSS é isso? Bom, sobre seu CSS, ele está muito bom, não vejo muito o que melhorar. A única parte que eu iria sugerir uma alteração no seu CSS é no Reset, que tem algumas redundâncias, que seria o
border
,outline
efont-weight
que foram utilizados ali mas acabam não tendo efeito, e também a estilização para tags<a>
e<ul>
, que nem se quer foram usadas no seu projeto.Agora sobre seu HTML, a estrutura dele está correta, mas ele está pouco semântico, e isso pode acabar afetando a acessibilidade da sua página, então é mais recomendável utilizar sempre tags semânticas, mostrarei algumas que você pode alterar:
<div class="container">
poderia e deveria ser alterado para<main>
, isso porque sempre depois da tag<body>
, deve vir uma tag<main>
. Mas também porque essa<div>
que representa o conteúdo principal da sua página.<div class="card">
poderia ser alterado para um<article>
, pois o conteúdo aqui presente é independente e autoexplicativo.
E é isso, seu projeto está muito bem feito, novamente, meus parabéns, continue praticando e se aprimorando, caso tenha ficado alguma duvida quanto ao que eu falei, por favor, comente abaixo que tentarei ajudar da melhor forma possível.
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord