Mobile app version of vmapp.org
Login or Join
Turnbaugh909

: Optimising images for web I’m currently building my own website and I’m trying to do everything as best as i can. I am currently learning about images and i have some questions on optimising

@Turnbaugh909

Posted in: #AdobePhotoshop #Dimensions #Images #PhotoEditing #WebsiteDesign

I’m currently building my own website and I’m trying to do everything as best as i can. I am currently learning about images and i have some questions on optimising them so that they dispaly appropriately across my site.

I bought a website template that comes with a carousel & 3 images to populate it. The three images are all jpg and the dimensions are 1920x700. I have since replaced these images with my own and although i set the dimensions to 1920x700 when i saved it (as png, using Photoshop save for web and devices) the file size is 2.69mb. When i hit my site for the first time the images takes a long time to load which is definitely not what I want.

When it comes to images should i be saving as jpg or png or any other format that is available? I know from a transparency point of view then i should use png because jpg does not support this but im confused when to use which.

I would also like to know (using Photoshop) how i could reduce the file size (for quicker load times) but maintain the dimensions of 1920x700.

Any information regarding best formats and other general advice to help me understand image use with website will be gladly taken on board.

I’ve just bought a camera so would like to know more about photography and images :)

Cheers
Paul

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Turnbaugh909

1 Comments

Sorted by latest first Latest Oldest Best

 

@Ann6370331

You have it backward; png and gif both support a transparency channel, jpg does not. Have you tried using smaller images to populate the carousel ? There is a setting in Photoshop under file menu that will let you save your file to the web. You can try different optimization levels until you achieve the proper balance between size and look.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme