Monospaced-woorden

Deze tool neemt een bekend idee, monospaced tekst, en geeft er een nieuwe draai aan. In plaats van elke letter even breed te maken, zorgt het ervoor dat elk woord even breed is.

Het resultaat is een tekstblok waarin elk woord exact dezelfde horizontale ruimte inneemt, ongeacht het aantal letters. Een kort woord als "is" wordt net zo breed als een lang woord zoals "kindercarnavalsoptochtvoorbereidingswerkzaamheden". Dat klinkt misschien wat vreemd, maar deze kleine verandering zorgt voor een compleet andere leeservaring.

Link

Wat is monospaced tekst?

Traditioneel geven monospaced lettertypes elke letter evenveel horizontale ruimte. Een i neemt net zoveel plek in als een W. Deze lettertypes worden veel gebruikt in programmeeromgevingen, typemachines, terminalvensters en technische documenten waarin nette verticale uitlijning belangrijk is.

Monospaced tekst kan code leesbaarder maken, helpen bij handmatige uitlijning en zorgt voor een voorspelbare structuur. Maar bij het lezen van normale lopende tekst voelt het vaak stijf of ouderwets aan. Dat komt doordat onze ogen gewend zijn aan proportionele lettertypes, waarbij smalle letters minder ruimte innemen dan brede, wat zorgt voor een natuurlijker ritme.

Deze tool keert het concept om. De letters blijven onaangetast. In plaats daarvan kijkt de tool naar de woorden in een alinea, zoekt het langste woord, en schaalt vervolgens elk ander woord horizontaal tot ze allemaal even breed zijn. Dit gebeurt met een simpele techniek: elk woord wordt in een <span>-tag geplaatst, waaraan de CSS-stijl transform: scaleX() wordt toegepast om het op te rekken.

Interpunctie en spaties blijven behouden, dus de tekst blijft goed leesbaar, maar het effect is direct zichtbaar. De zinsstructuur blijft intact, maar de textuur van de tekst verandert. Het voelt gelijkmatig, in balans, zelfs een beetje mechanisch, maar dan op een goede manier. Meer als een soort poëtisch raster.

Link

Een persoonlijk perspectief op lezen

Als iemand met dyslexie let ik vaak op de vorm en lengte van woorden om te bepalen wat ik lees. Ik decodeer niet altijd elke letter afzonderlijk. Als ik een lang woord zie dat begint met "int" en eindigt op een "t", dan gok ik dat het "intelligent" is, ook al staat er misschien iets anders.

Die gokjes gaan meestal razendsnel en onbewust, maar kunnen leiden tot fouten, vooral als woorden op elkaar lijken. Wat ik interessant vond aan deze monospaced-woorden-layout, is dat het de lengte van woorden als visuele aanwijzing wegneemt. Elk woord krijgt exact dezelfde vorm op het scherm, dus ik ga niet meer uit van hoe breed een woord eruitziet. In plaats daarvan maak ik dezelfde gok, maar dan op basis van visuele dichtheid, of simpel gezegd de mate van "drukte" binnen de ruimte die één woord inneemt.

In het begin was dat verwarrend. Maar na een tijdje begonnen mijn ogen te voorspellen waar elk woord zou staan. Doordat alle woorden dezelfde breedte hebben, paste mijn leestempo zich aan. Ik begon mijn blik direct naar het midden van elk woord te richten, omdat ik precies wist waar dat zou vallen binnen de tekst. Die voorspelbaarheid maakte het makkelijker om regel voor regel door de alinea te scannen, op een manier die gecontroleerder en minder springerig aanvoelde.

Of dit iemands leessnelheid zou verbeteren of juist niet, valt moeilijk te zeggen. Maar het is hoe dan ook een frisse, vreemde ervaring. Het lost niets fundamenteels op, en dat is ook niet het doel, maar voor mij opende het nieuwe perspectieven op typografie, toegankelijkheid en ontwerp.

Link

Waarom hiermee experimenteren?

Deze tool is niet bedoeld als vervanging van hoe we dagelijks lezen. Maar het is wél een leuke en mogelijk nuttige manier om te onderzoeken hoe opmaak onze waarneming beïnvloedt. Ontwerpers kunnen het inzetten voor typografisch artwork. Ontwikkelaars kunnen het gebruiken in visuele interfaces waar uniformiteit belangrijk is. En docenten of onderzoekers zouden het interessant kunnen vinden bij het bestuderen van de invloed van vorm op begrip.

Het is ook gewoon een speelse manier om met taal om te gaan, waarbij bekende zinnen veranderen in iets rigide maar vloeiends, wiskundig maar toch leesbaar. En als het niets anders doet, dan zorgt het er in elk geval voor dat je even anders naar tekst kijkt.

Voer hierboven een alinea in. De woorden worden in realtime aangepast, elk uitgerekt tot de lengte van het langste woord. Probeer korte en lange woorden te mixen. Voer één zin in, of een hele alinea. Bekijk hoe de opmaak zich vormt tot een strikt visueel ritme. En stel jezelf dan de vraag: is dit makkelijker te lezen? Of moeilijker? Of wellicht alleen interessanter?

Link

Technische toelichting

Deze tool draait volledig in je browser. Er worden geen canvas-trucs of server-side rendering gebruikt. Gewoon simpele HTML, CSS en JavaScript. Elk woord wordt in een span geplaatst, opgemeten, en vervolgens getransformeerd. Het is lichtgewicht, omkeerbaar en eenvoudig mee te experimenteren. Doordat het puur op standaard webtechnologie draait, blijven de bewerkte teksten ook toegankelijk voor andere systemen zoals webcrawlers en ondersteunende technologie. Nieuwsgierig hoe het werkt? Bekijk gerust de broncode.

Link

Gerelateerde tools

Link

Verder lezen

Widget gemaakt met staark