Why is this website different on a smartphone?

If you’ve ever visited the same website on a smartphone or tablet and a desktop or laptop then you’ll know that some features that appear on a smartphone (swipe left anyone?) don’t appear on a desktop and vice versa. As a marketing and web design agency, our team can happily geek out and talk about mobile v desktop, Java v PHP, Star Wars v Star Trek all day long. However, we recognise that not all of our customers are as deep into the intricacies of website development as we are – and why should you be, when you’ve got us? We hope this post answers a few of your questions, and if you’ve got any more, please get in touch.

Touch v click

One fundamental reason that websites look different and offer different features to visitors is that the way we physically manipulate a smartphone is different from how we interact with a laptop or desk top. A mouse or touch pad can be used in quite a delicate way, so clicks tend to be much more precise and detailed than finger taps. As a result, the user interface (UI) on a mobile page needs to be more chunky, with buttons ready to take a whole finger instead of the tip of a mouse cursor.

Smartphones also introduced a whole range of gestures which aren’t available without a touch screen (swiping and pinch zooming for example) and also respond to other actions in a way a desktop can’t (showing a compass that turns as you do, turning an app on when you shake the phone…). Finally, smartphones are still phones, so it’s possible to start a call directly from a website, or take a photo or record sound in a way that’s not possible or appreciated on a laptop. On the flipside, laptops and desktops tend to have more processing power and memory so are much better suited for complex tasks. They also have a full keyboard as well as the mouse so entering data into forms is much easier.

That screen size issue

Another major factor is that a large smartphone is about 6in while desktop screens can easily be 30in – and that’s before you start worrying about people with multiple screens or browsing through their 50in smart TV. The limited size on a smartphone means that website designs need to be different, and any competent design agency will factor this into their website creations. Smart phones and tablets are also used at a much closer distance, so the way information can be presented and the type of content people enjoy is different. It’s something akin to the difference between going to the cinema, watching TV with a friend and curling up in bed with a book: even if the story is the same, the presentation and experience is different.

Learning from apps

Both mobile and desktop browsing has learned a lot from the success of smartphone apps, with more and more design agencies creating websites that mimic app behaviour such as allowing users to swipe left and right to navigate through the site. While there’s no reason computers can’t have apps on them (Windows now offers an app store as a way to download new programs), the way people interact with the same app will be different on different platforms.

Just enough to be memorable – or confusing?

Branding is, for almost every business, something that should stay the same across multiple platforms (newspaper ads, shop fronts and website, never mind just mobile and desktop). This is one reason that web designers prefer to build a single website and serve it to both mobile and desktop customers. Ideally, the website should be similar enough that if you switch platforms while in the middle of a transaction you aren’t disrupted by changes, even if they are fairly dramatic. As an example, someone buying a gift might research ideas on their tablet, check a price online against an in-store offer on their smartphone, and finally purchase on a desktop. Or the other way around. Large retailers try to make the shift from one platform to another seamless, as disruptions lose customers.

Good design turns into bad design

As you can see, by thinking about the physical limits of the tools we use and the ways we interact with them, it’s clear that what could be a great design for a desktop website might be impossible to use on a mobile site. Drop down boxes are a common example: on a desktop website, they’re easy to manipulate and can even be ‘searched’ by typing in a few starting letters (e.g. ‘Aust’ in a country field brings up ‘Austria’ and ‘Australia’). However, on a mobile platform a long list can be impossible to scroll through if the website design interacts poorly with the browser app on the phone. Going the other way, date pickers can be an easy solution on mobile platforms where a couple of taps is all you need, but frustrating for many users on desktops if it means moving their hands back and forth from the keyboard to mouse.

With the rise of mobile, some design agencies have switched allegiance entirely. And while we do understand and embrace the concept of ‘mobile first’ design, we believe that both mobile and desktop browsing are important and users on all platforms should have a good experience of the websites we build and maintain. That experience includes great content, great pictures and, of course, great – and appropriate – design.

Back to blog list