WordPressで画像を自動圧縮してぼやけないようにするには?完全設定ガイド

ワードプレス ページの読み込み速度を上げるために、アップロードされる写真画像を圧縮すると、自動的に圧縮が適用される。このメカニズムは、パフォーマンスを向上させるために有用であるが、高精細画像の表示では、多くの場合、ぼやけたり、問題の詳細が欠落して表示されます。この記事では、我々は、ブレの問題によってもたらさWordPress自動的に圧縮された画像を解決するために、設定の完全なセットを提供するために、原理から始めます。

写真[1]-WordPress ぼやけた写真を修正するには?自動圧縮の問題を解決する5つの方法

WordPressデフォルトの画像圧縮メカニズムの分析

WordPress 4.5から、システムが自動的に ジェイペグ 画像は約82%の品質に圧縮されます。この処理は画像がアップロードされるときに自動的に実行され、画像のサイズを小さくすることを目的としています。しかし、詳細が豊富で画像の鮮明さが要求されるページでは、この圧縮によって視覚的な劣化が生じることがあります。

写真[2]-WordPress ぼやけた写真を直すには?自動圧縮の問題を解決する5つの方法

画像をアップロードすると、WordPressは自動的にサムネイル、中、大などの複数のサムネイルサイズを生成します。

WordPressのデフォルト圧縮を無効にする2つの方法

方法1:圧縮を無効にするコードを追加する

これは、テーマの functions.php ファイル内のデフォルトの圧縮処理をオフにする:

add_filter('jpeg_quality', function($arg){ return 100; });

このコードは画像の圧縮品質を100%に設定します。子テーマを使用している場合は、このコードをサブテーマを追加することで、テーマが更新された際に有効期限が切れるのを防ぐことができます。

写真[3]-WordPressの画像のぼやけを解決するには?自動圧縮問題を解決する5つの方法

方法2:プラグインでコントロールする

コードに詳しくない場合は、例えばプラグインの助けを借りてセットアップを完了することができる:

  • JPEG圧縮を無効にするデフォルトの圧縮処理は、直接オフにすることができます。
  • WPリサイズ画質システム生成画像の圧縮レベルを手動で調整できます。
  • ショートピクセル / スマッシュ画像サイズの最適化に加え、シャープネスの設定も可能です。
写真[4]-WordPress ぼやけた写真を修正するには?自動圧縮の問題を解決する5つの方法

第三に、サムネイルがあいまいな問題の解決策である。

元画像が圧縮されていることに加え、WordPressが生成するサムネイルも、特にページで「中サイズ」や「サムネイル」を使用している場合、ぼやけることがあります。

1.サムネイルサイズの自動生成をオフにする

バックグラウンド設定 → メディアで、デフォルトの「サムネイルサイズ」、「中サイズ」、「大サイズ」を0に設定します。これにより、システムがこれらのサイズの画像を自動的に生成するのを防ぎます。

写真[5]-WordPress ぼやけた写真を修正するには?自動圧縮の問題を解決する5つの方法

2.画像挿入時にフルサイズを選択する

記事やページを編集する際、表示用に圧縮された小さな画像が選択されるのを避けるため、画像を挿入する際は「フルサイズ」を選択してください。

3.プラグインを使ってサムネイル生成ロジックを制御する

おすすめ サムネイルの再生成 画像生成ルールをカスタマイズして、ページのニーズに合った画像を作成し、画質を維持するプラグイン。

写真[6]-WordPressの画像のぼやけを解決するには?自動圧縮問題を解決する5つの方法

第四に、高精細画面の画像ぼやけ問題に対処する。

Retinaスクリーンや高DPIデバイスの場合、通常の解像度の画像はぼやけて見えます。このような問題を解決するには、以下の方法を参考にしてください:

高解像度画像のアップロード

ディスプレイサイズの2倍以上の解像度の画像をアップロードすることをお勧めします。例えば、表示領域が600pxの場合、1200px以上の画像をアップロードすることで、HDデバイスでの表示がより美しくなります。

写真[7]-WordPress ぼやけた写真を直すには?自動圧縮の問題を解決する5つの方法

HD画像をサポートするプラグインの使用

例えば WPレティーナ2倍 異なるデバイスに対応した複数の解像度の画像ファイルを自動的に生成するプラグインです。このプラグインは自動的にデバイスの種類を検出し、適切なバージョンの画像を提供します。

V. エディターにおける画像の使用に関する推奨事項

  • プロ仕様のツール(PhotoshopやPhotopeaなど)を使って、アップロード前に画像のリサイズや圧縮を行う;
  • 画像を挿入する際は「フルサイズ」を選択し、サムネイルの使用は避けてください;
  • 小さな図表を大きなサイズで使用することは避ける;
  • コントラストが高い画像には低い圧縮率を選択し、システムによる自動トリミングを避ける。

概要

ワードプレス の自動画像圧縮メカニズムは、一般的なコンテンツ管理者にとっては便利ですが、高い画質が要求されるシナリオでは、ぼやけの問題を引き起こす可能性があります。圧縮パラメータの調整、システム圧縮の無効化、高解像度画像のアップロード、プラグインや画像サイズの賢明な使用は、以下の問題に対する解決策の一部です。ぼけ問題を解決する効果的な方法現場のニーズに応じて、圧縮方式や画像処理方法を柔軟に選択し、より鮮明なビジュアル表現を実現します。


お問い合わせ
チュートリアルが読めない?無料でお答えします!個人サイト、中小企業サイトのための無料ヘルプ!
カスタマーサービス WeChat
カスタマーサービス WeChat
電話:020-2206-9892
QQ咨询:1025174874
Eメール:[email protected]
勤務時間: 月~金、9:30~18:30、祝日休み
© 複製に関する声明
本文作者:托尼屎大颗
終わり
好きなら応援してください。
クドス921 分かち合う
解説 ソファ購入

コメントを投稿するにはログインしてください

    コメントなし