Skip to content
metryn

Agency and portfolio sites that hide their work

Why animated, single-page portfolios often read as empty to machines, and how to give every project a real page without losing the design.

By Metryn · Updated 16 October 2026 · 4 min read

Short answer: portfolio and agency sites are often the most beautiful and the least readable to machines. Full-screen scroll effects, galleries built in a canvas and case studies in a modal look great and leave a crawler with an empty page.

What usually goes wrong

  • All work lives on one scrolling page with no URLs for individual projects.
  • Case studies open in a JavaScript overlay with no address of their own.
  • Project names and results are baked into images, with no alt text.
  • Navigation is built from elements with click handlers instead of links.
  • Every page has the same title: the agency's name.

Make each project a page

A case study that can't be linked to can't be found, shared or cited. Give each one a real URL, a unique title and descriptive text in the HTML: the client or sector, the problem, what you did, the result. That's also the content a prospect wants, and it's what a person or a machine can quote.

The technical basics from Google's documentation

  • Use <a href> for navigation and avoid # fragment routes. Google recommends the History API with real paths.
  • Return meaningful status codes. A missing case study should be a 404, not a friendly 200.
  • Keep the main content in the initial HTML where you can. Google recommends server-side or pre-rendering, partly because not all bots can run JavaScript.
  • Write alt text that describes what's in each project image, in context, without stuffing keywords.
  • Give each page a unique, descriptive <title>.

You don't have to give up the animations. The aim is that the information exists as text and links first, and the design enhances it. If that's true, the site works for a visitor with a slow connection, a screen reader and a crawler, which is the same audience list as the one that matters.

One quick self-test

Open the site with JavaScript disabled. If your name, what you do and a way to contact you are still readable, and you can click through to at least three projects, you're in decent shape. If you see a blank page, you know what to fix first.

Questions people ask

My portfolio is built in a canvas for the effects. Can it still work?

Yes, if the information also exists as text and links. Google's guidance is that crawlers read HTML text, <a href> links and <img> elements, so the visual layer can be anything as long as the content isn't only inside it.

How many projects should have their own page?

All the ones you want to be found for. A page per case study, with a unique title and a description of the problem, the work and the result, is more useful to a visitor and gives a crawler something to read.

Do I need to give up animations?

No. The point is that the content doesn't depend on them. A static version first, enhanced by animation, works for visitors on slow connections, for screen readers and for crawlers.

Is a PDF case study okay?

As an extra for people who want to download it. As the only version it's harder to link to, update and read on a phone.

What to do this week

  • Pick your three best projects and give each its own URL and title.
  • Check that navigation uses real links.
  • Write alt text for each project's main image.
  • Turn scripts off and make sure your name, services and contact are still readable.

Check your own site

Paste your address below. The free scan looks at robots.txt, your sitemap, access for the main AI crawlers and structured data, and shows what it found in seconds. It tells you what a machine can fetch and read. It doesn't predict rankings or citations.

Free scan · No account needed · Results in seconds

Sources

Keep reading

Want to check one file yourself? Try the free AI crawler robots.txt checker or the llms.txt validator, or read how the score is built.