We need webp NOW

[Runar]

8 hours ago, sobrenome said:

And now we have AVIF!

https://blog.cloudflare.com/generate-avif-images-with-image-resizing/

Interesting, that article gave me the impression that WebP is not the wonder child of image formats I thought it was.

[Makoto]

WebP is amazing for lossless image compression (or rather, maybe you could say PNG is just really bad), but for lossy compression it's a bit iffy. It can sometimes beat out jpeg while preserving the same quality level but it's a hit or miss in my experience.

Edited October 6, 2020 by Makoto

[Everade]

On 10/3/2020 at 5:00 PM, Makoto said:

My stance is if you want WebP support, just use a good CDN service like CloudFlare.

It's a much more sensible solution. CloudFlare converts images to WebP, optionally performing only lossless or lossy compression, ensures WebP images are only served to clients that support it, and requires absolutely no additional processing power or storage on your end.

The same can be done with other reputable CDN services I believe.

If you are bare metal and absolutely don't want to use Cloudflare or so on, there is also mod_pagespeed as mentioned above.

It doesn't work flawlessly for all image types in every situation. There are lots of cases where it simply doesn't work.
Been actively using it since quite a while and it doesn't solve the main issue, which is that invision doesn't allow upload of specific image types as an actual image.

It also doesn't allow us to optimize the compression, not globaly nor per image.

First step should always be to fix the actual problem, and not look for the quickest workaround.
AV1 (AVIF) is just another great format that's not supported by invision, however it's a younger format.
Originaly a video coding format with its final image specifications just finalized back in february 2019 if i'm not mistaken.

Please note that webp is out there in the wild since >10 years by now.
And there are people out there who're itching for invision's implementation since several years.

[Makoto]

3 minutes ago, Everade said:

It doesn't work flawlessly for all image types in every situation. There are lots of cases where it simply doesn't work

Such as? Can you link me some examples?

CloudFlare won't convert images to WebP if the filesize would be larger or there would otherwise be no benefit gained. You can check the reason an image hasn't been "polished" or converted by reading the headers CloudFlare sends with the request.

I've never seen any issues using it myself. What do you mean by "optimize the compression" as well? You can configure the quality level for lossy compression, but otherwise there's nothing you can or need to really "optimize".

My stance remains that CDN's are still a significantly better solution. No increased storage or processing requirements on your end, you take advantage of faster CDN networks when serving images, and these services take care of ensuring users are always served the correct supported file format.

There's really not much of a good reason to not be using services like this in 2020.

Edited November 18, 2020 by Makoto

[Everade]

Cloudflare isn't capable of xxx to webp conversion in a dynamic website environment.  For example javascript.
Accessing the image directly might work, but Cloudflare has lots of issues when it comes to dynamic content.
This has nothing to do with the fact that not all images are optimized, but because Cloudflare isn't capable of handling certain cases.

CDN is always a great addition to automation and optimizations.
But it doesn't allow for much flexibility.

And how exactly do you think i'm saving processing power or storage, when i'm uploading a 10mb png vs a 5mb webp?
What has any of this to do with processing power?
webp is widely supported so double uploads are not really required. I'm not wasting space, i'm saving space with webp support.

Is Cloudflare flexible enough to optimize the webp compression per image? No.
Does it allow us to upload webp to invision? No 😉

I'm pretty certain that i'm at the InvisionCommunity here, and not at Cloudflare.
So please let it rest so we finally get the much needed webp support.

Thank you.

[Makoto]

2 minutes ago, Everade said:

Cloudflare isn't capable of xxx to webp conversion in a dynamic website environment.  For example javascript.
Accessing the image directly might work, but Cloudflare has lots of issues when it comes to dynamic content.
This has nothing to do with the fact that not all images are optimized, but because Cloudflare isn't capable of handling certain cases.

No, but where in IPS exactly are you utilizing this? This is a very rare scenario, and there's nothing in IPS that produces dynamic images like this, so you must be using a third-party application for this, right? Which means it would be more the responsibility of the third-party application developer to implement WebP support anyways.

3 minutes ago, Everade said:

And how exactly do you think i'm saving processing power or storage, when i'm uploading a 10mb png vs a 5mb webp?

You would have to store both the 10mb PNG and the 5mb webp file, so you're increasing your image storage consumption by 50% or more in this case, give or take depending how well your images are optimized on average. WebP is not supported on most Safari versions still. It has only recently gotten support. Many iOS users and so on still lack proper WebP support. You can't just not store/serve original PNG's/JPEG's. It's also still required to store original images when using the gallery application and so on, as Windows and so on have no native support for displaying WebP images. Users need to be able to download the original files for offline storage.

