Eindelijk: woordafbreking in html werkt!

Het is erg irritant als je tekst er online niet uitziet omdat lange woorden zorgen dat regels niet mooi uitgevuld worden. En dat probleem wordt natuurlijk alleen maar groter met responsive design. Want als iemand een site bekijkt op een mobieltje of tablet dan moeten die lange woorden in nog kleinere vakjes gepropt worden. Gelukkig blijkt nu dat woordafbreking werkt in html. In sommige browsers.

Dat het zo lang heeft geduurd komt misschien dat het probleem in het Engels niet zo groot is. Maar het Nederlands met z’n vele samenstellingen kan eigenlijk niet zonder woordafbreking. Vroeger kon je nog wel eens een zinnetje omgooien om de tekst beter over de ruimte te verdelen, maar dat is nu met de vele browsers en schermen onbegonnen werk.

Hyphenation works!
Daarom was ik dolblij toen ik op Quirksmode las dat drie browsers sinds kort woordafbreking aankunnen: Firefox, IE10 en Safari. Kijk maar hoe het werkt bij dit responsive WordPresstheme. Heb je niet de juiste browser, bekijk dan dit plaatje:

Hoe doe je het zelf?
Woordafbreking installeren op je eigen site of blog? Met een paar extra regels in je stylesheet (in de body-tag) is het gepiept. Ze staan in Quirksmode. Als je dat nog niet gedaan hebt, moet je ook nog vermelden dat je website in het Nederlands is (lang=”nl”). Zegt dit je allemaal niets, vraag het dan aan je webbouwer.

Hoe werk het?
Ik neem aan dat de woordafbreking werkt met de afbreekpatronen van OpenTaal waar ik in een grijs verleden nog wel eens woorden aan heb toegevoegd. Op basis van regels die ik ontwikkelde bij Van Dale.

Hoera voor woordafbreking!