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

Blogr landing page mobile first with css animations

XIII 790

@minibrusp

Desktop design screenshot for the Blogr landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


feedback needed...

Community feedback

P
tediko 6,500

@tediko

Posted

Hello, XIII! 👋

Really good job on this challenge! I like that you tried something new and create this onload animation! This is just my suggestion but maybe make this onload red background to be 100% height of your whole site and disable scrolling during this animation (because now i can scroll down and there's nothing but white 😅) and remove these two buttons since i won't click them anyway in that animation because there is not time. Just leave logo, h2 and paragraph.

Additionaly, you can make your page more accessible for keyboard users. Set some outline to your links on focus state. Continuing this thread, due to the fact that your nav__link is a div i can't access it using my keyboard. I think you can either use role on that or maybe change to atag.

Good luck with that, have fun coding! 💪

1

XIII 790

@minibrusp

Posted

@tediko thanks, yeah you're right it looks bad when user can scroll during animation will try your suggestions. Thanks for the feedback really appreciate it. Looking forward for more pointers from you in the future. ^^

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