I've been working with Adobe Illustrator for about 6 months, trying to learn to create interesting designs and graphics, but now I'm starting to create an online portfolio and I find when I save a file "for the Web" it looks pixelated and blurry around the edges. I've tried saving at 100% quality in both .png and .jpg format and I've had very little success with it. I was wondering if someone could help me with this issue.

post a link to an example and a link to the ai file too so we can see

Can I ask what are the dimensions of the image you save for web?

Also a link would help a lot

Youmay need to adjust the transparency settings on your images if you have used
drop shadows or are saving onto a transparent background, if file size is not
an issue save them as .png 24 files and that should solve the issue. A white hazy
pixilated border is common using transparency features on gifs so you may have
this issue. Hope this helps your design issue.

 

Had a similar problem recently (ish). I brought the image into Photoshop and saved as a png 24 just as DigitalYak has said. The quality is obviously very good but the file size is large. Bit of an unusual method, but I found a technique where you can reduce the posterisation and the image can drop quite considerably. There are some online compressors such as http://www.punypng.com/ that can help reduce the image further. They can work at getting your filesize down but you'll have a lack of control of the actual process of optimising.

 

If you've got the patience and want the best results, you'll have to fine tweak the image yourself through trial and error. The online compression sites are a fast track to lower sizes but you might end up getting those same blurry and pixelated edges.

In Illustrator when you select "save for web" - in the "Image Size" panel make sure you have Type Optimized option chosen. Also try ImageOptim for image compression, its a free download tool with simple drag & drop interface.

 

Hope this sorts it

Just downloaded ImageOptim and will have a looksy. If there is some degree of control, then I might use it.

In Illustrator when you select "save for web" - in the "Image Size" panel make sure you have Type Optimized option chosen. Also try ImageOptim for image compression, its a free download tool with simple drag & drop interface.

 

Hope this sorts it

 

Siege84 - Just to add, choose "Type Optimized" if working in Illustrator CS6, if in CS3 make sure you tick the "Anti-Alias" checkbox

 

4li4s - let us know how you get on. Ultimately the quality of the image is down to the save for web settings you specify in Photoshop or Illustrator. All ImageOptim does is takes those saved images and shrinks their file size without affecting the image quality.