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

clipboard-landing-page-master

@MojtabaMosavi

Desktop design screenshot for the Clipboard landing page coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I would love to hear what you think about the following aspect of my solution.

  1. Do you see BEM being missused in any place ?
  2. Are my modifiers proper ?

Happy coding :)

Community feedback

P
tediko 6,580

@tediko

Posted

Hello, Mojtaba! 👋

Good job on finishing another challenge! What I can suggest you is:

  • Since your .header__logo image is decorative your alt text should be provided empty (alt="") so that they can be ignored by assistive technologies, such as screen readers.
  • Your .header container background doesn't stretch full width on higher resolutions. Use Responsive Design Mode to see how your site behave on different resolutions.
  • Wrap .footer__social-icons into some anchor tags.

Good luck with that, have fun coding! 💪

1

P
tediko 6,580

@tediko

Posted

@tediko Answering the question, I think your BEM looks good. It is clean, you're using modifiers in good way and also using reusable elements like .card. Good job. Since you're using Sass, take a minute and read about 7-1 pattern to keep your file management orginazed.

1

@MojtabaMosavi

Posted

@tediko Thanks, I tought about setting 'aria-hidden=true' on it but forgot. I checked out your solution, it looks really clean and precise (great job), what tool do you use for measurement ?

0
P
tediko 6,580

@tediko

Posted

@MojtabaMosavi There's a chrome extension called pixel perfect where you put image and you can set opacity on that image, so you can set your elements to fit with design. Other way if u can afford is to use premium and have acces to design files.

1

@MojtabaMosavi

Posted

@tediko Thanks, I try to use in the next project.

0

@rammcodes

Posted

Looks Great

1

@MojtabaMosavi

Posted

@RamMahe1110 Thanks :).

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