Door Femme Taken

UX Designer

Nieuwe lettertypes voor bètatest UI-vernieuwing

17-06-2026 • 10:42

82

We hebben vandaag de typografie in de bètatest van de UI-vernieuwing aangepast. Ook hebben we de lettertypes voor de koppen en broodteksten herzien om de leesbaarheid te verbeteren en de forumlay-out breder gemaakt op desktop.

Bodyteksten

We hebben eerder een bètatest aangekondigd van de UI-vernieuwing die we dit jaar willen uitrollen. De meest in het oog springende verandering is de nieuwe typografie met andere en vooral grotere lettertypes. Aanvankelijk kozen we voor Roboto Flex in een relatief brede font-variation-setting als lettertype voor broodteksten. We kregen de nodige feedback, deels subjectief over de stijl, maar vooral over een verminderde leesbaarheid.

Om beter inzicht te krijgen in jullie voorkeuren hebben we in het feedbacktopic over de UI-vernieuwing een formulier gepost. Hierin vroegen we om de leesbaarheid van lettertypen als Arial, het platformspecifieke systeemlettertype en Roboto Flex met elkaar te vergelijken. Hieruit bleek een voorkeur voor het systeemlettertype, gevolgd door Arial. Daarom hebben we de keuze voor Roboto Flex heroverwogen. We hanteren voortaan de volgende lettertypes voor bodyteksten:

  • Windows: Arial
  • Android: Roboto Flex
  • Apple-platformen: SF Pro
  • Ubuntu: Ubuntu

Headings

In een parallel traject hebben we gekozen voor Clash Grotesk als het nieuwe lettertype voor headings in onze huisstijl. Dit is een wat bredere letter. We hebben bij het afstemmen op de bodytekstlettertypes gelet op samenhang in stijl en op leesbaarheid.

Arial is een relatief smalle letter en past in stijl niet goed bij Clash Grotesk. Op Windows-systemen biedt Arial wel de beste leesbaarheid van de beschikbare lettertypes. Op de overige platformen sluiten we aan bij het systeemlettertype dat gebruikers al kennen vanuit de OS-interface. Dit zijn allemaal neogroteske schreefloze lettertypes die passen bij het lettertype van de headings en zijn geoptimaliseerd voor leesbaarheid op beeldschermen.

Forumopmaak: bredere lay-out en kleinere lettergrootte

In de UI-vernieuwing kiezen we bewust voor grotere lettertypes om de leesbaarheid te verbeteren en aan te sluiten bij moderne webstandaarden. Meer over onze beweegredenen lees je in de vorige .plan. Op het forum zorgden grote letters ervoor dat titels in listings soms (op desktop) doorliepen op een tweede regel. Om dit te voorkomen hebben we een stapje terug gedaan en de lettergrootte verlaagd van 16 naar 15 pixels. Dit geldt ook voor de teksten in forumberichten.

Daarnaast is de lay-outbreedte op desktop aangepast naar de breedte die we ook hanteren op de frontpage en in de Pricewatch. Dit levert ongeveer 80 pixels extra horizontale ruimte op. De breedte van alinea's in forumposts zelf is ongewijzigd gebleven, omdat het aantal tekens per regel al aan de bovenkant van de aanbevolen range voor leesbaarheid zit. De kolom voor gebruikersnaam en avatar heeft wel meer ruimte gekregen, en afbeeldingen en tabellen kunnen iets breder worden weergegeven.

Op desktopformaat lopen forumtitels in lijstweergaven dankzij deze update vrijwel niet meer door op een tweede regel. Op kleinere schermformaten komt dit eveneens minder voor.

Heb je de bètatest nog niet aangezet, maar ben je benieuwd naar de verandering, zet dan 'Vernieuwing UI' aan onder bètafeatures in je instellingen.

Reacties (82)

Sorteer op:

Weergave:

