Table of Contents
Close Close table of contents

Automated webtypography with OpenTypography and php

About two years ago Opentypography was born, and together with FontDeck the idea was tested for a few typefaces in their collection. You can read the release post about the 2012 version of OpenTypography at Smashingmagazine.com

A few months ago I started converting the Javascript solution to a more robust php solution.

The goal is to have something running in the background of cms’s like Wordpress, Ghost, Drupal or lighter platforms like our discontinued Skrivr.

The idea is firstly to automate as much of the typographic details in a text as possible. But secondly to include more intelligent features in the solutions.

Core features of the solution

Those typographic features in its most rudimentary versions has been finished in the php version, and after fixing some small-caps abbreviation-bugs I will pretty soon make the first real tests on this site.

OpenTypography first PHP version Top: Text without typographic editing Bottom: Text automatically edited with the OpenTypography solution

Extended features – formatting numerals

As you see, the core features doesn’t cover all the typographic issues that might occur in a text.

I want to add further intelligence to the solution. If we look at some of the most common shortages caused by todays software and keyboard layouts it is mostly the widely spread misusage of hyphens, minuses or en- and em-dashes that is the issue. But solving this is way more complex than simply replacing quotation marks and ligatures. To know if a en/em-dash is separating or combining words and numbers we have to know the language context they are in.

That is what I’m currently working on. And I have decided to focus on numbers and formatting those in a as correct context as possible.

Examples of what has to be programatically detected:

The hyphen in «1-3 kg» has to be turned into an em-dash: «13 kg» as opposed to «Liverpool won the game by 1-3» that shall not be altered.

The numerals in «The organization spent 12003500 dollars …» has to be turned into «1,200,350». The phone number in «… contact us at 12003500» has to be formatted like «1200 3500» or «120 035 00» or «12 00 35 00» depending on what language the text is written in.

The key to this, I think, will be looking around the numbers and see what precedes and succeeds them. Based on that we can get clues on how to format them.

So it doesn’t take a neurosurgeon to realize that there is a horseload of work ahead to make that work.

Andreas Friday, 10 October, 2014    |    Agree or disagree? Please