Something unique about our company is that we all like each other. In fact, many of us are close friends and participate in many activities together (running, Tae Kwon Do and workshops on practical enlightenment, for example). On the car ride into a workshop one evening, a conversation arose about making websites mobile-friendly where I walked the others through an exploration of the question What does it mean for a web site to be “mobile”? I liked the Socratic Dialog nature of the discussion, and it evolved into this article, which is likely to be the first in a series continuing the discussion on this very relevant and important topic for anyone considering their website.
Starting with the Answer
As mobile devices have proliferated, we as web developers have been asked with increasing frequency to develop mobile sites or to assure that more generic sites are mobile friendly. This request often originates with someone who is aware that mobile devices are increasingly ubiquitous in our culture, especially in more affluent and/or younger subcultures. The request comes from the perspective that this audience exists, and must therefore be served.
As far as that goes, the perspective is quite accurate. However, we often find very quickly that the definition of mobile friendly in these requests is vague or incomplete. While there’s an awareness that something must be done, there’s less consensus regarding what that something should be. The answer of having a mobile ready site is clear, but the question being solved by this answer is often given little consideration.
This article is derived from a conversation among some people in our company where we helped explore the question being answered. Our aim in publishing it is to offer a framework for how to best approach the conversation about, and eventually the implementation of, building a mobile-friendly website.
What Should It Do?
When we hear “we need a mobile site,” the first question we ask is “what must it do?” That is, what is expected of a mobile site that is different from a more generic web site? This question is often the beginning of an exploration of what mobile means to the client.
The Easy Answers
The immediate answer is almost always some form of “it needs to work on a small screen”. Another display-based aspect of a mobile site is that it must work well in either landscape or portrait modes.
Another very common quick response is “it needs to be easy to use on a phone”. I tend to express this in the short, if not entirely accurate, form: usable w/o keyboard or mouse. Nested menus may work very well with a precise pointing device like a mouse, and might even work well on a phone that is very stable. However, phones are often used as people walk. A user interface that requires too precise a touch on a phone is one where a lot of errors will occur, especially if the user is walking or otherwise performing some other activity while using the web site. If it is sufficiently difficult, the user will give up.
Another consideration for both screen size and keyboard is use of a virtual keyboard: if one is required for any data entry, that consumes screen space, leaving even less than “normal” for the display of the page. Anything that needs to be visible to the user as the data entry occurs must not be obscured by a virtual keyboard. Again, landscape vs. portrait modes must both be supported.
As Freud would say: Sometimes, a Mobile Phone is a Mobile Phone
A consideration regarding how people use the site that often takes more time for people to realize is what I call using the phone. Many websites have buttons or links for Contact Us. Some even have Live Chat within this.
A mobile site, though is very often being displayed on a telephone. Though it is often forgotten in a world of smart phones, mobile browsers, and SMS messaging, phones are quite capable of a very effective form of voice communication! In addition to the other forms of contact, a mobile site being displayed on a phone should include a Call Us button or link that uses the phone to make a call.
Not Everyone has 4G or Wireless Ethernet
Not everyone thinks of the feature: demands little bandwidth. Many people today, especially in metropolitan markets, are used to a landscape littered with hotspots and 4G performance in between. Much of the US, however, operates with more severe bandwidth limits. More, an increasing number of smartphone contracts are imposing data limits with overage penalties.
Mobile sites, therefore, must keep their bandwidth needs to a minimum.
A Mobile Device is a Device
Rarely does the conversation get to this next point without help. Yet this point is right there in the name of the device. The defining aspect of a mobile device is that it is mobile: It moves from place to place, and is usable in any location. Every point above, excluding Call Us, involves accommodating one or another limitation imposed on mobile devices. That these devices are mobile, however, is a differentiator that can be used to provide great added value to the site’s users.
Google’s search mechanism is an example of a generic service that can be greatly enhanced by taking advantage of location. On any web browser on any device, one can search for coffee shops Montclair NJ to locate coffee shops in or around Montclair, New Jersey. On a location aware browser, however, one can ask merely for coffee shops and be given those that are nearby.
Another example of a web site that takes advantage of location awareness is one that reports on the state of a trip. It can use the current location of the mobile device to present the current state of the trip: the time spent and time remaining, the directions for the remainder of the trip, etc. This can be a straightforward application such as Google Maps, or it can be one that supports an itinerary of shopping at a planned set of stores or exploring a planned set of historic landmarks.
Considering these trip-oriented sites, though, takes us a step beyond a website that takes advantage of location in our understanding of mobile friendly. (That is another post entirely.)
A Mobile Device is used While Mobile
Above was presented a website that provided the state of an ongoing trip. However, a site that presents the state of a trip also requires that the trip be entered into the website. In addition to the portion of the web site reporting on the trip as it is undertaken, there must be some portion of the site where the trip is planned and entered.
This suggests the next level of a mobile friendly web site: one which organizes tasks based upon whether one is using a mobile device or not. The site can use the type of browser as a suggestion: is a trip under way, or is a trip being planned? Of course, this can only be a suggestion. Someone may plan a trip from their phone, and someone can take a trip with an open laptop.
But regardless of the device being used, the site includes both the while planning portion of the site and the while traveling portion of the site.
Finishing With The Question
The features above explore some possible fashions in which a website can be mobile friendly. Different applications, and different clients, will seek to make use of some different subset of these. It is critical for the success of any mobile friendly project that all parties share an understanding of just how mobile friendly is to be implemented for this project.
People come to your site for a reason. Maybe they need to solve a problem or address a challenge, perhaps they are looking to grow or find a reliable vendor. Your site should address how you can help them, very clearly show them how to reach you and also give them a reason to stay. How can you engage your visitors so that they stay on your site and even come back later? Here are some ideas:
One of the hot topics in web design and development this year was and is “going mobile.” How could it not be, really? With the already huge influx of smartphone use both in America and internationally (36% of global consumers use smartphones;
Recent Comments