Windows: Arial
Android: Roboto Flex
Apple-platformen: SF Pro
Ubuntu: Ubuntu
Of we nemen een font die bij elke Linux distro wordt meegeleverd. Ubuntu is nogal.... Ubuntu?
AuteurFemme UX Designer @BartOtten17 juni 2026 11:00
Voor andere Linux distro's hebben we Liberation Sans en generiek sans-serif als fallback.
Ik moet dus Liberation Sans toevoegen in mijn FreeBSD setup, of worden andere OS'en weer anders gezien?
ik vind het al wat dat ze rekening houden met linux, met slechts 5% aandeel. FreeBSD op de desktop heeft (jammer genoeg, eerlijk is eerlijk) nagenoeg geen aandeel.
Klopt, maar betekend niet dat het geen fonts heeft? En de browser meld zich vaak als Linux aan.
Hehe, wel consequent ook hierbij geen verschil tussen I en l :D
[sarcasme] Zullen de illuminati en de finnen niet kunnen waarderen. [/sarcasme]
Waarom dan niet ook LS voor ubuntu? Zoveel leesbaarder is het nou ook weer niet.
Er zijn nu toch al websites waar de user zelf een font kan kiezen in zijn user settings - is dat ook geen optie?

De user kan natuurlijk ook overriden met zijn browser.
Dank. Maar het zou fijn zijn als Tweakers niet steeds doet of alleen Ubuntu gebruikt wordt. Ik snap dat het prima is voor de massa, maar dat is Fedora ook (en was OpenSuse ooit ook, nu kan ik het niet meer aanraden)
Denk dat dit weer een hip UI designer feestje is om het meer naadloos te laten lijken op je OS.
Daar zitten wel meer voordelen aan dan 'hip designer' willen zijn. Dit zijn fonts die je OS al voorgeïnstalleerd heeft staan. Dat scheelt weer met hippe alternatieve fonts die eerst gedownload moeten worden. Dat is bandbreedte en laadtijd. Uiteindelijk bespaar je daar ook energie mee bij zowel server en client. Behalve de geringe kosten besparing is dat dan ook duurzamer.

Daarnaast is het voor je mentale model wel zo rustig als iets lijkt op hetgene dat je al gebruikt. Het is veel lastiger als een website totaal niet wil lijken op iets dat je kent. Vanuit kunstzinnig perspectief interessant, maar juist niet gebruikersvriendelijk.
Hiervoor kan je ook gewoon een websafe font gebruiken, dit hoeft niet voor elke OS een ander font te zijn.

Ik vind het voor websites vreemd om andere fonts per OS te gebruiken, het font moet bij het design van de website passen, heeft verder niks met het OS te maken.

Met hetzelfde argument, omdat ‘mensen dit gewent zijn’, kan je de knoppen en input velden ook wel in dezelfde stijl gaan maken als OS, de sluitknop in dialogen voor macOS links plaatsen en voor Windows rechts.
AuteurFemme UX Designer @faim17 juni 2026 14:30
We hebben er nu voor gekozen dat leesbaarheid het belangrijkst is. We hebben van alles geprobeerd met crew en bètatesters en de feedback is dat Arial een betere leesbaarheid heeft. Dit komt vooral van Windows-gebruikers met een standaard dpi beeldscherm. Arial is op dat soort beeldschermen het beste dat Microsoft heeft te bieden.

Wat ook meespeelt is dat het verschil tussen de fonts die we graag zouden willen gebruiken op de groottes die we gebruiken eigenlijk heel beperkt zijn. De meerwaarde van een webfont ten opzichte van een font dat Android en iOS/iPadOS/macOS al aan boord hebben is er eigenlijk niet dus waarom zou je het dan willen gebruiken. Het is anders als je een font-size hebt van bijvoorbeeld 20px. Wij zitten tussen 14 en 16px. Het moet vooral functioneel zijn.
Dan begrijp ik de keuze niet om voor macOS/iOS niet ook gewoon Arial te gebruiken en anders terug te vallen op Helvetica. Dan heb je meest uniforme look voor alle OS'en.
Er is weinig reden om te zorgen voor uniformiteit tussen verschillende OS'en. Gebruikers verwachten eerder uniformiteit tussen hun huidig OS en de website die ze gebruiken. Als SF Pro het standaard Mac OS lettertype is dan houdt het dus meer steek om dat te gebruiken dan Arial of Helvetica enkel en alleen omdat de twee op elkaar lijken en tweakers dan zogezegd meer "eenvormig" wordt. Dat klinkt misschien nobel en verstandig maar heeft in de praktijk geen nut, zeker niet voor neutrale body tekst.
Waar ik vaak tegen aanloop is het AI of Al

