OK..now, I am stuck

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:



Here is my public share link: LINK
(how to access public share link)

Hey Keith,

I think you may need to disable responsive images to get the quality as intended. Double click on the image then press CMD + SHIFT + O (mac ) or CTRL + SHIFT + O (windows) and untick Responsive Image

Here is an article on the same;

1 Like

Thanks! Somehow, I missed that article or forgot about it! It seems like the best thing for me to do is to try and save out all my images again uncompressed and let Webflow handle the compression and see what happens.

Thanks for the link!

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.