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?
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:
*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.
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.
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?
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... ;-(
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!
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.
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!
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.