Website graphics slightly blurred in Internet Explorer

[Dilaco]

I normally use Xara (Designer Pro X) as a graphics program but I am now using it to create a website . I noticed that when I preview the graphics I have created it looks fine, but if I preview it with Internet Explorer it appears slightly, yet noticeably, blurred.

All the graphics have been produced with Xara. I have tried converting some of the more detailed graphic to bitmap first, and I have also tried just leaving it as graphics object, and the result is the same. The only thing that doesn't appear blurred is text - that is, text that has not been converted to an editable shape.

Can someone explain why this might be, and how to rectify?

[steve.ledger]

Well, you have told us nothing about your Operating System version or the version of Internet Explorer you have installed.

Things to look for include:

Is 'Clear Type' installed and correctly configured?
Is IE* set to view your site at 100% or slightly larger?
Is your Windows scaling set to anything other than default 96dpi (100%)

Does it look the same in other browsers?
Have you published the site so that we can see for ourselves in our browsers?

[Big Frank]

...

[Dilaco]

Thank you Sledger for response
I did a check on your list of things to look out for: Clear Type is on (though I believe this mainly effects text? - which is okay); If the ‘default 96dpi Windows scaling’ is reference to the setting when Xara converts a graphic to a bitmap, then yes I keep to default. I’m using Windows Vista 32bit SP2; IE is version 9. I did however find out that I had zoom on about 120 in IE which must have exaggerated the blur and would explain why it looked worse than in the initial preview and in Firefox.
The blur is only slight but is a disappointing downgrade from what I’m used to seeing in Xara as vector images. But I am thinking now that this must be the norm, as no one has jumped up and said, “This happens to me too and is because of such and such...”
If I understand correctly, graphics are automatically turned into PNG files when the web pages are published. I have been converting them myself anyway to save on space/CPU. Perhaps someone could advise which are the best settings for web pages converting to bitmap? Should I choose a higher DPI, or should I stick to the default 96 DPI (as I have done)? Should I choose “Maintain screen anti-aliasing” or should I go with the default “Minimise visible anti-aliasing”?
When I get the website into some coherent shape I will post for viewing (if that doesn’t break forum rules?).

[gwpriester]

If you are creating for a high resolution tablet or phone, then you want your images to be 192dpi. Xara then outputs a pair of images, one for Retina quality display, and one for 96dpi display.

For photos, you can optimize them before publishing as JPEG and at either resolution. But for images to export at Retina display, you need to make sure this option is checked in the Website Properties > Website section.

[steve.ledger]

It appears that the OP is not using a version of Designer Pro which produces versions of images for Retina displays, Gary.

[gwpriester]

Never mind then. Optimize photos as JPEG, 96dpi, 85 compression.

[Big Frank]

Why don't you just attach a couple of screenshots of the site in the Xara browser and the site in IE where, you say, the images are slightly blurred. It might help.

[gwpriester]

Or a link to a page or pages?

[steve.ledger]

.... 85 compression.

Not picking on you, just to make it clear for newcomers to the world of image IQ and compression. 85% represents the image quality (IQ) which means 15% compression has been applied.