How to avoid JPG compression on Twitter
images png twitter · 6 comments · 400 words · read ~28,737 times.
Update for 2019! Twitter have changed how they compress images. Some of the techniques in this blog post may be out of date.
Let's talk image compression! Services like Twitter will often apply aggressive levels of compression in order to reduce their storage space and decrease download times. This can have negative consequences for usability and image quality.
Here's an example - this detail of a logo from my former employers, Vodafone. Solid red - with some fine detail in white:
If you upload it to Twitter, it will automatically be compressed to a low quality JPG. And this is what it looks like...
Yuck! Look at the grimy artefacts surrounding the text! By default, the image quality that most websites choose is 85%. That's not sufficient for images like this.
How To Fix It
PNGs have an interesting property that JPG images don't - they can be transparent. When Twitter sees even a single transparent pixel, it refuses to convert the original image and keeps it as a PNG.
Using GIMP - or any other photo editing tool - you can crop out a pixel from the image:
You can see a demonstration at:
JPEG compression is terrible for solid blocks of colour (especially red) next to fine details. By default, Twitter compresses your PNGs to JPG. The only way to avoid it is to make sure at least one pixel is transparent. See alt text for details. pic.x.com/skavjdelt6
If you can't bear to have a "missing" pixel - you can set a single pixel's opacity to 90%. That will also prevent compression.
Does this only work on Twitter?
Sadly, yes.
LinkedIn displays an 85% quality JPG in the preview.
They will let you see the original PNG once you click through.
In my experiments, Facebook compressed the transparent PNG to a 71% quality JPG.
That looks nasty! There appears to be no way to download the original.
ReDeCentralise
One of the advantages of hosting your own content is that you - the user - get to choose what is an appropriate trade-off between quality and filesize.
mike says:
I wrote a script a while ago for when I want to post png images to Twitter. It uses ImageMagick. I'm going to put code tags around it in the hope that your blog will use those for formatting. 😀
#!/bin/bashadds a strip of transparency to png images so twitter
won't convert them to jpg and make them look like crap
./png2twitter something.png
img="${1}"; outFile="$(mktemp)";
IFS=' ' read imgWidth imgHeight <<<$(identify -format "%w %h" "${img}");
((imgHeight++));
convert -size ${imgWidth}x${imgHeight} xc:transparent MIFF:- | composite "${img}" - "PNG:${outFile}";
mv "${outFile}" "${outFile}.png";
echo "new image is ${outFile}.png";
It's never mattered to me that the height of the image changes. Now I'm wondering if there's a simple way to make ImageMagick change opacity of a single pixel. So far I can only think of a rather convoluted method and a few minutes on Google found nothing useful.
I'm also now wondering why I've not made composite output to "PNG:${outFile}.png" instead of having that mv command.
mike says:
I remembered why I used the mv command. Because point of using mktemp is to get a unique output filename and it’s silly to have it create a file called fyhuji then output to fyhuji.png, which almost certainly won’t but may possibly exist already, and then delete fyhuji. And some versions of mktemp allow specifying a suffix to create a uniquely named file that ends .png, but some don’t.
I’ve just noticed your blog removed the # from comment lines in my script, but left the # on the interpreter line alone.
Marcus Downing says:
To play devil's advocate for a minute, one of the downsides of people hosting their own files for use on anything social is that individual hosting decays. If you read a forum from five or ten years ago, it's quite normal to see broken image links all over the place. My own self-hosting has changed domain, though for the time being I've retained the old one. If a site wants to preserve a professional image and avoid brokenness, it makes sense for them to take control of media hosting.
Of course, it would be nice if they did it better, and as a user you're stuck handing over control to a faceless corporation - as you are with all the rest of your data.
@edent says:
I'm not sure I agree. There are plenty of social hosting sites which have disappeared. Yfrog, for example.
Marcus Downing says:
Well, yes. The ideal case would a be some sort of decentralised, massively-mirrored, IPFS-like social network that no one corporation controls and which can survive the loss of any one part of it.
But it's in nobody's financial interests to make that happen.
Phil says:
Thank you for this tip, it works for me, the online header isn't as sharp as the original but much better than the jpg compression by twitter 😉