Marks and Spencer

Marks and Spencer is a British multinational retailer selling clothing, lingerie, homeware, beauty, flowers, gifts and food to UK shoppers, with financial services in the same navigation. Own-label ranges such as Autograph, Per Una, Jaeger and Goodmove sit beside third party brands including Nobody’s Child, Whistles, Monsoon and Calvin Klein. Prices are in pounds and the site runs on a custom Next.js front end.

Website Design

A token system with a palette per business. The stylesheet exposes separate named colour scales for the core retail brand, food, flowers and the clothing and home operation, so each department recolours without leaving the system. The core scale runs a near-black #101820, greys from #f6f6f6 to #3d3d3d, a heritage green #00664a and a red #ea122a.

Three proprietary typefaces. Display and headings use MS Market, a condensed face, body copy uses MS Barrow, and New MS London serves as a second family, with Helvetica and Arial named as the fallback stack.

The mega menu is the interface. Twelve top-level departments each open into multi-column panels of category links, closing with a row of editorial entries. Sale gets its own menu with a column per department.

Shopping Experience

Listing pages run deep and mix labels. The women’s dresses page is 50 pages long and interleaves M&S and Autograph items at £28 to £55 with Whistles at £189 and HOBBS at £139. Cards carry price, a star rating with review count, and flags including Just Arrived, Online Only and a percentage off.

Category pages close with written guidance. Below the grid sit paragraphs of buying advice on lengths, fabrics and styling, then an FAQ accordion answering questions such as what to wear over a dress.

Product pages are stacked accordions. About this style, Details and care, Delivery, collection and returns, and an About the brand block each expand in place. The buy box holds colour, sizes 6 to 18, a quantity selector up to 20 and an Add to bag button.

Delivery terms are restated at every level. Standard delivery is £3.99 or free over £75, nominated day and next day are £5.99, store collection is free on fashion, home and beauty, and UK returns are free with exclusions.

Brand Storytelling

Breadth is the argument. The homepage closes with paragraphs walking the reader through clothing, home and furniture, food, gifts and money in turn, framing the site as one destination rather than a set of shops.

Brands are introduced in their own words. A product page for a third party label carries that brand’s own positioning statement, so the Nobody’s Child dress is sold with Nobody’s Child copy rather than M&S copy.

Notable Features

Financial services in the shopping navigation. Credit cards, travel insurance, pet and home insurance, travel money, personal loans and internet banking are reachable from the same bar as dresses and dinner sets.

Sparks threaded through. The loyalty programme appears in the header, in promotional banners and again in the footer, with Sparks Pay listed under Money.

Locale stated in the footer. The base of every page names the market and currency as “United Kingdom ( £ )” above the legal links.