r / o: being round and oblique
Typographic Screen Structure In Digital Space

Typography for Electronic Display

ID 498 - Fall 98

Matthew Moroz
Hsin-Hsiung Liu

Download the PDF

Traditional and historic typographic elements and structures used as guidelines for the world of the printed page are now appearing  in a hybrid form in digital space.  These "standards" are now being used to address and redefine the unique problems facing typography and design in digital space today.

It seemed that with the advent of "screen only" multimedia applications and the World Wide Web that most issues of design and methodologies were tossed out the window.  The limited capacity of existing technologies did not allow for a definition of  a refined set of typographic controls and low resolution screen display seemed to curb the designer's command of the typographic and visual elements in the world of digital display.  Developing technologies in HTML such as Cascading Style Sheets (CSS), HTML 4.0, and the Document Object Model (DOM) promised consistent control over typographic delivery, yet there is still an enormous amount of unpredictability and still no real typographic command for designers.

Issues that once defined the world of the printed page are now being used to help define the design parameters within these limitations of digital typographic space that include: grid, text quality, number of columns, and their relationship to one another, column width and picture positioning.  Rules of typographic scale in digital space are now being recognized to establish information hierarchy, organization, and visual flow. Text guidelines for layout are currently being addressed by the Ease of Use site at IBM (as well as others).  Here, a rise in formality in digital design standards is seen clearly in the following overview of text and layout guidelines:

  Create effective headings and place important information first
  Provide a means for users to print groups of related pages
  Keep links separate from narrative text blocks
  Design for default browser fonts 
  Make paragraph text flush left
  Test for readability 1

Yet issues of readability, especially with large amounts of text and smaller text sizes still pose the one of the biggest problems of useability in digital screen space.  "Displaying type on screen requires a high degree of compromise." 2  Problems arise with standard typefaces at small sizes, mainly the loss of legibility.  Conventional typefaces cannot simply be transferred to the screen especially in lower point sizes.  The problem with traditional typefaces is that round and oblique forms are difficult to display on screen such as 'o' (round) and 'w' (oblique).  Typefaces with close letter spacing will also be difficult to read because the letter tend to "clump" together.  Some special screen font currently in  use are Chicago, Geneva, Monoco, and New York, but provide very little in terms of elegant display, although offer the most in legibility and readability in editable screen fonts.  Some developing guidelines to take into consideration for body copy and the use of smaller type sizes:

   Italics should be used sparingly
  5 to 10 unit track for screen type
  120% of single line spacing 
  Use roughly 40 characters per line

With the establishment of typographic guidelines in digital display space, some sense of understanding can be made of the limited capacity of current typographic control. Therefore giving designers the ability to recognize what contributions and changes that must be made to improve current technologies and to develop the most appropriate tools to create the most compelling experience in digital design space.

Bibliography and Resources

http://thegrid.net/orion17

http://www.useit.com

http://www.builder.com/Graphics/Type/ss01.html

http://www.typographic.rsub.com/index.cgi

1 - http://www.ibm.com/ibm/easy/design/

http://www.asktog.com/columns/015WebDesignRant.html

2 - Gotz, Veruschka, Color and Type for the Screen, Rotovision, Hove, England, 1998