Follow our Carousel Best Practices for the most efficient use of home page space!
Carousels (also known as sliders) are widely used on home pages. However, they can have adverse consequences on user experience and affect your website’s performance. To make your home page carousel effective, follow these best practices:
Carousel Best Practices and Tips
- Avoid making your slider into a large, screaming banner ad. Users will likely skip over it, no matter how relevant it is to their needs.
- Use the carousel to present vivid imagery that embodies your message and brand.
- Carefully select the order of your slides. Users will likely only view the first one or two.
- Make sure carousel information is easily accessible elsewhere. Users with short attention spans won’t wait for sliders to scroll.
- Set your carousels to auto-rotate for a higher click rate, but make sure your slides don’t rotate too quickly. A carousel that moves too quickly frustrates users and distracts from other content on your home page. You should be able to slowly read through each caption twice before the slide changes. Set your auto-rotation settings to “pause on hover” so users trying to access information don’t get frustrated.
- Allow your users to scroll through sliders manually to speed up, slow down, or view past slides.
- Make sure carousels are optimized for mobile use, including the proper image size/layout, text readability, and the ability to swipe to the next slide. Consider hiding carousels entirely on the smallest screens (e.g., cell phone portrait view).
Follow these best practices and get your carousels working best for you and your users. For more information see Smashing Magazine’s Ten Requirements For Making Home Page Carousels Work For End Users (If Needed).
Read all our blog posts!