One thing that's always bugged me about the HN interface is that visited links are basically the same color as the metadata below them. Makes it hard to just glance at a screen and see the stories you've already clicked on.
No, visited links are grey. That's the default. I've seen "new" stories appear that are grey links because they were popular weeks earlier and I had already read them. Maybe reset your defaults?
There is also a level of hell where reified retired 3D company logos swoop around booming out thumping techno trade show floor music, spinning, bowing, and pirouetting around with each other. Somewhere the old SUN and SGI and DIGITAL are still dancing.
Hmm. I don't see any discussion here, but weren't BBS links typically blue? I think I remember that being a thing, and that was well before 1993...
Also, cyan is a much better color for text on a black background. Dark blue is almost invisible. This makes some of the early examples a little complicated since we moved to white backgrounds around the same time as the web came to fruition.
It was working as designed. If you already visited that page, you don't need to go there again. Time was precious on dial-uo connections, better go visit some new page instead!
> we moved to white backgrounds around the same time as the web came to fruition
‘We’? Document-oriented workstations, including the one WWW was developed on, routinely used black-on-white back to the Alto, or NLS. (CAD stayed white-on-black due to the history of vector displays.)
Mosaic was the first browser I used, and the first I wrote websites for (I still only test in one browser ;) ).
Something the article doesn't touch on is the fact that there wasn't really such a thing as hex colors like "#0000ff" back then. You could use them, but no one did because they weren't guaranteed to work properly. There was a list of 256 "web safe colors" that you could use that were the 8 bit palette that most computers supported in VGA graphics (at 640x480 resolution), and then a further list of HTML colors that could be used if the user had a graphics card that could use 16 bit SVGA graphics. Using 24 bit hex code colors didn't come along until a little later, when computers were likely to display them properly.
In other words, links weren't #0000ff. They were "blue".
Yes, people did use the hex codes back then. You just had to take care that the ones you used were on the list of 216 (not 256) web safe colors. The VGA palette was programmable and supported up to 262,144 colors, but a standard set of 216 was used in browsers to allow Windows, Mac OS, and other programs color table slots with which to draw their standard colors.
I think some browsers understood X11 color names like "blue" or "DarkSlateGray", but there are more than 216 of those, so same caveat applies.
This still exists in some weird places. For example, I have a Hue portable light that connects to Alexa and can change colors. But I can only tell it X11 color names...it doesn't understand anything else. Which is funny given that both devices are fairly modern.
216 = 6 * 6 * 6 -- That's a "Color Cube": a 6x6x6 3D cube of 216 equally spaced colors. Not necessarily the colors you'd actually want, though, just mathematically convenient. Figuring out the closest color in the cube to any color is quick and easy (so you can do a quick 24=>8 error diffusion dither, for example, which needs to do that every pixel), but lots of the colors suck.
Around that time I brought a magazine to the web as a paid job and had endless discussions about the fact that the colors were "not accurate" and "not following CI".
I remember those days! Cue a design editor holding Pantone cards up to the screen and scowling.
That also led to interesting things like websites telling you how to calibrate your monitor so that they'd render correctly, e.g. http://sasg.com/help.html .
One underappreciated aspect of paletted computers is that you couldn't just take the whole palette for yourself, you have to leave some colors for the OS and for the other applications running alongside you. Palette management gets really complicated when you have multiple applications trying to share one. Even though it takes three times as much video memory, you save considerable complexity when you go true color.
Yeah, it really was a hindrance to multitasking. Your palette would sometimes reshuffle as you switched applications, making it seem like your screen was about to explode.
I'm a little surprised by some basic facts the article gets wrong.
- WorldWideWeb was not created in 1987. Tim Berners-Lee released it in December 1990, based on a proposal he developed in 1989 [1].
- Windows 1.0 in 1985 did not have hyperlinks. It also did not have overlapping windows. [2] That second screenshot is of Windows 2, (from December 1987) showing the "Help" system, which did use underlined hyperlinks, from 1989.
It makes me question the thoroughness of their research at all.
> What happened in 1993 to suddenly make hyperlinks blue? No one knows, but I have some theories. ... I like to imagine that Cello and Mosaic were both inspired by the same trends happening in user interface design at the time. My theory is that Windows 3.1 had just come out.
What? No! These are grad students working at the National Center for Supercomputing Applications in the 1990s on big powerful Unix workstations [3]. I highly doubt the UI choices of Window 3 were relevant or closely watched by that team.
“ Gopher Protocol was created at the University of Minnesota for searching and retrieving documents. Its original design featured green text on a black background.”
Yeah, I think the point that @setpatchaddress was trying to make was that the author is confusing the color of the monitor itself with the color prescribed by the software. Thus, take the accuracy of the entire article with a big grain of salt. That's how I understood the comment....
Monochrome monitors were often either green or amber or white. If the monitor used P1 Phosphor, then it was green, P3 Phosphor was amber, and P4 Phosphor was white. So the color of the text on the screen was a reflection of the hardware spec/design, not of the software.
My first response was ¯\_(ツ)_/¯ -- but I dug some more and found out that P2 is a Blue-Green color used in oscilloscopes, but it doesn't look like monochrome computer monitors were ever made for it though [1].
P2 was a long persistence phosphor. It was used in analog oscilloscopes because those couldn't be refreshed -- the waveform was drawn onto the display as it was received, and the phosphor was responsible for making that visible.
You wouldn't want that in a computer monitor. The computer is perfectly capable of refreshing the monitor, and the long duration of the phosphor would make anything rapidly changing (like a scrolling display) impossible to read because all of the previous contents would interfere with the current image.
Blue-green. It was used mostly only in oscilloscopes [1] because the persistence time was really long - good for instruments where the signal might be changing faster than a human can perceive not so much for low latency inputs.
There were also monochrome flat-panel displays, either LCD or plasma. My first¹ computer was a 25Mhz 386 lunchbox luggable with a plasma (amber) display. It was portable-ish and ran on AC power only.
---
1. Well really my second. The first was a Spectravideo computer I got for writing demo programs for the midwest distributor when I was in high school. It wasn't very useful though.
Something similar was the first computer I used too. My answer would.be: My dad bought it. This was a common form factor for personal computers back then, and they were sold in stores to to the general public.
At the time I periodically travelled to give LaTeX workshops. I wanted something that I could set up in my hotel room to be able to work on course prep. Laptops were much more expensive and this came out to be competitive, if not cheaper than buying a desktop plus monitor.
Green phosphor coating was cheaper and had a longer "glow" time so it worked better on lower refresh rate equipment. Why they weren't all white later, once that all mattered less, is a good question. I do know that HP charged us more for the white ones...that never changed.
I wonder..."once that all mattered less".... I wonder if, by the time that white CRTs were cheap enough, if color CRTs were also cheap enough (albeit, more expensive than white monochrome), that most consumers just said "f-it, for an extra X, I can have full color instead of _just_ white?"
I was "that guy" during those days and insisted on buying a monochrome CRT (which at that time was just a CRT, since your only choice WAS which "chrome" you chose for your monochrome) whose text was kind of pastel white. It was glorious.
Yes, now that you mention it. MS-DOS 5.0 (which predated the first Linux release a few months in 1991) had a nice grey text on blue background for EDIT.COM (or was it exe?) and QBASIC.EXE. and NC.EXE (Norton Commander). Netscape and Mosaic inverted this color scheme with a grey background and blue hyperlinked text. COINCIDENCE? PERHAPS NOT!
I grew up with MS-DOS and 4M of RAM, perhaps I should make a tiny VM with Windows 3.11 and Netscape to revisit these days and try to get my Jekyll blog running on it (served from CERN httpd or the popular webserver at the time). Not sure if VirtualBox virtual network adapter can be recognized by Windows 3.11. Perhaps someone can backport a Gemini browser to Windows 3.11.. perhaps someone can backport a modern WWW browser to Windows 3.11!
edit: someone provided VM's already! Just 33M for DOS622+WIN311 (but still a lot of floppies). I disabled the default USB support and the startup to GUI is ~5s. EDIT.COM has a "hypertext" links in it consisting of 2 little green arrows, 1 triangle rotated left on the left side and 1 right on the right side. The grey on black text is not underlined.
http://virtualdiskimages.weebly.com/virtualbox.html
Someone purportedly writing authoritatively for an audience. You don't get to just invent history out of whole cloth because you "don't have time." If you don't have time to write a factual article, you don't have time to write an article.
So now this piece of crap is out there on the internet for the rest of time, permanently memorializing completely nonfactual statements. Fake news. Literal definition of. Wonderful.
I'm quite sure that students, even grad students, at UIUC, had lots of access to windows based computers in 1993. Just because they weren't doing their work on them didn't mean they didn't have PCs running DOS or Windows (and maybe dual booting Linux).
250MB was common by then and Linux distros only took up a dozenish MB. Lilo existed by then and everyone dual booted to DOS/Win3. If you didn't want to modify the MBR you could boot Linux from DOS with loadlin.exe.
1993 is roughly when I bought my first computer and it came with 120 MB HD. I dual booted Linux (Slackware) on it in 1995. Still on Win 3.11 though, I believe I bought a bigger hard drive before upgrading to Windows 95, but still dual booting with Linux on another partition.
You could fit a lot more OS on an HD in 1993 than you can now!
At 64 MB, you wouldn't have a whole lot of space for data and applications / utilities, but you could certainly cram a couple of OSes on it.
The first "user-installable" linux was arguably SLS, which came on 24 1.5 MB floppies. I'm unsure what the installed size was, but likely in the 24 -- 48 MB range.
Not in my university, i had a used toshiba 386sx25Mhz as a laptop with Windows 3.11. The fastest public desktop computer was a 486DX2 running at 66Mhz, around 6 of them on the 4th floor from the physics faculty, that was early 1994. It was running Mosaic and Netscape 0.9 or so with Win 3.11, no dual boot. When I got my own room and built myself a 486DX5@133 Mhz I got RedHat linux on it, dual booting, I think it was '95. My roommate had a pentium with Windows98SE running Moria, he was quite addicted to it.
Perhaps some very adventurous types were trying out Linux on their own machines in 1993 but distributions were all pretty new, I am not sure it was written about in Byte or C'T magazine in 1993. Perhaps it was discussed on mailinglists or usenet groups, but it was not really findable on the www I think. I frequented a site called 'on the bleeding edge' featuring a picture of a knife (or so I remember) and a list of kernel version numbers and patches. Not sure what date, but might have been '95.
I remember downloading and compiling kernel 1.1 or 1.2 - which were released in 1994. In 1995 I bought the offical RedHat CD's, I might have tried Slackware or Debian floppy disks earlier. A friend was running Linux with X-Windows, Emacs and Mosaic on his Pentium with WindowMaker or AfterStep. No dual-boot. He was on usenet (with the built-in netscape usenet reader) and played with Lisp, he had studied physics (or was it philosophy) at the Utrecht University. Heaps of Byte and Astronomy magazines and SF books littered in his room where he enjoyed a glass of wine and a cigar. I occasionally dropped by for a chat about linux, SF, astronomy and the meaning of life and my own troubles. I think he had dropped out of college for some reason years ago but I never dared asking why. He was brilliant and stayed in the student dorm as a senior. Unfortunately at 45 or so he died in his sleep I heard later when I wasn't living there anymore. He had a good job at the municipality and was well respected for his knowledge, seriousness, dry and dark humor and wit and was still living in the student dorm.
I don't know about UIUC, but I was at university in the UK in 1993.
We had "labs" with about 30 Windows/DOS PCs in them that were for general use (meaning word-processing). Probably 1 in 100 students had their own computer (and if so it was more likely to be an Amiga or Atari ST).
My course wasn't computer-related, but I took a few computer-based modules (graphics, vision, AI, intro to programming). All of these apart from intro to programming where done on university SunOS/Solaris or Irix machines (and Intro to Programming was in Turbo Pascal for DOS on those Windows machines).
The SGI Irix machines (made famous in the original Jurassic Park) were really nice.
This article is poorly written, I was expecting an interesting investigation but stopped reading halfway through. Here's a bunch of underdescribed things with non-blue hyperlinks, and some completely unrelated ones that didn't even have hyperlinks. The answer to the headline could have been made in one sentence and there would have been no loss of value.
> The answer to the headline could have been made in one sentence and there would have been no loss of value.
That sentence would be "I have literally no idea, it seems completely arbitrary." There really isn't any value worth preserving, it's just misinformed commentary on a bunch of screenshots taken while the author was probably in diapers.
> Here Microsoft uses the “hyperlink blue” for active states when a user clicks on different drives, folders and icons.
Hyperlink blue was a much brighter blue (pure blue, on the interfaces I used, but I was a litter later in the timeline) than Window's blue, which was a (noticeably) darker blue.
Yeah, if I were to 'pick' a reason it would be that it worked in the EGA colorspace. You did not exactly get a huge range of colors there. While in 1993 256 (small screen res) or 'truecolor' (very expensive vid card) was not unheard of but it was decently uncommon on low end hardware.
I guffawed at "I do not believe that this is the first instance of the blue hyperlink since this color is cyan, and not dark blue."
No Blue Scotsman!
Tim Berners-Lee told Ben Shneiderman at the time that he was influenced by the design of the HyperTIES-based "Hypertext on Hypertext" project from the 1987 HyperText conference that the ACM published, which had light blue links.
>My students conducted more than a dozen experiments (unpublished) on different ways of highlighting and selection using current screens, e.g. green screens only permitted, bold, underscore, blinking, and I think italic(???). When we had a color screen we tried different color highlighted links. While red made the links easier to spot, user comprehension and recollection of the content declined. We chose the light blue, which Tim adopted.
>His systems with embedded menus (or hot spots), where a significant user interface improvement over early systems such as Gopher. But Tim told me at the time that he was influenced by our design as he saw it in the Hypertext on Hypertext project that we used Hyperties to build for the July 1988 CACM that held the articles from the July 1987 Hypertext conference at the University of North Carolina. The ACM sold 4000 copies of our Hypertext on Hypertext disks.
Windows help functionality has been declining ever since. Those old help files were so clean and snappy, well-organized and searchable. Now, I dread accidently pressing F1 in any major windows app.
They're also pretty seriously wrong about HyperCard:
> Apple brought color to its HyperCards, but notably, the text links were still black and not blue.
HyperCard never natively supported any form of "text links". You could make a button with a text label, or a transparent button hovering over text, but there was no way to attach a behavior to a span of styled text without a lot of custom scripting.
(And, for what it's worth, the color XCMD for HyperCard never really caught on. It was a late addition, and never felt entirely like a native part of the application. Even when it was available, most users kept on authoring stacks in black and white.)
> However, some UI elements did have blue accents when interacted upon
I have no idea what the author is referring to here. Possibly the blue tint in the system UI (like window titlebars), which has nothing to do with HyperCard and didn't apply to its in-app UI?
> I have no idea what the author is referring to here. Possibly the blue tint in the system UI (like window titlebars)
I get the impression that the author was trying to answer two questions, the second being: where did the color blue come from?
I was also under the impression that the color XCMD was not a part of HyperCard and was created by a third party, but I could be wrong there since it has been over 20 years since I've used HyperCard.
There were a couple of different color solutions for HyperCard, but the official one (Color Tools) was released with HyperCard 2.3.
The window tint in System 7 was a user preference. The purplish blue seen in the screenshot was the default color, but there were about a dozen other options. In any event, it seems a stretch to assume that Apple's choice of this color influenced Mosaic in choosing a different blue color for a different purpose.
> Windows 1.0 in 1985 did not have...overlapping windows.
Actually Windows 1.0 did have overlapping windows.
They just weren't the default style for application windows.
But there were popup windows that overlapped other windows on the screen. These were typically used for dialog and message boxes, for example the End Session message box midway through that filfre.net article.
There was nothing stopping anyone from using a popup-style window for their application, and adding a titlebar so you could move it around on the screen. It just wasn't the custom, and people would think your app was weird if it did that. And on a typical system of the day (no GPU!), dragging your window around on the screen would perform rather poorly.
I had read that Digital Antiquarian piece a few months back and had remembered about the "sub windows" that an app could have. But I had thought they were scoped to just be on top of the window for the app that spawned it, and couldn't leave that "tile."
However, you are totally right. This image right here clearly shows it overlapping another application's tiled window.
WorldWideWeb was created by (mostly Republican) computer engineers who broke from IBM in Silicon Valley in the 1980s, forming little democratic circles of twenty to forty people with their laptops in each other's garages.
This is a reference to a bizarre anachronism in David Graeber's writing. The conflict over this passage once carried over to the comments here on HN while Graeber was still alive, and he and a longtime foe quarreled about it to a fairly unsatisfactory conclusion.
The part about project xanadu is also shady. They list it as 1964, but first paper was published 1965, while their idea of hypertext was born 1960, with the word choosen 1963. Not sure where the 1964 comes from. Not to mention that this wasn't even an actual implementation. It's disputable whether xanadu really should be the first one to mention here. The ideas of referencing documents is older and has previous implementations in analog world. It they wanna go just about hypertext, they should at least started with memex.
Man what a weirdly speculative article. Is this what Mozilla employees are being paid to do these days?
It's basically a tour of old hyperlink and windowing systems... with lots of guessing and maybes. I'm not sure why it's relevant that Win 3.1 had blue titlebars, for instance. The author never actually answers her question but I imagine the obvious guess is the correct one:
Black text on a white background was the predominant GUI style at the time (probably due to Mac OS and Windows) and the software designers needed a visual cue that the hyperlink was clickable. Just underlined wouldn't have worked because underline was already a popular style in text processing. So they decided to give it a different color too. Blue is the most logical choice as it has good contrast against a white background, and has a neutral meaning (compared to say, red). There weren't really a lot of color choices back then, the largest palette you could count on at the time was 16 colors.
This was what Mosaic did and most browsers that came after it (including the most influential: Netscape) did what Mosaic did.
And there certainly were browsers of the era that didn't use blue underline for links, the next most common paradigm was some kind of bordered box around the text (usually the same color as the text).
“Black text on a white background was the predominant GUI style at the time (probably due to Mac OS and Windows) and the software designers needed a visual cue that the hyperlink was clickable.”
For a comment complaining about unsubstantiated speculation this struck me as exactly that…
The default background was gray for Netscape, even on Windows, presumably because that was the default background for common Unix toolkits like Motif/X. Even Internet Explorer defaulted to gray. See these Wikipedia articles containing screenshots:
In particular, notice the IE2 screenshot, which shows it displaying the more modern Wikipedia website using a gray background. IE2 doesn't understand CSS, so just displays the source. The CSS declares a white background, so we can infer that the HTML probably does not declare a gray background using the long forgotten BODY tag BGCOLOR attribute. (Rather, almost certainly the HTML doesn't use the BGCOLOR attribute at all.)
It's possible that Mosaic defaulted to white on Mac OS, but I doubt it. Netscape didn't back then, IIRC.
For a long time gray and gray-toned backgrounds were ubiquitous on the web. It was nice because white backgrounds are difficult on the eyes, especially for prolonged periods. Unfortunately, white eventually began to dominate, as it already did for most Windows and Mac applications. Now we're coming full circle with dark theming, though dark theming is typically much darker than the old web and old X applications.
For the same reason they didn't use red. Red and green have meaning in many cultures, especially the one that invented the web. As stated by the parent commenter, blue is more neutral.
Blue has an established connotation for marking up text. E.g once upon a time a newspaper editor would scribble notes in original copy before sending to the printers. It stands out against black text but is unobtrusive.
That was a particular hue called “non-photo blue”. It photographed as white when using the common photo-offset printing process. So you could make comments, on the camera-ready copy, that people could read, but that wouldn’t reproduce. I’m old and had proofreading jobs in high school.
It’s camera-ready but might get some comments from a last-chance lookover: “Should this be capitalized?” written in the margin, for example. If the answer is no, it’s OK as is, then the copy can go to the camera without having to be set again. This is more a proofreading stage than an editing stage; that part is long over.
EDIT: Also used for printing instructions, to make sure that things come out in the right order, for instance.
My understanding was in those days copy and paste was a literal thing, so I guess what eventually went to the printer might end up being a frankendoc of sorts …
There is a neat technique called ”stripping in” that lets you cut a word out of the page and replace it with the corrected word from another page. You can use it to correct a misspelling if the length of the corrected word is the same as the wrong one; it avoids having to reset the whole page.
You put the page with the correct word underneath the copy, on a light table (a real one). With an exacto knife, carefully cut out the word, cutting through both sheets. Now the correct word fits exactly in the hole. Hold it together with a piece of white tape (standard supply in all these shops) on the back. The mend is invisible.
It was also the color in which TSR would print maps for old Dungeons and Dragons modules, so that players couldn't photocopy them and pass them around. Functioned as copy-protection.
That's really speculation but there are certainly reasons against it. Mostly that red-green blindness is the most common color blindness and that blue is considered a more serious color. For instance banks often choose blue as predominant color. Maybe that's also something worth considering for an experimental technology.
Maybe people back then want something different because the most common monitor back in the day was a green on black monitor. Having blue is refreshing looks new.
I agree, I don't think there's enough research here. If it were just one browser, perhaps designer choice.
But it is two browsers that chose blue, so perhaps there is some underlying Unix-y reason. Maybe early ncurses had chosen that blue for something unrelated to the web, and the decision goes back further.
Or maybe it was just lack of choices. For example, of the 16 original hex colors, blue & purple IMHO look the least like crap when mixed in with black text. Maybe its just that simple? red is too alarming, green is too bright, yellow/magenta/cyan/grey are too hard to read... now I'm speculating, but I think the answer might be an unrelated pattern in some other color-related origin.
> Is this what Mozilla employees are being paid to do these days?
Mozilla amazes me with their org-bloat-to-products-they-sell-for-money ratio. They have programming language teams, research bloggers, occasional splashy products, an in-house bug tracker, and oh yeah, they make a web browser.
I don't know how they do it, but it seems to be working out for them. If I was the CEO of a company that only had one customer, I would probably not be hiring software engineers to write a programming language that's not even used for the core product. But, I guess that's why nobody ever asks me to be the CEO of a company!
I'm really glad that Mozilla is developing Rust. Even though I'm not using it (and haven't even learned it), it looks like a net positive for the world of software development. This is exactly the kind of thing that a nonprofit should do.
Reads like a really young person who is overconfident in their abilities and lacks any actual experience with any of the things they mention. Every geezer on here knows Mosaic had blue links because they used it.
The answer is "Mosaic", even if someone can find some other earlier use of blue. They chose it, and Netscape kept it, which meant that everyone was trained to expect it.
I first used the WWW in 1995 (after seeing a fellow student in a computer lab looking at sports scores in a browser and asking him what he was looking at) and, of course, it used blue for links at that time. That fact that it took this article, 26 years after I first saw the WWW and 25 years after I built my first web page, to question why hyperlinks are blue makes me laugh. What else have I never questioned because it was always that way?
Only ~33% of my 27", 1440p display is used for this article, which makes the images very unclear unless I zoom in, since they don't get their own paragraph and the text wraps around them. Not sure if this qualifies as irony for a blog article on UX.
Surprised this doesn’t mention visited links turning purple to mark that you had been there. I remember coding link, alink (active link during click), and vlink attributes.
Even though some facts might be wrong as others have pointed out, I just love reading about the history of the internet on a higher level and how it came about. I wish I could have been involved in that in its early stages. Truly transformative.
dunno, but I wish we'd started out with all browser default CSS looking like twitter bootstrap 2.3.2 rather than the bevelled tables and clunky buttons there were, and which took ages to shake.
I'm rather fond of buttons that look like buttons, rather than colored rectangles or buttons that look like links, because they have affordances to what they can do.
Bootstrap is a good tool for CSS, but I think it also over-legitimzed restyling and reinventing native HTML interactive elements.
I miss blue for links and purple for visited links. I think Google still does it (which is great for the nostalgic of the webs), but today links are mostly buttons/images and not text anymore.
I remember also, in the 90s, was quite popular yellow text against a black/dark blue background. The old days!
The fact that the :visited state of links was gimped due to privacy issues doesn't help much either.
It used to be any visited link would look visited, regardless of the website. This made it possible to see where a user had visited across the web, and so visited links only apply to the current origin now.
At some point it also became hip to remove the underline from links, and links rarely have underlines anymore.
Apparently the author has never used a monochrome interface if they think gopher is “green” and Linux (which has nothing to do with hyperlinks either) is “white”
I would love if links to the same domain would have another color, so that you know if e.g. a news site just links to own content or the source, without clicking all the links in the articel.
So, is there somebody there who knows Marc Andreessen or Eric Bina and could aks one of them to confirm they choose blue because it looked good on white while red or green were obviously too much loaded ?
This looks simpler than listing a bunch of other UI, many non influential and none of them giving the answer.
> they choose blue because it looked good on white
Websites back then did not have white backgrounds, they were all gray. In fact I’ve always wondered why the default background was gray more than why the links were blue.
Because window backgrounds were gray in NeXT, because buttons used both white and black to create beveled "3d" borders, because beveled buttons were a fancy upgrade compared to simple borders in 1-bit graphics. Screen resolutions and drawing speed weren't good enough to waste on thicker borders, so 1px lines had to stand out on their own.
Back then, most people used CRT displays, and just like today, tended to have the brightness turned up too high. And it was fairly common to have a 30 Hz refresh rate. The refresh might even be interlaced!
A white background in this situation could lead to noticeable flicker, especially as you moved your eyes, e.g. look away from the monitor and look back at it.
The gray background made this flicker less noticeable.
My boss did UI/UX on Mosaic (we are both at NCSA today). I will ask her on Tuesday when I see her. She has lots of wild stories about why things are the way they are.
> Interactive states should always be styled in your stylesheets. Examples include: touch, visited, hover, active and focus.
Agree in general, but I wonder if a separate style for visited hyperlinks is still useful these days? Does anyone benefit by visited links being differentiated (by colour or another means) from unvisited ones?
When I'm at a site with many different topics in a list, it's nice to see which ones I've already visited. Links that don't show this or (even worse) don't differentiate as a link until they are moused over are one of my pet peeves.
Semi-related: I recently learned [1] that there is a third color associated with links: blue for standard, purple for visited, and red WHILE actively clicking the link (I don't think I noticed this before).
263 comments
[ 3.1 ms ] story [ 295 ms ] threadAlso, cyan is a much better color for text on a black background. Dark blue is almost invisible. This makes some of the early examples a little complicated since we moved to white backgrounds around the same time as the web came to fruition.
‘We’? Document-oriented workstations, including the one WWW was developed on, routinely used black-on-white back to the Alto, or NLS. (CAD stayed white-on-black due to the history of vector displays.)
Press [SPACE] for next screen, or as it was commonly known, "Spank the blank."
[G] for the document repository. Or as it was commonly called "G-Philes."
Something the article doesn't touch on is the fact that there wasn't really such a thing as hex colors like "#0000ff" back then. You could use them, but no one did because they weren't guaranteed to work properly. There was a list of 256 "web safe colors" that you could use that were the 8 bit palette that most computers supported in VGA graphics (at 640x480 resolution), and then a further list of HTML colors that could be used if the user had a graphics card that could use 16 bit SVGA graphics. Using 24 bit hex code colors didn't come along until a little later, when computers were likely to display them properly.
In other words, links weren't #0000ff. They were "blue".
I think some browsers understood X11 color names like "blue" or "DarkSlateGray", but there are more than 216 of those, so same caveat applies.
https://invisible-island.net/xterm/xterm.log.html#xterm_111
This still exists in some weird places. For example, I have a Hue portable light that connects to Alexa and can change colors. But I can only tell it X11 color names...it doesn't understand anything else. Which is funny given that both devices are fairly modern.
You could use names, or you could use colors whose RGB components were each multiples of 0x33. (00, 33, 66, 99, cc, ff)
Web-Safe Colors (a Color Cube)
https://www.peachpit.com/articles/article.aspx?p=23671&seqNu...
Not to be confused with a Time Cube.
https://en.wikipedia.org/wiki/Time_Cube
There were plenty of us who surfed the web in less than VGA. I was on monochrome.
OS/2 Warp had a web browser and supported CGA: https://www.mit.edu/activities/os2/faq/os2faq0201.html
That also led to interesting things like websites telling you how to calibrate your monitor so that they'd render correctly, e.g. http://sasg.com/help.html .
"anchorColor: color Color to shade anchors whose corresponding documents haven't been previously visited. Default is blue3.
visitedAnchorColor: color Color to shade anchors whose corresponding documents have been previously visited. Default is violetred4."
https://www.math.utah.edu/~beebe/support/html/Docs/resources...
- WorldWideWeb was not created in 1987. Tim Berners-Lee released it in December 1990, based on a proposal he developed in 1989 [1].
- Windows 1.0 in 1985 did not have hyperlinks. It also did not have overlapping windows. [2] That second screenshot is of Windows 2, (from December 1987) showing the "Help" system, which did use underlined hyperlinks, from 1989.
It makes me question the thoroughness of their research at all.
> What happened in 1993 to suddenly make hyperlinks blue? No one knows, but I have some theories. ... I like to imagine that Cello and Mosaic were both inspired by the same trends happening in user interface design at the time. My theory is that Windows 3.1 had just come out.
What? No! These are grad students working at the National Center for Supercomputing Applications in the 1990s on big powerful Unix workstations [3]. I highly doubt the UI choices of Window 3 were relevant or closely watched by that team.
1- https://en.wikipedia.org/wiki/Tim_Berners-Lee#Career_and_res...
2- https://www.filfre.net/2018/07/doing-windows-part-3-a-pair-o...
3- https://en.wikipedia.org/wiki/Mosaic_(web_browser)#History
Yeah. All you need to know about this article.
Monochrome monitors were often either green or amber or white. If the monitor used P1 Phosphor, then it was green, P3 Phosphor was amber, and P4 Phosphor was white. So the color of the text on the screen was a reflection of the hardware spec/design, not of the software.
You're probably right. I still struggle with tone sometimes. I'm still getting used to this whole "Internet" thing... ;-)
Check standard phosphor types section here: https://en.m.wikipedia.org/wiki/Phosphor
[1] https://en.wikipedia.org/wiki/Phosphor#Standard_phosphor_typ...
You wouldn't want that in a computer monitor. The computer is perfectly capable of refreshing the monitor, and the long duration of the phosphor would make anything rapidly changing (like a scrolling display) impossible to read because all of the previous contents would interfere with the current image.
[1] https://www.wellenkino.de/565/565-1.jpg
---
1. Well really my second. The first was a Spectravideo computer I got for writing demo programs for the midwest distributor when I was in high school. It wasn't very useful though.
Why the hell were our monochrome displays not all white. What's the purpose of adding a color.
I grew up with MS-DOS and 4M of RAM, perhaps I should make a tiny VM with Windows 3.11 and Netscape to revisit these days and try to get my Jekyll blog running on it (served from CERN httpd or the popular webserver at the time). Not sure if VirtualBox virtual network adapter can be recognized by Windows 3.11. Perhaps someone can backport a Gemini browser to Windows 3.11.. perhaps someone can backport a modern WWW browser to Windows 3.11!
edit: someone provided VM's already! Just 33M for DOS622+WIN311 (but still a lot of floppies). I disabled the default USB support and the startup to GUI is ~5s. EDIT.COM has a "hypertext" links in it consisting of 2 little green arrows, 1 triangle rotated left on the left side and 1 right on the right side. The grey on black text is not underlined. http://virtualdiskimages.weebly.com/virtualbox.html
I mean who has the time to deep dive into 100% historical accuracy of these things.
I thought it was a neat look at a historical context of something mundane like a hyperlink.
I strongly disagree with this premise, there are plenty of people out there taking the past seriously and "full-assing" it.
So now this piece of crap is out there on the internet for the rest of time, permanently memorializing completely nonfactual statements. Fake news. Literal definition of. Wonderful.
You could fit a lot more OS on an HD in 1993 than you can now!
https://www.technologytips.com/windows-system-requirements/
At 64 MB, you wouldn't have a whole lot of space for data and applications / utilities, but you could certainly cram a couple of OSes on it.
The first "user-installable" linux was arguably SLS, which came on 24 1.5 MB floppies. I'm unsure what the installed size was, but likely in the 24 -- 48 MB range.
https://opensource.com/article/18/8/first-linux-install
I remember downloading and compiling kernel 1.1 or 1.2 - which were released in 1994. In 1995 I bought the offical RedHat CD's, I might have tried Slackware or Debian floppy disks earlier. A friend was running Linux with X-Windows, Emacs and Mosaic on his Pentium with WindowMaker or AfterStep. No dual-boot. He was on usenet (with the built-in netscape usenet reader) and played with Lisp, he had studied physics (or was it philosophy) at the Utrecht University. Heaps of Byte and Astronomy magazines and SF books littered in his room where he enjoyed a glass of wine and a cigar. I occasionally dropped by for a chat about linux, SF, astronomy and the meaning of life and my own troubles. I think he had dropped out of college for some reason years ago but I never dared asking why. He was brilliant and stayed in the student dorm as a senior. Unfortunately at 45 or so he died in his sleep I heard later when I wasn't living there anymore. He had a good job at the municipality and was well respected for his knowledge, seriousness, dry and dark humor and wit and was still living in the student dorm.
This just isn't true.
We had "labs" with about 30 Windows/DOS PCs in them that were for general use (meaning word-processing). Probably 1 in 100 students had their own computer (and if so it was more likely to be an Amiga or Atari ST).
My course wasn't computer-related, but I took a few computer-based modules (graphics, vision, AI, intro to programming). All of these apart from intro to programming where done on university SunOS/Solaris or Irix machines (and Intro to Programming was in Turbo Pascal for DOS on those Windows machines).
The SGI Irix machines (made famous in the original Jurassic Park) were really nice.
That sentence would be "I have literally no idea, it seems completely arbitrary." There really isn't any value worth preserving, it's just misinformed commentary on a bunch of screenshots taken while the author was probably in diapers.
(a/k/a Cunningham's Law)
> Here Microsoft uses the “hyperlink blue” for active states when a user clicks on different drives, folders and icons.
Hyperlink blue was a much brighter blue (pure blue, on the interfaces I used, but I was a litter later in the timeline) than Window's blue, which was a (noticeably) darker blue.
This is what it looked like: http://toastytech.com/guis/win30help.png
No Blue Scotsman!
Tim Berners-Lee told Ben Shneiderman at the time that he was influenced by the design of the HyperTIES-based "Hypertext on Hypertext" project from the 1987 HyperText conference that the ACM published, which had light blue links.
https://news.ycombinator.com/item?id=28317104
>My students conducted more than a dozen experiments (unpublished) on different ways of highlighting and selection using current screens, e.g. green screens only permitted, bold, underscore, blinking, and I think italic(???). When we had a color screen we tried different color highlighted links. While red made the links easier to spot, user comprehension and recollection of the content declined. We chose the light blue, which Tim adopted.
>His systems with embedded menus (or hot spots), where a significant user interface improvement over early systems such as Gopher. But Tim told me at the time that he was influenced by our design as he saw it in the Hypertext on Hypertext project that we used Hyperties to build for the July 1988 CACM that held the articles from the July 1987 Hypertext conference at the University of North Carolina. The ACM sold 4000 copies of our Hypertext on Hypertext disks.
> Apple brought color to its HyperCards, but notably, the text links were still black and not blue.
HyperCard never natively supported any form of "text links". You could make a button with a text label, or a transparent button hovering over text, but there was no way to attach a behavior to a span of styled text without a lot of custom scripting.
(And, for what it's worth, the color XCMD for HyperCard never really caught on. It was a late addition, and never felt entirely like a native part of the application. Even when it was available, most users kept on authoring stacks in black and white.)
> However, some UI elements did have blue accents when interacted upon
I have no idea what the author is referring to here. Possibly the blue tint in the system UI (like window titlebars), which has nothing to do with HyperCard and didn't apply to its in-app UI?
I get the impression that the author was trying to answer two questions, the second being: where did the color blue come from?
I was also under the impression that the color XCMD was not a part of HyperCard and was created by a third party, but I could be wrong there since it has been over 20 years since I've used HyperCard.
The window tint in System 7 was a user preference. The purplish blue seen in the screenshot was the default color, but there were about a dozen other options. In any event, it seems a stretch to assume that Apple's choice of this color influenced Mosaic in choosing a different blue color for a different purpose.
Actually Windows 1.0 did have overlapping windows.
They just weren't the default style for application windows.
But there were popup windows that overlapped other windows on the screen. These were typically used for dialog and message boxes, for example the End Session message box midway through that filfre.net article.
There was nothing stopping anyone from using a popup-style window for their application, and adding a titlebar so you could move it around on the screen. It just wasn't the custom, and people would think your app was weird if it did that. And on a typical system of the day (no GPU!), dragging your window around on the screen would perform rather poorly.
I had read that Digital Antiquarian piece a few months back and had remembered about the "sub windows" that an app could have. But I had thought they were scoped to just be on top of the window for the app that spawned it, and couldn't leave that "tile."
However, you are totally right. This image right here clearly shows it overlapping another application's tiled window.
https://www.filfre.net/2018/07/doing-windows-part-3-a-pair-o...
This is the best kind of correct: technically correct!
WorldWideWeb was created by (mostly Republican) computer engineers who broke from IBM in Silicon Valley in the 1980s, forming little democratic circles of twenty to forty people with their laptops in each other's garages.
It's basically a tour of old hyperlink and windowing systems... with lots of guessing and maybes. I'm not sure why it's relevant that Win 3.1 had blue titlebars, for instance. The author never actually answers her question but I imagine the obvious guess is the correct one:
Black text on a white background was the predominant GUI style at the time (probably due to Mac OS and Windows) and the software designers needed a visual cue that the hyperlink was clickable. Just underlined wouldn't have worked because underline was already a popular style in text processing. So they decided to give it a different color too. Blue is the most logical choice as it has good contrast against a white background, and has a neutral meaning (compared to say, red). There weren't really a lot of color choices back then, the largest palette you could count on at the time was 16 colors.
This was what Mosaic did and most browsers that came after it (including the most influential: Netscape) did what Mosaic did.
And there certainly were browsers of the era that didn't use blue underline for links, the next most common paradigm was some kind of bordered box around the text (usually the same color as the text).
For a comment complaining about unsubstantiated speculation this struck me as exactly that…
https://en.wikipedia.org/wiki/ViolaWWW https://en.wikipedia.org/wiki/Mosaic_(web_browser) https://en.wikipedia.org/wiki/Internet_Explorer_2 https://en.wikipedia.org/wiki/Netscape_Navigator
In particular, notice the IE2 screenshot, which shows it displaying the more modern Wikipedia website using a gray background. IE2 doesn't understand CSS, so just displays the source. The CSS declares a white background, so we can infer that the HTML probably does not declare a gray background using the long forgotten BODY tag BGCOLOR attribute. (Rather, almost certainly the HTML doesn't use the BGCOLOR attribute at all.)
It's possible that Mosaic defaulted to white on Mac OS, but I doubt it. Netscape didn't back then, IIRC.
For a long time gray and gray-toned backgrounds were ubiquitous on the web. It was nice because white backgrounds are difficult on the eyes, especially for prolonged periods. Unfortunately, white eventually began to dominate, as it already did for most Windows and Mac applications. Now we're coming full circle with dark theming, though dark theming is typically much darker than the old web and old X applications.
Ben likes to actually run controlled experiments and measure things like that, instead of just speculating! ;)
See the email quoted here:
https://news.ycombinator.com/item?id=28317104
What are these comments? "Nice word choice" "No changes here" "This is perfect" "(smiley face)"
EDIT: Also used for printing instructions, to make sure that things come out in the right order, for instance.
You put the page with the correct word underneath the copy, on a light table (a real one). With an exacto knife, carefully cut out the word, cutting through both sheets. Now the correct word fits exactly in the hole. Hold it together with a piece of white tape (standard supply in all these shops) on the back. The mend is invisible.
But it is two browsers that chose blue, so perhaps there is some underlying Unix-y reason. Maybe early ncurses had chosen that blue for something unrelated to the web, and the decision goes back further.
Or maybe it was just lack of choices. For example, of the 16 original hex colors, blue & purple IMHO look the least like crap when mixed in with black text. Maybe its just that simple? red is too alarming, green is too bright, yellow/magenta/cyan/grey are too hard to read... now I'm speculating, but I think the answer might be an unrelated pattern in some other color-related origin.
That would explain whatever happened to Firefox.
Shameless plug: If anyone is looking to get rid of Chrome but don't like Firefox for any reason, try Brave, it is a great browser, really.
Mozilla amazes me with their org-bloat-to-products-they-sell-for-money ratio. They have programming language teams, research bloggers, occasional splashy products, an in-house bug tracker, and oh yeah, they make a web browser.
I don't know how they do it, but it seems to be working out for them. If I was the CEO of a company that only had one customer, I would probably not be hiring software engineers to write a programming language that's not even used for the core product. But, I guess that's why nobody ever asks me to be the CEO of a company!
Rust is used in Firefox
including the shortcuts on your desktop (which now functioned with a single click)
it was awful
(DoJ had some thoughts on that.)
Bootstrap is a good tool for CSS, but I think it also over-legitimzed restyling and reinventing native HTML interactive elements.
https://youtu.be/g3WtvzmKCQQ
(Starman learns much like ML apparently.)
I remember also, in the 90s, was quite popular yellow text against a black/dark blue background. The old days!
It used to be any visited link would look visited, regardless of the website. This made it possible to see where a user had visited across the web, and so visited links only apply to the current origin now.
At some point it also became hip to remove the underline from links, and links rarely have underlines anymore.
I'm assuming a JS query can check link status and colour? With a targeted or crafted link-of-interest, user activity might then be tracked, yes?
This looks simpler than listing a bunch of other UI, many non influential and none of them giving the answer.
Websites back then did not have white backgrounds, they were all gray. In fact I’ve always wondered why the default background was gray more than why the links were blue.
A white background in this situation could lead to noticeable flicker, especially as you moved your eyes, e.g. look away from the monitor and look back at it.
The gray background made this flicker less noticeable.
https://en.wikipedia.org/wiki/Refresh_rate
Agree in general, but I wonder if a separate style for visited hyperlinks is still useful these days? Does anyone benefit by visited links being differentiated (by colour or another means) from unvisited ones?
[1] https://www.youtube.com/watch?v=HLdDvQym5xk
I remember learning these with the LoVe / HAte mnemonic for CSS. Maybe from Cameron Moll, can't remember...
What does this superset/subset relationship refer to? I thought link was just a shortened word meaning the same as hyperlink.