Skip to content
  • Learning paths
  • Challenges
  • Solutions
  • Articles
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted over 4 years ago

Loopstudios landing page

Emmilie Estabillo•5,580
@emestabillo
A solution to the Loopstudios landing page challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


Hi everyone, thought I'd give this fun challenge a go. I've noticed that the screenshot mirrors the project in Firefox compared to Chrome. I've had to make adjustments to keep them acceptable on both, aside from the prefixes. I also can't get my .container class to be as wide as it's supposed to be. It's identical to the design files in width, but it's a few pixels off when superimposed to the design. I can live with the results though :-)

My questions are mostly related to accessibility. What is the best way to deal with the base font size? I've been using the 62.5% route, since that was the advice given to me before. I've been reading up on it recently, and it was mixed opinions. So for this project, I reverted to setting it on html as px. Should I have placed a percentage value instead? Do I put it on body or html? Or should I stick to 62.5%? Looking for the standard and more accessible option.

Also, I'm not keen on major animations but I tried some here using a library to spiff up UX. At what point/how does it negatively affect accessibility?

Thanks and looking forward to your comments!

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Emmilie Estabillo's solution.

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
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub