: Image size for web - Image Layers I have an image that is: 24 x 11 pixels. In photoshop I have saved it as optimised for the web as .png The size of the image is 1.05kb Is this normal?

@Holmes874

Most of these answers are stating that if you save it in a different file format, you can reduce the size.

This is incorrect. Different file formats may make your image smaller, of course, but it all depends on the image itself as well as the particular compression and optimization settings you are using for each image.

So, yes, certainly try saving your image as a JPG or GIF and see if it helps, but it's no guarantee it will be any smaller.

As for your current image being 1k, note that that is already really small. There are also limits to how small an image can get that are somewhat out of your control:


minimum hard drive sector size. The image the size is reported at on your hard drive may actually be bigger than the image itself. This is due to the fact that the larger the hard drive, the larger the minimum sector size is. For really small files, you'll note that moving them to a smaller sized hard drive actually will report a smaller file size. This isn't relevant to internet bandwidth, of course
file meta data. Most all files have meta data. This is data not directly related to the image's look, but is ancillary data that the browser or file system may or may not use (such as a file icon). You can use software to modify or strip this meta data away.


As for your concern, that's not entirely clear. Are these all separate images, or just one image? If it's just one image, then in terms of bandwidth, it's moot, as only one copy of the image needs to be downloaded from the server for total bandwidth usage of 1k.

If these are all different images, then you're likely better off using sprites. This is where you take all of your individual small images and place them into one large image. You then use CSS to 'crop' each individual image out of the sprite on the browser-side.

While this may not reduce the total amount of files size, it drastically reduces the amount of server requests which can greatly reduce download speeds.

Vote Up Vote Down

@Berryessa866

You could post it as a gif image as that could be smaller, but it could be lower quality. The image you have is already pretty small but if you really want to experiment to make it smaller this could work.

Vote Up Vote Down

@Gail6891361

As stated, 1.05kb is very small. However, there are ways to reduse the size of any image further in photoshop at the expense of image quality.

In the 'save for web' Dialogue you have various settings to accomplish this.

Got to your 'Save for Web' settings.



you can adjust the size of your image prior to saving via the 'Image Size' dialogue. Notice the size of of the file that will be saved (highlighted 'PNG-24 63.26k in the example's case)







if you don't require that your images have transparency as in transparent backgrounds, then saving your files as a JPEG instead of a PNG will also result in a smaller file size for the same given image dimensions. In addition you can vary the size of the image to further reduce size by selecting 'Low, Medium, High,Very High or Maximum .





Something to consider with image for websites is the speed at which they will be loaded when first visiting a webpage.

Photoshop helps with this by providing information for a given image size when combined with a network's speed.

Click 'Select download speed' drop down menu to view image loading speed for a given network speed.









Hope this helps

Rob :-)

Vote Up Vote Down

@Cody3331749

Unless you need it to be transparent, save as a jpg. They are much smaller. Also make sure you resolution is set to 72, many designers have 300 resolution for the web and it is unnecessary.

Vote Up Vote Down