6 minutes ago, Everade said:

Is Cloudflare flexible enough to optimize the webp compression per image? No.

Yes? That's exactly what Cloudflare does, it intelligently compresses images, better than IPS probably could. This is literally what they do. Optimization is their entire schtick.

I'm aware this is IPS and not CloudFlare, but I'm merely offering a pragmatic view here in that there's not really a benefit in integrating this into core applications when better solutions that most of the internet already take advantage of exist. The number of users that explicitly don't want to take advantage of these solutions is comparatively small, and thus implementing this is not going to be a high priority for IPS.

[Everade]

Might be rare case for you. For me it isn't. It really isn't.
Just because cloudflare is the perfect solution for your personal project doesn't mean that it fits everyone.
Is it great overall? Absolutely. But it's not perfect.

Cloudflare might be great at optimization, but it doesn't KNOW nor SEE how the image looks like.
As such i prefer personal compression for optimal results. A machine doesn't understand images nor art. At least not for now.
In my case, Cloudflare only catches those pieces i haven't optimized myself.
I can save more space with personal optimizations where i want, and i can have the best qualitiy where i want.
Cloudflare is an image optimization fallback for me, not a solution.
 

Safari isn't an up to date browser, it's heavily outdated just like IE. I don't support that.
You do, others do, great, why not. I don't.
For me: double upload is at no point ever required. I save lots of space with webp.

And i repeat:
Cloudflare has nothing to do with the fact that we cannot upload webp as images to invision, anywhere at all.
-> Cloudflare doesn't fix the problem discussed in this topic.

Yes Cloudflare is glorious, i love it and use it too.
But it does not fix the very core of this topic and as such, shouldn't be discussed here.
It's a great hint for people who don't know about it.

But again:
It doesn't fix the problem discussed in this topic.

I understand that you don't need webp image upload support.
But others might. At least i do.

me: Alright?
you: Alright

k, thx, bye.

[Makoto]

13 hours ago, Everade said:

Safari isn't an up to date browser, it's heavily outdated just like IE. I don't support that.
You do, others do, great, why not. I don't.
For me: double upload is at no point ever required. I save lots of space with webp.

That's great for you, but to quote your own words, what works for you doesn't necessarily work for others. It doesn't matter what works for you. If this ever got an official implementation, this is the way it would work without any debate. Period.

13 hours ago, Everade said:

Cloudflare might be great at optimization, but it doesn't KNOW nor SEE how the image looks like.
As such i prefer personal compression for optimal results. A machine doesn't understand images nor art. At least not for now.
In my case, Cloudflare only catches those pieces i haven't optimized myself.
I can save more space with personal optimizations where i want, and i can have the best qualitiy where i want.
Cloudflare is an image optimization fallback for me, not a solution.

Sure, in that case just adding webp as a supported image format for manual upload would be all you need/want? Then you can manually compress and upload images however you want. That's fine. I support that.

13 hours ago, Everade said:

k, thx, bye.

You're welcome.

[Everade]

You never bothered to read the main thread, obviously.

I've never asked for png to webp conversion with double savings for backwards compatibility, but for webp upload possibility and being actualy recognized as an image.
What you're talking about is an entirely different story.

This was never supposed to be nor become a debate, you're just offtopic.
Learn to read, accept the future.

[Makoto]

5 hours ago, Everade said:

Learn to read, accept the future.

Never.

[PoC2]

Another vote for .webp image files to be shown inline in IPS.

I've started seeing this format crop up on web sites and both Safari and Chrome support it.

Thank you.

[AlexWebsites]

For anyone using mod_pagespeed, I ran into a small issue after updating to 4.5, which was not an issue for me in 4.4. Just sharing in case you run into this same scenario.

 

[Jordan Miller]

8 hours ago, AlexWebsites said:

For anyone using mod_pagespeed, I ran into a small issue after updating to 4.5, which was not an issue for me in 4.4. Just sharing in case you run into this same scenario.

 

Thanks for sharing that. 

I know there are a bunch of cache updates slated for our next release. Glad to see in that topic you posted above there was an answer 🙏 

[PoC2]

As I encountered today, ever more sites using this, but we can't on our forums. 😐

[Jimi Wikman]

May I ask what the business case is for using webp? How much time will it shave off your loading time and what benefit will it have on conversion?

I have seen many requests for webp in many systems and most are to get some adjustment to ratings in some system that measure loading times and best practices.

So, why do you want it, and why are your users asking for it?

[christopher-w]

