My 25-Year Career in Web Design Through the Eyes of the Wayback Machine

Remembering the excitement of a new medium, coming to terms with its ephemerality, and rediscovering some embarrassing little treasures.

Ka Wai Cheung
On Building Software

--

For more than 25 years, I’ve designed in front of the screen. This idea — that you could move boulders with a few keystrokes, make tectonic shifts by the drag of a mouse, and exhibit your work to the rest of the awaiting world in an instant — was once a completely novel one.

Weightlessness. One of the miraculous properties of the web. A medium without the constraints of material cost, gravity, or the seasons. Experimentation encouraged, decisions impermanent.

In the late 1990s, I was entering college in search of my future. My heart wanted to be an artist. My brain told me to grow up and be a scientist. And when this medium landed on the world like an alien spaceship, it seemed to come in peace and beckoned me to come inside.

It could appease both of my inner voices—and I wanted in.

In high school, I designed with pencil, pens, paint, and paper. The first web designs I remember doing in college were also planned on papersketches on the left over sheets of quad-ruled notebooks I used for math courses, each square representing 20 pixels or so.

Seems odd now, but at the time, it helped me envision how I would code up the big <table> that would hold the entire design like a jigsaw puzzle.

A bit art. A bit science. The prefect elixir.

I eventually found Photoshop. Discovered guides. Added layers to show rollover states. “Sliced up” the design and transported the Lego-like pieces over to HTML. A little Javascript onmouseover and onmouseout and you had yourself something dynamic.

Then Flash entered the scene — the medium I and a small but vocal corner of the web design community fell in love with. The one that started the first real debate of the modern web: Flash or HTML? Flash was electronic rave music to HTML’s adult top-40s. And the more Jakob Nielsen vilified the Flash community (and, to be fair, any HTML designer not using a browser’s default anchor link colors), the more we rebelled.

Flash eventually lost out of course, but over time, I found a deep appreciation for HTML and CSS — especially as browsers could do so much more with it.

There will always be a special place in my heart for web design — the old school kind. Pre-responsive. When we were still figuring our way around the edges of the browser. The era that began with the waning days of Netscape and breathed a sigh of relief during the waning days of IE 6. When 1024 pixels was considered a long distance run across the screen. When opening up a new FLA or PSD marked the beginning of an infinite spectrum of possibilities.

I’ve designed for the web for more than a quarter century and the web as I first remember it has changed — as it should. And as I should, I can’t help but get nostalgic.

I can’t help but occasionally long for the way it was — a simpler, more innocent, more playful period of the web when we admired what others were doing to push the medium well past the limits that the tools we were handed seemed to offer. I can’t help but want to flip through the dusty albums of my own work.

But what web designer keeps such digital artifacts? Not me.

This brings me to one drawback of the web: its weightlessness. Ephemerality really. Creations on the web spawn and vanish. They can escape through the back entrances without anyone hearing the doors shut.

So I went digging in the only place that might keep these artifacts intact, the Internet Archive’s Wayback Machine, to see what can be salvaged.

Maybe some of the good stuff is still there.

Maybe I can dust it off and re-stage it.

And maybe, I’ll rediscover some things I’d rather not have found.

Here was my bounty.

Saved by the web: The college years

The very first time I saved a file accessible to the web was in my Introduction to C++ class as a freshman in college. We spent one class that quarter discussing HTML and how web pages worked.

My first corner of the web is now a “site that can’t be reached”: http://www.isp.nwu.edu/~kawai.

I remember saving an index.html (or was it index.htm) file to a directory on a computer at the north end of campus, rollerblading down the main road to the south end of campus, sitting at my dorm room desk, typing in the URL I had memorized, and seeing that very same page render on my laptop.

Forget the World Wide Web — I was impressed the page made it across campus. It was nothing short of mind-blowing.

I never did much with C++, but this one serendipitous moment hurdled me down the path of learning more about HTML, basic CSS, Photoshop, and even a little Javascript.

In 1998, I had decided to use my college URL to create a “forum for next generation web design” called the Kiwi Site. I wanted to highlight sites that balanced design with content during a time when form typically got in the way of function.

Like many of us did back then, I used “we” in my copy to make the site seem like it was run by a team of professional designers, not a college undergrad who still had his rollerblades on sitting in his dorm room.

I even made a GIF award that I sent to random sites I admired at the time. And most folks actually added the GIF to their site. Because whenever you receive an award from a team of professional designers, you better highlight that on your site, ya know?

Screenshots from my very first “designed” web site including the coveted “Kiwi outta site! winner” award.

