前回の続きで、今回はメインである
「画像の扱い」について、つらつらと述べていきます。
概論になりますが、ご容赦ください。。。
2.画像の扱い
ブログに限らず、サイト上で画像(静止画、動画)を大量に扱う場合は、本当に注意が必要です。
何が注意なのかについてですが、そもそも多くのサイトの場合不特定多数を対象としています。
サイトに訪問した時にすぐに目につくマイナスポイントが、
①ページに遷移したつもりなのに、ブラウザ上で一切反応がない(例:真っ白なページが表示されているだけで処理されているのかもわからない) ②画像が表示されない
これでは、せっかくサイトを作ったのに訪問者はストレスがたまって、「二度と見ない!」ってことになります。(少なくとも私はそうです)
ただでさえ画像を扱うサイトは処理が重くなるので、訪問者にストレスを与えます。それを踏まえた上で何を注意すべきか、というと、
A.画像を扱うので、それ以外の表現は極力避ける。 つまりサイトを彩る様々なプラグインを画像処理(表示速度、表示表現)に重きを置いたうえで、極力最低限のプラグイン構成にし、極端に言えば文字がなくてもサイトを表現できるぐらいにする。
B.画像の表示速度だけでなく、ページ内の画像表示自体を遅延ロードする。 遅延ロードすることの主題の一つとして、ページ遷移処理が行われていることを訪問者に明示することだと思います。 訪問者:ポチっとな、とリンクやボタンを押してページ遷移 サイト:(まず、ページ遷移を最優先して、画像表示は後回し) 訪問者:(画像表示は遅いけど、ページ遷移しているから表示処理に時間がかかっているんだろうなー。) と、訪問者が解釈してくれれば最高ですが。 ページを上下にスクロールするぐらいの画像を配置する場合は遅延ロードを行うことによって、ページ遷移時点ではなく、スクロール時点で画像の表示処理がされるので必須です! ⇒遅延ロードおすすめプラグイン:Lazy Load
C.サイトのトップページにコンテンツ画像を大量に配置しない。 サイトの玄関であるトップページが重いと、それだけでげんなりします。ですが、全く配置するなというわけではなく、少量であったり(さじ加減は難しいですが)、画像ではなくサイトマップを表示するようにするだけで、大きく違います。サイト制作者としては、 「トップページにさえ来てもらったらこっちのもの!」 だと思いますので、コンテンツ画像は個別記事にがっつり配置する方法がいいかと。
D. ジャンルごとの一覧表示などはサムネイル表現にすることで、一つ一つのコンテンツ画像のサイズを抑え、最終的には表示速度を上げる。 皆さんお分かりなので割愛! ⇒サムネイル表示おすすめプラグイン:Regenerate Thumbnails
とどのつまりは、
A.で余計なプラグインを削除し、
B.でサイト訪問者に極力ストレスを与えず、
C.でトップページをスリムにすることで、
サイト訪問者にサイトを端的に表現し、再訪を促す。
これのループに尽きると思います。
次回は、「3.カスタマイズ」です。