Hot Links and Cool Sites: How Do You Make an Electronic Journal Readable?

Steven Pemberton

CWI, Kruislaan 413, 1098 SJ Amsterdam


Reading a paper publication and an electronic publication are very different experiences. Hundreds of years of development of the printed page has made reading paper publications an easy and pleasant experience.
Is there any chance that reading publications online will ever become pleasurable? If so, what are the issues involved?
In January 1996, the first electronic ACM SIGCHI Bulletin went online. SIGCHI is the ACM's Special Interest Group on Computer Human Interaction, and the Bulletin is their main publication. It was therefore of prime interest and importance to SIGCHI to address these issues before putting their publication online.
This paper presents the issues addressed in producing a pilot issue of the SIGCHI Bulletin, and the solutions arrived at.

What's Cool?

Consider the web page in Figure 1:

An example web page
Figure 1: An Example Web Page

Just to make clear what this is, it is a page with a black background; the only other element is in the middle, where you see a blue underlined full-stop. This blue underlined full-stop is in fact a link to the real information that you actually wanted when you visited this page.

This is probably a cool site. Unfortunately, it is difficult be sure, since it doesn't carry any of the logos granted by the self-chosen arbiters of all that is cool on the web (Figure 2). Including one of the logos would of course spoil the minimal starkness of the page design, and so we are left guessing.

Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool Arbiters of All That's Cool
Figure 2: Arbiters of All That's Cool

Consider now the Web site in Figure 3. This is the initial page of De Digitale Stad, a well-known Dutch web site. The problem with this site is that even if you know what you are looking for, it can be extremely hard to find. If you don't know what you are looking for, then you're in great trouble. One of the elements on this page is marked Spel Regels (Rules of the game) which seems to suggest that the designers thought of it more as a game than an information site.

A home page
Figure 3: A Home Page

Luckily (at first sight) there is also a button marked plattegrond (map), which suggests may be a helpful tool in getting aroung the site. Unfortunately, pressing it, gets the page in Figure 4, which leaves the user just as lost.

A map of a web site
Figure 4: A Map of a Web Site

On this page, though, there is a button marked Pleinen A-Z (Squares A-Z), and clicking that gives you the page in Figure 5. This immediately gives you the information you need about what is available, and finding information from here is easy.

A List of the Pages on a Web Site
Figure 5: A List of the Pages on a Web Site

The problem is, web pages are a human-computer interface, and they should be designed like one, with task and requirements analysis, user testing, and iterative design. Unfortunately, everyone thinks they can design a good user-interface, but few people really can!

The World Wide Web currently seems to be dominated by the question "What's Cool". Too many WWW documents emphasise cool graphics (with their concomitant long download times) to the detriment of quality of content and usability. It was this problem that was one of the many that SIGCHI addressed when it decided to put its main publication, the SIGCHI Bulletin, online on the web: the real question should be not "What's Cool", but "What's Good".

The SIGCHI Bulletin

The SIGCHI Bulletin is the main publication of the ACM's SIGCHI: The Special Interest Group on Computer-Human Interaction. It comes out quarterly, in issues of around 100 pages, and is distributed worldwide to SIGCHI's members, to libraries and to other institutions.

Although the Bulletin is produced almost entirely by volunteers, and produced on a rather low budget (in order to keep its price as low as possible for members), it attempts to be a high-quality publication; for instance, it is entirely typeset, rather than being produced from camera-ready copy supplied by the authors.

The SIGCHI Bulletin is produced entirely electronically. Material is submitted by editors and authors electronically in a number of different formats (ASCII, Word, TeX, Frame, and others), via a number of different routes (email, ftp, floppy disk), and the Bulletin is laid out and typeset electronically in the Netherlands. Finally camera-ready copy is produced on a 2400 dpi digital typesetter, and sent to the printers in the United States.

SIGCHI is an active, vibrant and forward-looking SIG, and considers it important to be at the forefront of developments in electronic publishing. As a consequence, it is supporting a number of experiments in electronic publishing, such as producing CD ROM and World Wide Web versions of the proceedings of its annual CHI conference [5].

Another of these experiments was to produce a pilot electronic issue of the SIGCHI Bulletin, to be accessible via the World Wide Web. The experiment aimed to find out how much work was involved in producing an issue, what resources were needed, and in keeping with the primary aims of SIGCHI – Computer Human Interaction – what is necessary to make using an electronic journal as pleasurable as possible, with an aim to begin publishing the Bulletin simultaneously on paper and electronically.

Electronic Publications

Common complaints about electronic publications include that they are not as readable as paper publications (and there is research to back this up, for instance [4], [8]), that they don't feel so nice to use, and that you can't take them with you to read in the train [7].

Some of these complaints will disappear soon enough, and are only a function of technical constraints. Colour LCD displays of 300 dpi are already being made [6], and only have to drop in price to be usable on a large scale. It is easy enough to envisage a device the size of a paperback book with a display of a quality barely distinguishable from the printed page, using current or soon-to-be available technology.

However, there are advantages of a paper publication that are inherent in the medium: for instance you can see at a glance how big a publication is and it is easy to quickly scan through to get an idea of the contents.

On the other side of this coin are the undeniable advantages of an electronic publication, such as the ability to cross-link, and the ease of searching – and that the use of colour is effectively free.

So we approached the design of an electronic SIGCHI Bulletin with a central question: how do you make reading the Bulletin online as pleasurable as possible and what can be done to make the perceived disadvantages more acceptable?

The Analysis

As any user-interface project should, we started with an analysis of requirements and tasks: what aspects of a paper journal are pleasant, that we would like to emulate, what aspects of using World Wide Web documents were undesirable, that we would like to avoid, and what does a reader require from a publication, whether digital or analogue?

Browsing and Reading

There are many reasons a reader may approach a publication: for instance, maybe just to browse, to see what is there, and if anything looks interesting; to find articles on a particular subject; to find a particular article that has been recommended; or to read the publication serially from beginning to end.

It is important that any electronic publication support all these modes of access, and not give priority to any one of them to the detriment of the others.

The purpose of browsing, either an issue or an article, is to quickly get an idea of the size and content, so it should be easy to skim through an issue, and if possible with one glance get a feeling for the content of each article.

On the other hand, if someone wants to read an issue serially, it should be as easy as possible, without too many extra actions. An especially important point is that when reading an article the reader should never get lost and wonder where they are or how to get back – a well-known phenomenon in hypertext systems [7], [8]. There are many documents on the Web that are split into many little pages so that the reader quickly loses track of the organisation of the whole. For instance the default action of the package Latex2Html [2], [3] which converts Latex documents to HTML, is to split an article so that each section is a separate HTML document. A single document then becomes a network of cross links. Figure 6 shows an example of such an article, and Figure 7 a section from such an article. Readers are at a loss where they are, and how to get anywhere. Any section you are reading is isolated from its context.

A Latex Document Converted to HTML
Figure 6: A Latex Document Converted to HTML

A Section from a Converted Latex Document
Figure 7: A Section from a Converted Latex Document

This should be avoided, at the article level, but in general terms for the whole site as well.

Printing, Threading and Identifying

When designing a site, it should also be considered to what extent the information will be used by the reader at the screen, and to what extent the site is just a repository of information that the user will take away.

Consider the page in Figure 8, which is a description of how to travel to a research institute near Paris. It has been split up into several parts, how to travel to Paris from the airports, how to travel from Paris to Versailles, how to travel from Versailles to the institute. Each of these sub-descriptions are themselves split into several sub-pages, each describing a part of the journey.

Travelling Somewhere
Figure 8: Travelling Somewhere

But the fact of the matter is, the user of this information will nearly never want this information when sitting behind a computer screen. More likely will be that they have just stepped out of the plane at the airport and want to know where to go next. That means that the user of this information has to visit each of the subpages in turn, and print them out, then reassemble them into a pack of paper, and take that with them.

While this point isn't so essential for an online publication, where the reader will often just browse articles online, it should also be easy to print an article out, so that the reader can take it to read in the train. Splitting articles into small pieces makes this difficult.

A reader should be able to easily jump between issues, for instance to follow a thread; it should be easy to read all the Education columns from all the issues, for instance.

And finally, the reader should always be aware that they are reading the SIGCHI Bulletin, wherever they come from. An author may put a pointer to an article from their own home page, or as a reference from another article; following that should make it clear to the reader that they have come to the SIGCHI Bulletin, and that there is a structure involved. (Related to this, a page should never contain a link that says "Back to Home Page" or similar, since in the case that the reader has come from a different route than envisaged by the designer of the page: following that link may have a different effect than that expected by the reader.)


With these ideas in mind, we set about designing a hierarchy for the SIGCHI Bulletin online, and we ended up with a structure that resembles that in Figure 9.

An immediate advantage of this structure is that it is shallow: this reduces the chance of the reader getting lost, since the hierarchy exactly reflects the conceptual structure of a journal (series of issues, each issue of a series of articles, and no further subdivisions, although there is a structure imposed within each article).

SIGCHI Bulletin Global Structure
Figure 9: SIGCHI Bulletin Global Structure

Home Page

At the top level, there is the Bulletin's home page (see Figure 10). After a short banner, there are immediately links to the online issues, so that regular visitors can get straight to the important information without first being confronted with all sorts of explanatory material. Only then comes the fixed material that occurs in each (paper) issue on the inside front and back covers: the purpose of the Bulletin, how to submit articles, lists of officers and local groups, email addresses, ACM and how to join, and so on.

The Home Page
Figure 10: The Home Page


Following a link to an issue leads you to the table of contents for that issue (see Figure 11). This contains a banner with links to the previous and next issues' tables of contents, and a link back to the Bulletin home page. These are here to facilitate quick browsing through a series of issues, for instance when in search of a particular issue.

An Issue's Table of Contents
Figure 11: An Issue's Table of Contents

Below these headers is a list of links to the individual articles, and then at the bottom a repeat of the links in the header: these are above all to aid serial scanning – you are searching for an article, so you go to the first issue, scan that (which may involve scrolling if it doesn't fit on the screen), and then you can immediately go to the following issue without first going back to the top of the page.


Clicking on an article title gives you something that looks like Figure 12. A principle property of an article is that it is essentially a single document (although images are represented as thumb-nails in the document itself, with links to a larger graphic if you need to see it greater detail – this reduces initial down-load time, especially important if you are only browsing). Having the article as a single document has a number of advantages: on the basis of the scroll bar (at least in many browsers) it is possible to get an idea of how large the article is; being a single document means that it is easy to search with the browser's search facilities for a term within the article; and a single document is easy to print out, to take with you to read in the train.

Each article has a banner to identify the article's source, especially important for people who have reached it through a different route than the Bulletin's home page. Using the information that needs to be there anyway (name of publication, identification of issue date) there are links to the Bulletin home page, and the table of contents for the issue that the article is for (without the use of the words "Back to...").

An Article
Figure 12: An Article

Additionally there are links to the previous and next article in this issue, to make quick scanning through an issue easy. Finally, before coming to the article proper, there is a table of contents of the article as a nested list of hyperlinks of the headings of the article, making accessing subparts of an article easier.

A reader can then quickly scan through an issue, looking at the table of contents of each article, using the slider at the edge of the window to get an idea of how long the article is, to quickly get an overview of an issue.

Also in the header are links to the same article in the previous and next issue, should there be such things. So should anyone feel inclined to read all articles from the editor, for instance, they can quickly click from issue to issue.

Finally, as with the issue tables of contents, at the end of the article the links in the header are repeated: again to aid the serial reader, who can quickly and easily get to the next article, or to the issue's table of contents.


At the time of writing, the Bulletin has recently gone online, at Consequently, experience is limited at the moment to the small number of users who have used it during user testing. Of one thing we can be sure: since usability is a central interest of the readers of the Bulletin, we expect many comments from its users.


[1] D.M. Edwards, L. Hardman,
Lost in Hyperspace: Cognitive Mapping and Navigation in a Hypertext Environment, in R. McAleese (ed), Hypertext Theory into Practice, Intellect Books, 1989.
[2] Nikos Drakos,
Latex2html, Computer Based Learning Unit, University of Leeds;
[3] Nikos Drakos,
From Text to Hypertext: A Post-Hoc Rationalisation of LaTeX2HTML. In Proc. First WorldWide Web Conference, May 1994, CERN, Geneva, Switzerland.
[4] J.D. Gould et al.,
Why Reading is Slower from CRT Displays than from Paper, Proc. CHI+GI '87, ACM Press, 1987.
[5] Mack, R. et al.
CHI '95 Conference Electronic Proceedings, ACM, New York;
[6] André Meyer,
Pen Computing, SIGCHI Bulletin, Vol. 27 No. 3, July 1995.
[7] J. Nielsen, and U. Lyngbæk,
Two Field Studies of Hypermedia Usability, in C. Green, and R. McAleese (eds) Hypertext: Theory into Practice II, Intellect Press, 1990.
[8] R. T. Wilkinson and Helen M. Robinshaw,
Proof-Reading: VDU and Paper Text Compared for Speed, Accuracy and Fatigue, BIT (Behaviour and Information Technology), 1987, Vol. 6 Number 2, Pages 125-133.
About the Author
Steven Pemberton is a researcher at CWI in Amsterdam, the Dutch National Research Centre for Mathematics and Computer Science. He is editor-in-chief of the ACM SIGCHI Bulletin, and chair of the ERCIM European WWW Working group W4G. His research is in broad aspects of computer-human interaction; he is currently working on the design and implementation of interactive books.

This article was originally published in the CWI Quarterly, Volume 8, Number 4, December 1995.