Design comparison
Solution retrospective
Hello everyone ! Done with sass html and css. Waiting for your feedbacks !
Community feedback
- @SzymonRojekPosted almost 4 years ago
Hi Yagiz,
Well done! :D
I've just checked your HTML structure and preview site by the inspector. A few tips from me:
- I'd suggest all this content put inside of the wrapper, then the text from the top: probably instead of the section I would use the aside tag with aria-label or treat it as a header tag (inside all text) and below the header you can create the main tag with all cards as a article for example (each article with the heading and paragraph);
- here we have a good occasion to create the h1 tag instead of two h2, for example sometimes I have seen this solution:
<h1 class="heading-primary"> <span class="heading-primary-main">Reliable, efficient delivery</span> <span class="heading-primary-sub">Powered by Technology</span> </h1>
- I'd recommend reading more about the alt text. You don't need to use words like picture or image, photo, icons in the alt text as it's already announced as being an image; from the other hand maybe I would even remove all the text from the alt and just use alt="" (empty attribute) instead so assistive tech knows to ignore those images because they are not very important here (this only my suggestion, please check it out);
- remove style CSS from the HTML;
- you can work with RWD because there is a huge gap between mobiles and 1000px (for example after mobile size you can create two rows with two boxes), also play around with the margin, padding, text on mobiles);
- the box-shadow is a little bit too strong;
I have read a very good article from the Smashing Magazine, Why You Should Choose HTML5 article Over section - but don't take it as a last oracle :D
That's it from me. Ps. Don't forget to upvote any comments on here that you find helpful.
Greetings :D
4@tosbaaPosted almost 4 years ago@SzymonRojek I don't know how to reply a comment like this. One of the most helpful feedback I have ever taken. Thank you a dozen times for this suggestions. Noted them all.
1 - @RenszCamachoPosted almost 4 years ago
Hiya ππ» Yagiz. Well done my friend πππ. You have done a fantastic job on this challenge π
πNice solution!!!! Keep codingπ§βπ»
2@tosbaaPosted almost 4 years ago@RenszCamacho Thank you so much for the feedback it matters a lot ππ
0 - @SzymonRojekPosted almost 4 years ago
I am glad to hear about it. Generally, HTML structure can be very tricky when you will start to think about intensively and sometimes it can be even annoying but donβt worry - we learn these things step by step, month after month.
Cheers :D
1@tosbaaPosted almost 4 years ago@SzymonRojek Exactly. Especially when you jump from documentations to practice
0
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