web-dev-qa-db-ja.com

Web用にPNGファイルのサイズを小さくするにはどうすればよいですか？

背景が透明なPNG-24ファイルがあり、現在のサイズは1.5 MBです。サイズを縮小する方法、またはPNG-8ファイル形式を使用して同じ品質を維持する方法

enter image description here

ここからPNGファイル： http://www19.zippyshare.com/v/69590430/file.html

サンプル画像をアップロードしましたすべての提案を試しましたが、良い結果は得られませんでした

ありがとう

adobe-photoshoppng
16
Welliam

PNGは可逆圧縮形式です。ファイルのソースマテリアルを変更せずに、デフォルトの最高レベルの圧縮を超えて圧縮を増やす方法はほとんどありません。サイズを削減する唯一の実際の方法は、PNG圧縮の操作の複雑さを軽減するために、解像度または色深度を削減することによって画像を変更することです。

画像に高レベルの圧縮が必要で、ロスレスデータストレージを気にしない場合は、JPEGを使用します。

6
mikebabcock

[〜＃〜] riot [〜＃〜] はそれを行うことができます。

ラジカル画像最適化ツール（略してRIOT）は、最小限のファイルサイズを維持しながら圧縮パラメーターを視覚的に調整できる無料の画像オプティマイザーです。

並べて表示（デュアルビュー）またはシングルビューインターフェイスを使用して、オリジナルを最適化された画像とリアルタイムで比較し、結果のファイルサイズを即座に確認します。

画像オプティマイザーは軽量で、高速で使いやすく、しかも上級ユーザーには強力です。圧縮、色数、メタデータ設定などを制御し、出力ファイルの画像形式（JPEG、GIF、またはPNG）を選択できます。

別の可能性は、説明されているように、pngquant、pngout、およびpngcrushの組み合わせを使用することです here が、これはコマンドラインからのものです。

ここでは、すべてのオープンソースツールを使用してコマンドラインからpngquant + pngout + pngcrushを使用して、png24画像をie6の良さのためにpng8に変換する方法を説明します。

1-画像を256に量子化します（基本的に、大きなスプライトまたは大きな色範囲のスプライトがあるpng8の外観はがらくたになります）。

pngquant 256 some_24_bit.png

2-画像をpng24からpng8に変換

pngout -c3 -d8 -y -force some_24_bit.png some_8_bit.png

3-画像を圧縮する

pngcrush some_8_bit.png -bit_depth 8 -brute -rem alla -reduce some_8_bit_small.png

9
Laurent Parenteau

試してください TinyPNG

彼らのウェブサイトから：

それはどのように機能しますか？

PNG（Portable Network Graphics）ファイルをアップロードすると、画像内の類似した色が組み合わされます。この手法は「量子化」と呼ばれます。色の数が減るので、24ビットのPNGファイルは、はるかに小さい8ビットのインデックス付きカラー画像に変換できます。不要なメタデータもすべて取り除かれます。結果：透明度を100％サポートする小さなPNGファイル。

2つのオプションがあります。

  • 画像をウェブサイトにドラッグアンドドロップすると、自動的に処理されます。無料サービス。 （最大20画像。それぞれ最大5 MB）
  • Photoshopプラグイン。これには$かかります。

私はPSプラグインを試していないので、それがうまく機能するかどうかコメントできません。

6
Dhaust

コマンドラインを気にしない場合は、 OptiPNG を確認してください。

OptiPNGは、情報を失うことなく画像ファイルをより小さいサイズに再圧縮するPNGオプティマイザです。このプログラムは、外部フォーマット（BMP、GIF、PNM、TIFF）を最適化されたPNGに変換し、PNGの整合性チェックと修正を実行します。

5
Renan

アルファチャネルでPNGを処理するための素晴らしいアイデアWebサイト開発のコンテキストは、サーバーにあなたのトリックをさせることです：サーバー上のアルファチャネルから画像データを動的に分離し、両方を最適化しますそれらを個別に作成し、canvas要素とブラウザのJavaScriptを使用してそれらを再結合します。ターダ！すべての最新のブラウザで動作します。

方法は次のとおりです。

http://headers-already-sent.com/artikel/shrinkimage-1/

PHPスクリプトとjQueryプラグインを含む完全なZipパッケージも見つかります。これについてどう思うか教えてください。

3
Andreas Ollmann

pngoutとdeflopt の組み合わせを使用します。 pngoutは、PNGカラーがPNG-8に適合するかどうかを自動的に判断して使用します。 defloptは、既に最適化された画像から余分なバイトを絞り出します。これは、デフレートされたデータを操作するユーティリティであり、PNGはその1つです。

3
Oleg V. Volkov

画像を本当に縮小する必要があり、簡単な提案がすべて機能しない場合、最終的な答えは、画像を圧縮可能な部分に分割し、スクリプトを使用してクライアントで再結合することです。

質問の画像は、縦線と斑点/ノイズのある色のグラデーションのように見えます。それを次のレイヤーに分割します。

  1. 線やノイズのない色のグラデーション。これは、PNGおよびJPEGで非常によく圧縮されます。さらに良いのは、JavaScriptを使用してクライアントで色のグラデーションを生成することです。あなたはおそらくJSの200バイト未満でそれを行うことができます。
  2. 色やノイズのない縦線。これを単一の4ビットチャネル（アルファまたはグレー）に圧縮できます。必要なのは、1ピクセルの高さの画像だけです。これは、ストレッチできます。それはPNGで非常によく圧縮されます。
  3. 雑音。この場合も、必要なのは単一の4ビットチャネル（アルファまたはグレー）だけです。色や線がなければ、PNGまたはJPEGで非常によく圧縮されます。

JavaScriptを使用してレイヤーを1つの画像に結合すると、「画像」全体が15KB以下になる可能性があります。

この種の作業は何十年もの間ゲームの業界標準でしたが、現在もそうです。プロのように画像を作成した場合、Photoshopにはすでにこれらの個別のレイヤーがすべて備わっているのは素晴らしいことです。

1
Sophit

標準のPNGファイルは、使用できる最も圧縮された画像形式であるため、ウェブサイトの画像、特にデザインの目的でPNGファイルが非常に多く使用されているのはなぜですか。

しかし、PNGファイルをさらに圧縮する方法はまだあります。画像で使用する色の数を減らす。これにより、ファイルサイズを最大70％またはそれ以上に削減できる場合があります。

これについて私が見つけた最高の全体的な圧縮率を持つ最高の自動化されたフリーソフトウェアは FileOptimizer で、複数のエンジン（つまり、PngOptimizer、PNGOUT、pngwolfなど）を使用して、画像を可能な限り最小のサイズに圧縮します。

良い結果が得られた別のオンラインツールは次のとおりです。 http://www.giftofspeed.com/png-compressor/

1
William Dresker

FileOptimizer を紹介しましょう。これは、画像の最適化のためのさまざまな方法を組み合わせています（余分なバイトを節約するためのEXIFの削除を含む-オフにすることができます）。

テスト結果 および他のソリューションとの比較。

enter image description here

1
rluks

ScriptPNG http://css-ig.net/scriptpng

非可逆を含む約10の異なるオプションを提供します！私はたくさん試しましたが、このWindowsバッチファイル（.exeの束を含む）は素晴らしいです

私は個人的にそれを使用して8ビットの損失のあるデータに圧縮します。どのように動作するのか本当にわかりませんが、スクリーンショットは同じように見えます。スクリーンショットの圧縮に使用します。私は約2GBのpngを持っていましたが、現在は700mbしかありません

0
Mikey