Submitted 7 months ago

Responsive accessible frontend Quiz App

Ortaly•970

@ortalyarts

Preview site View code

This is a solution for...Frontend Quiz app

HTML
CSS
JS

3intermediate

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

Built with:

Semantic HTML5 markup
Native CSS
Vanilla JavaScript
Mobile-first workflow
JSON to populate questions
CSS animations (transition + @keyframes)
Light / Dark theme switch
Aria role listbox + option to add accessibility for selecting subjects
CSS @media (prefers-reduced-motion) + Fallback in JavaScript

Checked with:

Chrome Screen reader
Chrome Lighthouse
PerfectPixel

What specific areas of your project would you like help with?

I am always glad to get any improvement suggestions, especially for accessibility.

Thanks in advance 🍭

Community feedback

Houari Aouinti•910
@aouintihouariPosted about 2 months ago
Great Job, Congratulations! I loved the animations and how the code is structured and organized, and how you made it accessible and SEO-friendly. There's just a little improvement, maybe when browsing from a tablet; there should be more margins on the horizontal axes, but good job overall.
1

Please log in to post a comment

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