Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using PNG images in web sites

Tags:

image

png

Is it okay to use PNG images in a website? I haven't really seen them used much so was wondering what the drawbacks are. There must be some as surely everyone would be using them?...

Are they, for example, MSIE and Chrome compliant etc...

like image 722
Exitos Avatar asked Feb 28 '10 18:02

Exitos


People also ask

Can you use a PNG image on a website?

Portable Network Graphics (PNGs) are just as popular as JPEGs on websites. They also support millions of colors, although you're much better off using PNGs for images that contain less color data. Otherwise, your image is going to be 'heavier' than the same image saved as a JPEG.

Is PNG web friendly?

PNG – Portable Network GraphicA PNG file is standard for web usage. These files are pixel-based and cannot be scaled up without pixelation. Similar to JPGs, this means they must be exported with the correct size for the end-usage.

Should I use PNG or JPEG on my website?

The general rule is to use JPGs for photographs, images that don't have a transparent background, and other memory intensive files. And to choose PNGs for graphics, files with transparent backgrounds, and other images where clarity and color vibrancy are important.

Why are PNGs good for websites?

JPG and PNG are also good choices for the web. If your choice is between JPG or PNG, use JPG for photos and PNG for logos. That's because a JPG is better compressed and loads faster, whereas a PNG will retain more detail and allows for a transparent background.


2 Answers

IE 6 will only render GIF-like transparency in PNG images unless you use filters.
For more details, see here

Other than that, they work fine, and they're becoming more popular now.

like image 66
SLaks Avatar answered Nov 09 '22 05:11

SLaks


Here's a few Fortune 500 corporate websites implementing PNGs on their front page:

  • microsoft.com
  • apple.com
  • google.com (google logo is a PNG)
  • hp.com (they're actually using twinhelix's IEPNGFIX and transparent PNGs)

actually the only one I found that didn't (I only looked at about 10) was Siemens.com

like image 23
Adam Avatar answered Nov 09 '22 07:11

Adam