Mobile app version of vmapp.org
Login or Join
Cugini998

: What should dpi be when saving artwork for web? When saving artwork made in Illustrator for web, what should the dpi be when saving it as a JPG or PNG? For example, say I save my artwork

@Cugini998

Posted in: #Jpg #Png #WebsiteDesign

When saving artwork made in Illustrator for web, what should the dpi be when saving it as a JPG or PNG?

For example, say I save my artwork at 500px wide, is it better to save it at 72 dpi or 300 dpi? What do people typically do? Thanks.

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Cugini998

3 Comments

Sorted by latest first Latest Oldest Best

 

@Jennifer810

From illustrator. I normally save as SVG then it will look sharp on a a screen and will re size nicely on gadgets. Then you dont need to worry about screen resolution

10% popularity Vote Up Vote Down


 

@Mendez620

Traditionally, screen resolution has been 72dpi, though newer high-res monitors like Apple's Retina displays can go up to 400dpi.

That said, when saving images for the web, image resolution doesn't really matter. Most people will export at 72dpi, but the most important thing to do is to export at the pixel dimensions at which the image will be displayed. This becomes a bit tricky in web use, where people are viewing your images on any number of different devices, all with different screen sizes and resolutions, but most content management systems (CMS) will allow for this.

Your best bet is to work out the largest size your image will be viewed, and export your image at this size, at 72dpi. Using CSS or HTML, you can instruct your browser to display the image at 50% depending on the viewer's screen size. This may be something you have to code yourself, or it might be built into your CMS (WordPress does this automatically).

Exporting your images using Illustrator (File > Save for Web) or Photoshop (File > Export > Export As) will let you adjust the size and quality to find a good balance between the two. You want your images to be big in dimension, but not in file size. Both export images at 72dpi.

Find some more info about image/screen resolution here: www.photografica.com.au/image-size-resolution-and-resizing-images-for-the-web/

10% popularity Vote Up Vote Down


 

@Correia448

72 dpi is best for web or 92 dpi for retina displays. 300 dpi is generally only for print. Using it for the web will just make a bulkier file.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme