Sunday, March 18, 2012

Caps, Lowercase & x-Height: The Development of Sassoon Joiner Fonts

I think we left off talking about why all CAPS is a bad thing to do to text, especially more than just a couple of words, especially when using a monospace typeface, because when you try to look at each word as a single unit, all words look alike -- boxes of varying widths:



The above is an image from Robin Williams' excellent book The Mac is Not a Typewriter and was produced to show the difficulty in reading whole words written in all-caps, especially monospaced all-caps.

Note that the two pairs of words are of the same number of characters; thus when the eye detects them as shapes, the two shapes look alike. When Rosemary Sassoon was asked to consider which would be preferable typefaces for children learning to read and write, she realized that studying children and their preferences had been left out of the study equation.

I was astonished that although various ‘experts’ had their own views, no one had bothered to ask the actual users – children... The design was based on the children’s preferences and surprising explicit comments – a slight slant, a plain top (sans serif) and a flickup like Times Italic. When rationalised that suggested that an exit stroke bound the word together. That feature, coupled with slightly extended ascenders and descenders (which had been eroded in other modern typefaces) accentuated the word shape hence made for easier recognition.

Ascenders, Descenders & x-height

Before we see why ascenders, descenders and x-height can make a great deal of difference is seeing entire words as shapes (or at least help in decoding), a few definitions are in order:



x-Height characters are everything else and have the vertical dimensions of, say, a lowercase x: They are a, c, e, i, m, n, o, r, s, u, v, w, & x. Why do ascenders, descenders and x-height assist in decoding words? It's a matter of creating visual contrast:



Still skeptical? Consider the following:





In the two above examples, Ascenders (signifying either a capital letter or one of the lowercase letterforms with an ascender) and descenders provide important clues as to what the words are. As children become more expert readers they learn to read whole words, partly by shape. As Sassoon notes, modern typefaces that seek to erode the visual contrast between letterforms with ascenders, descenders and how they relate to overall x-height make that text more difficult to read more expertly by new readers.

Thus we have the Sassoon family of fonts:





In the next post, we will discuss using type creatively and how to avoid some of the common don'ts of using type.

Saturday, March 17, 2012

Monospaced vs. Proportionately-spaced Typography


In a follow-up to the previous post, we learned that choosing an appropriate typeface can bridge the gap between learning to read and learning to write in young children as well as demonstrate learning cursive handwriting skills by taking a look at the Sassoon Joiner fonts and software, a demo of which is freely downloadable. In this post, we will discuss those monospaced vs. proportionately-spaced typefaces.

We talked a little in the previous post about the days of the dreaded typewriter. For the benefit of those whose eyes glazed over and rolled into the back of their skulls at the reference, let's take a trip back in time... time... time...:

In the beginning...


The first thing to learn is the difference between a monospaced typeface and a proportionally-spaced typeface (remember Steve Jobs talking about that in his Stanford commencement speech?). Below is the same sentence rendered in two similar-looking typefaces (both are serif typefaces; more on that in a minute):


The first line is in Courier; Courier is a monospaced font. The second line is in Times New Roman, which is a proportionally-spaced font. Both are 24 pt. Notice that the proportionately-spaced font takes up less horizontal space. That is because a monospaced typeface allots the same "cushion" space around the letterform for a capital W as for a lower-case i. The first line was indented two spaces; the second was indented five spaces. The third shows the difference between five and two spaces for the typeface Times New Roman. Below you can see how, in Courier, each character occupies the same horizontal amount of paper or screen real estate as any other in the typeface:


Notice how all the characters on row 1 line up with all the characters on row 2, regardless of how much horizontal space any given character actually requires to be properly represented. The monospace aspect of using typewriters can be a good thing when you need to properly align things like a column of numbers in a word processing application. It's less of a good thing when it comes to reading, because every single word has pretty much the same shape as every other word, making it difficult for the brain to engage in pattern recognition and chunk words into a single object rather than reading each character individually and then forming a word. Secondarily, for those of us who learned to type on a typewriter, the only way to create visual space demarcing the end of one sentence and the beginning of another was to type two spaces after the terminal period of a sentence, something now discouraged in this age of proportionately-spaced typefaces of the digital era. (I must admit that I have not been able to break the habit!)

Another bad habit carryover from the days of the typewriter, is the custom of using ALL CAPS WHEN WE WISH TO DRAW EMPHASIS TO SOMETHING. Because it was that or underlining (or, if you were especially clever, backspacing and double-striking each letter, because backspacing in a mechanical device never really got you to the exact same place on the paper, thus resulting in a double-strike that mimicked boldfacing a word).

Next post: Ascenders, Descenders, & x-height!

