T
Y I
II P
N
O
G
B
R
A
P
H
O
O
K
S
Y
AAA
Typo gra phy
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him. The hallway smelt of boiled cabbage and old rag mats. At one end of it a coloured poster, too large for indoor display, had been tacked to the wall. It depicted simply an enormous face, more than a metre wide: the face of a man of about forty-five, with a heavy black moustache and ruggedly handsome features. Winston made for the stairs. It was no use trying the lift. Even at the best of times it was seldom working, and at present the electric current was cut off during daylight hours. It was part of the economy drive in preparation for Hate Week. The flat was seven flights up, and Winston, who was thirty-nine and had a varicose ulcer above his right ankle, went slowly, resting several times on the way. On each landing, opposite the lift-shaft, the poster with the enormous face gazed from the wall. It was one of those pictures which are so contrived that the eyes follow you about when you move. BIG BROTHER IS WATCHING YOU, the caption beneath it ran. Inside the flat a fruity voice was reading out a list of figures which had something to do with the production of pig-iron. The voice came from an oblong metal plaque like a dulled mirror which formed part of the surface of the right-hand wall. Winston turned a switch and the voice sank somewhat, though the words were still distinguishable. The instrument (the telescreen, it was called) could be dimmed, but there was no way of shutting it off completely. He moved over to the window: a smallish, frail figure, the meagreness of his body merely emphasized by the blue overalls which were the uniform of the party. His hair was very fair, his face naturally sanguine, his skin roughened by coarse soap and blunt razor blades and the cold of the winter that had just ended. Outside, even through the shut window-pane, the world looked cold. Down in the street little eddies of wind were whirling dust and torn paper into spirals, and though the sun was shining and the sky a harsh blue, there seemed to be no colour in anything, except the posters that were plastered everywhere. The blackmoustachio'd face gazed down from every commanding corner. There was one on the house-front immediately opposite. BIG BROTHER IS WATCHING YOU, the caption said, while the dark eyes looked deep into Winston's own. Down at streetlevel another poster, torn at one corner, flapped fitfully in the wind, alternately covering and uncovering the single word INGSOC. In the far distance a helicopter skimmed down between the roofs, hovered for an instant like a bluebottle, and darted away again with a curving flight. It was the police patrol, snooping into people's windows. The patrols did not matter, however. Only the Thought Police mattered. Behind Winston's back the voice from the telescreen was still babbling away about pig-iron and the overfulfilment of the Ninth Three-Year Plan. The telescreen received and transmitted simultaneously. Any sound that Winston made, above the level of a very low whisper, would be picked up by it, moreover, so long as he remained within the field of vision which the metal plaque commanded, he could be seen as well as heard. There was of course no way of knowing whether you were being watched at any given moment. How often, or on what system, the Thought Police plugged in on any individual wire was guesswork. It was even conceivable that they watched everybody all the time. But at any rate they could plug in your wire whenever they wanted to. You had to live -- did live, from habit that became instinct -- in the assumption that every sound you made was overheard, and, except in darkness, every movement scrutinized.
Winston kept his back turned to the telescreen. It was safer, though, as he well knew, even a back can be revealing. A kilometre away the Ministry of Truth, his place of work, towered vast and white above the grimy landscape. This, he thought with a sort of vague distaste -- this was London, chief city of Airstrip One, itself the third most populous of the provinces of Oceania. He tried to squeeze out some childhood memory that should tell him whether London had always been quite like this. Were there always these vistas of rotting nineteenth-century houses, their up store, with baulks patched with Eighty-four cardboard and I remember myself in asides very shored old book foundof antimber, englishtheir printwindows of a book; Nineteen by their roofs corrugated their crazy garden walls sagging in all directions? George Orwell. I was instantly fellwith in love with theiron, book. Until then, I havent been surprised by any kind And the bombed sites where the plaster dust swirled in the air and the willow-herb of book design but yet,straggled that object I was holding my hands wasplaces something a a over the heaps of in rubble; and the where beautiful. the bombsThat had was cleared different reading experience, a different reletionship alongside any other book had read before. like larger patch and there had sprung up sordid colonies of Iwooden dwellings chicken-houses? But it wasbook no use, he could not remember: nothing remained of That moment was the first time I get aware that design is an art. his childhood except a series of bright-lit tableaux occurring against no background and mostly unintelligible. The Ministry of Truth -- Minitrue, in Newspeak -- was startlingly different from any other object in sight. It was an enormous pyramidal structure of glittering white concrete, soaring up, terrace after terrace, 300 metres into the air. From where Winston stood it was just possible to read, picked out on its white face in
I N T R O D U C T I O N
In this not-so-short chapter, I will try to give you some ideas on typography for long text readings. I must say that typography has a particularly significant role in book design only for its nature of occupation the biggest mess in a book. The graphic a reader will stare at most likely will be a text, therefore we should pay extra attention to choosing the right fonts, adjusting the sizes and creating a feel on pages only using fonts. This is the hardest job a book designer can get.
While reading this guide, I find the best practice is to design a chapter opening page with a chapter header, a long text and page number.
IV.
You can playaround with fonts and proportions while I’m trying to give you basic suggestions and inspirations. Have fun.
Chapter Heading It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him. The hallway smelt of boiled cabbage and old rag mats. At one end of it a coloured poster, too large for indoor display, had been tacked to the wall. It depicted simply an enormous face, more than a metre wide: the face of a man of about forty-five, with a heavy coat moustache and ruggedly handsome features. Winston made for the stairs. It was no use trying the lift. Even at the best of times it was seldom working, and at present the electric current was cut off during daylight hours. It was part of the economy drive in184 preparation for Hate Week. The flat was seven flights up, and Winston, who was thirty-nine and had a varicose ulcer above his right ankle, went slowly, resting several times on the way. On each landing, opposite the lift-shaft, the poster with the enormous face gazed from the wall. It was one of those pictures which are so contrived that the eyes follow you about when you move. BIG BROTHER IS WATCHING YOU, the caption beneath it ran. Inside the flat a fruity voice was reading out a list of figures which had something to do with the production of pig-iron. The voice came from an oblong metal plaque like a dulled mirror which formed part of the surface of the right-hand wall. Winston turned a
to be serif OR NOT TO BE
Adobe Garamond Pro
Proxima Nova
It’s time to make the decision on which type of fonts you are going to use on the content. The font you will choose will deeply affect the feeling of book. Even the expressions of words and story. My point is, book design is not completely about creatin a proper and readable design, you should also reimagine the concept and extract the book feel. Surely, the main key is observe the book and do the design after then. Serif fonts are the most common type of fonts used on book printing. I personally, read just one single book printed with sans-serifs. Believe me it was terrible. Even though the book was great (“The Picture of Dorian Grey” - Oscar Wilde) the printing was so cheap and half-baked, I barely could finish it. The font was Helvetica Neue Thin. On the other hand, the book I mentioned on the beginning of the chapter, Nineteen Eighty-four was printed with an antique’d version of Caslon. A very well-designed font, in my opinion. I believe this is because we all readers are very used to reading with serifs. When we got faced with a book that uses sans-serifs, this makes us feel uncomfortable. So, I’m complately disagreed on using sans-serifs font for the content. Even for aesthetic reasons.
Warnock Bold 144pt 100pt line height
It was a bright cold day. It was a bright cold day. Helvetica Neue Thin 144pt 100pt line height
But… Obviously, all the text on a page is not only the content but there are also headings and titles and page number indicators. Some designers traditionaly use serif fonts both content and page elements, but there is an alternative opinion that suggests sans-serifs are more suitable for page elements. You can pick your side, it’s absolutely up to you. Honestly, I think combining sans-serifs with serifs looks just perfect and instinctly do that on page design. Here’s two examples by Steidl, which is a great designer from Germany. He uses both of those aproaches and it’s worth to take a look.
THE BOOK IS “ VO N N E E N D L I C H K E I T ” by G Ü N T E R G RA S S
THE BOOK IS “ D I E H E I M S U C H E R ” by V E R O N I Q U E B I ZO T
I M P R OV I S I O N
Now, we will try and see some fonts in action for content. I hope it will help you to decide. All the fonts below are set in the same letter-spacing and line height as well as same font size and weight.
A D O B E G A RA M O N D
WA R N O C K
It was a bright cold day in April, and the clocks were striking thirteen.
It was a bright cold day in April, and the clocks were striking
Winston Smith, his chin nuzzled into his breast in an effort to escape the
thirteen. Winston Smith, his chin nuzzled into his breast in an
vile wind, slipped quickly through the glass doors of Victory Mansions,
effort to escape the vile wind, slipped quickly through the glass
though not quickly enough to prevent a swirl of gritty dust from
doors of Victory Mansions, though not quickly enough to prevent a
entering along with him.
swirl of gritty dust from entering along with him. A D O B E C A S LO N
B O D O N I 72
It was a bright cold day in April, and the clocks were striking thirteen.
Mansions, though not quickly enough to prevent a swirl of gritty dust
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
AMERICAN TYPEWRITER
AT H E L A S
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an eort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
B A S K E RV I L L E
MINION
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
It was a bright cold day in April, and the clocks were striking thirteen.
Winston Smith, his chin nuzzled into his breast in an effort to escape
the vile wind, slipped quickly through the glass doors of Victory from entering along with him.
Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
AND A FEW SANS-SERIFS
H E LV E T I C A N E U E
AV E N I R
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an eort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
C O M P O S I T I O N
When it comes to setting proportions of the text, I always get stucked in halfway through. This part is both fun and hard for me. Fun, because it’s a playground and hard because it is completely about optical comfortability. But yet, I have a secret-weapon; Penguin Books’ composition rules. I’ll share it with you:
T E X T C OM P O S I T I O N
All text compositon should be as closely word-spaced as possible. As a rule, the spacing should be about a middle space or the thickness of an ‘i’ in the type size used. Wide spaces should be strictly avoided. Words may be freely broken whenever necessary to avoid wide spacing, as breaking words is less harmful to the appearance of the page than too much space between words. All major puntuation marks - full point, colon, and semicolon - should be followed by the same spacing as is used throughout the rest of the line. I N D E N T I N G O F PA R AG R A P H S
The indent of the paragraph should be the em of the fount body. Omit indents in the first line of the first paragraph of any text and at the beginning of a new section that comes under a sub-heading. It is not necessary to set the first word in small capitals, but if this is done for any reason, the word should be letter-spaced in the same way as running title. If a chapter is divided into several parts without headings, these parts should be divided not only by an additional space, but always by one or more asterisks of the fount body. As a rule, one asterisk is sufficient. Without them it is impossible to see whether a part ends at the page or not. even when the last line of such a part ends the page, there will always be space for an asterisk in the bottom margin. P U N C T UAT I O N M A R K S A N D S P E L L I N G
If this can be done on the keyboard, put thin spaces before question marks, exclamation marks, colons, and semicolons. Between initials and names, as in G. B. Shaw and after all abbreviations where a full point is used, use a smaller (fixed) space than between the other words in the line. Instead of em rules without spaces, use en rules preceded and followed by the word space of the line, as in the third paragraph above. Marks of omission should consist of three full points. These should be set without any spaces, but be preceded and followed by word spaces.
L I N E
S PAC I N G
Line spacing is the distance between two lines in the same paragraph. As you noticed, each and every novel has a constant or flexible line space to achieve a nice and relaxing reading. If there wasn’t a thing such as line spacing, books would look like this:
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
But luckly,
Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind,
W E H AV E I T R I G H T H E R E
slipped quickly through the glass doors of Victory Mansions, though
For most cases, you can set the line spacing between 110% and 140% of the point size. This way, you can easily get a fine looking spacing but keep in mind, the correct line spacing differs from one font type to another. In actual printing materials, line spacing also affects the amount of paper will get used. Therefore, you should try to keep it at the minimum as possible. We don’t want to destroy forests, do we?
P O I N T
S I Z E
Point size defines the size of a font. It’s shortened as “pt”. While it is not the only measure to set a font size (others are pixels, em, vw and vh), it is certainly the most common unit on printing. You should bear in mind that point size does not appear as the same as it’s on the paper. The best way to achieve a nice point size playing within 9.5pt and 14pt. Since bigger point size means more papers and smaller means less readability; I’ll reccomend to spend a deserved amount of time to find the nice spot. Readability is also important if your target audience is old peoples or children. So, always know your limits. Well, let’s see some examples. WARNOCK PRO REGULAR 21
It was a bright
28
cold day in April, and the clocks were striking thirteen.
It was a bright cold day in April, and the clocks were striking thirteen.
37
It was a bright cold day in April, and the clocks were striking thirteen.
50
It was a bright cold day in April, and the clocks were striking thirteen.
In book design, you will always struggle with visual hierarchy. E.g. the size difference between titles and content. When you don’t know which size you should choose, you can try 3:4 scale which will generate the finest result for you. For example, if your content is 12pt size, you can use fourth step of 12 which is 28. You’ll see the every size we can get with 3:4 scale of 12pt on the next page.
Note:
AMERICAN TYPEWRITER 21pt
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
It was a bright cold day in April, and the clocks were striking thirteen. Winston Smith, his chin nuzzled into his breast in an effort to escape the vile wind, slipped quickly through the glass doors of Victory Mansions, though not quickly enough to prevent a swirl of gritty dust from entering along with him.
BASKERVILLE 21pt
We have two different fonts at the same point size here. As you can see, they don’t appear the same. Point size and the appearing size of a font always differ as the same as line spacing. Therefore, there is no perfect font size that works with every font.
The smallest yet readable point size is mostly considered as 6pt
T H E
F E E L
This is unquestionable, each and every book has a feel. This feeling maybe rare, unexpected and peculiar or generic and common. Through the book, a reader will be alone with story and the only connection he/she will get undoubtly will be the text. The look of a text can enhance the storytelling. I haven’t heard this argument before anyone but as a reader, I support this idea no matter it takes. I think we designers, should also think this. Try to imagine how should the story look like as a text, and try to get that feel. This is the last and least - maybe the most - part of typography in books. Below, I worked on the last page of the book Nineteen Eighty-four. If you haven’t read the book, please ignore it and go on. Otherwise, you’ll see what I tried to do with it. I used a typewriter-a-like font with a slight distortion to achieve the feel of dark-bureaucratic feeling and after the last word, used black erasing bars to give a referance of censorship that mentioned (it is one of the major motives in the book). I found this approach controversial, isn’t it? Manipulating the text and composition without author’s permission is maybe a bad idea but attempts like this could change our impression of book design.
III C
A
250
R
E
L
A T
I
N
G
A Y
O
U
T
250
Symetrical grid
The drawing you are staring is the symetrical grid and it is the easiest way to create a proper layout. The grid is first pioneered by a German typographer, Jan Tsichold. Developed and practicly used by Van de Graaf. You can create your own symetrical grid easily by draw two diagonals connects two pages and then one diagonal for each pages starting from top corner aside the spine to the furthest corner.
To place your content into the right position,decide how much do you occupy the page, firstly.Then create a block aligned to diagonals as shown here. In this way, you’ll get a nice text field that can contain your fluid text.
M A R G I N S
3
2
1
MARGIN
If you draw a line from connection point of a half diagonal and full diagonal, then from that point to the connection on the other page you will create a new connection point. If you go on and draw a horizontal line to the full diagonal; you will get the top margin. Then you can create the whole area by simply draw line between diagonals. This technique will give you the safest margins. Remember, this is not a rule but simply a technique. You are absolutely free to create your own margins. But it would be better if you follow some facts we will discuss on the next page.
I will mention two general types of layouts. First one is Graaf style, created by symetrical grids we just learned. It’s aligned to spine and has a big margin on the bottom. The second one is Steidl style which is completely centered or slightly off to the spine. I gave Steidl as an example earlier on typography, as you recall. Both of them has large margins around the content.
GRAAF STYLE
STEIDL STYLE
While you are holding a book, your hand will cover a significant space. This causes a problem because if your hands cover a text, you will have to change your holding position to see the text lay beneath. Simply disturbing. This is why those examples have large margins on the area you will probobly hold the book. When you are creating a layout, you better consider this, a lots of publishers doesn’t care about it. You should also give enough space between text and the spine. If you open a book you will see that there is a lost area between pages for the cause of the curve the spine creates. Finally, always design your layouts symetrical. You now know basic rules you should know about layout design. Now, grab some paper and a couple pens, do sketches and some exercise. I’ll share some sample layouts with you.
RA N D O M
F O R M S
CONTENT PAGE
CHAPTER OPENING
PART STARTING
TITLE OF THE BOOK // AUTHOR NAME OR CHAPTER
CONTENT
PAGE NUMBER