HolidayGrid

Er zijn zoekopdrachten die geen mening vragen maar een feit. "Public holidays Japan 2026" is er zo een. De zoeker plant een levering, een vergadering over de tijdzones heen of een lang weekend, en wil weten welke dagen wegvallen. Het antwoord is objectief, het verandert per jaar, en het is per land net anders geregeld. Dat maakt het een goede kandidaat voor een site die dat ene ding goed doet en verder niets belooft.

Wat het onderwerp lastig maakt is niet de vraag maar de vorm van het antwoord. Officiele bronnen staan per land op een eigen overheidssite, in een eigen taal en een eigen indeling, en zijn zelden bedoeld om twee landen naast elkaar te leggen. Wie dat toch wil, moet zelf datums overtypen en zelf uitrekenen op welke weekdag ze vallen. Wij schreven de site daar omheen: de landkalenders delen dezelfde tabel, dezelfde kolommen en dezelfde manier van tellen, zodat je Japan en Duitsland naast elkaar kunt leggen zonder ergens een aanname te doen.

Daarom staat in de belofte van het merk ook wat er niet is. De tagline van de site komt erop neer dat je feestdagen per land en per jaar krijgt, in heldere tabellen, met de datum en de weekdag erbij, en zonder aanmelding. Dat is geen slogan achteraf, het is de ontwerpopdracht die we onszelf gaven en waar de rest van de keuzes uit volgt. De sitebeschrijving zelf telt de landen en de jaargangen live uit de data op, zodat de belofte in de zoekresultaten meebeweegt met wat er echt staat.

HolidayGrid heeft een eigen designsysteem, geen Tailwind en geen thema. Alle stijl staat met de hand geschreven in een enkel bestand, geordend per onderdeel van de site: header, hero, landengrid, kruimelpad, statchips, feestdagentabel, jaarwisselaar, prozablok, linkblok, voettekst. Bovenaan staat een kleine set eigen tokens: inkt #1b1b1a, een warm gebroken wit #fbfbfa, randen in #eae7e2 en een enkele accentkleur, rood #c8362f. Verder komen er alleen een groen (#2f7d4f) en een goud (#b78a2e) in voor, en die zijn gereserveerd voor kleine signalen.

Dat rood is een bewuste verwijzing. Op een papieren scheurkalender zijn de vrije dagen rood, en dat idee loopt door de hele site: het logo is een kalenderblad met een rode kopbalk en een rode stip, en de social-afbeelding zet diezelfde rode balk boven een wit vlak. De typografie versterkt het. Koppen staan in Fraunces, een serif met karakter, de lopende tekst in Inter, allebei via next/font geladen zodat er geen externe fontcall nodig is. Het resultaat leest als een naslagwerk en niet als een SaaS-tool.

De rest van het ontwerp is vooral weglaten. Een landpagina opent met de vlag, de naam, een lead en drie statchips: hoeveel feestdagen het land dit jaar heeft, hoeveel jaargangen we dekken en in welke regio het valt. Daaronder staat een korte vooruitblik met de eerstvolgende dagen en een link naar de volledige tabel, waarin een weekendbadge de dagen markeert die je vrije dag opeten. Wie snel wil zoeken, typt in de zoekbalk op de homepage; die filtert client-side over de 44 landen, toont maximaal acht resultaten en springt bij enter direct naar het eerste.

De feestdagregels komen uit date-holidays, een open source pakket dat per land de regels codeert, inclusief de bewegende dagen die aan een weekdag of aan een religieuze kalender hangen. Wij zetten daar een dunne laag omheen die filtert op het type public, ontdubbelt op datum plus naam voor de zeldzame gevallen waarin twee regels elkaar overlappen, de weekdag afleidt uit de datum en alles chronologisch sorteert. Voor de jaartabellen draait die laag tijdens de build. De homepage en de landhubs lopen hem eens per etmaal opnieuw langs, omdat daar staat wat er als eerstvolgende aankomt.

De belangrijkste keuze zit in wat we weglaten. We instantieren date-holidays met alleen de landcode, dus zonder deelstaat of regio, waardoor een land op zijn nationale kalender uitkomt. Beieren krijgt geen eigen rij, Ontario evenmin. Dat maakt de lijst voor sommige bezoekers korter dan de werkelijkheid in hun eigen provincie, maar het maakt de landen wel onderling vergelijkbaar. Over de 44 landen en de drie jaargangen samen levert dat ruim 1.600 feestdagrijen op, een aantal dat meebeweegt zodra het jaarvenster doorrolt. Op de landkalenders zeggen we die afbakening er expliciet bij, in het proza en in de vragenlijst, in plaats van hem in een voetnoot te verstoppen.

Bij data die je niet zelf vaststelt hoort eerlijkheid over de herkomst. De Dataset in de JSON-LD verwijst naar de licentie van date-holidays, de llms.txt noemt de bron met licentie erbij, en zowel de voettekst als de aboutpagina zegt onomwonden dat je officiele datums bij een lokale instantie moet bevestigen voordat je een reis of contract vastlegt. Voor de versheid van de data houden we een aparte verificatiedatum bij, nu 10 juli 2026, die we alleen met de hand ophogen als de inhoud echt verandert. Zo blijft dat veld een signaal in plaats van een bijproduct van de laatste deploy.

Technisch is HolidayGrid een Next.js 16 App Router-site op React 19 met TypeScript in strict mode. De routes zijn eenvoudig: een hub per land op /holidays/[country] en een jaartabel op /holidays/[country]/[year]. generateStaticParams levert 44 hubs en 44 maal 3 is 132 jaarpagina's, en op beide routes staat dynamicParams op false. Dat laatste is de kern: een slug of jaartal dat wij niet kennen wordt geen on-demand render maar een nette 404. De routeset is dus eindig en vooraf bekend.

