8 Replies - 1677 Views - Last Post: 18 July 2013 - 09:50 PM

#1 jace75  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 31
  • Joined: 11-June 13

PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 09:05 AM

I've designed a few custom graphics for a site I'm working on. They are 1400x1200 pixels fully rendered, but programatically scaled down to 150x150 ASP LinkButton icons. They render quite well in Firefox, and beautifully in Chrome, but in IE they aren't even legible. Does anyone know how to "help" IE scale images?
Is This A Good Question/Topic? 0
  • +

Replies To: PNG Icons rendering poorly in Internet Explorer

#2 modi123_1  Icon User is offline

  • Suitor #2
  • member icon



Reputation: 9583
  • View blog
  • Posts: 36,319
  • Joined: 12-June 08

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 09:12 AM

Woah.. wait up.. you are forcing a client to download a 1400x1200 PNG and then programatically forcing the image to scale? eeesh.. Talk about wasted bandwith.

Now - what have you tried, researched, etc? I am guessing you hit the top ten items from a search of "internet explorer scaling image quality"?

http://css-tricks.co...ing-for-images/
http://www.cssplay.c.../menu/fast.html
Was This Post Helpful? 2
  • +
  • -

#3 laytonsdad  Icon User is offline

  • Cheese and Sprinkles
  • member icon

Reputation: 451
  • View blog
  • Posts: 1,948
  • Joined: 30-April 10

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 10:25 AM

Just scale them before you upload them and you will have less troubles.
Was This Post Helpful? 2
  • +
  • -

#4 jace75  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 31
  • Joined: 11-June 13

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 11:10 AM

The CSS tricks didn't work for my situation. When I scale the images using Gimp, some of the finer details of the design(shading, lighting, etc.) are lost. That is why I was attempting to implement client-side scaling. But, considering IE's complete lack of support for...almost everything, I'll probably just have to settle for lower quality images. I do see now why high quality Web-link Icons are so rare to see!
Was This Post Helpful? 0
  • +
  • -

#5 modi123_1  Icon User is offline

  • Suitor #2
  • member icon



Reputation: 9583
  • View blog
  • Posts: 36,319
  • Joined: 12-June 08

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 11:20 AM

How big are these PNGs? 3-4mb?

Of course you'll lose finer detail - you are taking a rectangular 1400x1200px image and cramming it into a 150x150px square1 Detail will be gone.
Was This Post Helpful? 0
  • +
  • -

#6 jace75  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 31
  • Joined: 11-June 13

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 11:48 AM

They are 115 kb in size. And they actually render very well in Firefox and Chrome. I've come up with a simple way to solve the problem. I just used the snipping tool to capture the image after it renders in chrome. Now I have the right size and still preserve most of the original quality B)
Was This Post Helpful? 0
  • +
  • -

#7 modi123_1  Icon User is offline

  • Suitor #2
  • member icon



Reputation: 9583
  • View blog
  • Posts: 36,319
  • Joined: 12-June 08

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 11:57 AM

Fair enough.
Was This Post Helpful? 0
  • +
  • -

#8 Atli  Icon User is offline

  • D.I.C Lover
  • member icon

Reputation: 3730
  • View blog
  • Posts: 6,017
  • Joined: 08-June 10

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 01:42 PM

Just a though. Gimp has several different methods of scaling images. Did you try more than the default interpolation method? As I've always understood it, the Lanczos3 method provides the best quality when reducing the size. (In Gimp at least.) From a bit of Googling, it seems Chrome uses that same Lanczos3 method when scaling images down.
Was This Post Helpful? 2
  • +
  • -

#9 jace75  Icon User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 31
  • Joined: 11-June 13

Re: PNG Icons rendering poorly in Internet Explorer

Posted 18 July 2013 - 09:50 PM

Really? I didn't know there was more than one way to scale with Gimp! I'm a complete rookie when it comes to graphic design. I appreciate the enlightenment B)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1