Favicon / Blavatar looks really bad
-
Hello,
My favicon looks really bad and I’m hoping to get this sorted out.
I used a transparent png, saved out of photoshop at roughly twice the suggested size suggested in the help page at http://en.support.wordpress.com/avatars/blavatars/
Here’s a screen shot showing a side by side of how the icon should look (left) vs. how it ended up displaying on my wp.com blog (right).
http://postimg.org/image/bkv7qql63/
The favicon on the left, in the above link, is an .ico saved out of photoshop at 16×16
The image that I uploaded to my wp.com site is 300×300, transparent png, saved from photoshop as a png 24. I built the art in illustrator and kicked it over to photoshop before flattening and saving for web.
FWIW, I’m a professional designer for 11 years now, and a full time freelance web designer working with WordPress for the past 2 years. I’ve designed and implemented quite a lot of favicons at this point.
Point of that is that I am thinking that this isn’t a question of my technique, but rather something crazy happened to my poor little robot head once I sent it off via the wp.com blog icon uploader. :(
Thanks in advance for any insight or help, it would be much appreciated.
Tiny as he may be, my little robot head means a lot to me.
The blog I need help with is: (visible only to logged in users)
-
Hi there!
It looks like this is a result of image compression. Have you tried uploading a version of the image at 128 x 128 pixels?
Can you also make sure that your image is saved in sRGB. The sRGB color profile will work the best for resized images on the WordPress.com servers.
-
Thanks a ton Shawna, I’ll give that a shot, wait for the new icon, and post back.
Much appreciated. :)
-
Seems that your PNG had trouble being resized so small…
Can you try, just for fun, uploading a correct 16×16 png file to see if the favicon shows up good ? If it looks good, maybe try with something smaller than 300×300 ?
-
Hey @francisbob – thanks for the response!
I just uploaded it at 128, per Shawna’s suggestion. I’m going to wait and see how that works for me first.
Hopefully it was just a compression issue and that’ll get me sorted!
-
Just a quick follow up – the reduced sized png at 128 x 128 still looked awful so I tried a jpeg and that came out fine.
I’m guessing there’s some issues with transparency when gravatar does whatever it does to the image.
The jpeg is not ideal, but it’s an acceptable compromise. I’m going to try experimenting with a png with semi transparent areas for the negative space. Who knows, maybe that will get me closer to where I want to be.
Marking as resolved – thanks for the help @shawnajroberts and @francisbob
-
I’m guessing there’s some issues with transparency when gravatar does whatever it does to the image.
You are right about that. See here below the video http://onecoolsitebloggingtips.com/2010/01/24/gravatar-avatar-blavatar/
-
-
-
You’re both welcome. :) If my stuff appears in the support docs I’ll backlink, right? lol :D
- The topic ‘Favicon / Blavatar looks really bad’ is closed to new replies.
WordPress.com Forums 