Skip to Main Content

Q&A: Image (Management) Is Everything on Today's Web

Posted on 8.15.2016

Consumers have a certain level of expectation around how they experience websites today.

Not only do they want it be relevant and useful, they also want it to be visually appealing/attractive. As a result, many Web professionals focus on the messaging, and a big part of how brands express themselves relies on the quality of images. Text certainly has its place, of course, but there is something to be said about the importance of visual assets.

Often, however, images are not used in a way that improves and adds value to the user experience. Website Magazine spoke with Akamai Senior Product Marketing Manager Anthony Larkin about the role creative assets have on the digital experience, why it is so challenge to create and manage these assets, and if there is anything that Web professionals can do on their end to improve the image-based experience on their own digital properties.


 SUBSCRIBE to Website Magazine & Accelerate 'Net Success


Website Magazine (WM): What role do creative assets like images have on the digital experience of consumers today?

Anthony Larkin (AL): The old adage “a picture is worth a thousand words” is not just for photographs and paintings. It holds true for web experiences as well.

High quality imagery is extremely effective in engaging users online. Businesses are increasingly leveraging image content to create richer, more engaging, and visually immersive web experiences to attract their audience, connect with them longer, and increase the chances that they’ll consume more content or make a purchase.

The text to image evolution on the web is apparent across social media (note the progression of twitter > facebook > instagram > snapchat), e-commerce, and even publishers. 63% of shoppers on mobile and tablet devices say that product images ranks first in importance over any other content on the page (source: Nielsen). But it’s not just true for shopping, articles with relevant images will get 94% more total views than those without (source: Skyword).

The use of high quality images to attract and engage with online audiences drives real business results. Organizations are striving for ultimate quality but they don’t want to sacrifice page load times or time to market as a result. Image content makes up about 62% if a web page’s overall weight and the average web page exceeded 2MB in size in 2015 (source: Soasta). The heavier a page the more difficult it will be to transmit all of the data necessary to the requesting device, especially over high latency mobile connections. Slow load times leads to abandonment and can have a negative impact on brand perception and your business results. Quality matters but so does performance.

WM: Why has it been so challenging to not just create, but store, manage and send/receive these assets?

AL: There is a tug of war going on right now between IT and Marketing departments and they’re battling over the balance of high quality imagery vs. page load times. See, while web experiences continue to evolve to be more visual (and bloated), diversity has also increased in how web content is being consumed.

In the U.S. time spent browsing the internet from mobile devices has exceeded the time spent on traditional PC or laptop computers (source: kpcb). There are many factors to consider in order to deliver a consistent user experience across devices. Mobile, Tablets, PCs, TVs, have screens of different sizes and varying processing power, they connect over different network conditions (like high latency mobile networks for example), and are using a variety of software/browsers. This diversity introduces the need to create derivative images with attributes that are best suited for different circumstances considering a) size and format b) the resolution that is supported and c) the artistic layout and attributes. Having to create different images for these different situations can really slow time to market by introducing manual effort or cumbersome workflows if you’re automating part of the transformations.

Once you’ve created all of these derivative assets then you need infrastructure resources to store this large volume of images. Let’s say you’re producing images in 3 sizes, 4 formats, 3 resolutions, and 3 layouts you’ll arrive at 108 versions of the same image. Now if you have thousands of products or articles on your site, you can see how that might get out of hand fast, and continue to grow over time.

After you’ve figured out how to create all of the images you then need to solve the puzzle of how and when to deliver the right image to the right user at the right time. This can lead to custom development and added complexity to tell the browser when to pull which resource. Now, browser software has evolved to support capabilities like srcset and client hints to automate resource selection, and those practices will continue to be valid but they only address part of the challenge and still require that you have a library of derivative assets to pull from. Due to this complexity many organizations are serving the same large images to all devices and screen sizes or they’re addressing a part of the problem through some combination of manual effort, custom development, and/or a service provider introducing less than ideal workflows.

WM: Is there anything that Web professionals can do to better manage image assets on their own end?

AL: The first thing to do is develop a good understanding of your existing image creation, storage, and delivery workflow and identify any waste or inefficiencies in your current process that could possibly be automated.

Second it’s important to understand the variables you need to optimize for. Are you delivering the same size image to all devices and is there extra weight that could be removed by sending a smaller size? Are you taking advantage of software specific image formats like WebP for Chrome/Android or JPEG2000 for iOS/Safari devices? What about quality settings and resolution?

These practices can offer helpful byte savings which can in turn improve performance. If you are compressing images though it’s important to gauge whether you might be degrading the quality of the experience in the process.

WM: How is a solution provider like Akamai Technologies addressing the problem?

AL: Complexity has increased across the web delivery landscape specifically in the areas of how you connect to your audience, how you collaborate in your organization, and how you orchestrate your infrastructure. Not only is Akamai’s platform helping web experiences be fast reliable and secure, it also provides tools to reduce the complexity associated with the design, development and delivery of web experiences to help you gain operational efficiency, cost savings, and faster time to market. For images, Akamai helps improve end user experiences by automatically optimizing images for maximum visual quality and performance while reducing the cost and effort to transform images for faster time to market. With automated optimizations, easy to use tools and {OPEN} APIs you can cut your image prep time in half by dynamically manipulating the attributes of images in the cloud and address your website's’ weight problem. You’ll also eliminate the time to create and the cost to store derivative image assets, and intelligently deliver the best image to each and every end user, every time.

Leave Your Comment

Login to Comment

Become a Member

Not already a part of our community?
Sign up to participate in the discussion. It's free and quick.

Sign Up

 

Leave a comment
    Load more comments
    New code
  •    
      

    The Ultimate Guide to Personalization

    Kibo