Over the last several years we have steadily been increasing the responsive capabilities of the websites we develop. More and more we find that our clients' audiences are shifting to mobile devices rather than their desktop or laptop computers. Audiences are interacting with websites and web applications with devices that do not have the processing power or internet connectivity that we have come to rely on for our browsing experience.
We have also seen a steady change to the wireless technology landscape. 3G, 4G, and now 5G wireless data have been trying to keep up with the demand for a more robust user experience on mobile devices. This is all well and good in areas of the world where those technologies are prevalent, but what about those areas where those high output data connections are limited or do not exist? Shouldn't those with limited access still have quick load times for the sites they want to visit?
One of the things that has bothered me about responsive designs is the desire to have all of the bells and whistles still available even though the data connection is limited. Clients and designers are always looking to us to somehow bring the full experience that they have on their fully connected laptop or desktop computer to the phone. The problem is trying to help them understand that the mobile environment has its limitations, and that it is better to provide a simplified version of their website or application that has all of the capabilities, even if it doesn't have all of the pretty.
A prime example of this would be banners and banner sliders with large photographic elements. On a full screen laptop or desktop these banners are slick, look cool, and can help sell your product or service. On a phone screen, that same set of photographs are now tiny or cropped to a point where the audience can barely see the element. How does the tiny image on the phone screen help to sell the product? Another example is the looping background video. Again, it looks fantastic on a large screen, even a tablet. Phone? Not so much.
The argument made by most marketing people is that they are not worried about those places that do not have amazing wifi or broadband data because "they aren't our audience". Yes, they may not be your audience, but when your audience is in those locations, for whatever reason, they are not able to access the material they want.
We're not talking about social media and streaming services here. We are talking about informational, product, and service websites and applications. The audience for these kinds of websites are looking for the information, product, or service that the website or application offers. On a phone with limited internet access, data transfer restrictions, or slow connection speeds, the information that a website provides should be suscinct and too the point. The audience doesn't want or need to wait for the fancy background video to load, or all of the banner images to appear. Those elements should likely be disabled so that they don't take up the limited resources that the audience has. On a phone browser we should get straight to the point.
When we do develop the design to account for these situations; having optimized image assets, small font and script libraries, and disabling many of the data heavy features like background videos, large banner images, and banner sliders; makes for a fast, efficient website or application that doesn't require all of the device's computing resources or eating up all of the user's data plan.
We know that we are not likely to make an impact on our client's requests to show everything, however, we also know that the audience is not going to wait around for the website to load if the bells and whistles are too heavy. They will move on. I guess the question to ask the client is "do you want that audience?" Obviously this question is rhetorical. Of course they want that audience, so how do we make sure that we hold on to that audience?
As web developers, it is our responsibility to help our clients balance the marketing with the practical. To be sure that we are giving the marketing a fair shake, we need to provide additional options for those small screens and limited data issues. When we are developing sites for our clients we make sure that we spell out the responsive issues that our clients need to consider and we help them through the process of coming up with options to still have that marketing punch without overloading the platform limitations.
For example, banner images. We look at options to provide optimized versions of the banner for small screens. We can do this either by automating the banner creation process where alternate sized banners are created by cropping or resizing the large initial version of the banner, or we offer to have multiple image uploads so that the administrator can choose specific images for the various responsive breakpoints. We've learned from experience that the automated process, while attractive for administrators, does not usually result in the best quality for the smaller screen. An automated process means the computer does the work, but it doesn't have an eye for context. A more manual approach works better since we humans can understand context far better than a computer can.
One of the more difficult things to do when trying to help our clients come up with responsible designs is to get them to allow the audience decide how they want to interact with the content. From a marketing perspective, we want to give our potential audience or customer all of the content all at once. This is rarely what the audience is after. Some content should definitely appear and be easily accessible. Any general copy information, product catalog elements, service information should be available as soon as they arrive on the page. Other elements should be more passive. Video, audio, photo galleries, and chat platforms should sit quietly and wait for the audience to engage with them.
As much as the marketing department wants to force an interaction to promote a sale or a conversion, the audience in a web environment should be allowed to decide whether or not they want to interact with the elements of the website or application. We've all dealt with pushy telemarketing over the phone. The vast majority of the time we either stop them in the middle of their script to tell them we're not interested, or we just hang up on them. It is the same with marketing on a website. If the marketing programming is too aggressive, the audience is just going to "nope" out and not come back.
To be responsible when developing the web environment those more aggressive marketing tactics should be very clearly thought through. Pop-up modals, bouncing/animated graphics, self-starting chat windows, and video autoplay are all examples of where we can find ways to be more responsible in our development. All of these elements are excruciating for the audience on their mobile devices. Pop-ups cover the content they are reading and force an interaction, whether to engage or to dismiss. Autoplaying videos (this is now only an opt-in option on most devices, so it is less of an issue) start slogging through the data-plan. Bouncing/animated graphics distract from why the audience is there in the first place. Self-starting chats are like a four-year-old at the public pool yelling "look at me! look at me!".
When developing a web presence, in whatever form it takes, the client, designer, and developer should always be considering if the functionality and design are working toward the best interests of the audience/customer and how they are interacting with that web presence. We endeavour to make the experience smooth, efficient, and friendly.