今回も最近のＷｅｂでの動向を踏まえた技術的なお話しをしていきます。
最近のサイトの特徴として画像が増えているということがあります。以前のサイトはテキスト中心でした。ＳＥＯ（検索エンジン最適化）対策としても有効なので、テキスト中心がダメなわけではありませんが、閲覧する人が見るには「百聞は一見に如かず」という感じで画像のほうが見やすいです。実際、画像による情報提供は文字情報より多くの情報を提供できることもあります。（中途半端な画像はかえって説明が必要な場合もあるので要注意！）
画像はテキストに比べてデータサイズが大きいために昔は遠慮されていました。しかし、どんどん通信環境がよくなり、画像、動画に対する遠慮はなくなり、むしろ積極的に使われるようになってきました。
その要因の１つがスマホです。スマホは画面サイズが小さいためにテキストより画像のほうが好まれる傾向があります。写真や図表のほうが見やすい場合が多いからです。特に記事の見出しとして文字だけでなく、関連写真があるほうがわかりやすいですよね。
記事のイメージを伝えるために使う画像をアイキャッチ画像といいます。アイキャッチとはもともとアニメなどでＣＭ前後にタイトルや映像を表示することで、何の番組かわかるようにするのが目的でしたが、広告業界で、閲覧者の気を引く言葉や画像を指すようになりました。ちなみに番組の最後に表示される画像は「エンドカード」と呼ばれています。
さて、このアイキャッチ画像ですが、普通にＨＴＭＬで作成するとなかなか手間です。しかし、ＣＭＳと呼ばれるホームページ管理ソフトやホームページ構築サービスではほぼ標準で記事一覧を生成する際にアイキャッチを登録できる機能がついています。意外とあることに気づかれていないことも多いようです。ご自身の利用されているソフト、サービスが対応しているか確認することをお勧めします。
このアイキャッチですが、真価を発揮するのは、自社内の記事紹介だけではありません。facebookやTwitterなどのＳＮＳで自社の記事を紹介される際により効果を発揮します。記事の紹介でテキストより画像があるほうがインパクトが大きいのはいうまでもありません。
この記事紹介の際にアイキャッチ画像だけでなく、タイトルや概要も含めて、ＳＮＳに通知する仕組みがＯＧＰと呼ばれる規格です。facebookが規格化したものですが、TwitterやGoogle+、mixiなど様々なＳＮＳで利用できます。もちろん、LINEでも使えますよ。
また、Twitterに関しては、Twitter CARDと呼ばれる規格があり、こちらを利用することでTwitterの投稿時の画像サイズを変更することができます。より画像でインパクトを与えたいときに有効です。
これらの記述はHTMLの<head>部分に<meta>要素として記述します。内容的には難しくないですが、手間はかかります。ただし、こちらもＣＭＳやＷｅｂサービスで機能としてついているものもありますのでその機能を使えば、比較的簡単にアイキャッチ画像付の記事紹介を提供することができます。
画像に関しては、自社で用意できることが理想です。会社の外観やスタッフの写真、現場写真など建設業界は画像で困ることは少ないと思いますが、ピンとくるものがない場合は画像を商用利用もできるＷｅｂサービスがあるので、そちらを利用してもいいかもしれません。ただし、他社と画像が同じになる可能性もあるのでご注意ください。できるだけ、自社オリジナルの画像をお勧めします。イラストやロゴといったなかったときの標準画像を用意しておくと便利です。
記事と書きましたが、一般的なページ（トップページや会社概要、サービス紹介）でも使えます。facebookやTwitterで自社を紹介してもらったり、自社のお知らせを掲載する際にはとても有効だと思います。ぜひ、利用できるかどうかを確認してチャレンジしてください。