Written by Roland Benedetti, Chief of Product & Marketing, eZ Systems

The year(s) of mobile

Ever since the end of 2008, when it was time for the next year’s predictions, we started hearing how the next year would be “the year of mobile.”

And now, six years later, mobile is so big that it has turned each year since the introduction of the iPhone into the year of mobile. In both 2013 and 2014, mobile has grown astronomically -- and 2015 it will surely keep the pace.

25% of Total Web Usage in 2014 vs. 14% in 2013 - KPCB, Internet Trends 2014

The importance of mobile is significant in terms of web traffic. It can make up as much as 38 percent of internet traffic, depending on the region. Some of our customers have seen up to 60 percent internet usage. But its even more significant when we look at the trend as a whole. Mobile usage continues to grow rapidly, from 11 percent in May 2013 to 19 percent in May 2014 in North America alone, according to a KPCB 2014 Internet Trends report.

It’s clear now that no digital or web project can avoid mobile in their development strategy.

It’s not a big surprise to see that when we speak with people who have new projects, mobile experience, and especially responsive web design, are among the main topics they want to discuss.

Note: When selecting a solution, customers and prospects often ask for “responsiveness” without really being sure what it is. If you don’t really know what responsive design is, you can Google it, but essentially, it is the idea that you can deliver the same content to mobile and PC users, while having the page adapt “responsively” to the size of the screen to maintain a solid interface for accessing content. Responsive pages will reorganize pages elements depending on the size of the screen (for instance, moving a three column table into a single column table).

Before even thinking about the look and feel, you should think about user experience. The solution doesn’t lie in responsive, adaptive, or progressive, but in good UX design.

One of the many things that the years of mobile has changed in our industry is the work of UX designers. They used to design sites and applications for one screen size: PC. Sites were used in a simple context, mostly a person sitting in front of a computer. Today, UX designers have to design for many screens and many more contexts. For example, sitting in front of a computer, on a mobile device, offline, online, with good connection, bad connection, etc.

At the bare minimum designers should consider a phone, tablet and PC for the screens of all applications and websites they design. We all speak about mobile, and often, digital managers look at making sure their solution is responsive. Unfortunately, after that, it is embarrassing to see how many website wireframes are made for PC first!

What has become clear is that one thing to do when trying to deliver good results on mobile devices is to invest not only in mobile, but in all screens, to make sure your UX and information architecture is consistent across all types of devices. We call this “multi-screen”.

This is even more important as we realize that “multi-screening” is what’s booming, and not purely mobile.

Users are jumping repeatedly from one screen to another on their user journey, most often thanks to email and social sharing.

25.85% of all emails are opened on mobile phones, and 10.16% are opened on tablets. - Knotice, Mobile Emails Open Report, 2012

Is responsive your only hope?

Now that you have done your UX research and design, the question becomes: how do I deliver and implement a new mobile-friendly UX? 

Responsive is the correct answer in most cases (As for example for the reasons discussed here). It is still what we would recommend at first, in the huge majority of cases. It’s also probably the cheapest and simplest. But it should be clear that it is not the only way to go. It should also be understood that responsive has quite a few drawbacks, starting with a complex way to deal with images.

Being adaptive on the server side thanks to a device detection system is one of the other options available. This approach was a popular one in the pre-iPhone world, when the mobile web was still in its early stages. The iPhone made PC and mobile phone screens so similar that responsive design solutions began to quickly take over. Still, relying on device detection on the server side to identify the user’s device and deliver content that is adapted for it is a real option to consider!

When to consider device detection? 

If you are “big enough” and really serious about the multi-screen experience, the device detection approach will provide you with more options and will give you greater control over what you can do on certain screens.

It can come with benefits such as:

  • Template optimization for different screen sizes without having to deal with the pain of squeezing all of them into one unique template.
  • Optimization of not only the HTML code, but also the assets related to it, starting with images and video -- a known weakness of responsive design.
  • Creation of substantially different layouts on different screens in a way that responsive could not provide.
  • Optimization of front-end performance by relying on high performance on the back-end.
  • and much more...

It is also important to note that with device detection, you will still be able to combine both elements of responsive design as explained in this excellent article by Luca Pasani. Using device detection might actually “simplify” things for the web developer, as developing and editing HTML code for responsive design can be a burden.

I mentioned device detection was if you are “big enough” as this adds to your infrastructure. But “big enough” does not necessarily mean being a giant company like Google, American Express or Apple. Device detection technology has really been simplified over the last few years and today has a significantly lower cost of entry.

What about the eZ way?

Well, there is no eZ way -- or let’s say there are many!

The different approaches described above are all valid. eZ, as a platform provider, always works to be agnostic. In this case, we want to make the two approaches possible and accessible to eZ Publish users. As long as we see value in the different routes for different use cases, we will work to make all solutions viable options. 

The eZ Publish Basic Demo site comes responsive by default, which can be used as an illustration of responsive design. Embracing responsive front-end frameworks, like Bootstrap (which we use), or Foundation, which some of our partners are basing their work on, are each ways to go responsive. It’s a very common approach to mobile-friendly template development on eZ.

Opting for device detection is also possible thanks to the many possibilities of the eZ template system. It’s simple to develop and maintain and is easier than using other CMSs which are not multi-channel and do not properly separate content from presentation.

But if you go this route, you will need additional components. For that we are collaborating with partners like ScientiaMobile, who is the company behind the WURFL open-source project, the most popular solution for device detection. Their products and solutions atop the WURFL database can be easily integrated into an eZ Publish website and can fit many different needs. It is available via the cloud or on premise and offers direct access to APIs or integrated modules in your webserver or caching system like Varnish.

In summary, we believe both ways are worth exploring, and even combined. We hope to provide a solid platform that will enable the use of those systems efficiently. We surely will keep working to make it easier to build all kinds of the multi-screen experiences!

Have you been involved in such a project? How do you build your multi-screen experiences? If you have other views or solutions, we would love to hear from you!

Cheers,

Roland

Load Comments
loading...