Case studies on your website: how to show your work

A good case study answers three questions, in the order a potential client asks them: what was the problem, what did you do, and what does the result look like. The big images and the details come after, as proof. On a phone, all three need to be visible without hunting around the page.

A structure that works

Give every project its own page, with the same sections:

1. The challenge: two or three sentences about the starting point.
2. What we did: the solution, in plain words.
3. On the phone: three things you notice on the small screen, because that's where clients decide.
4. Details: three choices that make the difference.
5. At the end, a path to the next project and the question "Want one like this?"

A fixed order helps someone reading three case studies in a row: they know where to look. Take a neighborhood bakery: the challenge might be that people didn't know they could order cakes ahead, and the solution an ordering page with the open days in plain view. Two sentences, and the reader gets the story.

The challenge, with real details

The part that convinces most is also the part most often written about nothing. "The client needed a modern online presence" tells the reader nothing. Say what was concrete: how many rooms the hotel has, where shoppers come from, what wasn't working. For a hotel, for example, you write how many rooms it has, how far it is to the beach and that everything is built around the tourist's phone. A reader in hospitality recognizes their own situation right away.

Only include sales or traffic numbers if the client agrees and you can back them up.

Images and screenshots

Screenshots should be real, taken from the site or product you delivered, with at least one from a phone. A few technical rules from Google:

• Alt text describes what's in the image for someone who can't see it. Google says plainly not to stuff it with keywords.
• The image sits next to the text about it. Google also uses the surrounding text to understand the image.
• The file name is short and descriptive: hotel-booking-phone.webp, not IMG00023.JPG.
• The format: WebP and AVIF are among the formats Google reads, and the file extension has to match the real file type.

For speed, the big image at the top loads right away and the rest load only as people scroll to them. web.dev, Google's site for developers, warns against lazy-loading images that are visible when the page opens, especially the largest one on screen. We wrote more about how many photos to use and in what order in our article on photo galleries.

Client consent before you publish

Don't publish a client's name, logo or screenshots without asking. That's how we work: on our business cards page, designs marked "Client" have the contact details replaced, and our app studio says openly that client projects stay confidential and we show them in meetings, with the client's consent. If a client doesn't want to be named, you can still describe the problem and the solution without the name.

What Google looks for in a case study

Google's guide to helpful content asks whether a page shows first-hand expertise and gives you reasons to trust it. A case study is exactly that: work you did, with real problems. Google also notes that these criteria aren't a ranking factor on their own, so a case study won't lift you in search results by itself. It does help the client who lands on the page decide to call you.