Why Do My Icons/Images Look Fuzzy On Mobile?


Our image compressor doesn't offer retina support at the moment, but we do have a couple of workarounds you could try:

  1. Re-size Before Uploading

    Before you upload the image in the Unbounce Builder, re-size the image to the specified dimensions in an image editor, such as PhotoShop or Pixlr, etc. instead of re-sizing it in the builder.

  2. Try .PNG Format

    Try converting any text, images or logos into PNG format. PNGs are great for logos and smaller sized files, and they also tend to retain their quality on the web.

  3. Double Pixel Density

    One of our intrepid community members came up with a high pixel density, low file size image solution that we've had success with:

    How To: Add High-Resolution Retina Images to your Landing Page (for use with retina screens such as iPhone, iPad…)

  4. Host the Image Outside of Unbounce

    Try uploading the full-size image to a web service (such as AWS), coping the image url, then writing some HTML in a custom HTML widget with a smaller size than the full resolution. This would allow you to increase the pixel density while manually controlling image dimensions.

    So for example:

    <img src="http://yourimagehost.com/yourimage.jpg" width="309px" height="476px" />


1 out of 1 found this helpful