Skip to main content
Participant
January 7, 2021
Answered

need some help exporting JPGs from Illustrator for web purposes

  • January 7, 2021
  • 1 reply
  • 742 views

Hi,

I made a website layout in the latest version of Illustrator. In the layout there is a banner at the top. I made an artboard that is the exact size as the banner (900x400px). Inside that banner I placed a masked JPG (I made sure that the JPG is high-quality and big enough for the size of the mask/banner). On top of that image I placed some vector graphics. In illustrator everything looks great. Now, I try to export that artboard as a JPG, and then when I check the exported image in PS, it looks really bad. It's an image of a pine tree branch. And in illustrator the pine needles are sharp and nice, but in the exported JPG they have jagged edges. I tried many different settings, 100%, 80%, 72dpi, 150dpi, everything... No matter what I try, the edges of the pine needles remain jagged. The vector graphics on top of the image look fine. It's just the image file underneath that looks bad. 

 

Can anyone provide any insight? Help is much appreciated!

This topic has been closed for replies.
Correct answer Doug A Roberts

Can you try again using Art Optimized anti-aliasing? Here's what I get performing those steps compared to your export on the right:

1 reply

Doug A Roberts
Community Expert
Community Expert
January 7, 2021

Please post the original image and the export that looks bad, as well as your export settings.

nvdgAuthor
Participant
January 7, 2021

Thanks for your reply. 

 

I can't send you the files in question, as it's a confidential design proposal.

 

But I quickly recreated the problem with a different photo. I exported the photo at 2000x3000px 72dpi. I placed it in a 900x300px artboard (it's a RGB document, document raster effect settings are 72dpi). I slightly scaled down the image to about 60%. I then exported the artboard with Export as > JPG (max quality 150dpi). Btw,  I'm on a 2019 Macbook pro, so I have a Retina display.

When I open the exported JPG in PS and view it at 100% the branches are clearly jagged. Again, the vector graphics are fine, so it's something to do with the photo. 

 

Doug A Roberts
Community Expert
Doug A RobertsCommunity ExpertCorrect answer
Community Expert
January 7, 2021

Can you try again using Art Optimized anti-aliasing? Here's what I get performing those steps compared to your export on the right: