Website voor een administratiekantoor

Vier pagina's, plus een foutpagina voor adressen die niet meer bestaan. Zo is het verdeeld:

• Pagina's Home, diensten, werkwijze en tarieven, contact. Header en voettekst zijn op elke pagina gelijk.
• Diensten Vier blokken: administratie, aangiftes en jaarwerk, salarisadministratie, advies. Elk blok eindigt in een lijst met wat de klant er precies voor krijgt.
• Werkwijze Vier stappen, van de kennismaking tot het maandelijkse ritme. Onder elke stap staat wat je erna in handen hebt, bijvoorbeeld een voorstel op papier met een vast maandbedrag.
• Formulier Naam, bedrijf, e-mail, telefoon, een keuzelijst voor het onderwerp en het bericht zelf, met een foutmelding per veld in plaats van een algemene waarschuwing bovenaan.
• Tijden Een tabel in de voettekst is de enige plek waar de bereikbaarheid staat. De regel bovenaan de pagina leest die tabel uit en zegt of het kantoor vandaag open is.

Verder verschijnt er op een telefoon een vaste belknop zodra je gaat scrollen, en opent een knop op de contactpagina de route in de kaart-app. Het tarievenblok legt uit hoe het maandbedrag is opgebouwd zonder bedragen te noemen; of die er wel in komen, beslist het kantoor zelf. De vragen die ondernemers stellen staan uitgeschreven op de pagina en niet weggeklapt achter een plusje, want een antwoord dat je eerst moet openklikken helpt niemand.

De site is bijna kleurloos: warm grijs op wit. Grafiet uit een potlood is warm van toon, niet blauw, en dat zet het ontwerp af tegen het blauwgrijs waar half het internet op uitkomt. Structuur komt van haarlijnen van een pixel en van witruimte. Er staan geen kaartjes met schaduw op de pagina, de hoeken zijn recht op de vlakken en 2 pixels rond op de knoppen, en nergens zit een kleurverloop.

Er is een tweede kleur, frisgroen, en die mag maar een ding betekenen: dit staat vast. Groen zit op de vinkjes, op het stipje bij de bereikbaarheid en op de streep boven het donkere blok onderaan. Nooit op een knop of een link; die zijn grafiet, en links in lopende tekst zijn altijd onderstreept, ook als je er niet overheen gaat.

De koppen staan in Albert Sans, de lopende tekst in Public Sans. Dat tweede lettertype is gemaakt voor het ontwerpsysteem van de Amerikaanse overheid, om formulieren en lange zakelijke tekst leesbaar te houden, en dat is precies het register van een administratiekantoor. De rangorde tussen kop en tekst komt uit het gewichtsverschil, niet uit kleur.

Vanaf 1024 pixels breed staat de pagina in twee ongelijke kolommen, met de tekst links en de feitenkolom rechts. Daaronder schuift die kolom onder de tekst, vlak onder de knoppen, zodat het eerste telefoonscherm meer laat zien dan alleen een kop. Beweging is er nauwelijks: niets komt tijdens het scrollen invliegen, alleen wat je aanwijst of met de toets bereikt verandert van kleur. Stilstand past bij een kantoor dat rust verkoopt.

Terlinde is verzonnen, dus het adres, het telefoonnummer en de openingstijden in de demo zijn ingevuld als voorbeeld. Bij een echte opdracht gaat daar jouw eigen informatie in staan, en dan geldt de regel uit het ontwerp: een getal of een jaartal komt er pas in als jij het bevestigd hebt.

Doet jouw kantoor iets wat hier niet in zit, dan komt daar een pagina bij. Onder de motorkap zit geen thema en geen bouwpakket: de lettertypes staan in de site zelf, dus bij het laden wordt er niets bij een andere partij opgehaald. Er is dus ook weinig dat vanzelf kapot kan gaan.