Hacker News Reader

Comment by TechBro8615 | Hacker News Reader

How did I know this would be the top comment on HN?

There are legitimate uses for snap-scrolling, e.g. a horizontal carousel on mobile (or even desktop, depending on implementation), where you want swiping to swipe so the next item is in view.

Also, you said half these things should be avoided -- care to list the others? It seems like the theme of the post is "you don't need JavaScript to do this." If some functionality is rarely needed, but does have use cases, it's nice to know that it can be done in CSS without requiring JS (which would be clearly worse).

View on HN

> There are legitimate uses for snap-scrolling

https://shouldiuseacarousel.com/

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

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.

My clients have large galleries of photos, would you prefer that be paginated?

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

Yes.

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.

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.

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.

That's a use for sure; though it remains an anti-pattern. Don't mess with the scroll.

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.

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.

> How did I know this would be the top comment on HN?

Actually I was thinking the top comment would be something about the site breaking the back button

I've already commented that today for another post so I'll refrain.

> It seems like the theme of the post is "you don't need JavaScript to do this."

Yet you can't see the examples without JavaScript.

This seems needlessly nitpicky. You need JavaScript to view the embedded CodeSandbox, which is an interactive application within an iFrame. Good luck making what's effectively an IDE without JavaScript.

I suppose the author could show the CSS snippets inline and make you click to a demo, but that's not very fun is it?

You don't need an entire IDE to show examples of content styled with CSS.

The anti-JS mindset (I assume for privacy reasons) seems so backwards to me on a social bookmarking site targeted at programmers/technologists.

We wouldn't have this mindset if sites retained enough basic functionality with it off, which is totally possible. I use NoScript pretty aggressively, and it's astounding how many sites actually render nothing unless you have JS turned on. Browsers and backends both implement form validation, yet most sites today don't support submitting a basic form without JS. I'm not expecting things like Spotify and YouTube to work without JS, but I should be able to at least read most webpages without running full-fledged applications with 7 different tracking scripts and 5 custom fonts.

Reply on news.ycombinator.com