JPG 100% vs PNG

Any help topics that don't fit in the current categories can go here.
Post Reply
User avatar
FrederickGeek8
Posts: 148
Joined: Wed Nov 30, 2011 10:31 pm

JPG 100% vs PNG

Post by FrederickGeek8 »

I have a bunch of 100x100 pictures on a page. Will JPEG 100% quality or as PNG have the smallest size?
User avatar
Helx
Posts: 350
Joined: Thu May 17, 2012 6:45 am
Location: Auckland, New Zealand

Re: JPG 100% vs PNG

Post by Helx »

So you want the images to load faster?
Just use optimized JPG (but keep high quality PNG if you can).

It's probably not the best idea to use 100% quality on JPG's anyway. I'd suggest you use around 70%.
There's little to no difference visually.

But if you really want to get all finicky, I saw somewhere that scaling up a JPG image twice as large as needed, saving at 70% quality, then in the HTML image tags scaling it to how its meant to be, makes it load faster by a few milliseconds.

If you're really obsessed with page speed, use Amazon CloudFront or Akamai. (I use CloudFront)
Just note, those are the big guys. They are rather expensive.
If you're looking for something cheaper, http://www.maxcdn.com has $40/yr plans.

But only use a CDN if you are making a commercial website :P
User avatar
FrederickGeek8
Posts: 148
Joined: Wed Nov 30, 2011 10:31 pm

Re: JPG 100% vs PNG

Post by FrederickGeek8 »

I'm really just trying for optimum page speed. I really don't care about storage. I have plenty of it and can get more.
User avatar
Helx
Posts: 350
Joined: Thu May 17, 2012 6:45 am
Location: Auckland, New Zealand

Re: JPG 100% vs PNG

Post by Helx »

FrederickGeek8 wrote:I'm really just trying for optimum page speed. I really don't care about storage. I have plenty of it and can get more.


Ah, then use JPG at 70%.
It provides the same quality for less storage.

And if you have PhotoShop, I'd recommend using these settings for JPG:
Image
Post Reply