Geen verschil te zien maar heeft een totaal verschillende betekenis... En blijkbaar is dat nu hiermee niet opgelost.
Dat is op te lossen met Serifs typeface. (tegenganger van de Sans-serif). Het wordt ook wel kranten-lettertype genoemd. :P

Wikipedia: Sans-serif
Lijkt mij dat tweakers hier over na moet denken en niet ik. Als ze zo zitten te hameren op leesbaarheid.. dan is dit er wel 1 van de laatste tijd met AI nieuwsberichten..
Haha, het was zeker niet mijn bedoeling om dat vanuit jou te regelen. Maar om een compleet lettertype aan te passen voor de site ivm een paar woordjes zal tweakers vast niet doen.

Ikzelf ga er niet druk om maken. Naast dat ik een beetje ai-moe ben, weet ik dat feedback voor tweakers helaas niet (meer) wordt meegenomen.
Dat is op te lossen met Serifs typeface. (tegenganger van de Sans-serif). Het wordt ook wel kranten-lettertype genoemd. :P

Wikipedia: Sans-serif
Of in gewoon Nederlands: schreef tegenover schreefloze lettertypen
Er zijn genoeg sans-serif type faces waar een lowercase L er anders uit ziet dan een uppercase i. Bij deze type faces buigt de l onderdaan een beetje naar rechts. Maar dan heb je nog steeds wel het probleem dat een l er uit kan zien als een I. Bij sommige is de uppercase i specialer.

https://fonts.google.com/?preview.text=Al%20AI&preview.lang=en_Latn&lang=en_Latn&categoryFilters=Sans+Serif:%2FSans%2F*

[Reactie gewijzigd door elmuerte op 17 juni 2026 11:40]

Fixedsys fonts zouden hier veel helpen. Buiten IRC wordt het helaas praktisch nergens gebruikt.
Je moet gewoon letters met een schreef kiezen, maar die hebben op een beeldscherm zo hun beperkingen. Het kan prima een proportioneel lettertype zijn.
Je moet gewoon letters met een schreef kiezen, maar die hebben op een beeldscherm zo hun beperkingen
Het heeft o.a. te maken met de DPI (Dots per Inch). De tekst op beeldschermen werden steeds kleiner (helemaal ten tijde van de introductie van de iPhone) en daardoor moesten letters simpeler worden.

Er zijn tegenwoordig steeds vaker designers die suggereren dat een letters met een scheef weer kunnen omdat de DPI per letter weer omhoog is gegaan.
Exact. Daarom zijn Arial of Calibri in dit geval eigenlijk ongeschikt, omdat de hoofdletter I en de kleine L vrijwel niet te onderscheiden zijn. Neem je een font als Verdana, Aptos of Bahnschrift dan zit er een haaltje aan de kleine L, zodat je veel beter het verschil ziet.
Letters met schreef zijn voor mij eigenlijk nooit leesbaarder dan een goed schreefloos lettertype.

Je moet gewoon zorgen dat je l en I niet exact hetzelfde zijn. Door de kleine L een beetje naar beneden te duwen en deze ook een klein haakje naar rechts krijgt.
Leesbaarheid blijft uiteindelijk heel persoonlijk :) Onderzoek laat zien dat factoren zoals lettergrootte, regelafstand, contrast en tekstlengte meestal veel meer invloed hebben op hoe prettig tekst leest dan de keuze voor een serif- of sans-seriflettertype. Daarom bestaan er ook geen universeel "beste" lettertypen, al worden Verdana, Arial, Helvetica, Tahoma en Georgia vaak genoemd als goed leesbare opties.

Voor mensen met dyslexie blijkt vooral voldoende ruimte tussen letters en woorden een positief effect te hebben. Het valt mij op dat de titels op Tweakers.net relatief strak zijn gezet, met weinig ruimte tussen de letters.
En precies daarom zou ik eerder stemmen op een typeface zoals IBM Plex Sans.

