Difference between revisions of "Carousels"
Jump to navigation
Jump to search
| Line 16: | Line 16: | ||
== If you have to use them== | == If you have to use them== | ||
* [https://www.w3.org/WAI/tutorials/carousels/ Carousels] by the [[WAI]] provides a tutorial on creating an accessible carousel. | |||
*[http://bradfrost.com/blog/post/carousels/ Carousels] by [[Brad Frost]] outlines how to know if you should be using one, when to use one, and how to do so responsibly. | *[http://bradfrost.com/blog/post/carousels/ Carousels] by [[Brad Frost]] outlines how to know if you should be using one, when to use one, and how to do so responsibly. | ||
*[http://uxmovement.com/navigation/why-users-arent-clicking-your-home-page-carousel/ Why users aren't clicking your home page carousel] explains how to improve a carousel's navigation | *[http://uxmovement.com/navigation/why-users-arent-clicking-your-home-page-carousel/ Why users aren't clicking your home page carousel] explains how to improve a carousel's navigation | ||
* [https://inclusive-components.design/a-content-slider/ A Content Slider] by [[Heydon Pickering]] provides ways to make the carousel more inclusive and less suck. | * [https://inclusive-components.design/a-content-slider/ A Content Slider] by [[Heydon Pickering]] provides ways to make the carousel more inclusive and less suck. | ||
* https://dev.to/jasonwebb/how-to-build-a-more-accessible-carousel-or-slider-35lp How to build a more accessible carousel or slider] by [[Jason Webb]] also covers accessibility concerns. | |||
* [https://bbc.github.io/gel/components/carousels/ Carousels] by the [[BBC GEL]] provides a component spec for carousels. | |||
* [https://ui-patterns.com/patterns/Carousel/examples/298 Carousel Design Pattern] on [[UI Patterns]] provides screenshots of carousels on different sites. | |||
===Examples=== | ===Examples=== | ||
These are examples that I pulled from places I trust, like accessibility boards and such. I still don't think you should use them, but hey.... | These are examples that I pulled from places I trust, like accessibility boards and such. I still don't think you should use them, but hey.... | ||
* [https://ebay.gitbooks.io/mindpatterns/content/disclosure/carousel.html eBay carousel] | * [https://ebay.gitbooks.io/mindpatterns/content/disclosure/carousel.html eBay carousel] | ||
Latest revision as of 13:40, 10 June 2022
Fuck carousels. Why? Read on.
Fuck carousels.
- 22.7 million pixels of raw slideshow power by The Onion probably tells you just in the headline how pretentious most slideshows and carousels can be... but don't worry, they've got a slideshow to fill you in on the rest of that pretentiousness.
- Do you know how well your carousels are performing? Probably really well on Item 1 and like shit on all the other items.
- Rotating Banners: they are never a good idea by The Good provides a video look at what it would be like to shop at a store if it was designed like a carousel. Hint: it sucks.
- Should I use a carousel? No. by Jared Smith explains why carousels are bad using statistics and industry experts... in a carousel.
- Sliders suck and should be banned from your website by Michiel Heijman on Yoast (an SEO optimization website) explains why carousels suck and hurt your SEO. (It also references one of the few good uses for a carousel: photos on a real estate website.)
- Image Carousels and Sliders? Don’t Use Them. (Here’s why.) by Peep Laja at CXL
Alternatives
- Rotating Website Carousels: 4 Alternatives That Drive Sales by Jon MacDonald
- 6 Design Alternatives to Avoid (Evil) Slideshows by Carie Fisher
If you have to use them
- Carousels by the WAI provides a tutorial on creating an accessible carousel.
- Carousels by Brad Frost outlines how to know if you should be using one, when to use one, and how to do so responsibly.
- Why users aren't clicking your home page carousel explains how to improve a carousel's navigation
- A Content Slider by Heydon Pickering provides ways to make the carousel more inclusive and less suck.
- https://dev.to/jasonwebb/how-to-build-a-more-accessible-carousel-or-slider-35lp How to build a more accessible carousel or slider] by Jason Webb also covers accessibility concerns.
- Carousels by the BBC GEL provides a component spec for carousels.
- Carousel Design Pattern on UI Patterns provides screenshots of carousels on different sites.
Examples
These are examples that I pulled from places I trust, like accessibility boards and such. I still don't think you should use them, but hey....