Blog / web

The latest & greatest news you’ll want to follow. Seriously. SRSLY.

A Quick Web Design Case Study – Apple Macbook Air Call to Action

We tell a lot of e-commerce clients that if you’re not going to A/B split test, at least copy Amazon… I have a similar stance on design. If you’re not going to hire an amazing web development and design agency (like us, amiright?) then there are roughly two things you should keep in mind:

  • Keep it simple
  • What is Apple doing? (I’m only half kidding; you’ll see why.)

So what is Apple doing? Let’s take a look at what I consider one of the best product pages online right now. The product page for the Macbook Air:

Macbook Air Product Page Design - Above The Fold

My favorite thing about this page is that the call to action (CTA). The little blue “Buy Now” button in the upper right sticks out like a sore thumb, but it doesn’t break the design language of the page in the process. They tastefully drew attention to it by making it the most extreme iteration of their design language.

The button is completely in line with the overall design language,  it’s just been turned up to eleven.

  • It has the most drastic rounded corners.
  • It’s the brightest and largest concentration of the page’s highlight color.
  • It anchors the site navigation of this area on by placing it last punctuating it with the bright blue button background gradient. (When you’re making a list and want something to stand out, always put it first or last.)
  • It doesn’t look out of place, but there isn’t anything else on the page that looks like it, or more importantly, that competes with it. This is the big one – your CTA should be the most extreme example of your design language, but it shouldn’t look like it came from another site.

One great way to test your CTA’s visibility is the ten foot test. The literal version of this to step back from your monitor 10 feet and see what you can still deduce about the content of your page. Of course, the fake version is to just zoom out your browser a few steps:

Apple Macbook Air Product Page Design - 10 Foot Test

You can still read the main title of the page, “The Macbook Air”. Great. You can’t make out much of the other text unless you’re eagle-eyed and even then the vast majority of it is still unintelligible, but that’s OK. One other thing above the fold (not that there’s a fold :) does still stick out, though. It’s that little bright blue button in the top right. You can’t tell what it says, but you still know it’s important.

And back to my earlier note about putting things at the front or back of lists when you think they’re the most important; you’ll notice the first item on that sub navigation list is Design. I’m shocked I tell you… just SHOCKED.

As usual, Apple’s page layouts are a master class in how to get the response you want from your audience. (Not that they never miss, they still can’t seem to make a mouse I care to use for more than about 20 minutes.)

The Apple iPhone accounts for more than half(!) of all mobile browsing.

This page shows the daily web browsing marketshare for mobile phones of interest, which is calculated from all mobile traffic across the 150,000+ sites that are tracked by It is updated every 30 minutes.

In the past 10 days the iPhone has been bouncing between 51% and 58% of total mobile web surfing in the US (Outside the US it’s spiked as high as 66%-one third of all non-us mobile devices online are iPhones). I’ve yet to get my hands on a Droid, but I’ve surfed the web with both Palm and Windows Mobile hand-helds and there’s just no comparison to the iPhone in that respect. Honestly, I’m surprised these statistics aren’t even more skewed in the iPhone’s favor.

Serious Security Flaw Found in Internet Explorer

In other news, water is still wet…

Users of Microsoft’s Internet Explorer are being urged by experts to switch to a rival until a serious security flaw has been fixed.

The flaw in Microsoft’s Internet Explorer could allow criminals to take control of people’s computers and steal their passwords, internet experts say…

…”Microsoft is continuing its investigation of public reports of attacks against a new vulnerability in Internet Explorer,” said [Secunia] in a security advisory alert about the flaw.

Microsoft says it has detected attacks against IE 7.0 but said the “underlying vulnerability” was present in all versions of the browser.

Other browsers, such as Firefox, Opera, Chrome, Safari, are not vulnerable to the flaw Microsoft has identified.

Serious security flaw found in IE – BBC

Test Drive Mozilla's New (incomplete) Supercar Browser: Minefield

Minefield is fast, furious… and incomplete. But its Javascript engine leaves Google’s Chrome and Webkit (Safari) in the dust. So what is Minefield? It’s pre-release/alpha version of a development branch of the Firefox browser. I that sounds too complicated, it wouldn’t be that much of a stretch to just call it Firefox 4 Alpha.

Sure, a lot of your plugins won’t work, and certain websites will make the browser crash. (Truthfully, that doesn’t make it all that much different from any other Mozilla upgrade I’ve run.) But if it’s speed you want Minefield has it in spades.

Download the latest nightly Minefield build for Mac OS X, Linux, or Windows.