Typogrify inserts non-breaking spaces into headings

[klingtnet]

I was using typogrify as a filter for the nikola static site generator until I noticed why my headings were not wrapped on whitespaces. The issue was that typgorify seems to replace spaces randomly with a   which prevents the browser from wrapping the headings correctly on small screens.

[justinmayer]

In my experience, the behavior is not random. Non-breaking spaces are added to prevent widows, orphans, and other phenomena that are aesthetically suboptimal. Perhaps you might care to provide more detail regarding the perceived issue?

[klingtnet]

Take f.e. this heading: <h1 itemprop="headline name">SSH cipher performance comparision</h1>, after running through typogrify it looked like this: <h1 itemprop="headline name">SSH cipher performance&nbsp;comparision</h1> Maybe it's enough to prevent the insertion of non-breaking spaces in hX tags at all.

[justinmayer]

In the example you cited, Typogrify is behaving precisely as designed: without the non-breaking space, the word comparison could be "widowed" on the following line by itself. If you look at the relevant code, you'll see where this is accomplished.

Typogrify offers several mechanisms for selectively customizing its behavior. If Nikola does not provide sufficient granularity regarding when and how Typogrify filters are applied, unfortunately we can't do anything about that.

[klingtnet]

For sure it would be possible to implement a filter in nikola that prevents typogrify from running on headings, but maybe the default behaviour isn't what the user expects. The headline with the 'widowed' word is what most users would expect, in my opinion. With the non-breaking space inserted, you have exactly two options, the first is a ugly looking break when the word-wrap rule is set in the pages CSS or the second is a broken layout on small screens.

PS: It had to search for a while to find the reason while the headings weren't broken at the whitespace because the developer tools of all major browsers are not showing non-breaking spaces in the dom-tree.

[justinmayer]

The headline with the 'widowed' word is what most users would expect, in my opinion.

In the specific mobile view that you're testing, yes. But a desktop view of a long headline with a single word wrapped on the second line? That's not, in my opinion, what "most users" would expect.

Given that I can't think of a simple way to distinguish between mobile and desktop in the context of what Typogrify does, I don't believe disabling the widont filter for heading tags by default is an acceptable solution. That said, I understand the problem you describe and am open to alternative proposals.

[chrisdrackett]

My opinion is that if you want a heading to show without a nbsp don't apply widont to that heading. Typogrify is about good typography rules for both desktop and mobile, but it also understands that you might not want all filters in all use cases. If you don't want widont in a header but want other filters you can apply them one by one as well.