I am busy designing portfolio boards for my new website. I am creating them in Ai, size 370x300px. I am putting the JPG or PNG images of the business cards, letterheads, ads etc onto the artboard then exporting them to screen x1 scale in PNG.

However, the quality is so bad you can't see anything.

  1. What format should I have the images of the items (business cards, ads etc) in before I place them on the artboard i.e. PNG or JPG?
  2. What format should I be exporting the whole completed portfolio artboard in once done i.e. JPG or PNG?

1 Answer 1


We live in a world where a Full HD screen is pretty common. This is 1920x1080px.

On a photo gallery, you can have 2 sizes of your images, a small one as a thumbnail and a higher resolution to see at "full size".

The small one depends on the website overall design. 370px width could mean that you can have a mosaic of 5 images. When you click on it, you can show an image of, let us say 1233x1000px width. The final size depends on the proportions of the original image.

  • PNG is used on flat images. Logos, diagrams.

  • JPG is used on photos.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.