kariaの日記 @ Alice::Diary

ノリツッコミの鳩子がはてなブログ書いちゃうよ/ブログデザイン変えました(2019/07/01〜)

kariaの日記です。コミケ告知等は本家のside=2にて。BOOTH通販やってるよ
過去記事リンクとかは最下部参照。Twitter ID:@karia

Twitterに画像を透過PNGのまま投げるためにチェックする項目

最近「Twitterで透過PNGをツイートしたいのに投げられない(透過のないJPEG画像に変換されてしまう)」といった発言を時折見かけるようになりました。何故そのような需要があるかは一旦置いといて、なるほど確かにこれは苦労しますね。

深夜帯に色々実験してみたので、透過PNGをツイートしたいけどうまくいかないときに確認したい点をまとめてみました。

Webブラウザから投稿している

これは割と盲点だと思うので最初に書きますが、iPhoneAndroidから画像を投稿する場合にTwitter公式アプリから投稿すると、この先に書かれている条件をいくら守っても透過のないJPEG画像に変換されてしまいます。WebブラウザChromeSafari)から投稿しましょう。

スマートフォンWebブラウザから投稿するやり方はアイビスペイントのヘルプに載っています。

ibispaint.com

透過つきのPNG画像である

投稿しようとしている画像はそもそも透過つきのPNGになっているでしょうか?ただの背景が白いPNG画像なのかもしれませんし、スマートフォンなどではいつの間にかJPEGに変換されているかもしれません。

縦横のサイズがどちらも900px以下である

画像サイズで縦横どちらかが900ピクセルを超えているとJPEGに変換され、透過でなくなる可能性が高いです。

iPhone上ではそんなのわからなくない?と思いましたが、以下のアプリで調べることができました。

apps.apple.com

f:id:karia:20190829035206p:plain

メタデータを表示させて、Pixel HeightとPixel Widthの項目を確認しましょう。画像形式がPNGJPEGかも調べることができます。

ファイルサイズが3MB以下である

ファイルサイズが3MB以下でないと強制的にJPEGに変換されてしまうという情報があります(試してみようと思ったけど3MB以上の画像がうまく生成できず未確認)。先ほどのアプリでファイルサイズも調べることが出来ますが、この「3MB」が厳密に何バイトなのかは定かではないので、あまりギリギリを攻めないほうが無難かと思います。

おまけ

以上の条件を守っていればおそらく透過を維持したまま投稿されると思いますが、Twitterの仕様が変更になる事もあるのでうまくいかない時は最新の情報を確認してね。

ここから先はおまけです。

【上級者向け】PNG-8形式なら900px制限を突破できる

※何を言ってるかわからない人はこの項目は飛ばしてね

同じPNG形式の中でもPNG-8であれば、900ピクセルを超えていても透過を維持したまま投稿できるようです。Twitter公式も言及していますし、下の画像は実際に横1024ピクセルの画像ですが透過を維持できています。2048x2048が上限らしいです。

ただ、この方法には以下の問題があります。

  • 使える色数が限られるため画質が劣化する恐れがある
    • PNG不可逆圧縮(ざっくり言うと画質が元画像から劣化しない)なのが特徴ですが、PNG-8の場合は使える色数が256色に制限されるため、保存時に減色され見た目の画質は劣化する恐れがあります。元々256色の画像なら問題なし。
  • 画像ファイルが「PNG-8形式かどうか」を判別するのが困難である
    • 厳密にはhexdumpするとわかると教わりましたが(実際に試したところ確かにその通りでした)、それが出来る人は限られてるでしょう(PCじゃない人は特に)。PCでPhotoshopを使っているなら書き出し時に「ファイルサイズ小(8-bit)」を選択すればPNG-8になる模様です。

これらを考慮するとPNG-8形式かつ画質を保ったまま投稿するのは多くの場合困難で、「そういうやり方もある」程度に思っておいたほうが良いでしょう。

「投稿してから時間が経つと透過じゃなくなっている」事象について

ときどき「投稿してから10分~20分程度経っても透過のままなら大丈夫」と書かれているのを目にしますが、これは投稿直後は画像をキャッシュして表示しているために発生する現象のようです(10~20分程度でTwitterから画像を取得しなおす模様)。アプリを一旦終了して(タスクkillして)起動しなおすか、投稿したのとは他の端末で確認するのが確実です(たとえばPCから投稿したならiPhoneで表示確認するなど)。

最も確実に透過PNGを添付する方法

ここまで長々と書いてきたのにこれを書くのはちょっと、という気はするのですが。

pixivにあらかじめ高解像度な透過PNG画像をアップしておいて、Twitterに投稿するときはそのpixivのURLを添付して投稿する、というのが一番確実だったりします。この記事を見ている方で透過ありで投稿したい需要って、おおよそ「YouTubeの動画のサムネイルで画像を使ってもらいたい!」という動機からの方がほとんどだと思うので。まあURLを開いてもらえるという保証はできませんが……。

参考にした記事

mnoqlo.hatenablog.com

www.webtech.co.jp