Heeft veel weg van Arial, maar zorgt ervoor dat elk teken duidelijk te onderscheiden is.
Die ziet er wel netjes uit! Inderdaad, fijn de verschillen tussen I en l.
Wat is dat een vreselijke site.
Haha, eens. Had misschien beter kunnen linken naar Google Fonts. 🫨
Er zijn wel fonts waarbij dat verschil duidelijker is, maar dan zit je hoogstwaarschijnlijk weer vast aan een webfont. En daarvan hebben we gezien dat een groep mensen "wazigheid" ervaart wanneer dat gebruikt wordt voor broodteksten met relatief kleinere fontsizes (<= 16px).
zou eerder mijn voorkeur hebben toch, ik ben zo vaak aan het lezen waarbij ik denk dat er 'Al' staat en dat het dan toch 'AI' blijkt te zijn of andersom. Jammer dat er wel hierover gepraat kon worden, ik had het idee vanuit het vorige bericht dat de keuze al gemaakt zou zijn voor Roboto, maar blijkbaar toch niet als ik het bovenstaande lees waarin voor verschillende lettertypen is gekozen. Maar gelukkig zijn er snippets 8-)

[Reactie gewijzigd door mrdemc op 17 juni 2026 18:00]

Ik ben benieuwd, volgt T.net de WCAG standaard? Met een site die zo’n groot bereik heeft zou je dat namelijk wel verwachte .
crisp Senior Developer @Toppe18 juni 2026 12:24
We proberen wel zo veel mogelijk de richtlijnen op het gebied van toegankelijkheid te volgen. We streven naar WCAG 2.1 AA compliance (ja, daar moet best nog wel wat voor gedaan worden) en gebruiken Lighthouse om te checken dat we in ieder geval niet slechter gaan scoren (en ja, Lighthouse heeft zo z'n tekortkomingen).

Als er specifieke dingen zijn waar je qua toegankelijkheid tegenaan loopt, dan horen we dat natuurlijk graag :)
Ik ben kleurenblind en ik merk dat websites hier weinig moeite voor 'willen' doen en soms is het erg lastig om wat te lezen omdat er veel te veel 'kleur' is.


Ook die "Jouw winnende opstelling dit WK" is zo'n voorbeeld, prima banner maar die rand er omheen maakt het niet fijn om te kijken.

Idem voor deze blauwe balk, blijkbaar zit 'ie er, ik zie hem niet.
https://tweakers.net/foto...GO9Wk6RY3EDZ6Phg3NEqE.png
Nee, zou je inmiddels wel verwachten inderdaad. Maar de WCAG standaard is er wel, maar de handhaving daarvan is weer een raar iets.
Duidelijke verbetering tov. de eerdere beta versie. Alleen vind ik de 16px. voor artikelen nog steeds te groot. De keuze voor systeem lettertypen / Arial is een erg goede keuze. En de koppen zien er ook prima uit.
Dit!

Ik vroeg mij al af of dit aan het font lag, maar bij een dev options check bleek het font echt 2px groter te zijn gemaakt.
In de UI-vernieuwing kiezen we bewust voor grotere lettertypes om de leesbaarheid te verbeteren en aan te sluiten bij moderne webstandaarden.
Dat hoeft van mij dus absoluut niet. 'Moderne' webstandaarden zorgen ervoor dat ik website moet uitzoomen om ze leesbaar te krijgen... Ik vermoed dat het merendeel het prima kan (kon) lezen en de rest heeft een zoomfunctie als ze slechter zicht hebben! Laten we verziendheid niet gaan bevorderen.

Dat de fonts aangepast zijn naar systeemfonts, prima, ziet er op de Windows pc en android tel gewoon beide goed uit. Al zou ik ook liever een verschil zien tussen I (i) en l (L), het is hoe het is.
Arial leest prettig, maar is erg slecht met de I en de l, omdat die twee letters vrijwel identiek eruit zien. Daar zijn betere opties voor te vinden, en met alle ai-gerelateerde posts is het denk ik nog iets om over na te denken.
ik zou heel graag het lettertype Dyslexie willen zien. Vind ik een heel fijn lettertype om te lezen.
Ik snap dat die niet als standaard wordt gebruikt. Maar als optie noals de NOS app heeft is heel prettig.

[Reactie gewijzigd door ewoutw op 17 juni 2026 11:08]

