Modern web design on Astro and Next.js

If you want a site that's fast, hard to attack, and light to look after for years, this is the approach built for it. We design from scratch and build on Astro or Next.js, with your content managed in Payload CMS, an editor that shows only what your site needs. We're a small studio in north Norfolk, a short drive from Norwich, designing Astro and Next.js sites for businesses there and across the UK. The web design page shows what each approach starts at, side by side.

A mockup of our new website, showing the dark theme on a mobile. The screenshot was taken while the website was under development, and the mockup was created using Gemini.

WHAT WE MEAN BY IT

A newer way of putting a website together.

Modern web design means the pages of your site are prepared in advance and served as ready-made files from servers around the world, instead of being assembled from a database each time someone visits. Astro and Next.js are the two frameworks we build on, and your content lives in Payload CMS, a clean editor with only the fields your site uses.

  • Faster, almost always. Pages arrive in milliseconds because they're already made and served from close to your visitor.
  • Harder to attack. There's no live database or plugin code exposed to the internet, so the ways in that automated attacks rely on mostly aren't there.
  • Lighter to look after. No software on a server to patch, no caching plugins to tune, and very little that can quietly break.
  • Cleaner to edit. The editor shows your pages, your posts, and your projects, and nothing else.

We've built this way for several years and it's now the larger share of our new work, chosen by clients who care most about how the site holds up over time.

WHO IT'S FOR

Right for clients who want a site that stays fast and stays out of the way.

This is the design approach to choose when:

  • Speed and security are priorities you'll still care about in five years' time
  • You want a clean, focused editing experience without the broader complexity of WordPress
  • You're planning a site you'll keep for a long time without wanting to think about maintenance
  • The site is mostly content-led (pages, posts, case studies, structured listings) rather than transactional
  • You’d rather run a site that does only what it needs to, with nothing installed "just in case"

It's probably not the right fit when:

  • You want the full breadth of the WordPress plugin ecosystem and the flexibility to bolt on almost anything later (WordPress Web Design is the better call)
  • The brief is mostly a busy e-commerce store with a large catalogue, subscriptions, and complex shipping (WordPress with WooCommerce is the more mature route, for now)
  • You want the widest possible pool of developers who could pick the site up later; WordPress still has more of them, though the gap closes every year

Some briefs actually suit WordPress better, and when yours is one of them the first call is where we’ll say it.

HOW WE WORK

Bespoke design, with the framework working for it, not the other way around.

A few things that shape every modern design project at BrainWeb.

A blank canvas, meant literally

There's no theme to fit into and no plugin patterns dictating where things go. The design comes first, and the framework is shaped to serve it.

Designed with Payload's editor in mind

The structure you see in the Payload editor mirrors the structure of the site, so adding content later feels obvious: your pages, posts, and projects, with only the fields each one needs.

The same design principles as every BrainWeb project

Typography doing the visual work, restrained colour, real photography. The full set is on the bespoke web design page; the modern stack just gives them a faster canvas.

Accessibility designed in

Contrast, focus states, type sizes, and reading order are decided at design. WCAG 2.1 AA basics are the default, and the build page covers implementation.

Performance treated as part of the design

A design that needs four seconds to appear has already failed, so image sizing, motion, and interaction weight are design decisions here, made against Core Web Vitals targets rather than left for the build to rescue.

WHAT IT COSTS

What does a modern site cost?

It depends on the shape: a text-managed site, a Payload CMS site, and a web app each start at a different point, and the web design page puts the starting prices side by side. The quote is fixed in writing before work begins, paid 50% at design sign-off and 50% at launch, and the first year of Firebase hosting is part of the project; what hosting costs after that is on the hosting page.

WHAT'S INCLUDED

What's in every modern design project.

Everything below is inside the fixed quote.

  • The initial conversation, free, 30 to 60 minutes, to settle the right shape and scope

  • A fixed written quote for the project, before any work begins

  • A design started from a blank page, built on Astro or Next.js with Payload CMS

  • The First Look: the homepage and one key internal page, at real fidelity, for you to react to

  • Revision rounds, as many as it takes; we don't count them against a limit

  • Designed mobile-first and checked at phone, tablet, and desktop sizes

  • Accessibility designed in, with WCAG 2.1 AA basics as the default

  • GDPR-aware design for forms, consent, and data handling

  • A training session on the Payload editor at handover

  • One year of hosting on Firebase; the <a href="/host/app-and-static-hosting">the Host page</a> has the detail

The build-phase details (specific integrations, custom functionality, SSR setup) are covered on the matching build pages.

PROJECT SHAPES

Three typical shapes, from lightest to most self-serve.

The design approach is the same across all three; what changes is how much of the site you edit yourself. The initial conversation settles which fits.

Text-managed modern site

The lightest build: Astro or Next.js with content managed as text files we update for you, or that you edit with a little guidance. Right for sites that change a few times a year.

AstroLightest build
Modern JS Development

Modern site with Payload CMS

The shape most clients choose: pages built by us, with your blog, projects, and similar collections editable in Payload. Fast, focused, and the site the rest of this page describes.

AstroNext.jsPayload
Modern JS Development

Web app or server-rendered site

For projects that need accounts, live data, or custom application work. Built on Next.js or similar, with Payload or a custom backend.

Next.jsSSRCustom backend
Custom Development

RECENT WORK

A few recent modern web design projects.

Recent design work from the studio, including our own site, rebuilt on Astro with Payload and hosted the same way we host for clients.
View all modern projects

THE OTHER OPTIONS

Not sure if modern is the right call?

All three are designed here; the difference is the platform underneath.

Bespoke Web Design

Design from a blank page, for a visual identity and interactions built only for you. Pairs naturally with modern JS framework builds.

WordPress Web Design (with Divi)

When editing your own pages in a familiar editor matters more than raw speed, Divi is the pragmatic choice.

One-Page Web Design

The same modern stack at its smallest: one page, launched quickly, with almost nothing to maintain.

Ready to talk about a modern site?

The first conversation costs nothing and commits you to nothing. Tell us about your business and what you've got at the moment, and we'll come back with a view on what a modern build would involve and what it would cost.

Get Started
⭐ 5.0 on Google · 15+ years building websites · Norfolk, UK