B2B Website Design voor een Linkbuilding-Platform

Dit project is B2B website design voor Pressmerit, een digital-PR- en samenwerkingsplatform voor linkbuilding. De software leest je site, zoekt op het open web naar publishers die het aanschrijven waard zijn, scoort elke kandidaat, vindt een geverifieerd contact en schrijft de pitch. Versturen doe je vanuit je eigen mailbox. Zodra de link live staat, verifieert het platform hem en controleert het hem elke 30 dagen opnieuw.

Wij namen de marketingsite volledig voor onze rekening: positionering, informatiearchitectuur, het visuele systeem, de interfacefragmenten op alle pagina's, de teksten en de technische SEO-laag. Dertien pagina's, één taal, gebouwd op Next.js en uitgerold op Vercel.

De briefing had één harde randvoorwaarde. Linkbuilding is een categorie waarin kopers hun vingers hebben gebrand, dus de site kon niet verkopen zoals er in deze categorie meestal verkocht wordt. Elke claim moest met bewijs komen, en elke prijs moest op de pagina staan voordat iemand zich aanmeldt. De algemene versie van dit verhaal staat in onze gids over de SaaS website.

Drie problemen kwamen tegelijk binnen.

Het product is een pipeline, geen feature. Analyseren, ontdekken, pitchen, versturen, verifiëren. Het uitleggen als featurelijst had de kern gemist: het platform doet het loopwerk en stopt bij de twee beslissingen die een mens hoort te nemen.

Er waren geen screenshots. Het product stond voor de lancering, en echte klantdata hoort sowieso niet op een marketingpagina. Generieke dashboard-mockups zouden er precies zo uitzien als wat ze zijn.

En de site had twee doelgroepen die elkaar nooit raken. SEO-kopers die een abonnement van $49 beoordelen, en publishers die een outreach-mail kregen en willen weten wie hen schrijft voordat ze antwoorden. Alleen de eerste bedienen zou de reputatie van het product bij de tweede beschadigen, en die schade zie je pas maanden later terug in de responspercentages.

Bekijk onze prijsplannen voor hoe we dit soort projecten inschatten.

De pipeline bepaalde de structuur. De homepage loopt door de vijf stappen van domein tot geverifieerde live link en markeert de twee waar de gebruiker handelt. Een longform-pagina werkt diezelfde pipeline uit tot acht fasen met elk een anker, inclusief de delen die het platform niet kan doen. Al het andere op de site hangt aan een fase, waardoor de navigatie een kaart van het product is en geen lijst met afdelingen.

In plaats van screenshots bouwden we de interface na als fragmenten in code: een analysekaart met de componenten van de domain score, een gescoorde prospectlijst, een geverifieerd contact met betrouwbaarheidswaarde, een geschreven pitch, een monitoring-tijdlijn. Elk fragment gebruikt voorbeelddata van fictieve sites en zegt dat in het bijschrift. Ze bestaan uit tekst en CSS, blijven dus scherp op elke resolutie, kosten nauwelijks laadtijd en zijn aan te passen als het product verandert.

De prijzen staan volledig op de site. Het plan, de complete credittabel per actie, een doorgerekende voorbeeldmaand en een calculator die dezelfde rekensom maakt als de tabel erboven. Er wordt niets bewaard voor een salesgesprek, want dat gesprek bestaat niet.

De publisherkant kreeg eigen pagina's. Eén legt uit wat een samenwerkingsverzoek is en wat de drie knoppen doen, één beantwoordt waarom iemand de e-mail kreeg, en één documenteert de verificatiecrawler met user agent en schema. Ze bestaan om vanuit de outreach-mail zelf te worden gelinkt, want daar wordt de vertrouwensvraag daadwerkelijk gesteld.

Het visuele systeem is redactioneel in plaats van SaaS-generiek: een schreefletter voor koppen, monospace voor labels, data en interface-elementen, en één warme accentkleur. De interfacefragmenten lezen als interface, de tekst als tekst, en ze concurreren nooit om aandacht. Die scheiding doet meer werk dan het lijkt, want ze houdt een lange pagina scanbaar zonder één decoratieve illustratie.

Vier pagina's van de live site, elk met een ander deel van de B2B website design-opgave.

De site ging live met 100 voor Performance, Toegankelijkheid, Best Practices en SEO in desktop-Lighthouse. Largest Contentful Paint op 0,5s, geen layout shift, geen total blocking time. Op mobiel staat Performance op 96 en blijven de andere drie categorieën op 100.

Die cijfers komen voort uit dezelfde beslissing die het ontwerp vormgaf. Omdat de interfacefragmenten markup zijn in plaats van afbeeldingen, kosten de zwaarste visuele elementen op de pagina een paar kilobytes HTML. Er was dus geen afbeeldingsbudget dat later geoptimaliseerd moest worden. Het meeste performancewerk op een marketingsite is eigenlijk een ontwerpbeslissing die eerder viel, zoals Google's Core Web Vitals telkens laten zien.

Elke pagina is server-rendered, draagt Organization-, WebSite-, SoftwareApplication- en FAQPage-gestructureerde data, en staat met één regel samenvatting in een llms.txt-index. De FAQ-blokken zijn geschreven als vragen die mensen echt intypen, en dat maakt ze bruikbaar voor AI-zoekmachines én voor Google.

De publisherpagina's deden iets wat we niet zo zwaar hadden ingeschat. Ze maken van de outreach-mail een tweezijdig document. Wie een verzoek krijgt, kan lezen wie het stelt, wat het platform is en hoe je je afmeldt, zonder account en zonder eerst te antwoorden.

Lighthouse-audits bij de lancering, desktop en mobiel.

Zes beslissingen uit dit project zijn over te nemen in vrijwel elk B2B website design, wat het product ook doet.

Laat het product de paginavolgorde bepalen. Voert de software een reeks stappen uit, dan hoort de site diezelfde reeks te tonen. Een featuregrid vraagt de bezoeker het verhaal zelf in elkaar te zetten, en de meesten nemen die moeite niet.

Zet de interface als markup op de pagina. Nagebouwde UI-fragmenten verslaan zowel generieke mockups als echte screenshots. Ze laden sneller, overleven een redesign van het product, en voorbeelddata kun je eerlijk labelen in plaats van een klantenbestand te suggereren dat er nog niet is.

Publiceer de prijzen. Bij alles wat selfservice is, is de prijspagina het salesgesprek. Laat de kosten per actie zien en laat de bezoeker rekenen voordat hij zich aanmeldt.

Schrijf de grenzen op. Vertellen wat het product niet kan is het goedkoopste vertrouwenssignaal dat er is, en het filtert de leads eruit die in week drie toch waren afgehaakt.

Geef de tweede doelgroep eigen pagina's. De meeste B2B SaaS-producten raken iemand naast de koper: een goedkeurder, een partner, een ontvanger. Die mensen zijn één zoekopdracht van je site verwijderd, en een pagina die voor hen geschreven is beschermt de reputatie van het product.

Behandel performance als ontwerpbeslissing. Markup kiezen boven afbeeldingsbestanden leverde de Lighthouse-score van 100 op, niet een optimalisatieronde achteraf. Hoe we de ontwerpfase draaien staat bij UX/UI design, en de structuur van grotere sites bij bedrijfswebsites.