Why web graphics can reduce readership

Can all that wonderful visual, value added work we do, chase viewers away? Lance Evans investigates.

Almost four years ago, Creative Bloq had two interesting articles (Web graphics can reduce readership, and Are graphic designers ruining the web?). They asked the question, if what we artists and designers do – creating art and design enhancements – may be reducing readership of our web pages, rather than enhancing it.

Also read: The 18 best image compression tools

At first blush it seems absurd. At second blush it might even be infuriating to some. Regardless, as you read more from the man who kicked this debate off, John Naughton, he makes a fine argument. Partly because he does so within some very narrow restrictions. For example, while he admits pages have gotten nicer looking, he complains that it is done at the cost of an average page going from 93.7kB to 679kB (circa 2011 data). And that pages loading that slowly turn away viewers.

My first reaction to this is, "Really, who didn't see this coming?" The demand for increased bandwidth has existed since before the internet even existed (who remembers dial-up and ever increasing baud modems?) This isn't even an internet thing. We have always wanted faster cars, more TV channels and… the list goes on.

But dude, it's 2016! (almost)

Indeed, as I write this it is almost 2016, and we have seen tremendous changes all around in the last four years. The internet in particular has gone through a few significant round of upheavals in that time. For example, many media giants have put more content online. Here in the US:

  • CBS News has created a 24 hour news channel just for web broadcast
  • Huffington Post has its HuffPost Live online channel
  • HBO has by-passed its cable partners with its HBO GO offering
  • YouTube has transitioned into "channels" and higher quality product
  • Netflix streaming has become the norm (their DVD service feels archaic)
  • Amazon Video Streaming with original content has emerged
  • Cable companies allow customers to view TV on their media devices

I could go on, but the bottom line is that the internet has become the go-to for most of our media needs. It's become our new TV set, whether that be on your computer, mobile device, or smart TV (built-in or via a box). And when we look at bandwidth needs, Netflix requires a minimum connection bandwidth of 0.5 Megabits per second, but recommends 1.5 mbps for mobile quality streams. Standard definition jumps to 3.0 mbps, and HD needs 5.0 mbps.

Obviously, these streams are only possible because of the ever-increasing bandwidth options being offered by our internet providers. For all of our justified complaints on cost, they have been working hard to increase the size of our pipes. At home and on the road.

Technology plays a significant role in web design

Given these increases, it really becomes hard to justify any of the arguments made for bringing static webpage size down, right? Well, mostly. Let's look at this from the other direction now, the webpage-centric one, and that of the designer.

Many of us aren't fully aware of what influences dictate our design work. Certainly our current and past aesthetic exposures can overtly influence our work. But like it or not, technology has always played a significant role in what we as creatives could produce. Go back to the Renaissance and artists had to even develop their own pigmented paints before sitting at the canvas.

Print designers were woefully hamstrung by the many limitations of the print medium. Constrained by size, bleeds, number of colors, lack of good four-color, etc. So much so that the artist Ad Reinhardt produced a series of black on black paintings whose subtleties notoriously defied reproduction. That, in fact, was his intent!

(It is one of the ironies of life that print reproduction quality has markedly improved, and the cost of such quality dropped, more or less in parallel with the rise of the internet and in turn its marginalizing of print production.)

When it comes to the web, our design efforts once faced almost absurd technological restrictions. So absurd that it boggled the minds of anyone coming from a print design background. "What do you mean I can't put a bleed image across the background?", "What do you mean my deign will look different for each browser and platform?". There was, for a time in the aughts, a great divide between those coming from print who were simply befuddled with web needs, and those younger designers coming into the workforce who had grown up with the web and adapted to its needs more naturally.

Thankfully, the most rigid creativity restrictions have all but faded away (or perhaps I am just more used to them now?). One way or another, we as designers are not only able to realize our creations, but in many cases we are able to do more than we had ever imagined. For many, today's biggest issues are staying current and up to date with things that we CAN do, not with what we can't.

The scrolling website: reinvented

Let me share with you one of my favorite examples of our newly available can-do options. It's the now standard single-page scrolling website design, which has an interesting history. If you remember the early days of the web, every website was a single scrolling page. Mostly, it was just all text, but small eight-colour indexed GIF images started showing up, and those pages began to load slowly.

Brilliant idea: Let's chop up the website into discreet web pages, for various topics. That way the viewer need only load the page they care to read, thus shortening load time. And once the load time was shortened, we could then start adding more imagery to each page.

Bandwidth increases mean fewer people think about load times

As our bandwidth has increased in the last few years, even on mobile devices, load times began to be something we thought less and less about. I can't recall the last time I felt the need to test load times with any but the most questionable pages. Part of this is also due to the fact that most professionals now have a more innate feeling for best practices. And because software like Adobe Muse and others run roughshod over us prodding us keeping things right.

Greater bandwidth has lead to the re-emergence of the single-page website design in its new media heavy incarnation. And along with it the great effects that are available in HTML5, like parallax shifts, and scroll-based animations.

Loading – playing – sputtering

So are page size concerns a thing of the past? Not completely. But in my mind, it has become a much more nuanced issue that now focuses on broader concerns like formatting for various device platforms, the extent of multimedia features in a design, and a destination device's capabilities.

For example, when designing a site, I will think in terms of the three targets of desktop, tablet and phone. And while I will be aware that a desktop can more easily download the added graphics of an animation, I will also be aware that once downloaded, the tablet is likely to have a much harder time playing those animations. The same thing is true for many effects, like parallax.

Arriving at a site that downloads fast enough, but gets hiccups when scrolling or playing, will certainly have the same bottom line effect of alienating readers/readers, as John Naughton had discussed. Something you want to avoid, no matter the actual causation.

As we move forward tablets and phones are getting more powerful. But still, with phones in particular always needing to keep an eye on battery usage, there may be CPU limitations for some time to come. And there are still plenty of people surfing with older iPads that are markedly slower. So when designing, we need to keep the needs and capabilities of three platforms, and some level of legacy gear in mind.

This means that even if you are building a responsive site, you must be aware of what elements that can reasonably be displayed in each format. If you are creating a site in a program like Adobe Muse, which I and many designers enjoy using, we need to be aware that each target platform has its own limitations. This underscores why Muse does not have a magic button to allow our Desktop design to automatically generate the Tablet and Phone versions, much do all users disappointment.

From a multimedia designer's point of view, a greater disappointment is the letdown I get when moving from having created a desktop site I am quite proud of, to having to recreate it for tablet and phone. Stripped of the unplayable media, the tablet/phone versions often just feel like a static Photoshop design dropped into the web.

But let's check back in another four years. This will all feel very dated, indeed.

Words: Lance Evans

Lance Evans is creative director of Graphlink Media.

Liked this? Read these!