Design comparison
Community feedback
- @correlucasPosted about 2 years ago
👾Hello @ColonelSandurz, congratulations on your new solution!
I’ve some suggestions for you:
Your html is working but you can improve it using meaningful tags and replace the divs, for example the main div that takes all the content can be wrapped with
<main>or section, about the cards you can replace the<div>that wraps each card with<article>you can wrap the paragraph with the quote with the tag<blockquote>this way you'll wrap each block of element with the best tag in this situation. Note that<div>is only a block element without meaning, prefer to use it for small blocks of content.This article from Freecodecamp explains the main HTML semantic TAGS: https://www.freecodecamp.org/news/semantic-html5-elements/
Add the website favicon inserting the svg image inside the
<head>.<link rel="icon" type="image/x-icon" href="./images/favicon-32x32.png">✌️ I hope this helps you and happy coding!
Marked as helpful0@ColonelSandurzPosted about 2 years ago@correlucas Thank you for your response. This is something I have to get used to as when I go through tutorials many typically use DIV's for everything, but I see why it should be done this way instead.
0 - @CarolkiariePosted about 2 years ago
Hello Colonel. Congratulations on finishing the project. I went through your code and I noticed that you did not include a media query for your project. I found this article which went into detail about why you should do a mobile first approach when designing.
https://xd.adobe.com/ideas/process/ui-design/what-is-mobile-first-design/
Second suggestion is for you to include a css reset into your code. Josh has a really good css reset which you can check out.
https://www.joshwcomeau.com/css/custom-css-reset/
happy coding!
Marked as helpful0@ColonelSandurzPosted about 2 years ago@Carolkiarie Thanks for your feedback. I included media queries on my last two projects but completely overlooked it for this one for some reason. Thanks for the reminder and I will take a look at those links you provided.
0
Please log in to post a comment
Log in with GitHub
Join 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