Skip to content

I Replaced My Blog Carousel With a Boring List

Adityo Guni Waluyo

The five latest posts were trapped in a swipe-one-by-one carousel. For navigation content, a plain vertical list is the honest pattern.

TL;DR

The author shipped a carousel for their latest blog posts, then found it tedious to use themselves. The realization: carousels suit fixed showcases like services, but blog lists are navigation, which needs everything scannable at once. They swapped it for a plain vertical list of five titles with dates, no JS or gestures.

I opened my own blog on my phone to check a post, and got stuck before the posts even started. The five latest articles were packed into a horizontal carousel, one card visible at a time, and reaching post number four meant swiping through two and three first. Finding an older post meant swiping through all five and then scrolling past the carousel anyway. Even I, the person who shipped it, could not be bothered. That is a bad sign.

Here is the embarrassing part. The day before, I had added a carousel to the Services page of the same site and praised it in the commit message. So my first instinct was not to remove the carousel from the Blog section. My first instinct was to fix it. Make the peek of the next card bigger, tweak the snap points, maybe add dots. I spent a while thinking about carousel parameters for content that should never have been a carousel.

The turn came when I asked a simpler question: what job is this section doing? Because the Services section and the Blog section look similar in a wireframe, but they are not the same kind of content at all.

A showcase and a directory are different jobs

Services are five items, fixed, visual, each one a pitch. You are supposed to stop and look at each card. A carousel actually fits that: small set, equal weight, showing off. Nobody needs to compare service number two against service number five from memory. They browse, they pick, done.

Blog posts are the opposite. The list of latest posts is navigation. Its whole job is to let someone scan titles and jump to the one they want. Navigation wants everything visible at once, in a column, where the eye can sweep top to bottom and pick in two seconds. Hiding four of the five latest posts behind swipes makes the scan slower for zero benefit. And the pattern gets worse as the list grows, which it does every week I publish.

There is also the motion problem. Carousels that move on their own train people to ignore them; Nielsen Norman Group found users dismiss anything that shifts on its own the same way they dismiss ads, which is the last thing I want for my own writing [1]. Mine did not auto-advance, but the family resemblance was already hurting it.

People do not read your homepage, they triage it

NN/g's classic eye-tracking number: on an average page visit, users read at most about 28 percent of the words, and 20 percent is more likely [2]. Visitors to my blog are not settling in, they are triaging. Every extra interaction between them and a post title is a chance they leave. A vertical list of five titles with dates is the cheapest possible triage surface. Five links, no gestures, no sync state.

That sync state is a real maintenance cost too. MDN's guide on CSS carousels is blunt about JavaScript ones being brittle, since you need script to keep the buttons, markers, and scroll position from drifting out of agreement with each other [3]. Every "fix" I was planning was me volunteering to maintain that machinery forever, for a list of five links.

What went in instead

The replacement is almost insulting. A vertical list, latest first, five items. Title, date, one-line excerpt. No JS, no scroll-snap, no dots. On a phone it is just a list, which is what a phone is good at.

My firm take: for anything that functions as navigation, a carousel is the wrong default almost every time. Reserve it for genuine showcases with a small, fixed item count, and even then be suspicious. The mistake I made was not picking a bad component. It was skipping the question "what kind of content is this?" and copying a pattern from one section to another because they sat next to each other in the layout. Patterns are answers to content questions, and the Services page and the Blog page ask different questions.

The carousel on Services stays, for now. The one on Blog is gone, and I do not miss it.

---

Sources

Related articles