Goede suggestie. Ik kende hem nog niet. Evenals een kleurenblind-modus zou dit best overal standaard onderdeel van mogen worden!
Beetje kinderboeken font ( niet denigrerend bedoelt, want daar letten ze inderdaad op leesbaarheid). Zou verplicht moeten zijn voor alle eula’s enzo.
Keuze zou mooi zijn
Als ik het goed begrijp is de lettergrootte in de forumposts verlaagd van 16 naar 15 en daardoor passen er dus ook meer woorden op een regel bij een forumpost.

Het aantal woorden op een regel bepaalt heel erg hoe snel je een tekst kan scannen en luistert nogal nauw.
Als ik dat met elkaar vergelijk op de desktop vind ik dit helaas een verslechtering vd leesbaarheid vd forumposts. Jammer.

Op een pagina als Forum Bookmarks werkt het wel goed en oogt het rustiger omdat titels minder snel afgebroken worden.
Helemaal mee eens. Er is een reden waarom kranten tekst zetten in relatief smalle en lange kolommen. Vertikale video's, nee liever niet maar voor tekst zie ik veel liever 'portrait' modus.
crisp Senior Developer @Help!!!!17 juni 2026 15:05
De lettergrootte binnen de bèta is 1 pixel kleiner gemaakt; ten opzichte van de huidige situatie (non-bèta) is het nog steeds een vergroting van 13px naar 15px. De ruimte voor de tekst is op desktop in de bèta welliswaar iets vergroot (672px breedte versus 640px), maar netto is het aantal tekens/woorden per regel daarmee wel verkleint, wat de leesbaarheid ten goede zou moeten komen. Het is met 90 tekens per regel nog wel vrij hoog, maar het zit nu ruim boven de 100.
Dit is een hele verbetering. Alleen de kopteksten zijn nog nog slecht leesbaar. Ik weet niet precies welk font daar gebruikt wordt, maar dat ziet er echt lelijk uit met antialiasing uitgeschakeld.
AuteurFemme UX Designer @TERW_DAN17 juni 2026 13:19
Dan moet je antialiasing aanzetten. Antialiasing is een essentiële techniek om lettertypes met een goede leesbaarheid te kunnen renderen op beeldschermen.
Antialiasing aan is gewoon geen optie, dat maakt alles zo ontzettend onscherp dat het direct hoofdpijn oplevert om het te kunnen lezen.
Ik snap niet waarom we bedacht hebben dat pixels uitsmeren zodat het wazige randjes heeft ooit een goed idee was. Als ik iets op papier zet dan smeer ik het ook niet uit. Een pixel is gewoon een pixel, maar je ziet aan moderne lettertypes dat ze allerlei kunstgrepen uitvoeren om de vage randjes een soort van leesbaar te houden.

Waarom dan niet gewoon een lettertype kiezen (zoals Arial, die dat perfect doet), dat er fatsoenlijk uitziet, ongeacht of je antialiasing aan of uit hebt staan?
Lettertypes zijn vectoren daar zitten geen trucjes in. Die trucjes zitten meer in je OS

Vroeger in windows kon je dat tunen zodat het voor jouw beeldscherm goed werkte, geen idee of dat nog steeds kan
Wat zijn broodteksten? Breadcrumbs?

Blijf het vermoeiend vinden om telkens te moeten nadenken welke ict term nu toch weer bedoeld wordt.

Andersom word dan weer headings geschreven wat juist weer prima bekend is onder de term koppen 8)7
Denk dat het een typo is en 'bodyteksten' hoort te zijn.
crisp Senior Developer @sky-18 juni 2026 12:25
Nee hoor, "broodtekst" is een redactionele term waar inderdaad de "bodytekst", oftewel inhoud van een artikel/bericht etc., mee wordt aangeduid.
Eerlijk, gelukkig hebben we nog custom CSS. Forum is en blijft niet fijn lezen met het nieuwe lettertype, zelfs 1 tandje kleiner blijft het niet fijn lezen. Frontpage is ok, maar veel reacties lezen of grote lappen tekst blijven ver van 'informatie dichtheid'.
Vind ik ook, daarom heb ik vrijwel alle groottes een paar tandjes teruggeschroefd: Undo bètatest 2026 fontvergroting
Heb het net ff aangezet op mn android telefoon. Vind het oude veel mooier dan het nieuwe font. Beetje lelijk dit.
Ja, die tekst ga ik wel aan wennen, maar die headers...

Om te kunnen reageren moet je ingelogd zijn