Browsing on Mobile: Lists, Filters and the Long Scroll

Design mobile browsing for narrowing. The list must show, per product, the facts the next decision needs: a clear image, the name in the buyer's words, the price, and the one or two attributes that split the range, such as size availability, colour or a key rating honestly presented. Filters must be reachable in one tap, usable with one thumb, forgiving of change, and clear about how many products survive them. Sorting should default to the order most buyers mean, usually relevance or best sellers, with price sorts exact. Every product tap should be cheap to undo, because browsing is comparison, and a list that punishes a wrong tap with a slow reload and a lost scroll position teaches visitors to stop exploring.

Each row or card is a decision to tap or pass, so it must carry the decision's inputs. An image large enough to judge the product type and colour honestly. The name as buyers search for it, not the internal code with a marketing suffix. The price, with any per-unit or from wording truthful and legible. The availability signal that matters: the popular sizes in stock, the local service area, the lead time where it is long. Promotions and badges should be few and factual; a card wearing four ribbons communicates none of them. Compare your list against a strong competitor's on a phone, side by side, and count how many questions each card answers before a tap is required.

Filters fail on mobile in predictable ways: hidden behind an unlabelled icon, applied only after a submit that reloads and loses place, impossible to clear one at a time, and silent about result counts until the visitor discovers an empty page. The working pattern: a clearly labelled filter control fixed within reach, options as large tap targets grouped in the order buyers think, counts beside options where the platform can supply them, apply behaviour that updates without losing the scroll, and a visible list of active filters with individual removal. Test the full loop one-handed, including the mistake loop: apply a filter that returns nothing and confirm the page helps the visitor recover rather than presenting a dead end with a slogan.

Choose loading behaviour for comparison, not novelty. A continuous scroll that preserves position and loads reliably suits long browsing; numbered pages suit deliberate comparison and returning to a spot; a load-more button is an honest middle. Whichever you choose, the visitor must be able to go from a product back to the exact place they left, every time, because backtracking failure is the single most cited browsing frustration in session recordings. Sort defaults matter quietly: relevance tuned to what actually sells and is in stock beats a default of newest that buries the proven range under this week's arrivals. Keep out-of-stock handling explicit in sorting, since a list whose first screen is unavailable products spends trust the next screens cannot repay.

Internal search lands the visitor in a list with the highest intent on the site, so give it the same craft as the category page and a few extras: tolerant matching for the misspellings and synonyms buyers actually type, the same filters and list facts, and a no-results page that works, offering the closest categories, a spelling suggestion and a contact route instead of an apology. The site search bench covers the search system itself; this guide's claim is only that its results page is a mobile browsing surface and inherits every rule here, including backtracking and filter behaviour. Measure its step rate from results to product view by device, because mobile searchers abandon bad results faster than any other segment.

List images serve recognition at small size, which changes what a good image is: the product centred and large in frame, its colour true, its scale hint present, distractions cropped out. A lifestyle photograph that sings on the product page can fail in a list, where the product occupies a tenth of the frame and the visitor scrolls past unable to tell what it is. Keep list imagery consistent in background and framing across the range so differences the buyer cares about, colour, shape, size, are the differences the eye catches. This is also a speed decision, since list pages multiply image weight by every card, and the discipline in the images guide applies with compound interest here.

Judge browsing by the step from list to product view, and by search-to-view where search exists, split by device and compared with the same category's own history. Watch recordings of mobile category sessions for the behavioural signatures: filter opened and abandoned, repeated back-and-forth between two products, long scrolling without a tap, each mapping to a section of this guide. Category pages differ legitimately, gift buyers browse differently from replenishment buyers, so compare a category with itself over time rather than chasing a uniform rate. The pillar guide places this work after speed and layout for a reason: a fast, reachable list still fails if its facts, filters and backtracking are broken, and now you know how to see it.