Solved

PNG has jagged edges

Posted on 2008-06-23
2
168 Views
Last Modified: 2013-11-19
The logo and some of the other icons on the page at http://fellowtip.codeyoda.us have jagged edges.  My developer asked for .png files with no background and that's what he's using.  He can't figure out what the problem is so I'm hoping you can help.
0
Comment
Question by:Iamageorgiabulldog
2 Comments
 
LVL 38

Accepted Solution

by:
lherrou earned 125 total points
ID: 21859494
Iamageorgiabulldog,

When the PNG was originally output, I am guessing there was not a colored background, so there's no anti-aliasing (http://en.wikipedia.org/wiki/Anti-aliasing) applied (since there's no background, the graphics program doesn't know what color to shade to). The solution is to have a background layer in the color you think you're going to use (or at least close), and then make that background layer invisible.

In addition, your PNG is more than twice as big in pixels as the area where it's being used, so it's being scaled by the browser. This can enhance the jaggies. I took your PNG and, in Photoshop, added a white background layer, then re-sized to 200 px wide, hide the background, and saved for web as a new PNG. The result is below, you can see it's nice and smooth by comparison.

Cheers,
LHerrou
fourseasons-logo-sm.png
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

Many programs have tried to outwit PowerPoint in terms of technology and skill. These programs, however, still lack several characteristics that PowerPoint has possessed from the start. Here's why PowerPoint replacements won't entirely work for desi…
Technology opened people to different means of presenting information, but PowerPoint remains to be above competition. Know why PPT still works today.
Learn how to use the remote presentation tool in Prezi to allow you to harness the power of this cloud based presentation platform. You can show your presentation with a remote audience using this free tool.
It’s easy to embed any of your public Prezi presentations on your website or social network to share with others. Learn how simple it is in this tutorial.

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now