What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 130 Stack Exchange communities.

I never liked that SO/SE relied on the external gravatar service, so I was glad to read that it doesn't any more. However, it turns out that one cannot use as profile picture a PNG file with transparent background (something that is supported by gravatar):

enter image description here

Above is a screen capture of my profile page, with a profile picture that has a transparent background. That background is turned into black, which I suppose is a bug.


The method of upload doesn't change anything (I uploaded it manually to imgur, but the same black background is observed). See the difference between the two following URLs:

http://i.stack.imgur.com/Da3ex.png?s=128&g=1
scaled, with black background

and

http://i.stack.imgur.com/Da3ex.png
unscaled, okay

The problem is thus in the resizing code from imgur.

share|improve this question
2  
What if you upload the correct size so no resizing is necessary? –  Daniel Beck Jan 15 '13 at 20:00
10  
@DanielBeck there are many “correct” sizes: 32 for user icon below posts, 64 for expanded user card, 128 for profile page… –  F'x Jan 15 '13 at 20:21
    
What's wrong with Gravatar? It gives you a centralized location to manage all your avatars –  NullUserException อ_อ Jan 15 '13 at 20:33
5  
@NullUserExceptionอ_อ Some people might not appreciate the inability to remove one's account, or want a different SE profile image than on every other web page while still using the same email address. –  Daniel Beck Jan 15 '13 at 21:01
4  
The resized version is a JPEG, which would explain the loss of transparency. –  John Flatness Jan 15 '13 at 21:19
    
@JohnFlatness http://i.stack.imgur.com/Da3ex.png?s=128&g=1 (underline png) is a JPEG?! Someone has serious issues… –  F'x Jan 15 '13 at 21:22
4  
Despite the extension, it is indeed a JPEG. –  John Flatness Jan 15 '13 at 21:23
    
@JohnFlatness yes, I understand, and that sounds like a really weird design choice –  F'x Jan 15 '13 at 21:32
    
This is purely imgur issue which does not support resizing transparent (or animated) pictures, it should be dealt by them. –  Shadow Wizard Jan 15 '13 at 22:21
1  
@DanielBeck That's easily fixable: I have different gravatars on my SE accounts (this is me, and this is also me), all while using the same email. Just append a +something (eg: something+so@somewhere versus something+mso@somewhere). You can also delete the gravatar for your actual email (if I were to use my email without the +, you'd see an auto generated image). –  NullUserException อ_อ Jan 15 '13 at 22:51
5  
@NullUserExceptionอ_อ If "somewhere" happens to be Gmail.com. By far not every email provider supports address tags. While you can (soft?) delete images, you can't get Gravatar to forget about the email address in plain format though, and they always store a user name and password (that you can change). Just think about common password/username/email address reuse patterns. You asked what's wrong with Gravatar, this is. While you can minimize issues, it's a reasonable request not to have to use it. –  Daniel Beck Jan 16 '13 at 9:30
1  
Can we even be sure that the background colour will be the same wherever the image is used, so that it can be manually set? –  Neil Jan 16 '13 at 21:28
    
The Green Dragon cannot be resized, it resizes you! –  Jack Feb 20 '13 at 12:44
    
@F'x http://i.stack.imgur.com/Da3ex.png?s=128&g=1 < Notice the query string that says s=128. This will tell the server to resize the image in the HTTP response, but the URL (Uniform Resource Locator) Still points to the original Resource in your browser. –  MDeSchaepmeester Apr 25 '13 at 8:18

5 Answers 5

up vote 5 down vote accepted

This issue was addressed and fixed back in March. Here's a quote from Alan at IMGUR:

After some more investigation it looks like this issue was already fixed back March when we were dealing with some thumbnails being corrupted. Since that meta post was created before that, in January, I suspect it's already been solved. This is the same image from the post with g=1 http://i.stack.imgur.com/ZH0eC.png?g=1 and also when resized http://i.stack.imgur.com/ZH0eC.png?s=128&g=1

Please let us know if you find any other images with issues.

share|improve this answer
2  
Bug is fixed, but it's still not transparent, having white background instead. Any plans to keep transparency in the resized thumbnails? –  Shadow Wizard Jul 17 '13 at 19:42
    
I'll ask, but I'm pretty sure we'll be sticking with transparent -> white. –  Geoff Dalgas Jul 17 '13 at 19:44
    
Fair enough. Just curious, was it busted along with animation, or did it always lose transparency when resized in imgur? –  Shadow Wizard Jul 17 '13 at 19:52
2  
This doesn't seem to be fixed entirely, this is the avatar I just uploaded via SE, and I get just solid black where transparency should be. –  Mad Scientist Oct 9 '13 at 19:53
    
Yes, it still happens. I just upload that image a few minutes ago for testing a related issue. –  Ilmari Karonen Jan 18 at 20:00
    
@IlmariKaronen working fine for me (though not transparent) with same image uploaded now. How did you upload your image? –  Shadow Wizard Jan 18 at 20:12
    
@ShadowWizard: I uploaded it less than 30 minutes ago. –  Ilmari Karonen Jan 18 at 20:13
    
