The rebuilt store: desktop home and mobile product page.
From 41 menu links to 5, a size and width on every boot, and the home page’s main image on screen in 2.0 s instead of 9.5 s.
Haverhill, Massachusetts, since 1987
Leather boots, loafers & everyday shoes, plus resoling
WooCommerce → Shopify
Full Store Rebuild · Automations & Workflows
Cobble makes boots, loafers and everyday shoes, and has resoled them at its own bench since 1987. Its 2016 WooCommerce store told a different story: a clip-art logo, a “Fall Sale! Up to 40% off” slideshow, and wide widths “by special order, please call the store”.
The new logo sets Cobble in Hoefler Text Black, a heavy old-style serif with the weight of a stacked heel, over a Gill Sans line that says what and since when. It is drawn as outlines, so it never depends on a font being installed.
Around it, a small system from the workshop: leather and kraft colours, a heel-nail pattern and a heel stamp for every resoled pair.
Welt black, cordovan, saddle tan, eyelet brass, shoebox kraft, glove lining and tissue paper.
Libre Caslon Text and Cabin, both free web fonts, self-hosted in 3 files (51 KB).
The person at the repair counter: plain, specific, a little dry.
41 menu links became 5: Boots, Shoes, Loafers, Resoling and Our Story. The home page opens on the best seller, 1 tap from the first screen instead of 2.
Collections filter by width first and every card lists D, E and EE. On the product page, size buttons and a width selector sit next to a fit finder that compares a pair you already own.
Under the button: free shipping, free exchanges for 60 days, and resoling for $95. The cart drops the coupon box and the surprise shipping line, confirms the size and width, and repeats the exchange promise.
BeforeAfterDrag to compare.
| Metric | Before | After |
|---|---|---|
| Performance scorehome page | 33 | 99 |
| Performance scoreproduct page | 36 | 99 |
| Main image (LCP)home page | 9.5 s | 2.0 s |
| Main image (LCP)product page | 6.9 s | 2.0 s |
| Total blocking timehome page | 2,202 ms | 0 ms |
| Total page weighthome page | 5.8 MB | 270 KB |
| Total page weightproduct page | 4.6 MB | 255 KB |
| Accessibility scorehome page | 88 | 100 |
| SEO scorehome page | 91 | 100 |
| Primary menu links | 41 | 5 |
| Small tap targetsunder 44 px, home page | 48 | 0 |
| Taps to a productfrom the first mobile screen | 2 | 1 |
Lighthouse 12.8.2, mobile preset, 3 runs per page, median run shown. Cobble is a concept brand. The “before” store is our build of a typical store in the segment, calibrated to the medians of the stores we audited (performance 31, LCP 9.0 s, 5.5 MB, 41 menu links).
The agent works in the site chat and the help inbox, and answers from Cobble’s own data: fit notes for each last, the size chart, stock, orders, the exchange policy and the resoling price list. When a rule says so, it hands the conversation to a person with a three-line summary.
