• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
2

My images look blurry when I export or publish my site from Muse. Why and how do I fix it?

Explorer ,
Apr 02, 2012 Apr 02, 2012

Copy link to clipboard

Copied

My images look blurry, jagged, pixelated and low quality when I publish or export my site from Muse. Is there any way to avoid or fix this problem?

Views

157.9K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Explorer , Apr 02, 2012 Apr 02, 2012

The primary cause of blurring images is the less than Photoshop-quality image downsampling algorithm currently used in Muse (that was compounded in early betas due to a bug in the JPEG compression library we were using at that time). Due to work we've done for Beta 7 to improve image encoding performance we now have the infrastructure in place to enable us to take a much better image resampler/resizer (after Beta 7), so this source of blurring will be addressed.

The other source of blurring is

...

Votes

Translate

Translate
Explorer ,
Apr 02, 2012 Apr 02, 2012

Copy link to clipboard

Copied

The primary cause of blurring images is the less than Photoshop-quality image downsampling algorithm currently used in Muse (that was compounded in early betas due to a bug in the JPEG compression library we were using at that time). Due to work we've done for Beta 7 to improve image encoding performance we now have the infrastructure in place to enable us to take a much better image resampler/resizer (after Beta 7), so this source of blurring will be addressed.

The other source of blurring is unique to opaque images containing line art or otherwise containing hard edges and large areas of solid color. When an image is opaque Muse will encode it as JPEG (if it's altered in Muse is a way that requires re-encoding). For line art this will introduce JPEG compression artifacts that can be noticeable depending on your eye and the specific image involved.

There are (at least) to ways to avoid these JPEG compression artifacts:

  1. Resize your image before placing and avoid applying any effects (rounded corners, drop shadow, etc.) or doing any cropping or resizing in Muse. If the image is unaltered your original JPEG, PNG or GIF will be passed through unaltered.*
  2. Put at least one pixel of transparency in your original image. (It could be a single 99% opaque pixel.) This will force Muse to encode as PNG. PNG compression is lossless and thus doesn't introduce any compression artifacts. However, an average PNG can be 5 times the size of a JPEG for the same image, so there is an impact to webpage download performance.

*For PSD files Muse has to encode the original PSD data into some web-friendly image format. If an image is resized in Photoshop and placed Muse won't resize/resample the image data, but it will encode it as JPEG or PNG depending on whether it contains transparency.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 21, 2012 Dec 21, 2012

Copy link to clipboard

Copied

THIS IS RIDICULOUS...

why can't you simply select the image and ask it to output as jpg, gif or png!

get with the program guys and please intruduce this feature!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 21, 2012 Dec 21, 2012

Copy link to clipboard

Copied

Is it really ridiculous? I think you didn't understand a word of the explanation above.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 21, 2012 Dec 21, 2012

Copy link to clipboard

Copied

yeah was just venting the old frustrations...do understand though, and applied the single pixel transparency and the PSD files sharpen up immediately. THX for the pointer!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Dec 21, 2012 Dec 21, 2012

Copy link to clipboard

Copied

For me, the most simple way to prevent a picture from getting downsampled is to choose in one egde a rounded corner of 1 Pixel. This isn't visible, but causes Muse to use losless PNG-Format instead of JPG, because rounded corners introduce transparency, which JPG doesn't support.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Dec 21, 2012 Dec 21, 2012

Copy link to clipboard

Copied

Sounds good I will try this. Very good idea. THX!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 06, 2013 Feb 06, 2013

Copy link to clipboard

Copied

sorry, but this is unbelievable for a program supposed to be a professional website-editor.

I have large line-art images in my site, and now have to include transparency to force Muse creating png and producing proper quality... should we laugh or cry?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 06, 2013 Feb 06, 2013

Copy link to clipboard

Copied

In a current project I notice that Muse creates/exports thes SAME jpg for dektop AND phone version. that is the reason, in this case, for the lousy quality of this (lineart) images. They only have 380 px widht even in dektop version!

In a test file with only 1 page and 1 image for each desktop and mobile, Muse created TWO files. since there is nothing to influence from my side this must be a bug.

another way to get the image quality needed, we can exchange the images in the folder of the webspace. this is ridicolous too, shure, but the a way to get 100% what you want...

unfortunately in this case it does not work since the 380 px images are neccesary and ok for the phone version... ;-(

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Feb 06, 2013 Feb 06, 2013

Copy link to clipboard

Copied

I understand your frustration. In many ways the controls in Muse are almost too simplistic. I know it's nice to have a simple and easy tool for website creation but the developers need to start giving the program some fire power!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 16, 2015 Oct 16, 2015

Copy link to clipboard

Copied

Given this answer was posted 6 months ago, when is the issue likely to be "addressed"?!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Oct 16, 2015 Oct 16, 2015

Copy link to clipboard

Copied

???

You did read the postings, didn't you?

‌

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 16, 2015 Oct 16, 2015

Copy link to clipboard

Copied

Question marks don't work on a sliding scale.  I totally missed the 2012...I'm a little stunned that it's actually been this long and a simple in-software resolution still isn't in place - weird. I'm still getting the same issue, trying ALL the fixes as suggested within CC and getting terrible results.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Oct 17, 2015 Oct 17, 2015

Copy link to clipboard

Copied

nolaninsingapore, I really have not the meanest idea, what you want to say …

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Oct 17, 2015 Oct 17, 2015

Copy link to clipboard

Copied

I'm not sure it could be much clearer.  I've resolved the issue.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Sep 20, 2022 Sep 20, 2022

Copy link to clipboard

Copied

I have been using Photoshop to make collages for my Instagram page. All of a sudden, the photos are clear and Photoshop, but when I export them to my camera roll they are fuzzy. This has not been happening before

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Sep 20, 2022 Sep 20, 2022

Copy link to clipboard

Copied

LATEST

@Amy26211286vqxl,

You've resurrected a very old topic from 2012 in the Adobe Muse community.  Muse is end of life web authoring software.

 

Please start a new topic in Photoshop. See below.

 

Photoshop Elements

https://community.adobe.com/t5/photoshop-elements/ct-p/ct-photoshop-elements

 

Photoshop Express

https://community.adobe.com/t5/photoshop-express/ct-p/ct-photoshop-express

 

Photoshop CC

https://community.adobe.com/t5/photoshop-ecosystem/ct-p/ct-photoshop

 

[Due to its advanced age, this discussion is locked.]

 

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 11, 2013 May 11, 2013

Copy link to clipboard

Copied

Can someone walk me through how to put this transparent pixel into a PSD button. In photoshop, I've got my two layers for my rollover button and then I save it and the quality is awful in Muse. So is this transparent pixel just an extra layer? Because when I add it as an extra layer an save it, then import the PSD button in muse, this layer isn't detected by the photoshop import/state options under the PSD button interface, and the quality is still awful. Any guidance would be much appreciated.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
May 13, 2013 May 13, 2013

Copy link to clipboard

Copied

Yes the blury PSD files in Muse is a very studip problem which requires the following action. Make sure your PSD file isn't flattened, this means the layer can't be called background in italics - this is the default setting, you will need to double click the layer and name it something else for this to change...and then ensure at least one pixel in your image is missing, this means you litterally have to delete the pixel revealing photoshop's background checker board pattern which indicates transparency (ensure this feature is turned on in your preferences, it is by default). It doesn't have to be one pixel it can be an entire row or even a column of pixels. The main thing to remember is that it must be "at least" one pixel in order for Muse to recognise the need to export as a PNG.

If you have multiple layers then I am pretty sure you just need to delete the same area in all of them thus revealing the checkers!

...any further questions please just ask!

Regards,

Glen

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 13, 2013 May 13, 2013

Copy link to clipboard

Copied

Legend! Thanks for the advice! Works a treat.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 09, 2014 Dec 09, 2014

Copy link to clipboard

Copied

will this help with my issue?

" I'm currently making a personal website/portfolio and its going to be fairly photo heavy. I'm currently having a few issues with getting high res photos imported. I have heard something about muse using different downsampling techniques to photoshop which can cause fuzzy images. currently I export photos as full res and screen optimised versions (PS down-sampled to 1080x1625) both of these and PSD files when imported to muse don't come out looking nearly as good as they should..? is there some other method i should use to import them or other file size/dimensions ? the poor quality issue is even worse when the image is used as a parallax scrolller? "

some of my photography uses multiple layers in PS but if its a  single layer or just adjustment layers can I use the same removal of a single pixel ? thanks for your help

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 26, 2015 Feb 26, 2015

Copy link to clipboard

Copied

Ok, did this and they still look terrible. Is there another way to get the images sharp. Am beginning to wish I had never bothered with Muse............  ...... .

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 17, 2013 May 17, 2013

Copy link to clipboard

Copied

What about HiDPi images for product like the Retina MacBook Pro? I want my webpage to look good on HiDPI screens too and not just a standard screen. Does anyone have any solutions?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jul 30, 2013 Jul 30, 2013

Copy link to clipboard

Copied

I've also started noticing problems when using the retina screen. All the websafe fonts look fantastic but the supporting images set automatically to 72ppi and look terrible next to the beautiful crisp type. Adobe need to get onto this asap. Screen technology is miles ahead of the automatic preferences of the software.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Aug 04, 2014 Aug 04, 2014

Copy link to clipboard

Copied

encountered this software glitch and found a manual fix:

1) create an additional file copy of the image that appears fuzzy

2) open muse and left-click on the image that appears fuzzy

2) click the blue arrow to open the options menu for the lightbox

3) selected show lightbox parts while editing

4) right click on the enlarged lightbox image

5) click 'replace image' and select the additional file copy

image will now appear normal when the lightbox opens in the preview

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines