Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Social Proof Section — Challenge Completed by alnahian2003

Al Nahian 775

@alnahian2003

Desktop design screenshot for the Social proof section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi There, Today I've completed this challenge and I tried to make the project 100% pixel perfect as shown in the design. Let me know if there's something that I've missed to do or give me some suggestions that how could I make this project more perfect.

Thank You

Community feedback

Szymon Rojek 4,540

@SzymonRojek

Posted

Hi @alnahian2003,

What can I say, great job, especially that was your first project here. Very good RWD.

I've only seen the HTML structure so I'd like to write a few tips:

  • I know that we can see this project as a whole component so basically, it can be a section, but here we can treat it as a separate project. In that case, you can use the main, also header (which can be used even a few times on the page), and finally an article tag.

If you want to gain more knowledge, I can recommend another article from the Smashing Magazine, Why You Should Choose HTML5 article Over section - but don't take it as a last oracle ;) Let me know what do you think about it.

Finally, congrats! Please, don't forget to upvote any comments on here that you find helpful. That's it from me. Hopefully, it will help you.

Greetings :D

2

Al Nahian 775

@alnahian2003

Posted

Hey Mate, Szymon Rojek!

Thank you so much zillion of times because you've shared your vast knowledge with me to improve my way of writing HTML. I studied again about the Semantic way of writing HTML code and you know what, I'm implementing the idea of semantic elements in my current challenge!

Thank you again. Stay Cool :D

Happy Coding <3

Edit: I'm so much grateful for you attachments (I mean, the useful links)

1
Szymon Rojek 4,540

@SzymonRojek

Posted

@alnahian2003

Very nice! That's great that you are implementing the semantic concept in your project. What kind of project are you doing?

Happy coding!

1
Al Nahian 775

@alnahian2003

Posted

Hi there, Szymon. Good Evening. How are you doing? Alright, you wanted to know about which challenge/project I'm currently working on, right?

Okay, here's the link: https://www.frontendmentor.io/challenges/manage-landing-page-SLXqC6P5/hub/manage-landing-page-NqgS-8rdM

Did you already complete this challenge? If not, then feel free to complete this challenge as well.

Happy Coding

1

@adluders

Posted

WOW! Really good job, specially in the responsiveness of it. My only suggestion would be to get in the habit of adding alt attribute to img tags because of accessibility and what not. Also, I love the hover effect you have on the ratings section!

2

Al Nahian 775

@alnahian2003

Posted

Hey @Adluders!

Thank you so much for appreciating and I really love your kind suggestion to get in the habit of adding alt attribute to the <img> tags. I really never thought that the alt attribute will be important for improving accessibility. I would definitely try to get myself in a good habit of always following the best practices while designing websites.

Thanks Again. Happy Coding!

1
Al Nahian 775

@alnahian2003

Posted

Hello, Adluders! I've already improved the challenge by adding alternative text in <img> tag. Thank You Once Again.

1

@adluders

Posted

@alnahian2003 LoL! I did not see this response! 👏 👏 👏

1

@mdsalahuddin2001

Posted

Great work

1

Al Nahian 775

@alnahian2003

Posted

Hey @mdsalahuddin46464 Thank You!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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