はかったな!AAの人気に嫉妬 ― 2014/05/13 19:23
久しぶりに更新したんでアクセス解析をのぞいてたのですが、なんかblog/?offset=5なんてのがちらほらあるんです。
「べつになんでもないこと」でググッたら、リンク先の一つがblog/?offset=5になるくらい影響してます。
調べてみたら、Firefox 3.6 の AA (via べつになんでもないこと) - Ethertumblrが元らしいってか、Firefox 4でAAがズレるという話で、Fx 3.6と比較した時のAAじゃないか!
しかし、なんでそんな古いものが……つうか、Firefox 3.6で表示したAA画像のタイトルに「Firefox 3.6 の AA」なんて入力してたものだからまるでFirefox 3.6 の AAみたいになってるじゃないか
その後AAの表示はというとズレなくなっていて、Firefox 29のデフォルト値は
「gfx.direct2d.disabled」が「false」
「gfx.font_rendering.directwrite.enabled」が「false」
になっています。
試しにズレていた頃と同じように
「gfx.direct2d.disabled」を「false」
「gfx.font_rendering.directwrite.enabled」を「true」
にしてみましたが、特にズレているAAはなさそうなので、ちょっとこれで運用してみます。
どうせなので、背景を透明にしたのとAAを置いときますね。
\ は か っ た な ! / ____________________________ | |llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll|llll| | | 0. 1 2 3 4 5 6 7 8 9 10 | | (,,゚Д゚) | | U, つ |  ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄|  ̄ | ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ U"U
<追記 5/23>
環境を書いてなかった……Windows 7 x64
Direct2D 有効 | true |
---|---|
DirectWrite 有効 | true (6.2.9200.16571) |
GPU #2 の使用 | false |
GPU 描画支援のウィンドウ | 1/1 Direct3D 10 |
WebGL レンダラ | Google Inc. -- ANGLE (AMD Radeon HD 6450 Direct3D9Ex vs_3_0 ps_3_0) |
windowLayerManagerRemote | false |
アダプタ RAM | 1024 |
アダプタドライバ | aticfx64 aticfx64 aticfx64 aticfx32 aticfx32 aticfx32 atiumd64 atidxx64 atidxx64 atiumdag atidxx32 atidxx32 atiumdva atiumd6a atitmm64 |
アダプタ名 | AMD Radeon HD 6450 |
デバイス ID | 0x6779 |
ドライバのバージョン | 14.100.0.0 |
ドライバの日付 | 4-17-2014 |
ベンダ ID | 0x1002 |
AzureCanvasBackend | direct2d |
AzureContentBackend | direct2d |
AzureFallbackCanvasBackend | cairo |
AzureSkiaAccelerated | 0 |
■AA対応チェック ┏━━━━━━━━━━━━━━━━━━━━━━━━━┓ ┃ ┌───────────────┐ ┃ ┃ │ .右のAAのズレない環境が標準モナ.| ┃ ┃ └──y────────────‐┘ ┃ ┃ ∧_∧ | |\|/ | | | ┃ ┃ ( ´∀`) | ∧ ∧ |/⌒ヽ、| ∧_∧ | ∧∧ | ┃ ┃ ( つ |(,,゚Д゚)||,,゚ Θ゚)|(; ´Д`)|(=゚ω゚)| ┃ ┗━━━━━━━━━━━━━━━━━━━━━━━━━┛ | | コソッ| | | |∧_∧ ジー ∧_/.| | __ |_|´◛ω◛`) .(´◛ω|_| .[lШШl] | | o【◎】 ( o| | (´◛ω◛`) ジー | ̄|―u' `u. | ̄||| | | | | """""""" """""""""""""""" ┏━┯━━━━━━━━━━━━━━━━━━━━━━━┓ ┏━━┻━┥ _,,.. ┃ ┠────┤ ⊂⊃ /,' 3~~\ ⊂.⊃ ┃ ┗━━┳━┥..............,,,,傘傘傘::::::::傘傘傘............. おてもと ┃ ┗━┷━━━━━━━━━━━━━━━━━━━━━━━┛ ┏━┯━━━━━━━━━━━━━━━━━━━━━━━┓ ┏━━┻━┥ (⌒-⌒) お食事処 仔熊庵 ┃ ┠────┤ ⊂⊃ (・(ェ)・ ) ⊂⊃ ┃ ┗━━┳━┥..............,,,,傘傘傘::::::::傘傘傘............. おてもと ┃ ┗━┷━━━━━━━━━━━━━━━━━━━━━━━┛
</追記>
<追記2 6/21>
リンク先どころかリンク名称まで「blog/?offset=5」になりやがりましたよorz
</追記2>
Flash Player 13.0.0.214リリース ― 2014/05/14 00:22
13.0.0.214がリリース(セキュリティ修正:APSB14-14)されてます。
11.7はサポート終了です。
さっさと更新!
と久しぶりに書いてみる。
Jpegのにじみと画質 ― 2014/05/19 01:39
不思議なことですが、Jpegは赤の劣化がひどいとか、にじむとか、そんな話で引き合いに出される画像は、だいたいサブサンプリングした(色差の情報を間引いた)ものが使われています。
サブサンプリング(ダウンサンプリングとかいわれたりする)に関してはその90「JPEGの特徴」 - 槻ノ木隆の「BBっとWORDS」を見て頂いた方が文字だけで説明するより分かりやすいと思います。
(PDFでよければもっと詳しい解説(知っておきたいキーワード 4:4:4と4:2:0もあります)
実際に比べて見れば一目瞭然ですので、色差を間引いてない画像(4:4:4)間引いた画像(4:2:0)のサンプルを作ってみました。
元画像はこちらのPNG
Jpegに変換するのに使用したソフトはiJPEGCompで、表題の「4:4:4」はサンプル4:4:4、「4:2:0」は4:1:1(2x2)で作成後、最適化しています。
YCbCr 4:4:4 | YCbCr 4:2:0 | |
---|---|---|
画質100 | ||
23,122 | 12,019 | |
画質 90 | ||
10,714 | 6,023 | |
画質 80 | ||
8,034 | 4,640 | |
画質 70 | ||
6,561 | 3,896 |
画像の下の数値はファイルサイズ(バイト)になっています。
色差情報を間引かない設定(4:4:4)なら、拡大でもしないと(ブラウザの機能などで拡大して確認してみてください)何処が劣化したのか分からないのではないでしょうか?
(流石に画質70では拡大せずとも、モスキートノイズが見えてますが)
一方4:2:0では画質100であっても、赤、青、緑いずれもおかしいのが分かってもらえると思います。
4:2:0の設定で保存した画像で、「Jpegは赤の劣化がぁ」とか「にじみがぁ」とか言うのはおかしいなっと私は思うわけです。
※このサンプル画像はJpegに不利になるように調整しています。4:2:0で保存しても、画質を落とさなければ、普通は気づかないレベルに収まるはずです。
ところで、iJPEGCompを使えば、比較しながら最適な画質が選べますが、使い慣れたアプリから直接Jpegで保存する場合やバッチ処理ではそうはいきません。
どのくらいの画質が最適か?となると、こればかりは人それぞれ、目的次第、と言わざるえません。
しかしながら、JpegAnalyzer Plusオンラインヘルプに指標になりそうな資料があります。
(資料を前提に)私見を述べると
画質は譲れないという場合、97~100(PNGを検討すべきレベル)
拡大しないと分からない程度でいい場合、92~96
バッチ処理でとりあえず処理する場合、90
よく見なければ気にならない程度の場合、85~91
雰囲気が伝われば十分な場合、75~84
あたりを目安にするとそうハズレはないと思います(参考なるか分かりませんが100~88まで4%ごとの出力結果)。
(※あくまで目安です。納得いく出力が得られるまで、元データを失わないしょう注意しましょう)
ところで、ツールの中には4:2:0でしか保存しないソフトがあったりします(例:JTrim)。そのような場合はPNGやBMPで保存して、ほかのソフトかiJPEGCompのような変換ツールを使うしかありません。
どうやって確認するかは、ヘルプファイルに書いてなければ、JpegAnalyzer Plusで出力ファイルを直接確認(解析ボタンを押すと先頭の方に情報があります)することになります。
これらのツールを上手く使って調整し、jpegtran(JTBは入手不可)やcarmineで最適化すれば、一時期話題だったJPEGminiより小さくて見栄えの変わらない画像が作れます(なのでみんながあんなにスゴイと騒ぐのか不思議でした)。
JPEGminiは自動で楽(そこだけはすごい)ですが、自動だからこそ、画質にこだわったり、ファイルサイズにこだわったりと柔軟な対応はできません。
これらのツールを使いこなせれば、Jpegに対する偏見もなくなるのではないかなぁと思います。
<Sample追記(5/25)>
渦巻きだけではアレかと他の例
元画像。PNGではサイズ面で不利(392061 bytes)だがJpegではよく縮み、YCbCr 4:2:0でもにじみが気にならない。
JPEGmini(YCbCr 4:4:4 64427 bytes)は自動でこの画像を出力するからすばらしい。
iJPEGComp(画質89 YCbCr 4:2:0 62078 bytes)ならサブサンプリングが選べるのでもう少し容量を削った。
iJPEGComp(画質75 YCbCr 4:2:0 41088 bytes)雰囲気を壊さない限界点?
iJPEGComp(画質50 YCbCr 4:2:0 28402 bytes)画質70以下では、画像が悪化する割に縮まないのでおすすめしない。
次はJpegを選択すること自体が間違いのAAの例
PNGなら劣化なしの6635 bytes!
JPEGmini(YCbCr 4:4:4 166300 bytes)はどうやって適切な画質を選ぶのか?ファイルサイズを削るより、破綻一歩手前の画質がチョイスされる絶妙さ(iJPEGCompだと96、7相当の画質)。この例は極端すぎますが、ファイルサイズさえ目をつぶれば、Jpegだってなんとかなる。
Caesium(品質100 YCbCr 4:2:0 125031 bytes)のようにサブサンプリング固定のツールではにじんでどうにもならない例。サンプリングの選べるiJPEGComp(対話処理)やRalpha(バッチ処理)やJpegResizer(バッチ処理)の方がいいと思う理由です。
※JPEGminiはPNGを入力できないので、Jpeg 画質100 YCbCr 4:4:4に変換して処理しています。
</Sample追記(5/25)>
蛇足
実は、画像を劣化させずにファイルサイズを小さくするあたりで書いておきたかった話だったのですが、手頃な画像がなくて5年以上も過ぎてしまいました。
なんか完全に旬を逃した感じの話ですが、まれに、にじみがぁとかJPEGminiスゲーとか見かけるので、ちょっと書いてみたです。
役に立つかもなリンク
JPEG、GIF、PNG画像選択の指針まとめ | マイナビニュース
Independent JPEG Group(jpegrtran)
(jpegtran:JTBが入手不可になったのでコマンドで最適化するしかない)
Independent JPEG Group's free JPEG software version 6b (Win32 版)
(上の古いバージョンの日本語化。マニュアルがありがたい)
新規保存で劣化していくJPEG形式の画像の様子をとらえたムービー - GIGAZINE
(途中出力にJpegを選んではいけないとよく分かる)
<修正>
4:1:1(4x1)→4:1:1(2x2)
</修正>
最近のコメント