Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted over 2 years ago

NEWS HOMEPAGE 🎯 [ ACCESSIBLE - BEM - VANILLA CSS3 - ES6 ]

accessibility
Abdul Khaliq 🚀•72,380
@0xabdulkhaliq
A solution to the News homepage challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


👾 Hello, Frontend Mentor Community,

This is my solution for the News Homepage.

  • Scored 97% on Google Pagespeed Insights! 🤩
  • Changed some of the font color's intentionally due to it's bad contrast which may affect accessibility 🙅🏻‍♂️
  • Custom navbar w/ scroll-in & scroll-out animation 🔥
  • Solution with 99.9% Percent Accuracy 🎯
  • Accessible hamburger menu w/ ES6 🍔
  • Minified the css files to improve site performance 🚀
  • Used Prettier code formatter to ensure unified code format ⚙️
  • Layout was built responsive via mobile first workflow approach 📲
  • Had a lots of fun while building this challenge ! 🤠
  • Feel free to leave any feedback and help me to improve my solution 💡

.

👨‍🔬 Follow me in my journey to finish all junior challenges to explore solutions with custom features and tweaks

Ill be happy to hear any feedback and advice !

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 Abdul Khaliq 🚀'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

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

Frontend Mentor

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

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