Ideas and Validation August 13, 2020

How do you know you're showing the best content/images? I have an idea about how to do it.

Rusty Conover @rustyconover

Hi,

How do you know you're showing the images that will inspire your visitors to click or sign up? Have you tested all of your images on your audience to see what they like? If not, you're leaving sales and customers on the table.

I hope you aren't kept up with questions like:

How do you know which color of a product to use your search results page when it comes in five different colors?

Have you ever tried A/B tests but realized its complex to continually monitor them and implement their suggestions?

Have you thought about what happens when your audience's preferences change and the images/content that were the best aren't anymore?

My idea is a software-as-a-service to figure all of this out for you and handle all of these challenges.

I can see you using it on for landing pages, blogs along with of course e-commerce stores. I even have a way to use it at Shopify if you use them.

It is essential to keep things as simple as possible. I'd only need you to make two changes to your HTML:

  1. Change the src attribute of your HTML <img> tag to include a list of the possible image URLs.
  2. Add a ping attribute to your <a> tag.

With those two changes, you're up and running and my service will show the best image to your visitor and continually learn which image works best.

If this sounds interesting, I'd love to receive your feedback about:

https://docs.preferred.pictures/

Many thanks,

  1. 2

    Have you considered implementing it as JS lib in place of hard HTML?
    That would also enable you for future versions with a backend and UI for nocode people/less techi people...
    Like I'd be worried of a hard dependency on your site for reliability, speed...
    The way a JS can solve it would be a doc rewrite and if your servers are slow/buggy I'd just stay with my original image...

    1. 1

      Hi @hatkyinc,

      First, I'm grateful you spent the time to read and think about my idea.

      I've thought about your suggestion of using JS to change the page. The problem with JavaScript changing the images after the page load is that the visitor may see a replacement between multiple differing images. The original image in the HTML would be shown, then once the JavaScript executes that image may be replaced and cause confusion.

      Your concern about speed and reliability are completely valid. I've architected the solution as best as I could on top of Cloudflare workers. The average response time for me is ~30ms. So I think it is pretty quick and shouldn't impact page load times. As I'm not running the servers, Cloudflare is, I'm not really able to do anything if they have an outage. I take comfort in that Cloudflare is so important to the rest of the Internet, I think I'm in good hands.

      If you want to see an example of where the service is running now to evaluate its speed check out:

      https://preferred-pictures-demo.myshopify.com/collections/all?page=1

      Thank you again for checking this out and sharing your ideas!

      Rusty

      1. 2

        It's not important what kind of servers you are using. The purpose of your tool is to improve something, which makes it non-essential. It just does not make sense to rely on a non-essential tool so much until any outage will crash the whole shop.

        I agree with @hatkyinc that JS solution will be more suitable.

        BTW, when people give you feedback - ask them, don't sell to them.

        1. 1

          @ugn, I'm trying to follow your thinking. Maybe you could help me understand, if something is non-essential, you seem to think it doesn't make sense to rely on it?

          If I took that reasoning I'd still be serving images from my own web server rather than a CDN. I'd never use the Cloud because I could put servers in my basement. I'd do all of this because I'm struck by worry about what would I do if the Cloud provider goes down?

          I don't see myself jumping on that bandwagon. I think Cloud services have built out track-records of reliability. Cloudflare's SLA for Workers is 100%.

          https://www.cloudflare.com/plans/#compare-features

          Since your preference is for a JavaScript execution how would you overcome this challenge:

          If JavaScript is running on a webpage it has either blocked the page from rendering (a <script> tag without async or defer set) or it is running after the page has been parsed and something may already be displayed to the visitor. A page's load time is critically important to e-commerce conversion rates. Blocking the page loading and rendering just isn't something anyone is going to want to do. Changing images after they have been displayed may cause disorientation if they are change while the user is interacting with the page.

          Where is the opportunity for the browser to run the JavaScript that both of you are referring to? I don't think it is possible with my understanding of how web page rendering is done in most browsers. I'm happy to learn more from you.

          Many Thanks.

          1. 1

            You're saying that you want to understand me yet I see a lot of polemics. Do you want to win this argument or do you want to get a feedback that will help you to sell your service?

            1. https://en.m.wikipedia.org/wiki/Lazy_loading
            2. https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content
            1. 1

              I'm trying to determine if your feedback is strongly-founded technically. The topics of those links don't seem to apply to the question of:

              How do lazy loading and preloading content offer the browser the opportunity execute JavaScript without interrupting the page render or having execution after images have been displayed? My understanding of them doesn't include a way that they do, maybe you understand them differently?

              I'm only trying to facilitate a technically sound conversation.

      2. 1

        Consider answering objections such as this in the sales copy.

        I don't think you see the potential
        And if as you said your talking about 30ms, would the user notice?
        You could also offer this as a rewrite in my own domain so you don't have to have your own storage and bandwidth charges for the images themselves..
        Can also do stuff like preload images or puts the JS before page load (not that I'd recommend the latter)

  2. 1

    Two things came to my mind. Sounds like you want to be a CDN that services the images as fast as possible in order to do the analytics. That comes along with a CMS. Happy to be wrong.

    The other thing is that I do not understand how you qualify one image is better than the other in any given context. Usually you can only guess by A/B testing. So your CDN would draw images from a set of images the client e.g. blog owner provides and over time and many requests later you may get the opportunity to learn about click through rates, qualified leads and how long users stay on the page.

    1. 2

      Hi @xh3b4sd,

      This service does not want to be a CDN, the service will just return a 302 HTTP redirect to the images that you're hosting on your CDN. It would just like to have a list of the possible URLs that you want to choose from and it picks one of those.

      How images are qualified to be better than one another is by tracking clicks/actions. Every link for an image has a ping HTML attribute added to it, my service tracks the number of times each image is displayed and the number of times it has been clicked on. The user is never directed through my service as the ping attribute sends a background request to report the user's click.

      The ping attribute can be attached to different actions if you'd rather optimize for lead capture or add to cart or any other action. Learn more about the ping attribute here:

      https://html.spec.whatwg.org/multipage/links.html#ping

      or:

      https://caniuse.com/#feat=ping

      The next time a new visitor arrives and requests the image URL the probabilities may have changed by that first user clicking or not. This way the system learns over time and optimizes which image to show.

      Do you think how long users stay on a page is useful to learn from?

      Thanks for thinking about this.

      1. 1

        Watch or read time is totally important. Imagine you watch a video or read an article. Do you watch till the end? Do you read the whole article? Was the image actually just clickbait and the video total garbage? Though I understand that your tracking happens "at the door" and not "in the showroom".

Recommended Posts