How to reduce image size as much as possible so that website loads much faster?

PicnicTutorials
—
2013-08-03T22:38:10Z —
#2

With photoshop $ or gimp free

ralphm
—
2013-08-04T03:17:07Z —
#3

Yep, the Adobe tools (Photoshop / Fireworks) are great for doing that. Go to Save for Web and choose a middling quality like 50–60%. You can also get great results (for retina) by doubling the width and height of the image, saving at a much lower quality, and then adjusting the image size with HTML and/or CSS.

godfather999
—
2013-08-04T06:33:01Z —
#4

What are the actual steps for photoshop and gimp? Just go to save for web in PS and choose quality 50% and save it?

ralphm
—
2013-08-04T07:59:29Z —
#5

godfather999 said:

Just go to save for web in PS and choose quality 50% and save it?

Yep, that's it for Photoshop. (I haven't used Gimp.)

system
—
2013-08-04T20:59:59Z —
#6

There are different ways you can reduce the image size like you can use Adobe Photoshop, Paint, Pixler, Photo Editor and there are lot of many other websites and softwares who are offering photo edit. You can reduce the size easily using this..

Just go to Photoshop and under Image Size, you can constraint the proportions while reducing by pixel amount or percentage.I recommend you use percentage to keep it simple.

system
—
2013-08-26T17:59:51Z —
#9

There are many ways but i think with the usage of adobe tools it is quite easy to reduce the image size to its extent.I have some good experiences.You also can try it.

stevod
—
2013-08-27T14:18:18Z —
#10

In photoshop there's a 'save for web' function which allows you to try different settings, compression, etc and preview the results. i.e. some levels of compression in the file size might not actually be visible in the final image. This will let you play around with that, while showing you the final file size too, and then save your chosen file.

Hope this helps.

S

vjproduction
—
2013-11-01T17:39:45Z —
#11

Best way would be converting to gif, which is way smaller in size than other formats.

TechnoBear
—
2013-11-01T17:57:44Z —
#12

vjproduction said:

Best way would be converting to gif, which is way smaller in size than other formats.

You're not suggesting all images should be converted to gif, are you? Surely you'll get a smaller filesize for photos by optimising a jpeg, as already stated, rather than converting to gif.

vjproduction
—
2013-11-01T18:09:38Z —
#13

^ not all, just the simple ones. If OP doesn't know about gifs already, he should definitely try it out and play with converting options depending on the image.

dresden_phoenix
—
2013-11-01T23:27:01Z —
#14

It just not that simple... and that's the first thing people must accept.

Here are some guidelines you MUST consider with EACH image.

1) Useage: is this a bg image? can it be tiled? 2) Resolution: similar to above. Do you really need a 1200 x2400 px image? reduce your image size to the dimesions size possible. This may be beyond some people, but try not to severe the same image for everybody... i mean it would seem that a 500px X 500px image is reasonable, but for smart phone with a screen size of 480 x 360 , it's pretty big. If you have the capability to know the device used, take advantage of that!3) composition.. for large areas of flat colors ( not to be confused with subtle gradients) use GIFs/PNG-8 for complex images JPG/PNG

4) Support Not really a big issue, but if for some reason you have to deal with ANCIENT IE versions, PNG may be out of the question

5) Transparency if you need transparency.. you need GIF/PNG

6) Palette and quality this literally will vary with each picture. With GIF you could edit the pallette manually; it does take a good eye to not over posterize , but it can be done. Adding an amount of blur to a JPEG before saving sometimes help. Obviously you can set the quality to some extremely low # , but beware that that will cause artifacts in your image

7) Color mode. If you have B/W photos .. you can save a few KB by making sure you are not on RGB mode. ( seems obvious, but you will be surprised how often it's overlooked)

8) With PNG-24, you can drop unused channels.

Tools for the steps above: Photoshop, Fireworks, GIMP and PNG crush.

Hope that helps.

system
—
2013-11-02T13:01:03Z —
#15

Weird, I have only been able to find on vision (apparently the light one) I still use the light version though and it's great. I haven't used it as much as I wanted too (actually not done anything productive for a couple of weeks now due to my MacBook being sent away for repairing).

TechnoBear
—
2013-11-02T13:02:07Z —
#16

To add to the above, you can also save a few kb by not saving the EXIF data with a JPEG, and in GIMP, if not others, by unchecking the "Save thumbnail" option.