Wat bij Rink zelf
is vastgelegd
Een Bron is normaal privé en staat op het adres van de klant. Deze staat open, als voorbeeld van de vorm, met de waarden van Rink zelf erin, inclusief de onderdelen die er nog niet zijn.
Zes onderdelen: het logo, kleur, typografie, raster en uitvoering, het platform, de opvolging en alles downloaden.
Één woordmerk, geen stelsel eromheen
Het horizontale woordmerk in twee versies: wit voor op een donker vlak, zwart voor op een licht vlak zoals een document. Verder geen apart beeldmerk zonder de letters. Dat is minder dan wat er bij een traject wordt opgeleverd, en dat is hier met opzet zichtbaar: de methode is nieuw, en dit systeem is er nog niet volgens de methode doorheen gegaan.
| Woordmerk wit | rink-logo.svg, 1042,3 × 270,7. Voor op een donker vlak |
|---|---|
| Woordmerk zwart | rink-logo-zwart.svg, zelfde vorm, vulkleur #111111. Voor op een licht vlak, bijvoorbeeld een document of brief |
| Varianten | geen los beeldmerk zonder de letters. Geen grijze of eenkleurige tussenvorm |
| Bestandsformaten | SVG voor beide woordmerken. Het favicon staat daarnaast als SVG en als PNG op 16 en 32 pixels, plus een apple-touch-icon van 180 pixels. Geen EPS, geen PDF, geen druklaag |
| Favicon | de R uit het woordmerk, op volle hoogte en zonder vlak eronder. #111111, en #FAFAFA voor wie de browser donker heeft staan, want een zwarte letter zonder vlak is op een donker tabblad onzichtbaar. SVG plus PNG op 16 en 32 pixels. Het app-icoon van 180 pixels heeft wél een wit vlak: iOS zet transparantie op zwart en dan verdwijnt de letter |
| Constructietekening | bestaat niet. Wacht op de vraag of de N zijn linkerstam hoort te missen: wie het raster tekent van een merkteken dat nog kan veranderen, tekent het misschien twee keer |
Gebruiksregels. Voor het eerst vastgelegd op deze pagina, niet afgeleid van een bestaande gewoonte:
- Minimale grootte in productie: 46 bij 12 pixels, de kleinste weergave van het woordmerk, in de navigatiebalk op een telefoon. Kleiner is niet getoetst.
- Twee vastgelegde varianten: wit op donker, zwart op licht. Kies de variant op het contrast met de achtergrond, niet op smaak.
- Geen rotatie, geen uitrekking, geen schaduw, geen verloop.
- Geen andere kleur dan de twee vastgelegde varianten.
- Vrije ruimte: in de navigatiebalk is dat de marge van de pagina zelf, dezelfde --gutter-formule als de content. Een vaste minimale vrije ruimte los van die ene toepassing bestaat niet; dat wacht op de constructietekening hierboven.
Zeven waarden, elk na te rekenen
Elke waarde na te rekenen met een willekeurige contrastcalculator. Het knopje achter een waarde kopieert hem naar het klembord.
| Koppen vanaf 32 px | #EDEDED, 16,00 : 1 tegen het vlak |
|---|---|
| Koppen daaronder | #FAFAFA, 17,95 : 1 |
| Lopende tekst | #A3A3A3, 7,43 : 1 |
| Micro-tekst | #8A8A8A, 5,43 : 1 |
| Scheidingslijn | #333333, 1,483 : 1 |
| Zachte lijn | #222222, 1,177 : 1 |
| Merkkleur | #E8E8E8 als HEX en RGB. Geen CMYK of Pantone: er is nog geen drukwerk om op te matchen |
De schaal, het raster en de patronen
De maten zijn nagemeten in de browser, niet overgetypt uit de opmaak.
| Typografie | |
|---|---|
| Lettertype | Inter, zelf gehost. Geen Google Fonts of andere externe koppeling |
| H1 | 40–72 px vloeiend op desktop, 24,5 px op mobiel. Alleen de homepage |
| H2 / paginakop | 40 px op desktop, 21 px op mobiel. Sectiekoppen, elke subpagina |
| H3 | 24 px op desktop, 18 px op mobiel. Sub-subkoppen |
| Uitlegregel | 18 px, 15,5 px in de homepage-hero. Verandert niet tussen desktop en mobiel |
| Lopende tekst | 16 px op een telefoon, vloeiend oplopend tot 18 px vanaf een venster van 1000 px. In de opmaak: clamp(1.6rem, 1.5rem + 0.3vw, 1.8rem) |
| Kicker en bronregel | 12 px, op elke breedte gelijk |
| Verwijzing | 18 / 14 / 12 px op desktop, 16 / 14 / 12 px op mobiel: drie maten in één stap, geen vast getal |
| Schaalfactor | bestaat niet. De maten staan los van elkaar vast, zonder vaste verhouding ertussen |
| Raster en tokens | |
| Raster | container van 1440 pixels, marge 32 pixels (24 op mobiel). Geen vastgelegd kolomaantal |
| Design tokens | kleur, letters en maten machinaal leesbaar als één bestand: tokens.json |
| Bestaan nog niet | basisvormen en iconen, beeldregels als document, digitale sjablonen (handtekening, presentatie, LinkedIn-banner) |
| Patronen waarmee elke pagina wordt gebouwd | |
| Paginakop met claim | de opening van een landingspagina: kop, een losstaande claimregel, dan de uitleg |
| Paginakop, eenvoudig | de opening van een gewone pagina: kop en één alinea |
| Tekst-en-kop-paar | kicker en kop links, uitleg rechts. Het meest gebruikte blok op de site |
| Opleveringstabel | term en uitleg, gegroepeerd onder een kicker. Deze tabellen zijn er een voorbeeld van |
| Vergelijkingstabel | drie of meer kolommen met een kop erboven; klapt op mobiel om tot losse rijen |
| Knop | één vorm, twee vullingen: gevuld voor de primaire actie, omlijnd voor de rest |
| Sectieafsluiter | vaste kop-en-knopband aan het eind van bijna elke pagina |
Elke pagina is een combinatie van deze patronen, nooit een eigen ontwerp. Daarom kost een nieuwe pagina geen ontwerpronde.
Statisch, zonder databank en zonder tracering
Statische pagina's: geen databank, geen server die per bezoeker iets berekent, geen scripts van derden. Dat maakt de site snel en houdt de privacy heel.
| Hosting | Vercel, op naam van Rink. Serverlogs worden ten hoogste dertig dagen bewaard, zoals ook op Privacybeleid staat |
|---|---|
| Toegankelijkheid | de contrastwaarden hierboven halen 4,5:1 voor lopende tekst ruimschoots. De geautomatiseerde toets scoort 100 van de 100 op deze pagina en op de homepage. Dat is een automatische toets, geen menselijke doorloop met een schermlezer |
| Laadtijd | grootste zichtbare element 2,0 s, verspringing tijdens het laden 0,003 (ruim onder de grens van 0,1), geen blokkerende tijd op de eerste handeling (0 ms). Gemeten tegen een lokale build; op de echte hosting kan dit afwijken, dan wordt het bijgewerkt |
Wat er gebeurt na een formulier, en wat er bewust niet gebeurt
| Formulier en melding | een contactaanvraag gaat via een Vercel-functie en Resend naar één inbox, demy@vanrink.com. Geen gedeeld postvak, geen CRM ertussen |
|---|---|
| Meting | bewust afwezig. De site zet geen cookies en laadt geen trackingscript; er wordt niets gemeten over wat een bezoeker doet. Bij een klant is meting van opbrengst en afhaakpunten wel onderdeel van de opvolging; hier niet, om dezelfde reden dat er geen toestemmingsbanner staat: er is niets om toestemming voor te vragen |
| Documentatie | deze pagina zelf: elke waarde staat erop, met de reden erbij waarom hij staat zoals hij staat |
| Accounts | domein en hosting staan al op naam van Rink. Bij een klant is dat de belofte; hier is het de uitgangssituatie |
Eén bestand, geen aparte aanvraag
Alles wat op deze pagina staat, in één archief: beide woordmerken (wit en zwart), het favicon- en app-iconset, en de waarden als tokens.json. Geen samengestelde PDF met uitleg erbij. Die uitleg staat hierboven, en verandert sneller dan een PDF zou bijhouden.
Wat er ontbreekt: geen los beeldmerk zonder de letters, geen EPS of PDF, geen WEBP- of JPG-export, geen iconenset los van het favicon. Dat staat hierboven per onderdeel, niet alleen hier als voetnoot.
Vragen over deze pagina, het systeem of de bestanden
Demy Rink, Brand Systems Architect, Rink.
demy@vanrink.com
Deze pagina wordt bijgewerkt zodra er iets aan het systeem verandert, niet op een vaste datum. Er is geen versienummer: wat hier staat is altijd de actuele stand.