October 18, 2013
By Ted Verani
The rise of mobile has been breathtaking. With smartphones passing the 50 percent penetration mark and 39 percent of online traffic coming from mobile devices (comScore), it is safe to say that mobile has risen and is here to stay.
We are living in a multi-screen world where consumers devour digital content on multiple devices, at multiple locations, and in different usage modes. Having an engaging, all-around Web experience across mobile, tablet, desktop and beyond is fast becoming a digital imperative for today’s marketers. But how do we as marketers best achieve a true cross-platform Web presence for our customers?
Dedicated mobile sites are done
In the early days of the mobile Web, mobile optimization meant developing a dedicated mobile site with its own URL, such as m.mysite.com. This distinction caused mobile Web sites to diverge from PC sites and evolve at their own pace, typically with a more limited feature set.
Keeping mobile Web sites separate made sense when mobility meant quick, on-the-go access to the most important content and, for most brands, this was the best path forward.
While the dedicated site approach offers flexibility and control over the mobile experience, it has serious drawbacks:
• Inconsistent user experience: Web sites change often, making it challenging for content owners to make updates across all versions when they are maintained separately.
• Escalating development and maintenance costs: As the number and depth of dedicated sites grow, so does the cost of their development and maintenance. API integration with various data sources can also present a considerable challenge.
• Fragmentation of URLs: With multiple dedicated URLs, brands have to implement complex, cross-device URL mapping if they wish to allow users to navigate between different devices. Using multiple sub-domains can have a negative impact on search results, as indexing becomes fragmented across the various URLs.
Rise of one Web with responsive design
Today, many brands are looking to merge their fragmented Web presence to deliver a more holistic, unified experience across all devices and take advantage of economies of scale.
This trend is fueled by the emergence and popularity of responsive design, a client-side technique that seamlessly adapts Web site layout to various devices.
Responsive design enables developers to create screen-optimized experiences from a single code base by using fluid, proportion-based grids, flexible images and CSS3 media queries.
The Web community, at large, has embraced this as a scalable way to achieve today’s gold standard: a cross-device Web experience that stems from a single code base and performs well on any platform. In other words, a one Web experience.
However, responsive design is not without its own limitations:
• Mobile context: While it addresses layout problems, and elegantly expands and contracts according to a screen’s width, responsive design is a one-size-fits-all approach that makes it difficult to take into account the potential for differentiated use-cases, such as a mobile-specific shopping experience.
• Performance: Responsive design forces the device’s browser to handle the bulk of the processing work. The browser is sent the entirety of Web site data, irrespective of device, and must determine which layout and assets to present. The result is longer load times and Web pages that perform poorly on mobile handsets.
Retailers and major brands know that site performance directly affects their overall visitor experience and whether they make a sale, which is why many still have dedicated mobile sites.
In fact, 40 percent of customers have turned to a competitor's site after a bad mobile experience (Google).
• Cost: Responsive design typically requires a complete overhaul of a company’s Web presence.
From UI/UX to content, there are many things that go into the initial development period of a responsive site.
While retooling their entire Web presence could prove beneficial for many companies, the monetary and labor costs in doing so can be quite high.
Optimizing one Web with server-side controls
Responsive design is a huge step in the right direction to achieve a one Web experience.
However, a truly exceptional user experience on the Web requires more than simply shifting layout and styling to a device’s screen width.
Performance and user context are two critical areas where responsive design alone cannot get the job done.
An improved approach involves the use of responsive design methods in conjunction with server-side technologies that can handle the processing at the server level, optimizing the code for the accessing device before it is sent to the client browser.
This emerging trend, sometimes called RESS (responsive design with server-side controls), can deliver much faster load times and a far better experience for the end user.
The addition of server-side controls allows a developer to serve only the required website assets to the accessing device and cut down on unnecessary browser load — especially important when images and other rich media are being served.
Rather than serve all media assets and force the bandwidth-starved mobile device to choose what to show and hide, one can leave this decision to the server and send only the optimized images and video intended for that device.
In a world where the average page weight has increased 28 percent year over year, now up to over 1MB, it is easy to see how using server-side optimization for Web assets can drastically improve a page’s performance. This is particularly crucial for media and retail businesses where Web site load time is critical and directly affects revenue.
It is important to note that responsive design with server-side optimization is more than just a design technique.
Adding server-side components to a Web site’s architecture provides more technical flexibility and the ability to fine-tune presentation for an optimal cross-device Web experience.
For example, a retailer can tweak design to ensure an ecommerce site functions better with a mobile-specific shopping cart, or a large content-focused site may require entirely different ad placement based on device and user context.
Server-side controls can easily allow for a complete swap of crucial elements based on any number of characteristics.
Right tools can make all the difference
There is no arguing whether a one Web experience is critical for a company’s online success today. But the path to get there can be long and arduous, fraught with difficult decisions and complex development challenges.
Choosing the right tools for the job can make or break a marketer’s budget, yet has the potential to turn a mediocre Web site into an exceptional cross-platform customer experience.
For this reason, Web technology should be focused on creating server-side solutions to simplify multi-device development.
Marrying server-side technology with responsive design techniques allows the server to do all the heavy lifting, while providing the visitor with a clean, high-performing Web experience.
Ted Verani is senior vice president of sales and marketing at Trilibis, a San Mateo, CA-based provider of Web development technology and advanced mobile solutions. Reach him at tverani@trilibis.com.
Share your thoughts. Click here