I teach an HTML/CSS course at Shillington College in Sydney. The course is aimed at providing Graphic Designers with an introduction to writing code and understanding HTML and CSS. Something that print designers find very difficult to accept is that due to the changing nature of the web as a medium and the ever changing size of displays and devices, it is almost impossible to completely avoid widows in type.
However, a trick that we often use, which more people should know about, is non breaking space characters to prevent widowing. This has been documented a lot in the past and i’m definitely NOT taking credit for the idea (I believe the first place I saw this technique was “widont” by Shaun Inman – but I could be wrong).
The concept, in a nutshell, is to put a “non breaking space character” between the last two words of a paragraph, such that the browser will essentially stick these words together.
The simple implementation is to include this in your HTML.
on some devices, at some resolutions, this sentence will likely have a widow
The only thing a beginner need know about this, by replacing the ” ” space between “a” and “widow” with “ ” we are forcing the browser to not break the line between these words. This is not as controlled as shaping text in a printed document, however it does give us the ability to prevent obvious widows. We often use this technique for headings and feature text – but as always: use with caution and test, test, test.