Friday, March 16, 2012

Sassoon Joiner & the Importance of Typography & Handwriting


In Steve Jobs' famous 2005 Stanford University commencement speech, the college dropout noted the profound effect that auditing a course in calligraphy had on him:

Reed College at that time offered perhaps the best calligraphy instruction in the country. Throughout the campus every poster, every label on every drawer, was beautifully hand calligraphed. Because I had dropped out and didn’t have to take the normal classes, I decided to take a calligraphy class to learn how to do this. I learned about serif and san serif typefaces, about varying the amount of space between different letter combinations, about what makes great typography great. It was beautiful, historical, artistically subtle in a way that science can’t capture, and I found it fascinating.

None of this had even a hope of any practical application in my life. But ten years later, when we were designing the first Macintosh computer, it all came back to me. And we designed it all into the Mac. It was the first computer with beautiful typography. If I had never dropped in on that single course in college, the Mac would have never had multiple typefaces or proportionally spaced fonts.


People who remember the days of the typewriter can tell you of the excitement when the Mac came around and we had something like 32 typefaces with up to four or five different "effects" that could be combined when using them. And now we have so many more and yet, how often do we pause to think about which typeface to use instead of using the default? Moreover, how relevant is typography to software design, a question which Rosemary Sassoon believes is worth asking?

As she notes in her book Computers and Typography, choosing the correct typeface in an education setting has can have a positive effect in bridging the gap between reading and writing for children. As she says,


Remember Sassoon's claim that choosing the right typeface can bridge the gap between reading and writing for children? What exactly is that gap -- and what would be wrong about using any of the very standard and commonly-available typefaces shown below in an educational software product aimed at new readers?



Still can't see it? Let's try again:




Look at the incongruence between how children are taught to print a lowercase "a" and how the same letter is given an entirely different representation in the "standard" typefaces above. Bonus points if you can spot the additional letter in some of those typefaces which is similarly problematic.



Thus was born the Sassoon font family and Sassoon Joiner educational software program, a program made possible and designed by Sassoon (in the midst of a Ph.D. program in Typography and Graphic Design) and an associate in LiveCode and fine-tuned by a LC developer.

The font family alone is useful in the preparation of student practice sheets or for webpages or software programs; the program, however, is useful in showing on-the-fly the art of handwriting, an art that many say is on the decline:

Click here to see video

As Joiner and her colleague Adrian Williams note, Sassoon® Cambridge Joiner is needed to assess which join is used with the starting letter and the next letter. Even when joins have been calculated for a word, the joins may be changed in view of the Preferences set by the User or the combination of letters. This isn't your father's "Hello World" type of programming. It involves examining the position of every character and having multiple representations of each character depending upon whether the character occurs at the beginning, the middle, and the end of a word, or by itself; Williams notes that The test word was not the usual "Hello world" but "success" because it used two forms of c, a tricky e join and three forms of s:

Click here to see the different letterforms and the application in action as it determines which letterform to use. The screen video doesn't quite show it here, but when I was typing in the application, you could see the app "change its mind" about which letterform to use, which is interesting to see.

Why LiveCode? Williams continues, A program was required to control the fonts. I had been following the progress of Runtime Revolution for some time, I took the plunge and bought it, giving me the opportunity to quickly make a first test program. As I had never coded before, its language quickly endeared me to it.

Why does cursive handwriting still matter? As Williams points out, Surprisingly, in the past many schools had no consistent handwriting policy, but left it to individual teachers' methods to instruct pupils.  The idea for Sassoon Joiner arose from the decline of traditional blackboard and chalk in favor of whiteboard screens in classrooms, offering an ideal way to display handwriting to the whole class by any teacher. 

Other reasons for supporting cursive handwriting include There is now quite a lot of new data that indicates handwriting has a powerful and positive impact on reading. Moreover well-taught cursive writing is faster and more efficient than printing, and will consequently have a greater long-term effect on the student’s performance in school, according to Richard McManus of The Fluency Factory.

In The New York Times' essay The Case for Cursive, several observations are made regarding downsides of society's declining cursive writing skills:

For centuries, cursive handwriting has been an art. To a growing number of young people, it is a mystery. These range from issues regarding identity theft due to simple block printing signatures that are easy to duplicate and declining fine motor skill development in children. Perhaps the saddest observation was that a connection to archival material is lost when students turn away from cursive, noting that one college student and her cousin experienced great difficulties in reading their grandmother's handwritten journal.

And, finally, getting back to Mr. Jobs' observation on the utility of beauty, Richard S. Christen, a professor of education at the University of Portland in Oregon, points out that These kids are losing time where they create beauty every day... I’m mourning the [loss of] beauty, the aesthetics.