Developing for Mobile : The Dos and Don’ts

Mobile web development is a nightmare; there, I said it. My daily commute consists of being sensorially detached from the waking world whilst I peek under my veil of perception at my fellow commuters, gormlessly encapsulated by their handheld devices and the digital offerings of the internet. They might be exchanging messages with loved ones, catching up on their email correspondence, or just binging on snackable content to avoid the dreaded inconvenience of mutual eye-contact with a stranger (could you imagine the trauma?).

I can’t help but feel somewhat responsible.

It’s no surprise that since the advent of the smartphone, companies have been adopting the ‘mobile-first’ mentality when it comes to web development to take advantage of this very behaviour, particularly in e-commerce. In the modern day, the mobile experience often takes priority over that of the desktop as ultimately, it promises a more lucrative return on investment.

As a web developer, though, I know that those websites and apps that are able to retain the attention of its users for more than the alleged 8-second span (1 second less than a goldfish…) did not get there by accident, and with that comes a significant amount of admiration. There’s a reason why the yuppy next to me cannot deter themselves from placing another bid on the hand-crafted, vegan-friendly, hemp teapot on eBay – and it’s the same reason that they are oblivious to the whereabouts of their elbow within my proximity when the bus makes a right turn – they are floating aimlessly in a bubble of digital consumerism thanks to their mobile-optimised content.

Every detail of the design and functionality of that website interface gracing his or her iPhone X would have been subjected to ruthless scrutiny by industry experts, colleagues and maybe sometimes, consumers – the laboratory rats of UX market research. Hence, the developer’s nightmare ensues – countless subtleties in UI to consider, a plethora of ‘user journey’ options to test and dismiss, and all whilst trying to create something beautiful and original for the client.

All things considered though, for me mobile web development is most definitely a labour of love and one I continue to happily pull my hair out over in search of mobile perfection. Here are some tips to bear in mind that I’ve found to be useful when developing for mobile.

DO reference

If my now redundant days in music production have taught me anything about digital creativity, it’s that referencing your work on as many devices as possible is paramount, and the same is true for web development. It’s important to remember that the end user won’t necessarily consume your creation on the same technology… in fact, assume that they never will. Want to build an amazing mobile website? Get it to look good and function well on the least-compatible device and browser that you support – and mobile excellence should promptly follow.

DON’T be afraid to hide

A sentiment that I live my very life by, but also an important and often overlooked notion in mobile development. Responsive design is a staple of modern web development, allowing users to access mobile-optimised layouts of the very same content that is displayed on desktop. But sometimes, things just don’t work as well on the restrictive displays of mobile devices. Look at it this way, there’s a reason Bootstrap offers a ‘hide’ class for each of its breakpoints.

Mobile usability is a very different experience to desktop, and its development should be treated as such – if it looks naff and doesn’t serve a mobile purpose, consider its expendability.

DO think of the end user

It’s easy as a creative to become precious about what you produce, and under certain circumstances, this is understandable, if not condoned. You want to leave your mark and have people appreciate your work, but it’s important to consider the behaviour of the target demographic. Is Shelly from Bury going to notice the skill at which you crafted that hover effect using pure CSS and pseudo-elements? Probably not. Develop with them in mind, not you.

DON’T complicate matters

Sounds obvious, doesn’t it? But you’d be surprised how many developers are capable of exacerbating an existing issue. Occam’s Razor: the simplest solution is normally the correct one.

Here’s an example in context – if there’s a reason your customers aren’t converting via mobile, consider the simplest solution first before introducing new hypotheticals. It could be a broken link, a redirect issue or just that they couldn’t find the ‘checkout’ button. Of course, there are utilities available to track the behaviour of your customers which should expedite the debugging process, but nonetheless a helpful theory to keep in mind.

ALWAYS test

You’re bound to have a few egg-face moments, especially when delivering websites for third-parties, its part and parcel of a developer’s day. That being said, if you expect your work to be imperfect and test accordingly, many of these growing pains can be avoided.

Testing is tedious, I can say that as a developer who focuses mainly on front-end and UI development, but the benefits of structured testing for mobile are plentiful. You won’t regret it.

Looking for some help achieving mobile excellence? Get in touch!