画像のサイズと解像度に関する問題

製品などの販売、サービスやソーシャルメディアの提供、またはオンラインでの単なる情報提供であっても、ユーザーが魅力を感じなければ、コンテンツとそのプレゼンスの成功はあり得ません。ユーザーを満足させることができれば、その Web サイトは成功していることになります。

画像がエンゲージメントの構築に役立つのは、人間の脳がテキストよりも視覚的刺激をすばやく受け入れて処理するからです。人間は画像によく反応するようにプログラムされているのです。

以下に示すように、Web サイトの画像はエンゲージメントを高める効果があります。

  • Facebook の投稿に写真が付いていると「いいね!」が 50% 以上多くなります。
  • 記事に画像を使うことでページビュー総数が 94% 増えます。
  • 63% の人は製品画像の品質の方が製品情報よりも重要だと考えています。

Web サイトの目的に関係なく、テキストのみで画像のないページは、面白味や魅力に欠けるものでしかありません。

こうしたことから、この 5 年間、使われる画像のサイズは継続的に拡大してきました。下のグラフ(http://httparchive.org のデータを使用)を見ると、画像数はほぼ一定しているにも関わらず、画像のサイズは 3 倍近く増大していることがわかります。Web サイトをできる限り魅力的なものにしようと、コンテンツ所有者が新しい高解像度の画面を活用しているからだと考えられます。

満足を求めるユーザーは待ちません

Image & Video Manager Growth Graph

リッチコンテンツに加え、Web サイトのパフォーマンスもユーザーエンゲージメントの向上に貢献することがわかっています。しかし、優れたパフォーマンスを求めることは、高解像度画像の提供とは対極の要件です。

画像のパフォーマンスは、ネットワークの速度と、画面に表示する速度という 2 つの主な領域に分類できます。

さらに、レスポンシブ画像、画像の遅延読み込み、Responsive and Server Side design(RESS)など、非表示画像の読み込みを回避するようなブラウザーソリューションもあります。

ネットワークのパフォーマンス

画像のダウンロード時間を改善するための基本原則はバイト数の削減です。これには次のことが含まれます。

  • 画像の解像度と表示可能なサイズ(ピクセル)を画面の寸法に合わせて縮小する
  • Web サイトに応じて品質を適切なレベルに軽減する
  • 適切な形式を選んで圧縮と転送を可能にする
  • クロマサブサンプリングを適用する
  • ファイルの全体サイズを縮小してページ読み込み時間を短縮する
ユーザーが 3G のような低速接続を利用している場合は、より積極的な最適化への取り組みが必要になる場合もあります。たとえば、解像度の低い画像を送信するといった方法もあります。

デバイスのパフォーマンス

デバイスに配信された画像は、処理(デコード)され、画面に表示される必要があります。メモリやグラフィックス処理能力はデバイスによって異なり、これらの要因が画像表示時間に大きな影響を及ぼします。前述のテクニックはどれも、画像が消費するメモリの圧縮と表示時間の短縮に役立ちます。

美しい画像 + 高パフォーマンス = ユーザーの満足 = Web サイトの成功

適切な画像を配信することは、かつてはもっとシンプルでした。今では画面サイズの異なる何千ものデバイスに加えて、さまざまなネットワーク接続、さらにブラウザー固有の画像形式まで考慮しなければなりません。ほとんどすべてのユーザーが CRT ディスプレイと、独特の接続音が鳴る 56k モデムで Web をブラウズしていた 10 年前とは状況がまったく異なります。

ユーザーの満足感を維持するためには画像が欠かせません。Web サイトで画像の問題が生じないように、できる限りすばやく画像を配信し表示することが重要です。

Akamai Image & Video Manager によるオンライン画像の管理について、詳細をご確認ください。