It was during this time that I also became a webmaster for the website of the science program I was enrolled in at college. It was a work-study job. I think I made $10/hour, which was a few dollars more than you could make swiping dorm cafeteria cards or reshelving books at the library.

I spent more time being a webmaster than I did on my schoolwork, stumbling my way through Photoshop and reverse-engineering HTML through the magical “View Source…” option on my browser.

It reminded me of being a kid and leafing through BASIC code on the programs that came with the Apple IIc I grew up with. Or just taking apart any old toy.

It was a digital kind of tinkering.

A few iterations of the website for the Integrated Science Program. I was both a student of the program and its “webmaster”.

It was also around 1999 when I found my first paid contract work. For some of my earliest clients, my deliverable was an emailed ZIP folder of files — HTML pages (with inline CSS) and images. Or, I’d upload them for you if you had your FTP credentials on-hand. Sometimes I’d redesign a logo too.

My very first paid client was an engineering company named Geotrack. I believe I found them through a pinned ad on a billboard at the lobby of my dorm hall. I emailed them, perhaps sent them a sample of what I was thinking, and they said yes.

They paid me $20/hour for my work. Double what I had been making as a webmaster and three times more than the standard work/study pay for an odd job around campus. I was having fun and making money—two things that I assumed were mutually exclusive when I was growing up.

I managed to snag the homepage, still relatively intact.

The nearly fully-intact homepage of my very first paid client, Geotrack.

Some things I’d like to forget:

  • The curved border around the Geotrack logo — a staple of late ’90s web design.
  • The not-quite-right transition from the curve to the straight vertical border down the right side.
  • The really poor fading technique I applied to the side images.

Then, through the grapevine of college connections (still years before The Facebook was created), I managed to land a gig designing the website for Student Solutions, a college shipping and storage company started by a fraternity on campus.

You never forget the first time you get paid for doing something you love and in this case, it came in the form of a $700 handwritten check (which felt like $70,000) and a steak dinner.

What’s left on the Wayback Machine is a skeleton of the original site.

I remember this site being very forest green with some tacky imagery around it.

The “natural” aging of freelance work

A large number of sites that I launched to the world, particularly when I was freelancing between 1999 and 2006, look only partially the way I remember them looking.

But there’s something poetic about seeing an old site you designed using the old table layout technique that’s now littered with broken images, with backgrounds that aren’t loading, with CSS hacks that don’t quite do what they once did.

It has the feel of an abandoned house you once tended with love and care — now overcome with the affects of old age and neglect. The bones are still there.

A small sampling of web designs I made that still live on the Wayback Machine, some fully intact, some with a few missing images, non-rendered backgrounds, and broken table layouts

And while some Flash sites and cheeky Flash intros I designed still work with the help of the open source Flash player Ruffle, many aren’t able to render at all.

My Flash-based web portfolios (2001–2006)

I was pleasantly surprised to find that a few versions of my old portfolio site were largely intact.

The very first version is the most preserved and here’s a link to it. Hopefully, it still works as you are reading this.

I forgot I had added sound effects to this puppy as well as some random audio clips of my 21-year-old-self talking about my creative process and other self-absorbed stuff. Embarrassing little treasures!

I am 100% sure the “Client Extranet” form didn’t submit anywhere — it was a facade to make me look like a professional web developer at the time.
Collegeboxes (right) was one of my favorite interactive Flash projects, but unfortunately I couldn’t find a workable version of it from the Internet Archive. A little screenshot within a screenshot will have to do.

I was in downtown Chicago one evening in July 2001 taking pictures of city buildings with my brother’s digital camera. I can’t remember why I was there but I ended up using these pictures in the next version of my Flash-based portfolio.

Here’s the link to V2. (Unfortunately, the dynamic content doesn’t load and only the shell navigation remains).

Behold my magical design skills. I Photoshopped that “Portfolio” sign onto the side of the building. When you moused over the window panes, it would reveal more detail on a particular project. Cool….right?
Unfortunately, Wayback Machine did not cache the other SWF files that are supposed to be loaded when navigating to the “About” and “Contact” pages.
A sign of the times: Links to various charities shortly after the September 11th attacks

The next year, freshly laid off from my first (and only true) corporate programming job I’ve ever had, I redesigned my portfolio once again, and once again in Flash. By then, even us Flash geeks were getting a little tired of the overly embellished 2Advanced Studios style of Flash sites.

Version 3 was more modular and restrained with subtler doses of Flash-iness. Maybe my way of saying I was ready to move on to building more functional, “serious” software.

My final Flash portfolio circa 2002. Through it all, I really liked orange…I guess.

By the mid-2000s, I rekindled my love for pure HTML and CSS, and also had enough work to showcase where I didn’t feel the need to overcompensate with the design of Project99 itself. My final two designs (2004 and 2006) focused more heavily on organizing text, line heights, paddings, and the like.

