Web design has come a long way since the days of dancing baby gifs and starry backgrounds. The World Wide Web was opened to the public in 1991 and we’ve been fussing over how to design for it ever since. So let’s do a quick rundown of how web design has changed over time and where we are today.
The web of the early 90s was pretty plain by today’s standards. Websites looked like little more than digital versions of paper documents. Computer scientist Tim Berners-Lee started it all by posting the very first website in 1991 explaining what the World Wide Web initiative was.
Recreation of the very first website on a NeXT machine. Source: Cern
The pace of change went into overdrive soon after that. Mosaic launched its first consumer-facing browser in 1993 with features like inline images - a huge game changer at the time. Then Navigator launched in 1994. Yahoo stepped out on the scene that same year but they spent some time iterating on their original design. Their most recognisable homepage wouldn’t come out until 1997.
Yahoo in 1997
For better or worse, hotwired.com - an online offshoot of Wired Magazine - posted the world’s first banner ad in 1994 sponsored by AT&T. It was so unlike anything else at the time, the clickthrough rate was almost 80%. The move would become the catalyst for the paid advertising model online.
The very first banner ad featured on hotwired.com in 1994. Source: http://thefirstbannerad.com/
The Browser Wars and Iconic 90s Design
Internet Explorer launched in 1995 and with it came the infamous browser wars of the mid-1990s. It was a heated competition for the top spot as the most popular browser, with heavyweights IE and Navigator going head to head. And with so much competition came a flood of proprietary features in a bid to outdo each other and drive many a developer to madness.
In these wild times, the top priority was placed on visuals and heavy graphics on websites. Think of it like the kid who just got their first box of crayons and immediately ran to the wall to scribble in every colour.
Website for Space Jam the movie in 1996
Of course, to achieve these visual effects, we’d see a whole bunch of weird acrobatics happen in HTML with heavy use of padding, white text, 1-pixel-large images and so many more hacks most developers would probably be embarrassed to admit they took part in today.
And piling onto it all was the 1996 release of flash and the emerging trend to create sleek, eye-catching animated intro pages. That is, as long as you had enough bandwidth to actually load the graphics. CSS was also released at this time but wouldn’t pick up for another couple years because most browsers simply didn’t support it.
Coming of Age for Design and Content
The late 90s brought signs of maturity on multiple fronts. The web standards project launched in 1998 and reigned in some of the insanity of the browser wars. Text at the top of web pages told us when our browser version was outdated and advised us to upgrade. This gave developers an out so they didn’t have to kill themselves accounting for every browser version invented.
Design philosophy also grew up a bit and colours finally started to calm down. More emphasis was placed on readability and usability and we saw some standardisation on menu design. Google.com launched in 1998 and showed us just how alluring negative space could be.
By the mid-2000s, increasing internet speeds allowed for more video streaming. Youtube launched in 2005 and would go on to become famous for making Justin Bieber famous.
Modern Times: Focusing on Mobile and Minimalism
The launch of the iPhone in 2007 turned web design on its head. People didn’t know how to react. Some would create two different versions of the same site to accommodate either desktop or mobile screen dimensions. Most others simply didn’t address mobile at all and left consumers to pinch, scroll, and zoom on their phone to read anything off the screen.
In 2010, Ethan Marcotte put forth the groundbreaking idea that design should respond to the screen size viewing the content. He called it responsive design. And while this isn’t the only approach to dealing with mobile devices, it’s become the dominant strategy for tackling a diverse ecosystem of screen sizes.
At the same time, a return to 2-dimensional design starting getting some traction. Flat design as it’s called got rid of those ugly shadows and border formatting effects from our screens and gave sites a simple, graphical feel.
Flat design layouts with toned-down colours. Source: Wikipedia
Building on the philosophy of less clutter and more readability, companies also looked to finding better fonts for the web. Google famously released an internally developed font called Roboto as its default font for Android and Chrome in 2012. Meanwhile, Apple ended its relationship with Helvetica in 2015 and replaced it with a custom font called San Francisco.
A lot has changed in design and development since the web’s humble beginnings. And while we may not know for sure exactly what changes will come next, we can be assured the web will continue to evolve quickly to deliver even more functionality and aesthetics.