Freddy Muriuki — September 27, 2019 Website sliders. We absolutely love them, but they can be a pain in the neck. And if you aren’t careful, they might slow your WordPress website, diffuse your message, and scare away visitors – three things you don’t want.
But if you know what you’re doing, they are a delightful way of painting a great picture. Additionally, there are tons of powerful plugins to create sliders that are completely out of this galaxy.
In today’s post, we highlight several best practices you must follow to make the most out of your sliders. Keep in mind sliders are tricky, and can cause you problems you must address immediately. Going forward, check where you must improve and get to work right away.
That out of the way, let us dive in since there is a lot to learn.
7 WordPress Slider Best Practices To Follow
The following practices help you to create sliders that work for you, and never against you. Between you and me, a great slider should load beautifully and look dashing. Most importantly, it should lead your target customer to take action.
If you use a slider to showcase photos or a portfolio, the following tips come in handy too.
Choose a WordPress Theme with a Slider Plugin
You can choose any WordPress theme you fancy and add sliders thereafter. However, starting with a slider-ready theme saves you a ton of time, more so if you build a couple of sliders for different websites.
Besides, if you plan to add sliders to your WordPress site, it costs less to start with a theme that comes with a slider plugin. And since the plugin is already integrated into the theme, you have plenty of custom options to style the sliders for any brand.
Slider Revolution is one of the most popular WordPress slider plugins and my go-to solution. And if it’s your cup of tea, here are 20 Great WordPress Themes with Slider Revolution. If you use a different slider plugin, you can easily find WordPress themes with that specific plugin.
Indulge me, ladies and gentlemen. Slider Revolution is pretty remarkable. Thanks to a fantastic list of features, responsive design, and a friendly UI, I can whip up beautiful sliders in the time it takes you to chow a burger.
For projects that require a slider, I always go for Slider Revolution. It’s so easy to use, but if you ever need help, you can always find an excellent Slider Revolution tutorial to help.
Back to the point: Choosing a WordPress theme with a slider plugin saves you time and money as a business owner or web designer.
Design for Mobile
We live in an era of devices with varying screen sizes. Nowadays, many people, including your target audience, visit your website via a mobile device. According to Statistica, mobile devices account for nearly half of the web traffic globally.
For this reason, you must create mobile-friendly and responsive sliders that work across various devices. Many plugins enable you to create responsive sliders, so you ought to be sorted in this area. However, if you code sliders from scratch, you must incorporate responsive design techniques.
On top of that, optimize the media you use in your sliders. Large images or videos will only get in your way, leading to slower page speeds and problems with responsivity. The rule of thumb is to keep your sliders simple, elegant and easy to navigate. Oh, and don’t forget to make your sliders touch-friendly too 🙂
When all is said and done, designing sliders for mobile helps you reach more customers regardless of the device they use. Always adopt a mobile-first approach when creating sliders.
Turn Off AutoPlay or Reduce Rotation Speed
Sliders are meant to be seen, but I have seen designers use auto-play or sliders that rotate infinitely and fast. Let’s start with auto-play.
A section of internet users reports that sudden movements on websites are annoying or distracting. Some experts argue that “…your visitors will be too distracted by the image sliders to notice anything else.”
To avoid the problem, we recommend disabling auto-play. In its place, add clear navigation offering the visitor more control to move from slider to slider as they desire.
On top of reducing distractions, disabling auto-play offers visitors the feeling of being in complete control while on your website, which has a correlation with better conversion rates.
The same goes for rotation speed. Set slower rotation speed to offer users enough time to view the slides. It is annoying for a slider to load the next item while you’re still viewing the current one. Things are even worse when the speed is higher.
But instead of reducing slider speed, best is to turn off auto-play entirely. If that’s not an option, add manual controls. That way, users have more control over the slider, which is exactly what you want.
Use Thumbnail Navigation
Offering the best navigation is one of the best website usability decisions you’ll ever make. Usually, sliders occupy plenty of real estate on your website, and as long as you have a slider, it better be navigable.
Thumbnail navigation offers you exactly the solution you need. Now, your visitor can preview a slide and know what to expect. Additionally, the user can manually go to any slide with a click, without having to scrub back and forth.
Thumbnail navigation is especially perfect for sliders with more than 4 slides.
Leverage Lightboxes
Let’s say, for a moment, you’re a photographer or graphic designer looking to showcase your portfolio. A typical slider is one of the best ways of sharing your work with the world.
To offer a bigger and better experience, you can leverage the power of lightboxes. Adding a lightbox to your slider allows you to take advantage of large displays and resolutions to display your best work.
Set up the lightbox to launch every time the user clicks a slide. The best part is users can continue viewing your slider inside the lightbox, which is awesome.
Link Product Slides to Your Cart
Closing a sale is of utmost importance to many, if not all, online entrepreneurs. You work so hard to build an online store, so you can sell your wares and – we all agree that – getting one extra sale is always welcome.
Seeing as sliders occupy prime real estate on your site, it’s important that they work for your conversion rates. At the same time, you mustn’t create sliders that look like banner ads because banner blindness is a real thing.
Assuming you’ve created beautiful product slides, the next thing you should do is link said slides to the respective product pages. Make sure your Call to Action (CTA) buttons are prominent and clear.
With carefully placed product slides, you can effectively drive targeted traffic to your best-selling products. Further, A/B test your product slides to put a finger on the ones with the best results.
Take Advantage of Social Media
Social media networks can help you spread the brand message like a boss. At the same time, you can use social media streams to drive engagement on your WordPress site?
How? You ask.
You can add a slider that pulls images from your Facebook, Twitter and Instagram accounts among others. Instead of manually uploading images to your sliders, you can use a plugin to integrate social media with your sliders.
Using social media images is advantageous especially if you post a lot on social networks. You can repurpose the content into a slider in a way that works for your business.
Many WordPress slider plugins support integration with social networks, meaning you’re covered in this regard. While on it, add a “Pin-it!” button to your sliders.
Bonus Tips:
- Don’t use H1 headings in your sliders – Doing so messes up your SEO
- Keep text on your sliders short and clear, especially if you use autoplay (which, you shouldn’t)
- Schedule your promotional slides
- Protect your slides from image theft
- Use custom CSS to add personalized styles to your sliders
- Set up useful and relevant sliders
- Replace your slider with a hero image
- Make your sliders accessible for all users
Conclusion
Sliders are great, especially when you know what you’re doing. If you don’t do your homework, sliders cause you problems.
However, I hope you found a few gems after reading today’s article. What are your views on sliders?
Please comment below; I will monitor the comment section for the next 24 hours, so let’s GO!
Digital & Social Articles on Business 2 Community
(55)
