Design comparison
Solution retrospective
How i can do it better? not sure if this will work perfect in any situation.
Community feedback
- @devriquesantPosted over 1 year ago
Hello @rodrigobeckmann
Congratulations for completing this challenge!!
✏️ Here are some tips and suggestions for this and your future projects ;) ✏️
1. 🚀 Contain your "main" content in a "main" tag:
<main>
is a semantic element from HTML which provides accessibility and organization for your web page;- semantic elements provides detailed info about the contents in your page.
- Others semantic elements includes:
<header>
,<footer>
,<figure>
,<figcaption>
... - To implement this, you should exchange the
<div class="main">
for<main>
and wrap all the necessary and main content of your page
2. 📱 Build a responsive web page:
- Use
px
unit to dimension your components in the page makes it a appearance of static. - To build a more responsive one, you should start to use relative length units to adequate the page components to a device screen.
- To deeper details, take a look at it
3. 🌐 Build an accessible web page:
- There are a lot of users of all kinds around the world! in order to make everyone able to use the program you just made you could provide some accessibility. But how?
- The
<img>
tag has thealt
property which helps screen readers to get all the content and info in your page. - It’s simple, just add an
alt
based on description of the image as:<img src=”cat.jpg” alt=”A cute cat”>
Overall your project is great and keep coding, I'm sure you will discover new things and become even better
Here, take a star for achieving it: 🌟 <- it's a glowing star if you're seeing a rectangle :)
Marked as helpful0 - @Davidmide02Posted over 1 year ago
Hi Rodrigo, you did a nice job but there is always room for improvement. Below are what you can Improve on:
- your choice of html tags, always make use of the Semantics tags where appropriate. It make your code more readable just to mention but a few.
- make sure your image tag always has alt.
For the layout, you did a perfect job! keep building, it can only get better!
If this is helpful you can hit the helpful button.
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