Typography for the Web of Information

Home :: matt@vistaseeker.com :: Choose a style: [1] [2] [3] [4]

Browsers and Beyond

To define the aesthetic for Web Publishing, one begins by assessing the needs of the user base, coupled with some idea of browser and operating system usage.  Typically the best idea is to adopt a design strategy which, in the best cases, allows the user to adjust elements of the layout to their liking. In the worst cases, the design should degrade to a level where readability is not affected.

The easiest and most basic methodology is often the most successful: Keep it Simple.Text styling, grid-based layouts, and compelling content are all anyone needs to deliver critical information to a large audience. In these situations, a designer's assertion of control is antithetical to the intentions of the user and the information provider.  Think legible, readable, searchable.

Reporting, News, Research Data
When information plays a highly functional role, quick, easy location of data is most essential.  Information used by many people on a daily basis should load quickly and be highly searchable.  To achieve this, there are several simple options for layout and typographical design.

Allow for the maximum range of display sizes and resolutions.  Allow for the resizing of text through the use of proportional or relative font sizing with CSS. Use structural markup sparingly and avoid heavy image usage. Use heading and paragraph (P,H1,H2) tags to denote content blocks.  Apply styles using CSS or through server-generated HTML.  Avoid allowing layout elements to 'clutter' content blocks. Avoid using TABLE tags for layout elements: use them for tabular data (spreadsheets, financial reports) instead.

The use of complex navigational elements is also discouraged in large-scale reporting applications.  It is important for there to be order to the masses of data, but often these relationships will be determined by the data itself.  It is essential never to let the design overpower or reinterpret the content.  Navigational elements featuring non-standard interaction are also discouraged.  The easiest and oftentimes most successful option is the exclusive use of  hyperlinks for actual page navigation. For more complex applications, effective navigational elements such as the Breadcrumb Trail, or Explorer - style interfaces provide users with options similar to those contained in programs they already know.

For maximum search effectiveness, use alternative texts on images and avoid locking away meaningful content in binary file formats.  Use the facilities of the markup language to provide document metadata: the use of META tagging, doctype declarations, and informational text is a powerful combination for effective search parsing.  Again, the use of text linking is essential for search engine software to properly parse and recognize relevant texts.

Forms and Process Driven Web Documents
When a Web document requires human input, additional issues are raised.  Forms require human interaction, and the level of sophistication in a form-driven layout should accurately match the level of sophistication of the user base.  This is a daunting task when faced with novice users.

Forms driven layouts range from the deceivingly simple search box  to content management system interfaces with embedded HTML editors.  For novice, or non-author users, form elements must be exceedingly simple while still allowing for growth and  increased navigation speed over time.  The challenge for designers is to create effective and time-saving work environments.  Although it will be often be the job of an application designer to define the way that people utilize the system, there are numerous techniques available to designers as well. 

Allow for cursor focus on form fields, and allow for effective tabbing. Use descriptive text, contextual help and clean, organized layouts.  Form fields should be grouped appropriately as with multiple forms.  Validating the input should be in place at all levels of the application.  Form field length, and type should be carefully chosen to guide the user towards valid input. 

Think Sparse
It's good that bright, clean design is en vogue, because this is precisely the style that large-scale Web publishing demands.A good techniques is to weigh the value of the content against the value of your design. Think about the value of the information within a 1995 tax report vs the design of the page which contains it. By using layouts designed for maximum readability, the designer ensures not only efficient communication but a more useful experience for the user.

Designing for the user means that visual trickery must be minimized.  Layouts should be purposeful and well-suited to the application, through use of color, borders, and text styling.A competent designer in a CMS environment should be as comfortable creating subtly styled textual work alongside complex graphical elements.

Utilization of columnar layouts, headers and footers, and other traditional news and print paradigms will aid in the display of mixed media such as images, audio, or video assets. Again, emphasis should be placed on the easy location of these files while still retaining consistency with textual content.

Beyond The Browser
As the Web embraces it's textual nature, inroads are being made into exploring the Web itself, as not only a complex informational space, but a social space as well.  The nature of the web as read/write is often overlooked, but the ability to self-publish is a key factor of the Web as a media.

And beyond self-publishing, the amount of information available from universities, research labs, and public institutions is staggering.  There are countless millions of lines of personal correspondence locked in e-mail, Usenet postings, and web sites. 

As a Web Designer, coping with huge amounts of text presents it's own issues.  Most germane are the struggles of production: as Web project becomes increasingly complex, production methods must scale to meet the demand.  As non-technical personnel are called upon to develop content, either as writers, artists, or otherwise, they will need to be able to use tools familiar to the software they use every day.  These tools must respect the layouts, fonts, and design choices set forth by the creative staff.  This demand has lead to the creation of the CMS (Content Management System), an entire class of software devoted to making Web authoring easy.

In this way, the Web moves beyond the conceptual 'Web Site', and towards a 'Web of Information', in which content is truly fluid and available.  The goals of a Web site in the Web of Information may differ from the personal homepage or the corporate  site, but the effect is the same: written and graphical content is put in a public or semi-public place, one that is searchable, indexable, and useful.

Indeed, the majority of cutting-edge Web work involves this meta-process of mining the Web. By examining the content outside of it's context, we can aggregate and selectively disseminate information.  Again, text is crucial, because only plain text can be analyzed by machines, only text can be 'remembered', and compared for meaning.  For now, binary data, being opaque, cannot convey meaning in this manner.  The time will arrive when this is possible, however.

Examining the Web as a publishing framework, one can draw similarities to past advances in technology.  Given a solid technical background, and a strong sense of set, setting, and content, one can address Typography for the Web.