The very first web page is turning 31 this year.

It’s nearly impossible to overstate how the world has changed since Tim Berners-Lee launched that simple page on August 6th, 1991, let alone how the internet has become nearly unrecognizable compared to those humble beginnings. So here is a brief look at the growing up (and growing pains) of web design over the last 30 years.

1991-1995 – the birth of the first web pages

Hewlett Packard website, 1994
Hewlett Packard website, 1994 (source)

A lot happened in these first five years. The HTML (or HyperText Markup Language), text-only black and white pages of ‘91 made way for the images of ‘92.

And if you’re old enough, you’ll remember dial-up modems and their, ahem, leisurely pace when it came to loading pages. So between the capabilities of website design, and our download speeds, this was a simple, utilitarian era. By 1993, there were a grand total of 130 websites on the internet. 1994 is where things started to ramp up, though, thanks to a name that is very familiar to many of us, for good or ill: GeoCities.

GeoCities, 1995
GeoCities, 1995 (source)

GeoCities finally put web pages in the hands of regular people, and with that came the kind of design that is most associated with the early internet: gaudy backgrounds, colored fonts and a lot of very seemingly random design choices. It may cause a bit of an eye strain today, but this showcased the potential of what the web could look like.

1995-2000 – hello GIFs, JavaScript and CSS!

McDonald’s website, 1996
McDonald’s website, 1996 (source)

This era is when the web became a true playground for designers. Javascript’s (JS) appearance in 1995 sparked what would become a fundamental part of the internet – for the first time, developers could add interactivity to websites.  

At the same time, the world’s most popular browser, Netscape Navigator, introduced support for animated GIF images. But these early GIFs weren’t the reaction GIFs you’re probably used to seeing on sites like Giphy today. Instead, GIFs were a popular way to add animation, display navigation buttons or let users know that your site wasn’t ready for the world wide web just yet.

Coming soon GIF animation
Coming soon GIF animation (source)

But when Adobe Flash (initially Macromedia Flash and FutureSplash) hit in 1996, that’s what truly opened a new world of design possibilities. Not only could web pages be organized in a non-linear fashion, allowing for fresh perspectives on how pages were presented, but those pages of texts and images could now be truly interactive and incorporate a host of new elements. This meant newfound freedom, allowing for animations, video, audio and choices of fonts and layouts.

The derBauer flash website in 2000‌‌

1997 was when HTML tables came into vogue, allowing developers to structure websites on a grid-like layout. But while helpful and incredibly popular, they took longer for browsers to render, and were hard to work with. So there was still a lot of trial and error for those looking for better design methods.

Then came CSS.

CSS (Cascading Style Sheets) dropped in 1998, dovetailing with a community of designers who were starting to figure out what did and didn’t work on the web. CSS allowed for a separation of design and text – this gave designers the ability to work on the style aspect of a website without worrying about its connection to the content.

2001-2005 – empowering everyday users to design

MySpace website, 2003
MySpace website, 2003 (source)

Blogging seemed like a silly word back in 2003 when it was shorthand for “weblogging,” but it became a trademark for Web 2.0, a term used to describe a more communal internet.

And what did this community do for design? Between blog platforms like WordPress and Xanga, and social media platforms like Myspace, the internet gave everyday users the platform to design their own online spaces. And as users became comfortable with designing, more people started to push the limits of web design.

At the same time, more websites were using the Adobe Flash Player to display multimedia content. Sites like Newgrounds took Flash to a whole new level, hosting many of the first viral videos.

The Badger Song, released in 2003 and was one of the most popular music videos on Newgrounds‌‌

Of course, there were still plenty of issues. Font issues, non-standard links and the overuse of Flash were big issues for people trying to make the web a better place for design. But many good design practices, like the use of white space, adherence to flow and readability, and impactful pages that load quickly, were birthed in this era.

2006-2009 – skeumorphism and the iPhone

Hewlett Packard website, 2008
Hewlett Packard website, 2008 (source)

Web design saw a big shift in 2006 with the birth of skeuomorphism – an intimidating word that simply means designing things on the screen to look like things in real life. This usually means drop shadows and other design choices that give things like icons the look of being 3D. It was a style that seemed to sync well with a lot of the other trends that soon followed.

According to this article from 2008, design trends of the year included “pencil sketches, handwritten notes, card stocks, watercolor effects, collage art, script fonts, grungy and splatter ink backgrounds…”, signaling a desire for more realism on the web.

This coincided with another major shift: the iPhone.

When the first iPhone dropped in 2007 (with skeumorphic icons), an entirely new horizon opened up. All of a sudden designers realized that designing pages that were optimal for regular computer screens was only going to solve half the issue. Now websites had also to be optimized for the mobile screen – this meant adjusting for scrolling layouts, different button sizes, limited bandwidth and readability.

2010 – the rise of responsive design

Microsoft website, 2010
Microsoft website, 2010 (source)

In 2010, web designer Ethan Marcotte coined the term “responsive design”. Responsive design is an approach that allows web pages to adjust their layouts or appearance according to different screen sizes, including the smaller screens of mobile phones. This is, of course, how nearly all sites are designed nowadays, but it took years for this to become a standard practice while mobile devices slowly took over the world.

2010-present – flat and minimalist design

Facebook website, 2016
Facebook website, 2016 (source)

While web design in the early 2000s leaned heavily on skeuomorphic elements, the 2010s went into an opposite direction: flat design.

Flat design, which replaced skeuomorphic design in iOS7, is still with us today. Think 2D icons, clean layouts and simple color palettes. This meant that websites looked less crowded – flat design helped make websites easier and more user-friendly to navigate. At the same time, many websites moved away from using stock photography to custom illustrations.

LinkedIn in 2016 and 2022

In recent years, some sites have pushed back (or bent the rules) of minimalist design. Take neubrutalism, for example. This design style uses high-contrast colors, thick defined outlines and rich typographic elements, moving away from minimalism’s softer approach.

Other trending website designs of 2022 don’t fall neatly under flat design, either – many feature delightful chunky 3D illustrations, oversized typography and tactile-looking elements.

Gumroad’s neubrutalist design
Gumroad’s neubrutalist design

What’s next for web design?

It’s hard to say what web design might look like in the future. But there are a few broad trends that might stick around:

  • Web designs may pay more attention to web accessibility, as public awareness of accessibility is on the rise.
  • Users may continue to seek out interactive experiences – after all, that’s what made technologies like JavaScript and Adobe Flash so appealing.
  • Web designs may make more use of custom animations and illustrations. Visuals that look as if they’ve been tailor-made for a specific brand stand out against stock imagery, which can look too generic.  

No matter what comes next, looking back at lessons from the past can help us design for the future. In the meantime, we hope that LottieFiles helps you create effective, engaging and interactive websites that stand the test of time. Check out our free customizable animations, and tools that make setting up interactions easy. Happy designing!