29 minutes ago, Jimi Wikman said:

May I ask what the business case is for using webp? How much time will it shave off your loading time and what benefit will it have on conversion?

I have seen many requests for webp in many systems and most are to get some adjustment to ratings in some system that measure loading times and best practices.

So, why do you want it, and why are your users asking for it?

Good to hear someone talking about benefit rather than just features.

 

[Linux-Is-Best]

2 hours ago, Jimi Wikman said:

May I ask what the business case is for using webp? How much time will it shave off your loading time and what benefit will it have on conversion?

I have seen many requests for webp in many systems and most are to get some adjustment to ratings in some system that measure loading times and best practices.

So, why do you want it, and why are your users asking for it?

I cannot presume to speak for everyone, but it has been my personal experience whenever seeking out photos to share; all the website's I pull from as a casual user are already using WEBP. That is to say, my members, when posting images, are already frustrated that all the cool photos they wish to share seem to be incompatible with the site. To put that into context, imagine visiting a forum that was incompatible with JPEG. At this point, general web compliance and practiced user engagement should be enough to justify adaptation, in my opinion.

From a technical standing point, I recently updated a static website, which was heavily image-related. One of the last modification was converting my PNG's to WEBP. I noticed a full 4-second speed difference as a notable improvement. 

[Jimi Wikman]

1 hour ago, Linux-Is-Best said:

I cannot presume to speak for everyone, but it has been my personal experience whenever seeking out photos to share; all the website's I pull from as a casual user are already using WEBP. That is to say, my members, when posting images, are already frustrated that all the cool photos they wish to share seem to be incompatible with the site. To put that into context, imagine visiting a forum that was incompatible with JPEG. At this point, general web compliance and practiced user engagement should be enough to justify adaptation, in my opinion.

From a technical standing point, I recently updated a static website, which was heavily image-related. One of the last modification was converting my PNG's to WEBP. I noticed a full 4-second speed difference as a notable improvement. 

On your first point I would say that it is a bigger concern if you share images you do not own, especially in a community setting since there are numerous laws and suggested laws that want to make community owners responsible for the content. There are very simple ways around for your community however using the snippet tool for windows or the screen grab tool for mac.  I would say that encouraging copyright theft is a not valid point, but I see the case for why your community may be a bit lazy in sharing content they do not own 🙂

As for your second point you have way to many images on your site if your 20-30% size reduction from PNG bought you 4 seconds. Why did you choose png in the first place over say jpg or even vector files?

My start page have 15 large and NOT optimized images that makes up 60%+ of the page load at 1.6MB and my page load around 1.5seconds (with JS animations and other things slowing things down). Optimized I would probably be below 1 second using regular jpg files that would probably be around 500-700k in size. A reduction using webp would probably result in 0.1 second faster load time, which would barely be noticeable due to the structure of the dom rendering. If your target audience is low bandwidth users, then it might be a more important aspect with maybe 0.5 to 1 second faster loading time.

If you reduce loading times with 4 seconds, then the question is how slow the remaining time is because over 5 seconds your conversion rate drop exponentially and even at 3 seconds you will see big impact. I do not think a 30% reduction in images being loaded will have as much impact and I base that on 15 years of CRO experience in E-commerce where optimizing product images have far less impact than optimizing the experience and adhere to psychology such as gestalt laws and directional ques.

As a graphical designer I also do not see an increase in requests for webp images and as a technical project manager I don't even see many PIM systems that even have webp as a part of their roadmap.

[Joel R]

5 hours ago, Jimi Wikman said:

May I ask what the business case is for using webp? How much time will it shave off your loading time and what benefit will it have on conversion?

I have seen many requests for webp in many systems and most are to get some adjustment to ratings in some system that measure loading times and best practices.

So, why do you want it, and why are your users asking for it?

To me, the problem is not in delivering webp images.  It's in posting webp images.  

My users re-post webp images from around the web.  It works when they post to Facebook, to twitter, to tumblr, to their blog, but then it doesn't work when they post to my site. 

[Jimi Wikman]

2 hours ago, Linux-Is-Best said:

At this point, general web compliance and practiced user engagement should be enough to justify adaptation, in my opinion.

As far as I know there are no mention of webp for WCAG or any W3 standard for that matter? I know of no ISO standard either that mention webp, so may I ask what web compliance you are referring to? User engagement I do not see how the format of an image would be involved based on the discussion so far?

2 minutes ago, Joel R said:

To me, the problem is not in delivering webp images.  It's in posting webp images.  

