Back To The Future: 15 Years Of Apple Web Design Seen Through A Time Machine (Feature)

In just the last fifteen years, a lot has changed for Apple. The company has transformed itself from a dying corporation teetering on the brink of bankruptcy into the most powerful technology company in the world, a giant that has revolutionized pretty much every aspect of technology.

Given the extraordinary changes that have happened to Apple in the last fifteen years, you’d think that the Apple.com homepage would have gone through a lot of changes too. But it hasn’t. Why not?

Going back through fifteen years of Apple.com homepages, it is clear that for Apple, their website is just another product, just like an iPhone or iPod. When Apple wants to make a new product, they first find the ideal form they think that object should be, and then endlessly iterate upon it over successive generations to bring the function of that form into sharper relief.

Apple’s website is no different. Here’s how Apple has refined it over the years.

Before The Revolution: Apple.com From 1996-1998

Back in 1996, the Apple.com website probably looked decent compared to other websites in the mid-90s. It followed the standard design trends of the era, with a format that looked more like a fancy e-mail newsletter than a website. There’s a sidebar of information and a few blocks designated for stories that were aimed at educating people about Macs.




Putting The “i” In Mac: The 1998 Redesign

Apple’s 1998 redesign was the first to truly embrace the possibilities of the Internet while embracing a cutting-edge design ethos.

When Steve Jobs unveiled the iMac in 1998, Apple.com also got a facelift. It needed one.

The ”i” in iMac stood for Internet, and Apple.com needed to look like it was created by a company that was pushing forward the boundaries on the very frontiers of the web. To do that, Apple needed to start treating its homepage not just like a repository of basic information about their company, but like something they were actually selling: a product so important that they had slapped it in the name of every “Internet Mac” sold.

The 1998 Apple.com redesign was incredibly important, because it was a redesign that would see the basic shape and structure of Apple’s homepage take hold, to be honed and refined but never substantially altered over the course of the next 15 years. The newest iMacs can trace their design lineage back to the original iMac of 1998, and we can trace the main elements of Apple.com back to the 1998 redesign.

Every Single Line Means Something: The Apple.com Formula



With every new product Apple creates, they find a basic form that they think perfectly encapsulates the function of a product and then continue to refine it over the years to reduce that form to its essence. The iPhone, iPad, iMac, and MacBook have all retained the essential form of the first generation model, but Apple has perfected each one by adding new features, introducing new technology and manufacturing processes, and stripping away superfluous elements.

Apple.com has been no different. In 1998, the Apple.com website relaunched with four main components that are still in use today.

1. The Big Box – As largest section on Apple.com, the main product section is used to promote newly launched products and give them the bulk of visual space on the homepage.
2. Hot News – Rather than displaying news all over the front page, the 1998 redesign featured a small news feed area that didn’t detract from the focus of the page: Apple’s newest products.
3. Small Promotion Boxes – Used to promote smaller products in the Apple lineup.
4. Navigation Bars

Over the years, Apple has slowly refined these elements, bringing their website’s function into sharper relief.

Consider the following evolution:

In 2000, the Navigation Bar was moved to the top of the page and given a new look.

Both the Navigation Bar and Hot News components were given an Aqua enhancement in 2001.

Despite many changes, the 2013 Apple.com homepage still has all four components that debuted in 1998.

Perfecting The Formula

Although Apple.com is treated by Cupertino like a product in its own right, it is also a service, and its purpose is to promote other Apple products and sell them to consumers. Since 1998, Apple has dedicated the bulk of its homepage to beautifully promoting its latest and greatest products, but the way in which Apple has done so has evolved over time.

Here’s a deeper look at how Apple.com has perfected each of the four major sections over the last 15 years with each one of its products over the last 15 years.

The Big Box

When Apple redesigned Apple.com back in 1998, the Big Box took up about half of the page. As time has progressed, the Big Box has only grown in size to accommodate the humongousness of importance of Apple’s latest products.

After moving the navigation bars to the top of the page, Apple expanded the size of the big box

The Big Box in 2007 promoting OS X Leopard.

The Big Box continues to grow for the iPhone 4S in 2011.

Hot News

Before Apple redesigned their website in 1998, their homepage used to be covered in news stories. You can still find Apple-related news through Apple.com, but over the last 15 years the Hot News section has diminished in importance. It’s gone from a highly visible object to being barely distinguishable from other links on Apple.com. Why? Probably because, back in the day, the only place to go for Apple news was Apple.com, where as now, sites like this one keep the Apple space well-covered.

Apple changed the color of the Hot News bar in 2000 to match the Navigation Bar

The Hot News bar became a little bit smaller in 2004.

In 2006, Apple started blending Hot News into the background.

By 2008 you could barely notice the Hot News bar.

Small Promotion Boxes

The Small Promotion Boxes on Apple.com have always been used to promote an Apple product or event, but the look of the boxes has changed over the years. They’ve gone from three bland divided sections, to looking more like buttons on the page today.

The boxes were given definitive outlines in 2000

In 2007, Apple added some gradients to the boxes them stand out more.

Some drop shadows added in 2012 made the Small Promotion boxes look like individual objects on the page.

Navigation Bars

During the redesign of 1998, the Navigation Bars originally appeared in the lower half of the page. Then in 2000, Apple moved them to the top of the page along with a redesigned look. From 2000 to 2002 Apple changed the color of the Apple icon a few times, then in 2007 it settled on a look that is still used on Apple.com today.

The Navigation Bars were moved to the top of the page in 2000.

A blue Apple icon appeared in 2001, the iReview tab was replaced by Mac OS X.

In 2002 Apple changed the Apple to a grey color, while Switch and .Mac made an appearance.

The Navigation Bar was transformed into a solid bar that was divided into Apple’s different product categories.

Conclusion

Even though Apple’s not considered a web-based company, their online strategy has been phenomenal over the past 15 years. Once Steve Jobs came back to Apple, a new web product was created, and has been used for 15 years and counting. Apple has made small incremental changes to Apple.com over the years, much in the same way its made small adjustments to the iMac, but the form has always remained the same. Only the function has improved.

By following the same formula it uses with hardware products, Apple’s been able to use their website as a tool to engage customers and promote products while keeping things consistent and easy-to-use. In essence, Apple.com is the perfect example of how Apple seeks perfection via small adjustments, rather than a constant schedule of revolutionary changes.

Data source: Cult of Mac (BY Buster Heine)