By 2014 mobile internet browsing will overtake desktop internet browsing. Smartphones are cheaper and have a better connection to the internet compared to desktop computers available even a few years ago.
One of the issues that many business owners, designers or developers are debating is,
“Should we develop a mobile site, or create a mobile app, or just stay with the current responsive design?”
To answer the above question we need to understand these three different approaches better.
There is no final answer for the above solutions, any of those options can work for everyone. However, if we dig deeper about the functions, pros or cons of each model you may find an easier answer to your questions.
Responsive Web Design:
What is responsive web design?
‘Responsive web design (often abbreviated to RWD) is an approach to web design in which a site is crafted to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones)”.http://en.wikipedia.org/wiki/Responsive_web_design
Responsive web design lets you experience the page through different devices with fluid grids, flexible images and media queries.
See the Boston Globe site below.
If you want to know if a site is RWD , re-size it in your browser and see if it still keep the same structure.
With this approach you can have only one design and use it in different platforms.
Netflix, for instance, uses this technique to manage different interfaces on over 400 unique SKUs.
Amazon seems to take a similar approach. The Amazon Web site has been optimized for the usage/posture, input methods, and screen sizes of desktop and laptop computers. But the company has also experimented with different platforms in isolation.
Amazon developed Flow app, which we will cover below.
This seems an easy solution. Right?
1- The content and design will be created once. It will be re-sized and used for smaller screen for mobile devices such as iPhone, Android, Blackberry, etc.
2- Only one browser is needed to access to the site so viewers can have access to it from anywhere.
3- It saves time and money in production and execution
4- It requires wise and clever design and coding to make sure it can be used easily and efficiently on different devices
5- If your assets and information architecture are minimal, and you just need something simple that works everywhere (in the case of some blogs, for instance), RWD might be a correct fit.
So why not stick with this approach?
What are the problems?
1- Speed: The main site is designed for the faster internet connection available on desktops, where connections are faster compared to mobile devices, when you compare desktops and mobile internet connections.
2- Site is designed to be used with a keyboard and a mouse, there are some issues when navigation is switched to using your thumbs and gestures.
3- Images are scaled by browser (fluid image) and this not only takes more time to load on a browser but the best results are not always achieved
(check this link for more info)
4- It doesn’t have a “personal” feel.
5- There are compromises in the main design and core-functions which doesn’t let each device excel to their highest capability.
For example the number of touches and steps might be confusing for tablet or mobile users compared to the mouse clicks needed on the desktop site.
Or, the core function and main goal will be diluted in the serial and sequential format of the mobile interface.
6- Once you have a couple of big images or scripts in the design, or you start thinking about what content you need to hide or show in certain contexts, you’ve outgrown the utility of responsive design.
7- Another problem will be the input and interaction with users. The input on mobile devices with just the user’s fingertips and the size of the interface is totally different.
Mobile Web Design:
A mobile website is a special design that is just developed for mobile devices with all the specifications that a mobile–centric approach has.
The site needs different design and codes from the main web interface site; but since designers and developers know the functions and limitations of the mobile devices, they will design based on these specifications.
For example, images will be optimized for mobile devices and there is no need for the browser to download the large size and then scale it. The result is very controlled.
When it comes to input and interactions such as touch, gestures, shaking and moving hands, they are all well studied and designed.
1- Faster result: It was designed with the small screen in mind so everything is tested and controlled.
2- Files and images are optimized, it is open and very fast. Time is an important factor in mobile site development.
3- On the go concept: The information is accessible any place that there is an internet connection.
1-They don’t handle specific tools and processes, especially when it comes to e-commerce, banking, or any other personal interaction.
2-Doesn’t have the “Personal” individual feel.
See this Chase bank mobile site
A mobile app is a software application that is downloaded (from the App Store or Android Market) and installed on a mobile device.
- It can be anything from a game, a calendar, a to do list, etc.
- They mainly focus on one function.
- They have personal uses and you can enter your profile information.
- If used frequently, they are much easier and faster; they require single taps to access information (after they are installed on the device).
- These apps are more responsive because of native device code.
- Mobile apps have to be written specifically for a mobile device platform. For example, iPhone mobile apps will not work on an Android phone and vice versa.”
So why would a business that has a mobile web page need to develop a mobile app?
Mobile apps are geared toward some functions that mobile sites might not be able to do.
For example Amazon has a mobile site and an app called Flow.
What does it do?
“Amazon Flow, the barcode scanning/augmented reality app from Amazon subsidiary A9.com, has arrived on Android today, following its November 2011 iOS debut. To refresh your memory, the app lets shoppers scan things like CDs, DVDs, books, toys, video games, and more people are using their smartphone’s camera in order to display product details and pricing info.” Source
So their app is not a duplicate of their mobile version. It has a specific individual functionality.
Chase bank, also has both a mobile web page as well as an app.
Once clients install the app they can log in with taps and they can do many personalized interactions with it, such as deposit or transfer funds, and check their balances.
With this app Chase has made it very easy to access their information every time.
But what if their battery is dead and they need to check something on their friend’s smartphone and don’t want to install the app?
Now, the mobile site becomes handy and they won’t need to install anything onto the mobile device.
- Mobile apps are only compatible with the platform that it was created for. If a business wants an app to work on an iPhone, Android and Blackberry, three different apps will need to be developed. With a mobile website, a single version will work across all mobile platforms.
- You need to install the app onto the device, and some users may not wish to.
- Cost: Development costs considerably more and takes longer than mobile website development.
It is obvious if you are limited to one option to choose from all of the above; it is to make your main site utilize Responsive Web Design. This reassures you that your site is viewable on different devices.
However, if you want to take that extra step and make sure your service or product is more accessible, then you need to make a mobile site.
Lastly, if you want your service or product to utilize specific tools for personalized use it is better to develop a mobile app.