Post-Flash, grayscale phase, circa 2004. Maybe got sick of the orange?
Final design of my portfolio site, circa 2006

Around this time, I started to write on various web topics. I wanted to get my name out there so I emailed a few organizations and asked if I could write an article for them. Today, we’d probably call this building your personal brand by writing guest posts with cross-links.

A few of my earliest articles:

The one-page web site

In 2006, I co-founded a web development business called We Are Mammoth. During this time I found a love for the one-page website.

The first iteration of WAM’s one pager was in Flash and involved some airbrushed tusks on us three partners. Embarrassing little treasures.

Unfortunately, what’s left of the one-pager is just the top portion. The rest of the page was loaded through a few backend calls on a new Flash backend framework I developed called X2O but Wayback Machine wasn’t able to cache those data calls. So, what we’re left with is three lonely dudes and a very black screen.

My next iteration was a return to HTML. The vertical flag on the site mirroring the actual flag we had strung over our renovated warehouse turned home turned office in Chicago’s Fulton Market.

The home of We Are Mammoth, circa 2011

For the first five years, our company was a small and slowly evolving operation — we grew from about 2 to 7. But then our business grew significantly. By 2014, we grew to nearly 30 team members and built a design team.

My days of wearing the designer hat for the WAM website were over. I started focusing more on building and managing our development team, and building a new SaaS product called DoneDone. More on this in a bit.

Books in one-page website form (2012 and 2020)

I published my first book, The Developer’s Code, for the Pragmatic Bookshelf in 2012. But it started with another one-page website of the entire original draft, complete with the ability to “bookmark” where you were at by clicking anywhere on the side margins of the page.

A book, complete with a cover and table of contents, on one web page.
Bookmarking by clicking on the margins. A page refresh would send you right back to where you left off.

Here’s the link to the original one-page web book:

https://web.archive.org/web/20110716072538/http://www.thedeveloperscode.com:80/

In 2012, after the book was reworked and published in print, I changed the website to a more traditional design with links to the publisher. I was a little sad to see my original web book go.

Redesigned site after The Developer’s Code went to print

Years later, I wrote a book about naming things in programming which became another one-pager—this one was done with chapter navigation that swaps the visibility of divs and works well on mobile.

Cover, flyout chapter menu, and page sample of “Naming Things”.

Designing for a product (2009, 2021–2024)

DoneDone is a product I began building in 2008 and launched in April of 2009. It’s been my proverbial “baby” for 15 years.

I also designed and deployed its very first public website, and it’s still fully intact!

My favorite part of this site is the copy. I spent a lot of time on it, noodling each word to get it to fit just right around the angled and cropped screenshots. It still reads well to me.

Version 1 of DoneDone.com, launched in 2009.

DoneDone remained a side project for WAM for its first nine years. At no point did we employ more than three people on development (myself being one of them). But, our growing design team at WAM as well as a few wonderful freelancers, took over the design of the public site for its next several iterations.

Still DoneDone’s been my labor of love and most of what I’ve been contributing to the web since 2009.

Even after I went “full time” on it in 2017, we kept DoneDone small. In fact, smaller. By 2020, our full-time staff became just two again. And in 2021, for the first time in over a decade, I got to redesign the public site myself again.

This time in Webflow using all the powers of modern responsive CSS.

A few pages from the most recent version of my product, DoneDone.

A blank canvas every now and then

I don’t design websites anymore. Not much anyways.

But every now and then I’ll feel that itch to layout words on a screen. Noodle on line heights, letter spacing, padding, and margins. Pick a font. Feel that small thrill of throwing something up on the web.

My most recent itch produced my most recent iteration of my personal website. It’s written as a memoir to my web career, because as a father of two and in my mid-forties, my energy for this stuff is only delivered in small spurts.

My latest personal website, kawaicheung.io.

Going rogue

Another thing I’m experimenting with these days is to use what I’ve learned from these raw programming materials to create art on the web.

Recently, I’ve recreated a couple of old baseball scoreboards with no images or scripts—only raw HTML and CSS, bringing my career back full circle perhaps, to a time well before any of this existed. And also to a time where experimentation was the only way I knew how to get somewhere different.

How far can we go with what’s available with raw HTML and CSS? I’m trying to find out.

I like the fact that the simple web is still here if you want it. You can still just write a web page in a basic text editor, upload it somewhere, and have it be seen.

You can still make embarrassing little treasures whenever you please.

--

--

On Building Software
On Building Software
Ka Wai Cheung
Ka Wai Cheung

Responses (70)