My users re-post webp images from around the web.  It works when they post to Facebook, to twitter, to tumblr, to their blog, but then it doesn't work when they post to my site. 

Would you want them to be able to do so, knowing that they are not the copyright owners of those images? Especially considering the dark zone that is Fair Use these days....

[Linux-Is-Best]

2 hours ago, Jimi Wikman said:

On your first point I would say that it is a bigger concern if you share images you do not own, especially in a community setting since there are numerous laws and suggested laws that want to make community owners responsible for the content. There are very simple ways around for your community however using the snippet tool for windows or the screen grab tool for mac.  I would say that encouraging copyright theft is a not valid point, but I see the case for why your community may be a bit lazy in sharing content they do not own 🙂

As for your second point you have way to many images on your site if your 20-30% size reduction from PNG bought you 4 seconds. Why did you choose png in the first place over say jpg or even vector files?

My start page have 15 large and NOT optimized images that makes up 60%+ of the page load at 1.6MB and my page load around 1.5seconds (with JS animations and other things slowing things down). Optimized I would probably be below 1 second using regular jpg files that would probably be around 500-700k in size. A reduction using webp would probably result in 0.1 second faster load time, which would barely be noticeable due to the structure of the dom rendering. If your target audience is low bandwidth users, then it might be a more important aspect with maybe 0.5 to 1 second faster loading time.

If you reduce loading times with 4 seconds, then the question is how slow the remaining time is because over 5 seconds your conversion rate drop exponentially and even at 3 seconds you will see big impact. I do not think a 30% reduction in images being loaded will have as much impact and I base that on 15 years of CRO experience in E-commerce where optimizing product images have far less impact than optimizing the experience and adhere to psychology such as gestalt laws and directional ques.

As a graphical designer I also do not see an increase in requests for webp images and as a technical project manager I don't even see many PIM systems that even have webp as a part of their roadmap.

Respectfully, I would ask that you not presume anything. Using public domain or freely-licensed images is perfectly kosher. I assure you every photo or illustration I use is entirely legal.  

Having said that, realistically, in a large community forum virtually impossible to verify the legality of every individual photo submitted by every person, and that is why safe harbor laws exist.  While we speak of 'safe-harbor,' there is a nice thread that gently touches the subject matter here https://invisioncommunity.com/forums/topic/457695-protect-your-forum-with-dmca-safe-harbor/. I welcome you to participate if you feel you can contribute to the subject or perhaps think you have a better understanding of which everyone can benefit.

The static website I had previously mentioned (not my community) involves digital photography—a pastime of mine.  I would not say my website has too many photos per page, as I have an average of 2 or 3 per page (WordPress). However, I would reasonably argue that of higher quality in high definition images. I used PNG because when converting to JPEG (original RAW), I noticed some image degrading. So, for the time being, PNG became my preferred format when saving on a website. I later took the same images (RAW) and ported them to WEBP as I understood the compression (file size) could be improved. I had come to understand some web browsers rendered those images faster.  Of course, the result is my site did load (or render) the site quicker.

Thank you for taking the time to read about my experience.  And thank you for following up with your expressed opinion. It made for an interesting read. 🙂

Edited February 19, 2021 by Linux-Is-Best
autocorrect

[Linux-Is-Best]

2 hours ago, Jimi Wikman said:

As far as I know there are no mention of webp for WCAG or any W3 standard for that matter? I know of no ISO standard either that mention webp, so may I ask what web compliance you are referring to? User engagement I do not see how the format of an image would be involved based on the discussion so far?

 

2 hours ago, Joel R said:

To me, the problem is not in delivering webp images.  It's in posting webp images.  

My users re-post webp images from around the web.  It works when they post to Facebook, to twitter, to tumblr, to their blog, but then it doesn't work when they post to my site.

I believe the good gentlemen (or madam), Joel R, did a fine job addressing the general adaptation and common acceptance we see unfolding. True, there is no official certification and notarized documentation establishing this fairly transparent commonality of our reality. And you are, of course, wholly welcome to ignore the world around you and remain in your certified and quantified notarized 'bubble,' but I would advise against it, as a matter of opinion. 

Thank you once again for your time and consideration. 🙂

[opentype]

54 minutes ago, Linux-Is-Best said:

So, for the time being, PNG became my preferred format when saving on a website. I later took the same images (RAW) and ported them to WEBP as I understood the compression (file size) could be improved. I had come to understand some web browsers rendered those images faster. 

PNG works fine on the web for a limited number of use cases like logos and other graphics. It was always bad for regular web content like pictures with a lot of information in them. Either huge files (PNG24) or very lossy (PNG8)—especially when processed through the regular web image libraries, which don’t do much optimization. So yeah, going from PNG to WebP will make a huge difference — but only in this very specific scenario of yours. 

