4 ms·

I work with a lot of online publishing clients, who aren't always particularly tech savvy (you'd be amazed by some of the workflows). Designers would often like

by fortes 17y ago

I work with a lot of online publishing clients, who aren't always particularly tech savvy (you'd be amazed by some of the workflows). Designers would often like to justify text, which can cause some terrible whitespace rivers since browsers don't provide hyphenation. Browsers do, however, support soft-hyphens, which are hints that tell the browser where it can break a word. Adding these hyphens manually is quite tedious. So I wrote up this little utility that takes HTML and adds soft hyphens automatically. Background: - Took a day to write (started it yesterday afternoon) - Written in Python, deployed on AppEngine - Uses OpenOffice's hyphenation dictionaries Source code: http://github.com/fortes/softhyphen http://github.com/fortes/softhyphen

jacobolus 17y ago
This is neat. Some possible drawbacks: (1) Browser layout engines are pretty messed up, and adding a bunch of shy hyphens can lead to really weird layout issues. I wish I had some good examples, but basically it has to do with taking into account the amount of space a hyphen takes up, and using that to compute how long lines should be, but then when the hyphens are in the middle of the line, not showing them. Anyway, as I remember sometimes it can result in text being eaten (i.e. not shown properly). In other words, I’d try to do specific testing in a bunch of browsers, resizing a window through all reasonable sizes it might be, before counting on shy hyphens to work properly. (2) This is still going to break search within pages. Pretty stupid that browsers can’t do proper search, but so it goes. (3) This is going to be effectively a line-by-line paragraph composer, because browsers don’t do any kind of real paragraph layout. And it still won’t do any adjustment of inter-letter space. The combination of these two things means that using justified text is going to still usually end up looking like crap. Better than without any hyphenation, but not all that much better. ---- In short, this is kind of a half-way stopover workaround for the absolutely stupid lack of real hyphenation and justification algorithms in current browsers. Absolutely stupid because this is a solved problem: the algorithm used by TeX and described in one of Knuth’s students in the late 70s works pretty darn well (Adobe uses a modified version for InDesign), and on modern hardware should be perfectly reasonably fast, as well. It’s not quite as bad as the lack of real layout in Microsoft Word, given that laying out text is the only purpose of that application, but still.... pretty bad.
- est 17y ago
  > Browser layout engines are pretty messed up Did html5 address this?
  - jacobolus 17y ago
    It's not in HTML5’s scope. That’s the domain of CSS3.
antileet 17y ago
One of the main issues here would be source-code readability (people will have to add another step to the build-process and the folks using static content will have some difficulty). An elegant solution I can think of is to implement this as django middleware and hyphenates all the content by default. I don't know about the performance impact of this. But if there is an approximate solution you can create which doesn't require dictionaries, you can port that to javascript as a library which can then instrument all the elements in a class with these soft hyphens. This will also solve the performance issue and can be introduced very unobtrusively into virtually any application. And also any potential SEO concerns are alleviated.

by fortes 17y ago

jacobolus 17y ago

This is neat. Some possible drawbacks: (1) Browser layout engines are pretty messed up, and adding a bunch of shy hyphens can lead to really weird layout issues. I wish I had some good examples, but basically it has to do with taking into account the amount of space a hyphen takes up, and using that to compute how long lines should be, but then when the hyphens are in the middle of the line, not showing them. Anyway, as I remember sometimes it can result in text being eaten (i.e. not shown properly). In other words, I’d try to do specific testing in a bunch of browsers, resizing a window through all reasonable sizes it might be, before counting on shy hyphens to work properly. (2) This is still going to break search within pages. Pretty stupid that browsers can’t do proper search, but so it goes. (3) This is going to be effectively a line-by-line paragraph composer, because browsers don’t do any kind of real paragraph layout. And it still won’t do any adjustment of inter-letter space. The combination of these two things means that using justified text is going to still usually end up looking like crap. Better than without any hyphenation, but not all that much better. ---- In short, this is kind of a half-way stopover workaround for the absolutely stupid lack of real hyphenation and justification algorithms in current browsers. Absolutely stupid because this is a solved problem: the algorithm used by TeX and described in one of Knuth’s students in the late 70s works pretty darn well (Adobe uses a modified version for InDesign), and on modern hardware should be perfectly reasonably fast, as well. It’s not quite as bad as the lack of real layout in Microsoft Word, given that laying out text is the only purpose of that application, but still.... pretty bad.

est 17y ago
> Browser layout engines are pretty messed up Did html5 address this?
- jacobolus 17y ago
  It's not in HTML5’s scope. That’s the domain of CSS3.

antileet 17y ago

One of the main issues here would be source-code readability (people will have to add another step to the build-process and the folks using static content will have some difficulty). An elegant solution I can think of is to implement this as django middleware and hyphenates all the content by default. I don't know about the performance impact of this. But if there is an approximate solution you can create which doesn't require dictionaries, you can port that to javascript as a library which can then instrument all the elements in a class with these soft hyphens. This will also solve the performance issue and can be introduced very unobtrusively into virtually any application. And also any potential SEO concerns are alleviated.