Wie een kalenderpagina opvraagt, krijgt daardoor een vooraf gerenderde pagina, zonder database, zonder API-call en zonder wachtrij. De enige dynamiek is het blokje bovenaan de jaarpagina dat zegt welke feestdag de eerstvolgende is en over hoeveel dagen. Dat rekent de browser zelf uit tegen de klok van het apparaat, met een statische zin als terugval voor hydratatie, zodat er ook zonder JavaScript iets bruikbaars staat. Bij het opzoeken en bekijken van een kalender gaat er dus geen locatie, geen datum en geen zoekopdracht het apparaat af. De homepage en de landhubs revalideren daarnaast eens per etmaal, zodat de eerstvolgende datums niet verouderen zonder dat we opnieuw hoeven te deployen.

Ook wat er nog niet is, is met zorg gebouwd. Het advertentieslot en de consentbanner zitten al in de code maar renderen niets zolang de bijbehorende omgevingsvariabele niet aanstaat, met een vaste minimumhoogte klaar op de maat van het blok dat er later komt. Zo staat de ruimte vandaag niet in de weg en hoeft de layout er straks niet omheen te schuiven. Het contactformulier is het enige onderdeel van de site zelf dat data verstuurt, met een honeypot-veld tegen bots. Daarnaast is er een IndexNow-script dat we na een deploy handmatig draaien, buiten het bezoek om.

De land- en jaarpagina's bouwen hun metadata op uit de data zelf. De titel van een jaarpagina bevat het echte aantal, bijvoorbeeld Japan Public Holidays 2026 (18 Dates), en de omschrijving herhaalt dat aantal in een volle zin. De pagina's hebben een canonical, en de OpenGraph-gegevens lopen via een gedeelde helper, zodat een pagina-eigen socialblok de afbeelding of het type uit de layout niet stilletjes overschrijft. Dat is precies het soort fout dat je pas ziet als iemand een link deelt en er een leeg vlak verschijnt. De social-afbeelding zelf wordt gegenereerd via next/og in de eigen huisstijlkleuren.

In de JSON-LD staat per paginatype een eigen graph. De jaarpagina levert een Dataset met tijdvak, land, licentie en verificatiedatum, plus een FAQPage en een BreadcrumbList. De landhub levert een WebPage, een BreadcrumbList en een eigen, kortere vragenlijst met het aantal feestdagen van dit jaar en de jaargangen die we dekken. De vraag- en antwoordblokken op de jaarpagina komen uit de feestdaglijst zelf: hoeveel feestdagen een land dat jaar heeft, welke de eerste is en op welke weekdag die valt, en wanneer Nieuwjaar of Kerst wordt gevierd. Alleen de vraag over regionale feestdagen heeft overal hetzelfde antwoord, en dat is opzet, want dat is nu juist de afbakening die we op de jaarpagina's willen herhalen.

De variatie zit in het proza eromheen. De introteksten kiezen hun formulering deterministisch: een hash van de landslug en het jaar bepaalt welke van de beschikbare zinnen je krijgt, aangevuld met een weekendnotitie en de drukste feestdagmaand uit de echte lijst. Twee landen lezen daardoor niet hetzelfde, terwijl dezelfde pagina bij een nieuwe build weer dezelfde tekst oplevert. De sitemap telt 181 URL's: 44 hubs, 132 jaarpagina's en vijf vaste pagina's (home, about, privacy, terms, contact). Die stempelen we met de verificatiedatum in plaats van de builddatum, omdat honderdvijftig-plus URL's die bij elke deploy op vandaag springen crawlers leren het signaal te wantrouwen. Verder wijst een robots.ts naar de sitemap, meldt het IndexNow-script na een deploy de URL's bij de aangesloten zoekmachines, en legt een llms.txt het URL-patroon en de dekking uit voor wie de site machinaal leest. Interne links lopen via regiochips en jaarwisselaars, zodat je van een landpagina in een paar klikken bij de buurlanden en de andere jaargangen bent.

De eerste commit dateert van 3 juli 2026. Diezelfde week volgde een auditronde die de OG-afbeelding, de live eerstvolgende datums, de JSON-LD, de 404 en de vertrouwenspagina's rechttrok, daarna op 7 en 8 juli de Search Console-verificatie, en op 14 juli een contentuitbreiding met de Ahrefs-bevindingen en de voorbereiding op monetisatie. De site is klein in bestandsomvang en compleet in wat een echte site nodig heeft: about, contact, privacy, terms, een eigen 404 en een icoon.

Het jaarvenster rolt uit zichzelf mee. De jaargangen worden afgeleid van het jaar op het moment van bouwen en dekken vorig, huidig en volgend jaar, dus een deploy is genoeg om de kalender een jaar op te schuiven. Dat is bewust: hoe minder handmatig onderhoud een site vraagt, hoe langer hij goed blijft zonder dat iemand eraan denkt. De enige knop die we met de hand bedienen is de verificatiedatum, en dat is precies de knop die je niet wilt automatiseren.

Voor een opdrachtgever is dit vooral een steekproef van hoe wij werken als niemand meekijkt. Geen template, geen frameworkkleuren, geen data die we niet kunnen verantwoorden, en geen advertentieblok dat de layout verstoort voordat er iets te verdienen valt. Strategie, merk, interface, code en vindbaarheid komen hier uit dezelfde hand, en dat is wat we ook voor klantwerk meebrengen.