Tekst op thumbnails: hoeveel woorden, hoe groot en waar

Waarom minder woorden beter werken

Iemand die door een feed scrolt, geeft elke thumbnail een fractie van een seconde. In die tijd neemt iemand een gezicht, een vorm en één of twee woorden op, geen zin. Tekst die de titel herhaalt, verspilt de ruimte; tekst die een getal, een resultaat of een wending toevoegt, geeft de kijker een tweede reden om te klikken.

Er is ook een formaatprobleem. Elk extra woord maakt alle woorden kleiner, omdat de breedte van het beeld vastligt. Van drie naar zeven woorden gaan halveert ongeveer de letterhoogte die je je kunt veroorloven, en op zijbalkformaat is dat het verschil tussen leesbaar en onzichtbaar.

Hoeveel woorden passen op een leesbaar formaat

Met letters van minstens 100 pixels hoog en normale letterafstand past er op een canvas van 1280 pixels breed ongeveer 10–14 tekens per regel, als je marges laat en de rechterkant vrijhoudt. Twee regels grote tekst is het praktische maximum voordat het beeld zelf geen ruimte meer heeft.

Ontwerp leesbare thumbnailtekst in zes stappen

1. 01

   Bepaal wat de tekst toevoegt

   Schrijf het ene feit of de wending op die het beeld niet kan tonen. Is die er niet, gebruik dan geen tekst.

2. 02

   Kort in tot vijf woorden of minder

   Schrap lidwoorden, opvulling en alles wat al in de titel staat.

3. 03

   Zet hem groot en vet

   Maak het kleinste belangrijke woord minstens 100 px hoog op een canvas van 1280×720.

4. 04

   Voeg scheiding toe

   Gebruik een rand, schaduw of vlak tot de tekst een contrastcheck van 4,5:1 haalt.

5. 05

   Plaats hem linksboven

   Houd hem uit de rechter 22% en de onderste 22% van het beeld.

6. 06

   Check op 168 pixels

   Open de safe-zone-checker op een breedte van 168px en lees de woorden zonder in te zoomen.

Waar je tekst plaatst

Kijkers van talen die van links naar rechts lezen, beginnen meestal linksboven te scannen, en eyetrackingonderzoek op webpagina’s toont dat mensen zich richten op het begin van regels en de linkerkant van content. Linksboven en middenboven zijn daarom sterke plekken voor woorden. De hoek rechtsonder is de slechtste, omdat de duurbadge die op bijna elk scherm bedekt.

Laat op een canvas van 1280×720 een marge van ongeveer 50 pixels rond de randen en houd tekst uit de rechter 22% en de onderste 22% van het beeld. Zet geen tekst over het gezicht van het onderwerp; zet hem ernaast, op een rustig stuk achtergrond.

Getallen, symbolen en emoji op thumbnails

Getallen behoren tot de effectiefste woorden op een thumbnail omdat ze kort en specifiek zijn: “€0”, “30 DAGEN”, “1 vs 100”. Cijfers in vette lettertypes zijn breed en duidelijk en overleven verkleining goed. Houd valutatekens en eenheden even groot als de cijfers of iets kleiner, maar nooit piepklein.

Symbolen zoals pijlen, vraagtekens en vinkjes kunnen woorden vervangen, maar elk ervan voegt een element toe dat om aandacht concurreert. Gebruik er hooguit één. Emoji worden door de editor als afbeeldingen weergegeven, dus ze schalen als elke andere graphic; één grote emoji kan werken als reactie, maar meerdere kleine worden op 168×94 gekleurde stipjes.

• Liever cijfers dan uitgeschreven getallen
• Hooguit één symbool of pijl
• Eén grote emoji, nooit een rij kleintjes

Uitgewerkt voorbeeld: van negen woorden naar drie

De eerste versie van een techreviewer zegt “I USED THIS CHEAP LAPTOP FOR 30 DAYS” langs de onderkant van het beeld, op 64 pixels zodat het past. Op 168×94 zijn de letters 8 pixels hoog en staan de laatste twee woorden onder de duurbadge.

De tweede versie verplaatst de claim naar de titel en houdt “30 DAYS LATER” linksboven op 130 pixels met een donkere rand. Op zijbalkformaat zijn de letters 17 pixels hoog, de hoek is vrij en de tekstcheck van de audit wordt groen.

Veelgemaakte fouten met thumbnailtekst