Mobile First, Desktop Later – Thriving in a Post-PC Era

The landscape of web marketing has seen a massive overhaul in recent years. Long gone are the days when just having an accessible website was all that mattered. Our websites are not only expected to be very engaging and interactive, but people expect an ideal experience on any device capable of rendering it. This presents a lot of challenges for web developers, especially in the post-PC era.

How are we in a post-PC era? Computers, obviously, aren’t going away. This largely is due to the fact that computers still, and for the foreseeable future, dominate the workplace–but let’s put ourselves in the shoes of a consumer. Let’s say you’re watching a commercial and are intrigued by an advertisement, making you want to learn more about the product. In that situation, when is the last time you ignored the smartphone in your pocket, walked past the iPad on your coffee table and went into your office to look it up on your computer? I’m guessing not in a while, if at all! The fact is, tablets and cell phones give consumers convenient access to information in ways computers never could and for that reason–mobile is dominating the web.

It’s no secret that people have been making websites that work with mobile devices for years. The difference is consumers are no longer satisfied with the traditional mobile experience, and who could blame them? Why should you get a lesser experience because you aren’t sitting behind a computer monitor? Overcoming this expectation is certainly challenging, but fortunately it’s not impossible. There are quite a few different techniques at our disposal to help us not only meet, but also exceed our visitors’ expectations.

Mobile-first Responsive Design – This is the concept of thinking about your mobile visitors first before you start planning out your desktop interface. There are a lot of advantages to this approach. For starters, it ensures that mobile is not an afterthought. Too many times have I seen a responsive website that is gorgeous on a computer, but when pulled up on a smartphone is a garbled mess. The content may still reflow to fit the screen of the phone, but it becomes apparent that the designers only thought about the desktop version in planning and smashed the site content in a mobile sized box towards the end of development. Obviously, websites greatly affect the perception of brands, so whether it be a computer or a smartphone – we want them to be pleasing and accurately portray our organization.
Mobile Performance – Another big advantage to this approach is that it can greatly improve your website’s performance on mobile. In most instances, computers will come with a great deal more horsepower than a tablet or smartphone, so we want to make sure that we aren’t throwing more at a smartphone than it can handle. For example, say your website utilizes some heavy parallax scrolling techniques, which typically do not work well on mobile devices. You wouldn’t want to still load those large assets and disable them for mobile as this would require your visitors to download them anyway, thus greatly impacting your website’s performance. If we look at our mobile experience first and start developing that portion from the start, we can ensure we aren’t loading large desktop assets that are not necessary on the mobile version and ensure excellent mobile performance.
Browser Detection – In some ways, mobile devices have some advantages over desktop computers when it comes to development. Since the mobile landscape is relatively new and the life of a smartphone is two to three years, most mobile phones are sporting pretty modern browsers. This means visually pleasing techniques like CSS3 animations work very well in smartphone browsers. However, many older PC browsers, such as the dreaded Internet Explorer 8, won’t know how to handle them. This actually puts us at the opposite end of the spectrum, but just like with responsive design – the solution is detection. If we know what browser we’re in and what features are available to us, we can serve the ultra smooth, super light CSS3 animations to our mobile users, and serve the reliable, JavaScript animations to desktop users with old browsers. What does that mean in English? It means we can have visually appealing interactive pieces that work just as well on mobile devices as they do on PCs–even ancient PCs.

So even though consumers are expecting more and more out of a company’s web presence, you can see there are many ways we can rise to this challenge. It’s also important for us to remember that accommodating mobile visitors doesn’t mean having to compromise. We can build a highly interactive experience that’s just as engaging on mobile as it is on desktop if planned properly. This is how we will truly thrive in the post-PC era.

view all blogs