@IlmariKaronen sorry, noticed only on second read. How did you upload it? –  Shadow Wizard Jan 18 at 20:13
    
@ShadowWizard: From my user profile page here on meta, using "change picture" -> "upload new picture". –  Ilmari Karonen Jan 18 at 20:14
    
@IlmariKaronen true, when uploading file from the computer you're right, transparent becomes black on resize. I pasted the raw image data into the upload dialog and it caused the resize to work fine. Think it better be reported as a new bug, feel free to start it. :) –  Shadow Wizard Jan 18 at 20:19
    
@ShadowWizard: Done. –  Ilmari Karonen Jan 18 at 21:14
    
@GeoffDalgas What's the reasoning behind the "transparent -> white" approach? With the addition of more and more different SE sites it's more and more likely that the image will be used on a site where the actual background is not white. –  Nit Jun 9 at 15:29

The transparency (or rather lack thereof) is still an issue. I uploaded my current avatar today (17 December 2013) and the transparency in the PNG is replaced by black colour. Here's the image when included into the post:

enter image description here

Compare that with the one displayed as the avatar:

enter image description here

share|improve this answer
1  
See related question: meta.stackexchange.com/q/210132/142977 –  F'x Dec 18 '13 at 8:40

A solution no one has mentioned yet that is entirely within the control of StackExchange is to perform the image-resizing beforehand (preserving full alpha-channel transparency in pngs), and then upload 3 differently-sized images to imgur.

share|improve this answer
1  
Stack Exchange has no upload mechanism of its own, that's the whole point of using imgur in the first place. As far as I know, it just pass the file as-is to the external vendor without storing it anywhere. –  Shadow Wizard Jan 21 '13 at 8:28
    
"Passing" = uploading. Don't know what "upload mechanism" besides that you think I meant, but if it can "pass" one file, it can preprocess and "pass" three files. –  ErikE Jan 21 '13 at 9:56
1  
My main point is that such thing will require lots of efforts from the dev team here. While you are correct and it will work, it's better to have imgur fix their image resize code. –  Shadow Wizard Jan 21 '13 at 10:54

Seems the black background and jpeg encoding is caused by the g=1 GET parameter:

http://i.stack.imgur.com/Da3ex.png?s=128&g=1
g=1

without it we get a png with white background:

http://i.stack.imgur.com/Da3ex.png?s=128
no g

share|improve this answer
    
Yes, that's the undocumented feature that prevents animation.... –  Tim Stone Jul 17 '13 at 13:53
    
The animation is already prevented by s=128 –  m0sa Jul 17 '13 at 14:04

This can all be solved if the query slug from the imgur source is removed and http://i.stack.imgur.com/Da3ex.png is used in its stead, then the CSS automatically kicks in to make it look correct ^_^

share|improve this answer
1  
You do realize what's wrong with this solution and why it would not be used, right? –  Wesley Murch Jan 15 '13 at 21:51
    
@WesleyMurch ok tell me? Since the img's source is imgur -- it puts no extra load on the SE. So please, explain it to me ^_^ –  amanaP lanaC A nalP A naM A Jan 15 '13 at 21:52
    
If I mention viewing the site on your mobile, does that ring any bells? You're forcing the user to download roughly 5 times as much data per avatar. –  Wesley Murch Jan 15 '13 at 21:54
    
@WesleyMurch what about visiting on mobile? CSS still works on mobile phones! –  amanaP lanaC A nalP A naM A Jan 15 '13 at 21:56
2  
It has to do with what you force the user to download. More stuff to download means slower load times, more bandwidth used. I'll admit though, this is the only solution on SE's end - imgur would have to fix their resize method. –  Wesley Murch Jan 15 '13 at 21:57
2  
@WesleyMurch usually after one load the image is in the cache and there is no need to download again. So no real issue there. especially in this instance where the same image is loaded 3 different times with 3 different queries, whereas my solution there is only one image. –  amanaP lanaC A nalP A naM A Jan 15 '13 at 21:58
5  
Yes cache is meant to mitigate stuff like this, but it cannot help the first download of the image. Any given page may have 5-15 or more of these avatars, not in the user's cache yet. So it seems you're aware but don't agree that it matters, understood. –  Wesley Murch Jan 15 '13 at 22:00
1  
@WesleyMurch well my solution is on SE's end (not on imgur's since we cannot change thier system) and the only way to show a png in the correct format currently (using imgur) is to use my method, so either we have to deal with png transparency looking "wrong" or we have to deal with large images. I guess it is up to the SE to decide that.... –  amanaP lanaC A nalP A naM A Jan 15 '13 at 22:01
7  
Just for reference, I managed to set a 4000 x 3000 image (natural size after upload, before dynamic resize) as my avatar. Compare original to resized, huge difference. I know I'm repeating myself, but I just can't see this being a usable solution. –  Wesley Murch Jan 15 '13 at 22:18
4  
@WesleyMurch Another solution on SE's end is to host the images here. –  NullUserException อ_อ Jan 15 '13 at 22:59

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .