Living in the Mobile Web

A little more than 5 years ago, Apple announced its newest mobile device, the first-generation iPhone. Within minutes (well, maybe it took a few months), every web pundit was doing his or her own Paul Revere impression of riding around the web screaming, “Change is coming! Change is coming!

It is clear that whatever we thought was coming is here, and it is wrapped in the chaotic elegance that arises from such revolutions. Though the environments for accessing the web have changed—now the same information once only available at a desktop on the ground is easily accessed on an iPad aboard an en route airplane—the consumer’s traditional expectations for how a site should function and how they can interact with it are still intact. In light of this, the user experience that our website and application developers design matter more than ever before. Here are a few trends we’re watching at Danya:

mHealth is Growing

It has been a half decade since Steve Jobs said, “Today, Apple is going to reinvent the phone, and here it is.” In that time, the word “mobile” has grown from a vague notion of what the web would become to the reality of what the web is today. So what is that reality? A rapidly expanding new world of mobile. In fact, during the week of September 7, 2012, the world saw six significant new mobile devices launched.

These changes have seeped into the health industry, too: There are more than 10,000 medical/healthcare applications available in Apple’s iTunes App Store. Creating effective mobile sites is significant when considering that:

  • Forty-one percent of teens and 20-somethings claim to be “addicted to their mobile devices,” according to recent Google data
  • Nearly a fifth of cell phone users have used their mobile device to look up health or medical information
  • Forty percent of doctors believe that using mobile health technologies¾like those that monitor fitness and eating habits¾can reduce the number of patient visits

With this obvious growth of mobile pervading into health, web developers must become experts in syncing mobile and traditional websites, which isn’t as easy as a click of the mouse.

Mobile User vs. Desktop User

Regardless of the device being used for its mobile capabilities, a smartphone resting next to a desktop computer has vastly different features and functions available than its stationary counterpart. Web content specialists have had to expand their focus to design sites that still please the user, no matter how the information is accessed. Some of the considerations developers must make include:

  • Helper Applications. Desktop users have a variety of applications that assist them as they traverse the web. Some of those applications are not available to iPhone/iPad users. For example, iPhone/iPad users cannot use any content that is presented through Adobe’s Flash player. So any content presented to desktop users using Flash has to be recreated in a mobile-friendly format.
  • Size Matters. The click has been replaced by the tap, and the finger replaced by the mouse. With all due respect to the opposable thumb, fingers are not as precise at clicking a space as a mouse is. Using a mouse, users rarely have problems clicking on links or icons that are 16 pixels by 16 pixels. The average finger size isn’t as precise; device makers like Apple suggest that a “44 x 44 points is the comfortable minimum size of a tappable UI element.” So in creating a more mobile-friendly site, web managers have to revise all of the links, buttons, and menus to become larger targets for a mobile user’s finger.
  • Prioritizing Features and Content. One of the greatest considerations for the mobile web is that developers are given smaller real estate on a tablet or mobile device than a desktop. While two-thirds of all screens are around 1200 pixels x 800 pixels for desktop users, mobile users may have to make do with just a third of that space. What that means for the website is that developers have to prioritize the information shown and how the user can interact with the site.

With differences such as these, website developers must be cognizant that their audience is no longer stationary; they are on the move, so their site must be, too.

Responsive Web Design

Remember those six new devices that were launched in 7 days? Creating six different versions of one website for six screen resolutions, three different browsers, and two different operating systems is obviously not practical. This is the problem that responsive web design (responsive design) addresses head on. The purpose of responsive design is to create the best user experience possible for different site visitors on different devices, all built into one website. This allows site visitors to focus on the content of the site and enables the development team to maintain only one website. Responsive web design can suit desktop, smartphone, and tablet platforms through two key aspects of web development:

  • Fluid Frameworks. Within the website, the actual code that displays the website is reconfigured to be able to support the variety of devices and resolutions.
  • Media Queries. Within the mobile device, the website accesses the device as the site is loading and is told which content to show and how best to show it.

These technologies allow a desktop visitor accessing the website on a Windows PC to see one set of content and functionality, while allowing a visitor on an iPhone 5 to see reformatted content that also supports the gesture-based interactions—such as swiping, pinching to zoom out, and screen taps—of the device. (Check out developer-guru Ethan Marcotte’s excellent post on Responsive Web Design.)

To fully understand responsive design, let’s take a closer look. By way of an example, the “Boston Globe’s” website was redesigned in December of 2011 using responsive design techniques. If a site visitor comes to the website through a Windows laptop, this is what they see:

If a site visitor comes to the website using an iPhone 4S, this is what they see:

Items such as the stories featured above, the advertisement, and even core features such as the navigation links have changed. You’ll notice a few key differences:

  • Reorganized listing of articles, with information flowing vertically rather than horizontally
  • Relocated advertisements, to allow visitors to access content before being shown ads
  • Reformatted navigation links, condensed to save space but still allowing users access to various sections (albeit with an additional tap)

While resolving the issue of maintaining features without sacrificing functionality may seem like chaos, I promise there is a guiding light: where technology provides challenges, it also provides ways to move forward. Steve Jobs’ “change” is here, and we are all capable now of quite literally living—in the car, in a plane, on Paul Revere’s horse—in the mobile web. Our website developers, like my coworkers here at Danya, are ready to meet the challenges these changes bring and aid consumers in accessing the content they need when they need it and where they need it.

Future Trends

With the release of each new mobile gadget, the universe of possibilities for mobile continues to expand. At Danya, we’re keeping a close eye on today’s data and prototypes of tomorrow’s new technologies. Here are a few things that we’ll be watching over the coming months:

  • Near Field Communications (NFC). NFC-equipped devices collect and share data from other mobile devices at close range. Devices simply need to touch to establish a connection. This type of technology promises to have a strong impact on everything from sharing contacts and photos in social networking to multiplayer mobile video games.
  • Cloud Computing Delivered to Mobile. Mobile computing will most certainly make leaps based on cloud computing. Mobile apps will use the cloud to store and process data and services. Combined with growing network speeds, big data can serve just-in-time analysis to mobile devices.
  • App Platforms. Mobile web apps will likely dominate the future as platform proliferation continues and technologies, such as HTML5, improve mobile web capabilities with features like offline data storage.

Want to learn more about the wonderful world of mobile and social media?

We’ve decided to strip away all the confusion surrounding social media (including mobile) and truly make these tools come to life with a free one-stop, 1-day event on all things digital with Social Media Day 2012 on September 27, from 10 a.m. – 2 p.m. You can RSVP here.

By Harsha Vemulapalli

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s