Carousels are a design pattern that will probably outlive civilisation I’m afraid. As much as the fact that you probably don’t need a carousel is true, that overflow pattern is useful where there’s not much screen real estate available.
We’re getting a heap of new stuff here to make carousels less bad such as ::scroll-button()
and ::scroll-marker()
pseudo-elements. It seems like that’s the first iteration though — at least I hope so because I have no interest in using an icon font or HTML entities for arrows. Been there, done that and have experienced the trauma enough already, thanks.
Carousel best practices are handled by the browser, thanks to the engineering and accessibility teams working together. It’d be very difficult to make a more accessible carousel than this.
This is great to see. As soon as I saw this capability coming down the line I immediately worried about accessibility, naturally. Our industry (and browsers) don’t have the best track record or reputation…
All-in-all, this seems like a good feature of CSS — whether you agree with carousels or not — because the more client-side, DOM manipulating JavaScript we can get rid of, the better. One thing I also like about Adam’s demos especially is the progressive enhancement angle. We simply love to see it.
Check it out