We Need a Web That’s Device-Aware

January 9th, 2014 by

This article originally appeared on the Wired Insights blog at: http://insights.wired.com/profiles/blogs/we-need-a-web-that-s-device-aware
Ted Verani heads up sales and marketing here at Trilibis. He recently posted a thought-provoking article for Wired.com, in which he outlines the need for a device-aware Web. Head over to the Wired blog to post your thoughts and see comments from others.
We Need a Web That’s Device-Aware
The Web continues to mature as evolving technologies and devices shape its capabilities. From a Web 1.0 infant to a Web 2.0 toddler, websites offered interactivity to engage the viewer. With the arrival of device-aware websites, the Web has officially become a teenager, with a self-awareness that brings new levels of functionality.

Mobile Users Are Calling the Shots

It’s 2014 and I am happy to say that I no longer have to explain why companies need a mobile website. The billions of mobile devices now in the hands of consumers, ranging from top-of-the-line smartphones and tablets to low-end phones, have made a mobile website am essential component of any digital marketing strategy. Consequently, consideration of the user experience on these fast-evolving mobile devices has emerged as a major concern because these easily distracted mobile users are much less tolerant of a poor experience.

The Mobile Web’s Humble Beginnings

Until recently, for many companies, having a mobile website meant developing an “m-dot” experience that was distinctly separate from the desktop version of their website. Though this dedicated site approach can offer flexibility and control over the mobile experience, it also typically means the mobile site evolves at its own pace, often resulting in an inconsistent user experience and feature set across platforms. Additionally, the requirement to fork the code base as well as manage two websites (instead of just one) sends associated development and maintenance costs through the roof.

Digital marketers are often frustrated by multiple dedicated sites, since they now have to implement complex, cross-device URL mapping so that users shifting between different devices can get to the same content. Finally, having multiple sub-domains can also negatively impact search results as indexing becomes fragmented across the various URLs.

During the Mobile Web’s infancy this approach was adequate, but as mobile usage has taken off, many companies have started to re-examine these “segmented web” strategies. This has conveniently coincided with the explosive trend toward responsive Web design (often called responsive design, or RWD).

The Emergence of ‘One Web’

Responsive design is all about creating one website to fit all screen sizes, ranging from a giant desktop display to the smallest smartphone. Responsive sites are created from a single codebase by using proportion-based grids, flexible images, and CSS3 media queries. The device’s web browser, or “client,” uses media queries to determine the screen size and adapt the websites layout and rescale the content accordingly. For many, it is quite exciting to see a website seamlessly adapt its layout to the device at hand. The Web community at large has embraced responsive design as a scalable way to achieve a cross-device Web experience from a single code base. However, responsive design is not without its own challenges.
  1. 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 optimize for design consideration or differentiated use-cases, such as offering the customer a mobile-specific shopping experience. Thus, you end up making trade-offs in your design if going responsive.
  2. Performance: Responsive design forces the browser to handle the bulk of the processing work. The client is sent the entirety of website data, irrespective of local device capabilities, and must determine which layout and assets to present. The result is longer load times and Web pages that often perform poorly on mobile handsets — a major headache for media or e-commerce companies, who pay close attention to load times to retain the attention of the fickle mobile consumer.
  3. Development time: Responsive design typically requires a large-scale rebuild of a company’s Web presence. From UI/UX design to the final testing phase, there are many things that go into the development of a good responsive site and making sure the experience is optimized for a wide variety of devices. It usually takes longer to convert an existing website into a responsive site than to build one from the ground up.
Responsive design is a big step in the right direction and the number of responsive sites is growing daily. However, a truly exceptional One Web experience that also addresses the unique characteristics and limitations of mobile devices requires more than just simply shifting layout and styling to conform to a device’s screen width.

Websites Become Device-Aware

Recently, responsive design methods have been augmented with server-side approaches that optimize 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.

Drawing on years of developing mobile websites for our clients, the team here at Trilibis wondered how we might improve on the responsive design approach to deliver the best possible One Web experience. We talked to our clients and learned that they wanted flexibility and control. They also didn’t want to be locked into a proprietary site-building toolset, preferring instead to work directly with code. We explored the idea of enabling server-side controls and device targeting as a natural part of website development — essentially adding more intelligence to the server itself.

The result is SNOW (Software eNabling One Web) — a server-side software technology that enables delivery of optimized web content to targeted devices and browsers. With SNOW, you can create multiple web experiences with one code base under a single domain.

Here’s how it works:
  1. HTML5-compliant SNOW tags are added directly to the website HTML, CSS or UI template code. These tags specify if and how content or code blocks should be displayed on a given device, OS or browser by choosing from over 40 pre-defined device and browser groups or creating your own custom device grouping.
  2. SNOW software is installed on the Web server. This software plug-in includes over 4,000 device profiles, device taxonomy for grouping, and a high-speed content parsing engine.
  3. At runtime, SNOW detects the accessing device, scans the HTML/CSS code for device-awareness tags and post-processes it, generating only the optimized code and content appropriate for the device. This post-processing determines the layout, images, colors, and feature-set as defined by the developer for the target device group.
  4. The Web server then delivers only device-specific web assets and content for the specific device.
SNOW Advances Brands Toward a One Web Strategy

Marrying server-side technology with responsive design techniques allows the server to do the device-specific performance optimization that cannot be done using pure client-side responsive design techniques. The result is that much less data is sent to the device, resulting in fast load times (up to 2x faster), and a far better experience for the visitor. Adding server-side controls to a website’s architecture also provides more technical flexibility and the ability to fine-tune page presentation and features for the best possible cross-device Web experience.

While the Web is still a way from adulthood, companies now have the means to create exceptional Web experiences across the broad range of today’s connected devices. As development strategies continue to progress, my hope is we’ll see many more websites utilize server-side intelligence to backup their responsive design. Not just for the significant performance improvements to be had, but because this will advance our cross-device Web experiences to a more capable (and mature) Web.
Related Posts Plugin for WordPress, Blogger...

Comments Off

Comments are closed.