One problem with WebP is that a cross-browser support only came very recently with Apple’s Big Sur OS. Before that and without a fallback solution in place, a WebP image would not render at all on millions of Apple devices (or very old Windows machines) and that continues to be the case for some time, since of course not everyone uses the latest operating system.
When you weigh the pros (slightly smaller with slightly better image quality) and cons (might not show at all), the situation is only shifting slowly to the pro side. 

I agree with Joel by the way: the most important fix would be to allow WebP uploads—even if the delivery remains in a legacy format. 

Edited February 19, 2021 by opentype

[Jimi Wikman]

14 hours ago, Linux-Is-Best said:

Respectfully, I would ask that you not presume anything. Using public domain or freely-licensed images is perfectly kosher. I assure you every photo or illustration I use is entirely legal.  

Of course. I apologize if I made presumptions that was incorrect. I mistook the "my members" as people that you did not control, hence my comment.

I have not found many graphic services that provide webp only that are legal. In fact, I have never found any at all 🙂 Might be a side note, but if you know of any service that only provide webp, could you give me a link? I am always looking for new sources of graphics and I would like to discuss the business model with such a site owner.

 

Quote

Having said that, realistically, in a large community forum virtually impossible to verify the legality of every individual photo submitted by every person, and that is why safe harbor laws exist. 

I would not bet on any law that are designed to protect communities from copyright claims. Safe Harbor also works very different in different countries, and it differs between content types. In Europe there are numerous laws that are either already in place that hold you accountable as a website owner and there are many, many laws that are on the rise. This is why you hear people screaming when content get flagged over at Twitter, Facebook and YouTube as they try to add AI support to scan every single item that is being uploaded because laws are being designed to hold them accountable.

I assume this is one of the reasons IPS have added the ability to add images from known free graphic sources to reduce the problem of users stealing content and uploading it on peoples communities. You are also required by law in many countries to prove that you have done everything you can to prevent copyright theft, or you will be liable based on being negligent and reckless.

 

Quote

I believe the good gentlemen (or madam), Joel R, did a fine job addressing the general adaptation and common acceptance we see unfolding. True, there is no official certification and notarized documentation establishing this fairly transparent commonality of our reality. And you are, of course, wholly welcome to ignore the world around you and remain in your certified and quantified notarized 'bubble,' but I would advise against it, as a matter of opinion. 

As someone who have been working with web design since 1996 I can tell you that the apparent rise of a new graphic format is nothing new. Web technologies comes and goes, but unless it becomes a defacto standard it will always just be something fun to tinker with. Webp has been around since 2010 and there is a reason why it is not a standard yet, not even after more than 10 years. There is a reason why it is not supported by several industry standard tools and there is a reason why conversion based websites do not use them. There is also a reason why most, if not all free graphic resources do not offer webp as an alternative, or include as a secondary option only.

Google is also notorious for making up new things and then put it to sleep. Just look at AMP that flopped as soon as people realized the SEO and CRO cost or any of the dozens of projects that has been cancelled by Google over the years.

If you want to use webp on your website, then go for it. Options are almost always good (I guess some of you remember the gif injection issue back in the day as an exception for example). Personally I would wait until webp was a supported industry standard with 100% support in all web browsers before I put it into a commercial system. That is just me though, because I have other things than spending time supporting people complaining that their users can't see images on their site.

 

Quote

However, I would reasonably argue that of higher quality in high definition images. I used PNG because when converting to JPEG (original RAW), I noticed some image degrading. So, for the time being, PNG became my preferred format when saving on a website.

Auch. I see the issue then 🙂 Still, if you shaved off 4 seconds in 2-3 images, then the size of those images are huge, or you did not use thumbnails and just shrunk the images to display them? Either way, webp is much better than png, but you should use jpg for photos. It is probably a setting in your export or some adjustment you do for the images that cause the degradation. Are you using LightRoom or something like that for the export? Maybe we can find a way to reduce the file size even more, regardless of the format you choose. Probably good to take that as a separate topic though 🙂

[Joel R]

1. Webp is not a niche image format anymore. Full stop.  While I could understand that argument in 2015,  webp is now almost universally supported by all browsers: 

https://caniuse.com/?search=webp

2. The grand irony - or perverse absurdity - is that my own website delivers images as webp via my Cloudflare.  I literally have users who have downloaded my site's images, but can't upload them back to my site! That comes across as distinctly discrepant.