I just exported a version of the image as a compressed jpg using PS legacy "export for web". I set it to "High" at 60%. The image looks decent when viewed just dropped into a browser, but when placed inside Webflow, it gets way compressed and looks like crap!
I've been working on one site and decided to make some changes to my other site. I noticed that some of my images looked really compressed. I tried an experiment of saving my images out of PS without any compression and then putting them into WEBFLOW. In the "designer view", everything looks decent, but when I view the published view, all the images look crazy compressed. All the shadows or gradients have bad banding and look awful.
To help try to get an a solution, I set up a test site. On this page, I upload the same image 4 times. The first image is an uncompressed png, then an uncompressed jpg. Then I uploaded the same image as a compressed png and a compressed jpg, using TinyPng for the compression. As you can see, all four images look decent in the "designer view" but once they are viewed after being published, they look pretty crappy and compressed.
I am not sure why this is happening. I am hoping someone here can help me find a solution. Here is the link to the image test site: