News for hackers. Stuff that matters.
Re:CSS Tips by pmlnr on Monday April 26, 2021 @02:53PM (#26946476)
> There are legitimate uses for snap-scrolling

https://shouldiuseacarousel.com/

So... no, there isn't a legitimate use for snap-scrolling. Leave scrolling alone.

Re:CSS Tips by jessep on Monday April 26, 2021 @03:29PM (#26946904)
Oy. Yes there, are legit uses. A few straightforward examples:

1) You implementing something boards (like trello) on mobile. The well-established-in-all-the-apps-that-specialize-in-this behavior is snap scrolling.

2) Tiktok/stories/etc. When you scroll up or right, does it ever land you in between two stories? No. This is the exact behavior.

3) Presentations. Say you are building a presentation tool. The whole point is to define separate slides that are on screen one at a time. This is a very natural and appropriate use of this behavior.

So, yeah, carousels suck. But, this behavior is commonly used and useful in a lot of modern software.

Re:CSS Tips by dfabulich on Monday April 26, 2021 @03:12PM (#26946701)
That page is mostly about auto-rotating carousels. Don't do that.

It's also about making your home page a giant carousel, instead of showing multiple things vertically. Don't do that, either.

IMO, one great use for carousels is when you have a product catalog with a bunch of category sections, like Netflix. Each category gets a header, e.g. "Action" "Family" "Romance" "Horror" and each category is a horizontally scrolling list of products, with the next one on the list half-visible on the side, so it's clear that you can scroll it into view.

Scroll snap can be pretty good for that.

Re:CSS Tips by ravenstine on Monday April 26, 2021 @03:24PM (#26946831)
Carousels are the modern day <blink> and <marquee> tags. The only difference is that it occasionally has its place with photos, but it's just not optimal for any sort of written content, even if it's just a headline and short description.
Re:CSS Tips by SamBam on Monday April 26, 2021 @03:15PM (#26946736)
nytimes.com uses horizontal carousel on mobile very well, I feel. It's usually for a group of related stories, it's non-intrusive, uses scrolling instead of buttons, and the next story is always partially-visible, which I think is gold-star UI for letting users know it exists.

My understanding is that NY Times spends quite a lot of effort on user metrics, so I would guess, but can't say for sure, that they have evidence that their carousels work.

Re:CSS Tips by dreadlordbone on Monday April 26, 2021 @03:14PM (#26946715)
My clients have large galleries of photos, would you prefer that be paginated?
Re:CSS Tips by metalliqaz on Monday April 26, 2021 @03:18PM (#26946767)
to a carousel? probably. or infinite scroll, depending on the type of content.

would probably be best to split up the galleries into smaller groupings, though

Re:CSS Tips by pmlnr on Monday April 26, 2021 @03:41PM (#26947057)
Yes.
Re:CSS Tips by ryanwhitney on Monday April 26, 2021 @03:16PM (#26946755)
There are plenty of uses for snap scrolling and carousels that aren’t rotating hero images.

See something like https://airbnb.com which uses it for categories a’la the App Store. Image galleries, Netflix-type layouts, etc.

Re:CSS Tips by lucideer on Monday April 26, 2021 @03:24PM (#26946837)
I'm struggling to see how that is different to "rotating hero images". Is it that it doesn't rotate automatically?

What's the UX benefit here?

I get that mobile apps use horizontal swiping and some websites want to be app-like, but even in apps the only common horiztonal-swipe pattern I see is the Android hidden menus pattern, which is (a) a subject of debate in UX circles and (b) absolutely nothing like horizontally scrolling item selection, which is still a bad idea even in native mobile apps.

The other major example I can think of is Instagram's story circles, which I feel must be intentionally unusable to try and force people to view stories in their full-screen tap-to-advance format.

Re:CSS Tips by cosmotic on Monday April 26, 2021 @06:31PM (#26949118)
That's a use for sure; though it remains an anti-pattern. Don't mess with the scroll.