Larissa Weber Website

Larissa Weber is the mayor of Waldbröl, a town in the Oberbergischer Kreis district of North Rhine-Westphalia. Her website tells residents which goals she is pursuing for the town, which projects are underway and who she is as a person.

The previous site ran on WordPress. Goals, projects and news were spread across several pages, and the sitemap also contained older SEO duplicates of the same content.

All content had to be migrated and reorganized: political goals, municipal projects ranging from the town center to broadband expansion, a biography and contact details. Statements tied to planning dates that had since passed could not be left standing as future commitments.

At the same time, the client was meant to decide by comparing real, clickable pages rather than sketches. And after the switch, none of the existing URLs could lead nowhere.

The site relies on photos from around the town. Images therefore had to appear sharp and fast on phones too, without the layout jumping while they load.

The previous site became a central content base: six goals, 25 projects in eight areas at the design stage, a biography with four milestones, plus contact, legal notice and privacy pages. On top of it, DuoByte built four complete design directions, each with every page, mobile navigation and a floating switcher that opens the current page directly in another design. A comparison view showed the directions side by side, and all drafts were blocked from search engines.

The client chose “Waldbröl im Blick”. The other three directions were removed, the pages now live at clean URLs such as /ziele and /projekte, and draft links sent to the client redirect there permanently. The site now lists 29 projects, and a contact form with a confirmation email has replaced the former mailto links.

The website is built with Next.js 16 and the App Router, React 19, TypeScript and Tailwind CSS 4. Every page is generated statically at build time; content and routes each live in one central file, which kept all four designs in sync during the design phase. The build also creates a dedicated preview image for social networks and messengers for every page from its photo, title and category.

Images are stored as originals in the project. One script caps them at 2,000 pixels on the longest edge and compresses them with mozjpeg, and a second generates 12-pixel blur placeholders so each photo fades in from its own colors. Next.js serves the images as WebP with a one-year cache, and because the placeholders are read only in Server Components, they never end up in the browser's JavaScript.

Title, description, canonical URL, Open Graph data and JSON-LD for the person, the town and the page type are set for every page, along with robots.txt, an image sitemap and a web manifest. An audit script based on Playwright requests every route, checks the redirects from the old WordPress URLs and verifies this metadata page by page. At desktop and phone widths it also checks that every page has exactly one main heading and no horizontal overflow.

The contact form validates all input on the server, ignores submissions that arrive faster than a person could type, and rate-limits requests per connection and overall. Deployments run through GitHub Actions after linting and type checks: the server builds the release, switches to it atomically and checks the service. If it does not respond within 60 seconds, the previous release is reactivated automatically.

The new website is live and has replaced the WordPress site. Residents find the six goals and every project on its own page, and messages reach the office through a form that confirms receipt.

New projects are added in the central content file and appear automatically in the overview, the sitemap and the structured data. Old WordPress links and links from the design phase still lead to the right page.