Start networking and exchanging professional insights

Register now or log in to join your professional community.

Follow

How can I reduce the file size of a web banner image with Photoshop?

user-image
Question added by Dana Adel , Sales Representative , Karmalite
Date Posted: 2015/08/17
Deleted user
by Deleted user

Just open the image in Photoshop then go to 

File - save as - choose in file type - JPEG , then choose depending on what size you like from slider (1-12) (1 smallest size less quality ) (12 largest size best quality)

press enter 

done 

Zeeshan Amer Dar
by Zeeshan Amer Dar , digital marketing manager , Eduskills Technical and Occupational Skills Training

To reduce the size of a Web Banner in Photoshop... Go to FILE MENU in photoshop and click on Save for Web option. A dialog box will open and there, on the upper right corner, you will select JPEG from a drop down with File Types Listed and then click on PROGRESSIVE check box under that. Then, you will see file size in Lower Left Corner of the Dialog Box, under the section where your image is displayed.

 

If the file size is still not, what you want, change the Quality of Image from the area next to the file type drop down box in upper right corner of the Dialog Box.

 

Yaqoub Alomar
by Yaqoub Alomar , Civil Engineer , Al-Zubeir municipality

you can open it in photoshop and when you click "save for web and other devices" you can choose the size to save as.

Ibrahim Saleh
by Ibrahim Saleh , Front End Developer , Souq.com

when making something in photoshop ... We tend to take some high resolution photo's ... try to make this photo's more smaller in size ... and then add it to the design ... I guess it'll reduce the design size a little bit more. 

And save it for a web ...  Like what the other people wrote.

 

And you can select the size that you need from the drop-down beside the preset drop-down and select "Optimize to file size" and type the size that you want.

Fadi Alatteli
by Fadi Alatteli , Site engineer and outdoors spaces designer , adnan bdran office for planning and design buildings

reduce the resolution of the image by pressing "Ctrl+Alt+I". After that save as this image and choose the Quality of the Image Options from0 to12. I recommend from5 to10.

Deleted user
by Deleted user

CTRL + ALT + SHIFT + S choose JPEG format and reduce image quality ;-)

Deleted user
by Deleted user

Crop or resize your images. If you are going to make a300×250 px banner don’t load a picture of say2400×1554 px. Use the Banner Snack image editor to do that (just click Edit image) or use a computer program like Photoshop, Paint, Photo-Paint, IrfanView etc. to crop off the area of the picture you need.

 

If you need aproximately the whole picture, resize it, but be careful to constrain proportions. In this example you could resize the2400×1554 px down to16% of the original size, resulting a408×264 px resized image. Now you can go further with the image optimization and crop this resized image to fit perfectly the300×250 px size of the banner.

Ahmad Kassir
by Ahmad Kassir , General Manager , Spring time

  1. Save For Web
  2. Set to JPG
  3. Reduce image quality

Jayson Aglubat
by Jayson Aglubat , Graphic Designer/Information Technology , Local Government

Well as long as your file in website is organize between your pc and photoshop; once you open it  in adobe Photoshop CC version14.2.1, CC2014 and CC2015; just go to the layer of the file and resize it by renaming of the file including the file file size and extension. so you don't want to save it again but instantly will be updated on the file folder of the website files..

Tamer Kholy
by Tamer Kholy , Graphic Designer , Freelancer

Image > Image size > Set the desired image size > use Bicubic Sharper for size reduction.

or File > Save for web ( CTRL+SHIFT+ALT + S ) Set the desired image size > use Bicubic Sharper for size reduction.

If you rather not to constraint the aspect ratio and need to edit either just the height or width I would suggest after you resize the image constrained.

Create a new layer from the current background layer (if you're working with a flatten image), and another layer for background.

go to Image > Canvas size > and expand the width or height the desired pixels, then fill it with a color similar to the current banner color.

Muhammad Ali Faisal
by Muhammad Ali Faisal , Lead Artist , OZI Technology

Firstly, reduce the resolution of the image by pressing "Ctrl+Alt+I". After that save as this image and choose the Quality of the Image Options from0 to12. I recommend from5 to10. Anyway you can choose any and compare the result. 

More Questions Like This