Why we need to revisit the origin of blue hyperlink
While musing over my recently published article, Why are hyperlinks blue, I was left feeling a bit blue myself. Yes, it could have been the fact that I was evacuated and Hurricane Ida was destroying my home, I’ll admit. Besides that, I was also bothered by the fact that even though I was able to determine that Mosaic was indeed the first browser to use blue hyperlinks, I was not much closer to determining why the hyperlinks themselves were blue.
Black hyperlinks had been the standard for many years, but why the sudden shift to blue? One can assume that it is because RGB phosphorescent monitors were becoming more readily available in comparison to monotone phosphorescent monitors that could only produce one color. Okay then, with a palette of colors to choose from, why blue? Why not green? Microsoft 3.1 had used green for hyperlinks. Surely there must have been something to support or inspire Marc Andreessen and Eric Bina on April 12, 1993 to make the hyperlinks blue, but what was it?
I simply didn’t know, so I published the article anyway and hoped the internet would do as it always does: thrill in pointing out when someone is wrong, in the hope that someone would know the true answer.
I published the first article, a hurricane destroyed my home, and now two months later I’m once again sitting in my now gutted home with the miracle of the internet once again restored, and I’m back on the case.
Sifting for the golden nugget
I found myself enjoying my morning coffee, reading through hate mail from my first article, as one does. I sifted through this dung heap as a prospector pans for gold, scanning for the faintest hint of gold to help me continue my journey to the true origin of the blue hyperlink.
Don Hopkins, or a commenter who goes by the same name, knew the answer, and pointed me towards Ben Shneiderman. In short, it is Prof. Ben Shneiderman whom we can thank for the modern blue hyperlink. At the time, however, I didn’t yet know this. I found the professor online, and contacted him, and went about my day. He so kindly reached out to me, and as he spoke, it was an epiphany – all of these disassociated pieces of applications, history and anecdotes suddenly fit together like a marvelous great puzzle.
Below is the timeline based on our conversation, the documentation Prof. Shneiderman provided to me, and the information I had already gathered in my previous research. I hope that this all together can help prove a direct link between the work Ben Shneiderman and his graduate students were doing at the University of Maryland in the mid to late 1980s and the blue hyperlink found in Mosaic in 1993.
I’m a cyan fan
1985 – University of Maryland: Human-Computer Interaction Lab
Ben Shneiderman developed the highlighted selectable light blue link, which was implemented by graduate student Dan Ostroff. In doing so, they, as well as other students, tested many versions in controlled experiments.
“Red highlighting made the links more visible, but reduced the user’s capacity to read and retain the content of the text… blue was visible, on both white and black backgrounds and didn’t interfere with retention,” Shneiderman shared with me.
1982 – HyperTIES
Created in 1982, HyperTIES was an early hypertext authoring system, made commercial available by Cognetics Corporation. After research concluded at the University of Maryland, blue links were then built into HyperTIES. This is the first instance of a blue hyperlink.
April 1986 – Communications of the ACM
Koved and Shneiderman published their research in Communications of the ACM, an industry magazine.
Koved, L., & Shneiderman, B. (1986). Embedded menus: Selecting items in context. Communications of the ACM, 29(4), 312-318.
November 13-15, 1987 – The Hypertext Conference, Chapel Hill, North Carolina
At the first Hypertext conference, Ben Shniderman presented in a panel session, “User interface design for the Hyperties electronic encyclopedia.” Of the conference, Professor Shniderman wrote:
“We conducted approximately 20 empirical studies of many design variables which were reported at the Hypertext 1987 conference and in array of journals and books. Issues such as the use of light blue highlighting as the default color for links, the inclusion of a history stack, easy access to a BACK button, article length, and global string search were all studied empirically.”
July 1988 – Communications of the ACM
Ben Shneiderman’s team took on the project of producting a HyperTIES disk for the ACM called “Hypertext on Hypertext”, which contained the full text of eight papers. These papers were published in the July 1988 issue of Communications of the ACM.
The leap to Lee
In 1989, Tim Berners-Lee wrote Information Management: A Proposal, in which he discussed many topics. Of interest to the blue hyperlink, he does discuss the work being done at universities centered around human interface design, and a nod to commercial success of a product using hypertext:
“An increasing amount of work is being done into hypermedia research at universities and commercial research labs, and some commercial systems have resulted. There have been two conferences, Hypertext ’87 and ’88, and in Washington DC, the National Institute of Standards and Technology (NST) hosted a workshop on standardisation in hypertext, a followup of which will occur during 1990.
The Communications of the ACM special issue on Hypertext contains many references to hypertext papers. A bibliography on hypertext is given in [NIST90], and a uucp newsgroup alt.hypertext exists. I do not, therefore, give a list here.
Much of the academic research is into the human interface side of browsing through a complex information space. Problems addressed are those of making navigation easy, and avoiding a feeling of being “lost in hyperspace”. Whilst the results of the research are interesting, many users at CERN will be accessing the system using primitive terminals, and so advanced window styles are not so important for us now.”
While still an assumption, it is a fair assumption that Tim Berners-Lee was aware of the blue highlight hyperlink color because he was aware of “research at universities”, “Hypertext ‘87”, and the “ACM special issue on Hypertext,” all instances where the blue highlight color research was presented. Berners-Lee did mention that the “results of the research are interesting.” It is also interesting to note that WWW, the browser he was creating at the time, did not use blue hyperlinks.
January 16-18, 1990 – Hypertext Standardization Workshop
Tim Berners-Lee, as well as many others, participated in the hypertext standardization workshop, yet there was no mention of the use of color to denote hypertext in the report. However, readability of hypertext was identified as a research objective in the workshop report (PDF).
“Measuring hypertext “readability.” … Hypertext extensions to readability metrics might include measures of the “goodness” of links based on similarity between linked units. Readability measures for alternative hypertext designs for the same text will go far toward making hypertext design an engineering discipline.” (Page 35)
August 1990 – Dynamic Characteristics of Hypertext
Following up on the workshop, I assume this is the resulting paper (PDF) to come out of the hypertext standardization workshop. Published by Richard Furuta & P. David Stotts, this paper argues that dynamic characteristics of hypertext are required to achieve hypertext’s true purpose. In the excerpt below we can see the authors discuss color’s role in hypertex, and the foundations of active, visited and focused states:
“Dynamic representation of context may also be useful. For example, consider the representation of an anchor that changes over time. The anchor may be represented by a highlighted region whose color, size, or location changes over time to draw more attention to itself. Alternatively, the anchor might be represented by a small animation.” – Page 2
In the late 1980s, industry workshops and conferences brought people together to share ideas, discuss trends and standardize ways of making the web work. What are the results of this sharing of knowledge? Well, hypertext starts to turn blue. At the time, hypertext was more than what we now know as hyperlinks, but also included user interface elements such as the close icon, navigating back and forth between sections, and printing. As we see above, there were arguments from industry leaders to make hypertext dynamic, so active states must be included as well.
October 21, 1991 – Macintosh System 7
Apple began adding hints of blue to icons and text background when selected.
April 6, 1992 – Windows 3.1
Microsoft began using blue for interactions to “highlight” text when selected.
1992 – HyperTIES
Created for the HP LaserJet4 User Manual, even using HyperTies creators began using the darker blue hyperlink on a button as well as the light blue (cyan) for hyperlinks.
December 1992 – Framaker 3.0 (Windows Version)
Framemaker was created for making and maintaining large documents, and is also the first instance I uncovered of the dark blue hyperlink. In 1992, not all versions were in color, but Framemaker v3.0 for Windows did support color monitors. Huge shoutout to Dan Connolly for letting me know about this application, and to a colleague of mine for opening it in an emulator to get this screenshot.
On Wednesdays we wear blue
So what inspired the blue links in Mosaic; whose blue hyperlinks went on to set the industry standard we are following even today? Well, we do know that Marc Andreessen and Eric Bina were inspired by ViolaWWW and decided to create Mosaic after seeing it. Perhaps they were aware of the same inspirations and research as Tim Berners-Lee, or they simply saw the blue trend happening in their industry.
In truth, it doesn’t matter what specific application or article inspired them. The decision to make hyperlinks blue in Mosaic, and the reason why we see it happening in Cello at the same time, is that by 1993, blue was becoming the industry standard for interaction for hypertext. It had been eight years since the initial research on blue as a hyperlink color. This data had been shared, presented at conferences, and printed in industry magazines. Hypertext went on to be discussed in multiple forums. Diverse teams’ research came to the same conclusion – color mattered. If it didn’t inspire Marc Andreessen and Eric Bina directly, it inspired those around them and those in their industry. We can see evidence of this inspiration by looking at the work of Macintosh, Microsoft, HyperTIES, LaserJet, Framemaker and Cello. These companies and products created work before or during Mosaic, and all use blue hyperlinks, selection colors or blue typography. Though this was still a time of experimentation, the visual language of blue for interaction was beginning to be defined years before Mosaic was created.
I love knowing that the original blue was chosen with care and through testing, that this research and knowledge was shared through a community, and that the spirit of open source sharing still lives on here at Mozilla. I am very thankful to the developer community for their comments which led me to the right people so that I could find the answer to this question which has long plagued my mind and the minds of countless others. I hope that we continue to choose to use the internet as a place for good and communication, and that we use blue hyperlinks to connect with and help one another.
Updated January 12, 2022
After publishing the article, Ben Shneiderman and I continued to connect, in which he informed me that Lee and himself were colleagues who connected several times.
Shneiderman informed me that Lee had cited his work from the ACM for the Macintosh or PC, and that Lee had used the idea of light blue links from Shneiderman’s work. From this we can infer that the blue hyperlink was indeed inspired by the research done at the University of Maryland.
Also, from the comments on my first article, Why Hyperlinks are Blue, the user SeanLuke found bug fixes for WorldWildWeb on the NeXT that hinted at color support as early as 1991.
Get the browser that protects what’s important
The post Revisiting why hyperlinks are blue appeared first on The Mozilla Blog.
Original article written by Elise Blanchard >