Illustrator image viewed at 100% is “tiny”

I’m a web developer and I love Photoshop but unfortunately I have some design mock-ups sent over to me in Illustrator. When I viewed the document at 100% the text isn’t even legible on my monitor. At 150% things looks like they could be an actual web page and everything is clear.

I’m thinking the designer used a screen resolution that really doesn’t convert well for web.

How can I view/change the document’s screen resolution to say, 72ppi from whatever it is now?

If you think I’m asking the wrong question then here is an alternate: How can I figure out what width (in pixels) the designer actually intended for design?

Answer

The good news is that “screen resolution” doesn’t really exist in an Illustrator document. Since most of what you see is vector data (text and graphics), you can scale the whole shebang to whatever looks right to you. The art could look tiny on your screen for various reasons, but I suspect there’s a huge art board with relatively tiny art on it. When you Ctrl-0 (Cmd-0) to fit on screen, if the artwork is still tiny then that’s the problem.

If you have Illustrator CS5, select the Art Board tool and change the size of the art board to fit the artwork, then at 100% it will fill the window. If you have CS4 or earlier, first make sure nothing in the Layers panel is locked (twirl down the layer triangle(s) and verify no objects are locked), then Ctrl/Cmd-A to select everything. Grab one corner handle and Shift-Alt/Option drag the artwork to scale it up to the size of the artboard.

I would take a modest bet that the designer wasn’t thinking with screen resolutions or pixel dimensions, just the relative sizes of the objects in the layout. As the web dev, you should make your own best judgment call on dimensions, based on the text in the mock-up and how 1 em for your <p> tag text compares to the designer’s mockup.

Since you’re the guy who knows the web, you should provide input in terms of recommending the best page width, font-size, etc. (As a designer, if I hand off a design to a web developer I expect and value that kind of feedback. As a web dev, that’s what I do with designs I’m handed by others. That includes saying things like, “Your header is too tall for the average screen dimensions of the people who visit your site.”)

Attribution
Source : Link , Question Author : David Murdoch , Answer Author : Alan Gilbertson

Leave a Comment