The Thoughtful Touches
I just finished building a website!
I’m afraid it’s not live just yet but there are a few thoughts I’d like to share, so if you can get your imagination running I promise not to waste your time! (No refunds.)
I’ve also optimised the animation speed at different breakpoints.
A 1280px image that slides in stage-right on a desktop needs far more transition time than a 320px image on a mobile screen. If both were to take one second, the large image/screen combo would slide across lightning fast while the smaller experience would crawl. Animations adjust responsively to keep speed relative.
It is however, best viewed on an iPhone or iPad.
The transitions, animations, and touch events offer an exceptional user experience. The breakpoints (image size and effect speed) are all optimised around Apple’s devices. The iPhone 4 even gets its own high-res logo and sprite. These devices received a lot of attention.
Wait, One Web?
Why so much focus on Apple devices if we’re suppose to subscribe to the “one web” philosophy?
When you get the basics right is there any reason not to go the extra mile for specific devices? Particularly when the client and the users have specific uses in mind. (This particular website will be heavily demoed on an iPad.) I’ve always taken the progressive enhancement approach and opted for feature detection over device detection (none of that here) but I’ve never thoroughly consider device optimisation until now. It’s fairly easy to pick breakpoints that verge on some average, but there’s always an opportunity to consider the best possible experience on specific devices and browsers. After all, is that not what we do with IE stylesheets? Sometimes the average doesn’t suit anything.
There is “one web” but there is only one device in the user’s hand. Relying on a specific device or browser is bad, offering something special when possible is not.
I would highly recommend watching Aral Balkan’s talk “The Future is Native” from Fronteer 2011. The first 20 minutes sums up the perfect attitude towards user experience and he really makes you think about the crossover between native and the web. His notion “write once, optimise everywhere” is a great thought.
Oh, and I’ll show off the website I’m talking about as soon as it launches!