What is a Slider on a Website?
A slider, also called a carousel, is a website element that displays a rotating series of images or content panels in a single space. Visitors move between slides with arrows, dots, or swipes, and some sliders advance automatically on a timer. Sliders commonly showcase products, photos, or featured content on homepages and store pages.
More About Sliders
Sliders let you put several pieces of content in one prime spot, usually near the top of a page. Instead of stacking banners, you rotate messages through a single frame, which saves space and gives more than one item a shot at the most visible part of the page.
Don’t count on a slider to boost engagement, though. Nielsen Norman Group’s carousel usability research (published September 2013, last reviewed August 7, 2026) finds that visitors often scroll straight past carousels and miss everything inside them. A slider can still earn its place, but only with clear navigation and strong content in the first slide.
What the data says about sliders
In Notre Dame’s 2012–2013 homepage test, only about 1% of visitors clicked the slider, and 84% of those clicks went to slide 1. Erik Runyon tracked the ND.edu carousel from mid-October 2012 to January 2013 and published the numbers: the remaining slides drew roughly 4% of clicks each, and static carousels on 3 other Notre Dame sites with narrower audiences managed click rates of 1.7% to 2.3%. That’s one university’s traffic, not a universal click rate, but the practical advice from it is safe to follow: use 4 slides at most (3 is better), put the content you most need seen in slide 1, and give every slide a clear reason to click.
Autoplay and navigation
Visitors move through slides with arrow buttons, pagination dots, or a swipe on touch screens, and many sliders also advance on a timer. Auto-forwarding is the risky configuration. Jakob Nielsen’s usability testing (Nielsen Norman Group, January 19, 2013) found that auto-rotating panels annoy users, pull content away before slower readers finish, are hard to click for people with motor-skill impairments, and move like ads, which trains visitors to ignore them. Default to manual navigation. If slides must rotate, show a visible pause button and stop the rotation as soon as someone interacts.
Slider vs. carousel
Mostly the same thing. Both names describe a panel that rotates content through one space, and the labels get used interchangeably: Nielsen Norman Group files its research under carousels even when one panel shows at a time, while WordPress plugins like Slider by Soliloquy sell the same element as a slider. When a tool does separate the two, as the Smart Slider 3 plugin does, the split looks like this:
- Slider: one slide fills the frame at a time.
- Carousel: several slides sit side by side in the frame, with more scrolling into view.
Check a plugin’s demo rather than its name to see which layout you’re getting.
When to use a slider instead of a hero image
Default to a static hero image: one strong visual, one message, one call to action. The same carousel research suggests a static hero may serve you better: committing to one image pushes you to pick something powerful and demonstrative, and visitors can focus on it instead of dividing their attention among several frames. Choose a slider only when several items genuinely deserve equal billing, such as a store promoting a few product lines, and keep the navigation user controlled. Either way, repeat anything critical somewhere else on the page, since many visitors never see slide 2 and beyond.
Common types of sliders
Most sliders in the wild fall into 4 patterns:
- Hero slider: rotating banners at the top of a homepage, usually promotions or featured pages.
- Product slider: a row of items on a store page, often pulled from a WooCommerce category.
- Testimonial slider: customer quotes rotating in a compact block on service and agency sites.
- Gallery slider: a photo viewer with arrows or thumbnails, standard on portfolio and photography sites.
Slider performance and page speed
Sliders can slow a page down. A slider loads several images plus the JavaScript that animates them, right at the top of the page. The first slide is often the largest element above the fold, so a slow slider delays Largest Contentful Paint, the Core Web Vitals metric Google wants at 2.5 seconds or less. Compress every slide image, cap the count at 3 or 4, and lazy-load everything after slide 1. If page load time is already a problem on your site, a static image is the safer call.
Adding a slider in WordPress
Check what you already have before installing anything. There are 3 common routes on a WordPress site:
- Your theme or page builder: many include a slider element out of the box, so you may not need another plugin at all.
- A dedicated plugin: Slider by Soliloquy, for example, builds responsive image sliders with a drag-and-drop editor. WooCommerce product sliders, filtered by category, price, or availability, are a feature of the paid Soliloquy Pro version, not the free plugin.
- No slider at all: when one message matters most, a static hero image loads faster and focuses attention.
New to plugins? Our introduction to WordPress plugins covers finding, vetting, and installing one safely.
Frequently Asked Questions
What is a slider in UI design?
Slider also names a form control: a handle you drag along a track to pick a value from a range, like a volume control or a price filter. HTML implements it as the range input. This page covers the other sense, the slideshow-style content slider.
What is a gallery slider?
A gallery slider shows a photo collection one image at a time in a single frame, usually with arrows plus clickable thumbnails that jump to a specific photo. Portfolio and photography sites use them to present large images without a long scrolling page.
Are sliders accessible?
Auto-advancing sliders are the biggest accessibility risk: they pull content away before slow readers finish and are hard to click for people with motor impairments. If you use one, add a pause button, make the arrows keyboard reachable, and give every slide image alt text.
Do sliders work on mobile?
Yes, when the slider is responsive. On phones, visitors expect to swipe between slides instead of hunting for small arrows, so choose a slider with touch support that serves scaled-down images rather than desktop-sized files.
