emjogale/testimonial-slider

Frontend Mentor - Coding bootcamp testimonials slider solution

This is a solution to the Coding bootcamp testimonials slider challenge on Frontend Mentor.

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Overview

The challenge

Users should be able to:

• View the optimal layout for the component depending on their device's screen size
• Navigate the slider using either their mouse/trackpad or keyboard

Screenshot

Links

• Solution URL: https://github.com/emjogale/testimonial-slider
• Live Site URL: https://testimonial-slider-zeta.vercel.app/

My process

Built with

• Semantic HTML5 markup
• Flexbox
• Mobile-first workflow

What I learned

• I tried to make the slider as accessible as possible as I have read that they are generally not very accessible due to the varying ways of structuring them.

Continued development

• I need to do more research on accessibility.
• I continue to find the sizing and positioning of background images tricky so need to do more research in this area.

Useful resources

• How to build a more accessible carousel or slider - I found this article helpful.

Author

• Frontend Mentor - @emjogale
• Twitter - @emmagale2635