ID files exporting fuzzy and not at size designed

[lindsays62277560]

For many years I have designed things like digital ads in ID, exported as png or jpg and they have been crisp and at the size that I designed it out (example 300x250). With the latest updates I can no longer do that. The files are only sharp when I export at 300dpi but are much larger in size (around 1200xsomething).

Some of the solutions I have tried:

playing with dpi 72/96/300 - didn't result in sharp file after export at size

exporting from ID as a PDF and resizing in photoshop but is still blurry at size

exporting from ID at 300dpi and resize using websites/mailchimp etc just to see if that worked, still fuzzy

redesigned in photoshop, exported still fuzzy

redesigned in illustrated, exported to size and still fuzzy

used both mac and pc, no difference there

The only partial fix I've found is starting the design under "web" and exporting at 72dpi with "high" (exporting at max results in a fuzzy file).

I've asked several colleagues from different orgs and they are running into the same issue themselves (trying it out with their files, not mine!). Anyone else see this? Is there something you have to change in creating a document that sets it up better where it doesn't loose quality? WAs there something that use to be automatic that now we must do manually?

[Scott Citron]

Are you sure the fuzzy files are linked within InDesign? If the files are missing or no longer properly linked, this would explain why your images are appearing fuzzy.

[lindsays62277560]

Nope they are linked without any issues. The images are fine when it exports because the file is larger than it was designed at. But when you resize it to be the size designed at everything becomes blurry.

[rob day]

Is your Photoshop zoom percentage at 100% when you view the exported JPEG?

If you want to control an export's pixel dimensions, set your page dimensions and rulers to pixels and export at 72ppi, and then view the JPEG at 100% in PS.

So here's a 800x600 pixel InDesign page (left) exported at 72ppi to Photoshop (right)

[lindsays62277560]

Yes its at 100% but still blurry.

[rob day]

Can you share the JPEG?

[lindsays62277560]

Here is how the image comes out at 300x250 at 72dpi.

[rob day]

The text is going to get bitmapped to the resolution you choose, so what you are showing would be expected. Your headline caps are around 11 or 12 pixels in height and the logo text is down around 5.5px, which would never be legible as a bitmap viewed at 100% in PhotoShop or a browser.

When you design in InDesign find the Zoom scale that matches Photoshop's 1:1, so that you are not tempted to set the type too small.

[rob day]

InDesign no longer provides a zoom level that matches Photoshop’s 1:1 100% view. You can assign this JavaScript a key command to matchup the views.

var x = app.generalPreferences.mainMonitorPpi;
app.activeWindow.zoomPercentage=(72 / x) * 100;

[lindsays62277560]

this helped for viewing but the trouble is still the same at exporting.

[rob day · Accepted solution]

It is expected behavior when you convert vector objects into bitmaps. If I set matching type with Photoshop directly into your JPEG, the anti-aliasing is pretty much identical—you can't get around the low resolution 300x250 pixel canvas:

If you are designing a bitmap with text for an HTML page, you have to consider the wide range of display resolutions out there. A developer can use CSS media queries to call higher resolution versions of an image when the display is HD, but you have to provide two versions of the image. Try a search for HD Media Queries

[rob day]

Also, in case you are not aware InDesign uses a different zoom scale than Photoshop. In Photoshop the 100% view is 1:1 image to monitor resolution. With InDesign CS6 and later 100% is actual print size, so in almost all cases the InDesign 100% view is larger than Photoshop's:

InDesign CS6 resolution for pixel documents not the same