Mobile website vs Native App

A mobile web site or mobile friendly web site is not the same as a native android app or a native iPhone app or a native Windows mobile app. The mobile web site VS Native app is not exactly a debate as to which one is the best, but these are technologies that can (and should be) used as part of your overall Internet Marketing strategy.


Mobile Web Site:
The mobile web refers to access to the world wide web, i.e. the use of browser-based Internet services, from a handheld mobile device, such as a smartphone or a feature phone, connected to a mobile network or other wireless network.

Traditionally, access to the Web has been via fixed-line services on laptops and desktop computers. However, the Web is becoming more accessible by portable and wireless devices. An early 2010 ITU (International Telecommunication Union) report said that with the current growth rates, web access by people on the go — via laptops and smart mobile devices – is likely to exceed web access from desktop computers within the next five years.[1] The shift to mobile Web access has been accelerating with the rise since 2007 of larger multi touch smartphones, and of multi touch tablet computers since 2010. Both platforms provide better Internet access, screens, and mobile browsers- or application-based user Web experiences than previous generations of mobile devices have done. Web designers may work separately on such pages, or pages may be automatically converted as in Mobile Wikipedia.

The distinction between mobile Web applications and native applications is anticipated to become increasingly blurred, as mobile browsers gain direct access to the hardware of mobile devices (including accelerometers and GPS chips), and the speed and abilities of browser-based applications improve. Persistent storage and access to sophisticated user interface graphics functions may further reduce the need for the development of platform-specific native applications.

The Mobile Web has also been called Web 3.0, drawing parallels to the changes users were experiencing as Web 2.0 websites proliferated.

Mobile Web access today still suffers from interoperability and usability problems. Interoperability issues stem from the platform fragmentation of mobile devices, mobile operating systems, and browsers. Usability problems are centered on the small physical size of the mobile phone form factors (limits on display resolution and user input/operating). Despite these shortcomings, many mobile developers choose to create apps using mobile Web. A June 2011 research on mobile development found mobile Web the third most used platform, trailing Android and iOS.

Native App
A native application (native app) is an application program that has been developed for use on a particular platform or device. A native mobile app is a smartphone application that is coded in a specific programming language, such as Objective C for iOS and Java for Android operating systems. Native mobile apps provide fast performance and a high degree of reliability. They also have access to a phone’s various devices, such as its camera and address book. In addition, users can use some apps without an Internet connection. However, this type of app is expensive to develop because it is tied to one type of operating system, forcing the company that creates the app to make duplicate versions that work on other platforms.

Companies that are looking to promote themselves to the smartphone market have other options beyond native mobile apps:

  • Hybrid App: This type of application has cross-platform compatibility but can still access a phone’s hardware. It is developed using platforms such as Sencha, PhoneGap and Mosync.
  • Dedicated Web App: A website that is tailored to function on a mobile device. These are tailored to a specific platform and will not work on other smartphones or feature phones.
  • Generic Mobile App: A mobile website that will work with all mobile phones.

In the early stages of the smartphone market, most apps were tailored to the iPhone. However, the market share for Android phones grew, thus, the need for cross-platform functionality became an issue.

Why you should care?

As a webmaster you can use both these technologies to increase the traffic and exposure of your web site. I would say that besides search engine traffic and social media, mobile traffic (either through search on mobile or through the various mobile markets) is among the best ways to promote your web site.

How can a webmaster benefit from mobile markets?

You can develop a native app for your web site and make it available in those markets. The app can represent your content, products or services in a format optimized for mobile phones or tablets. By doing so you are bringing your brand in the hands of more users which will result in:

  • More visits to your mobile friendly web site and desktop site.
  • More sales (if you are selling a product)
  • More direct visits
  • Brand awareness
  • Additional revenue from advertising (if you choose to run ads on your native app)
  • Additional revenue from selling the app (if you choose to sell the app)
  • More subscribers
  • More social followers

How can you develop a mobile web site or a native app?

Depending on the platform you use for your site there are a number of free and paid tools you can use to develop a mobile friendly version. I use WordPress and a paid plugin (wptouch pro – has a free version as well) to easily and quickly create a version for smartphones and tablets.

Developing a native android app is a bit more complicated than just installing a plugin and it also depends on the kind of application you want to create. You can use or any other freelancing service to hire a developer (or hire me – contact me for a quote) to do the work for you. I will cover this is in more depth in another post so stay tuned.

So what is the difference between a mobile web site and a native app?

Now that you know more details, it is easier to understand the differences between a mobile web site and native app. In summary:

A mobile web site is a version of the desktop web site that is optimized for viewing through a browser on a mobile device (or tablet). It cannot be published on the mobile markets and the only way for users to find your mobile web site is to type the address from their mobile browsers. You can monetize your mobile web site by running mobile ads.

A native app is an application developed for a particular platform (android, iPhone, Windows). The resulting application is a file that can be uploaded in the respective mobile market. Once published in the market it can be searched through the market and installed on the device. You can monetize your native app by either running ads on by setting a purchase price.

Good Design Methodology

Good Design

Good Design

The goal of the design is to arrive at solid design solutions in a collaborative setting using the process, which will be explained in this article, of illuminate, sketch, present critique, and iterate. Multiple cycles of this process are run individually at first, then eventually run as teams, which allows us to arrive at some solid concepts by the end of the day. Along the way, the process helps develop greater trust amongst participants, and surfaces unknown requirements from key stakeholders. Inventing a good design involves:

  1. Define
  2. Research
  3. Brainstorm
  4. Sketch & Wireframe
  5. Design
  6. Review & Revise

It is critical to come to a conclusion of a project without having a methodology, its important to define the entire project methodology, as it helps everyone to make clear decision about the objective scope and timelines for a design development.

Think about the targeted audience for ascertaining how they complete their task using best practice methods. Gather requirements, business functions, user and functional requirements.

Research is always considered as imperative to achieve success in any business. Research to gather ideas and gain knowledge of competitions is always important part of design. It ensures truly evidence based design which helps in exploring and problem solving.

Use brainstorming to start to share and develop initial ideas and interaction concepts. It is an iterative process resulting in problem solving and design solutions.

Sketch & Wireframe
Sketching/Wire framing (ranging from hand drawn sketches through to high fidelity wire frames) is a key part of design process. This allows to explore design choices, conceptualize functionality, and test theories with users, stakeholders, designers, and developers prior to starting development.

Good design begins with defining the problem. A solution cannot be reached until there is a firm understanding of the problem, Understanding the problem and draw design accordingly is a best way of concluding a design into implementation.

Review & Revise of Design
Feedback is most important part of designing, Redesigning on the basis of user testing/feedback substantially improves design usability. Gathering and analyzing user feedback throughout the process helps define key areas of improvement.

Heuristic Design

A heuristic technique ( “find” or “discover”), sometimes called simply a heuristic, is any approach to problem solving, learning, or discovery that employs a practical methodology not guaranteed to be optimal or perfect, but sufficient for the immediate goals. Where finding an optimal solution is impossible or impractical, heuristic methods can be used to speed up the process of finding a satisfactory solution. Heuristics can be mental shortcuts that ease the cognitive load of making a decision. Examples of this method include using a rule of thumb, an educated guess, an intuitive judgment, stereotyping, profiling, or common sense.


The most fundamental heuristic is trial and error, which can be used in everything from matching nuts and bolts to finding the values of variables in algebra problems. Heuristics were also found to be used in the manipulation and creation of cognitive maps. Cognitive maps are internal representations of our physical environment, particularly associated with spatial relationships. These internal representations of our environment are used as memory as a guide in our external environment. It was found that when questioned about maps imaging, distancing, etc., people commonly made distortions to images. These distortions took shape in the regularization of images (i.e., images are represented as more like pure abstract geometric images, though they are irregular in shape).

10 Usability Heuristics for User Interface Design

Visibility of system status
The system should always keep users informed about what is going on through appropriate feedback within reasonable time.

Match between system and the real world
The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

User control and freedom
Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

Consistency and standards
Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

Error prevention
Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

Recognition rather than recall
Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

Flexibility and efficiency of use
Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Aesthetic and minimalist design
Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Help users recognize, diagnose, and recover from errors
Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

Help and documentation
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.