こんにちは、沖縄のホームページ・WEBサイト制作チームNpnp(エヌポンプ)です。
今回は、WEBメディア・オウンドメディアにおけるサムネイルの制作で最低限気をつけている事を、Npnpのサイトで更新中のコンテンツや現在お手伝いしているWEBメディアにて実際に使用しているサムネイルを例に挙げてご紹介します。
サムネイルの制作におけるポイントは何か、日々更新する中で効率良く制作をするにはどうしたら良いかなどを書いていきますので、初めてホームページを作った方やサムネイル制作で悩んでいる方にも是非参考にしていただけたらと思います。
合わせて読みたい記事:デザインがダサくなる5つの要因を回避しよう|サムネイル作成
目次
コンテンツに関連する素材を使う
「コンテンツと関連する素材を使う」というのはサムネイル制作において基本です(グルメ記事なのにまったく関係のない「鞄」とか「掃除機」をサムネにしても見た人は混乱するだけなので…)。
例えば、当サイトのコンテンツで「食べ物」の写真をより美味しそうに見える加工ができるアプリについて書いた時は以下の画像を制作しサムネイルとして使用しています。
「食べ物」の写真加工についての記事なのでケーキの写真を配置しています(実際に記事の中でもケーキの写真加工について順を追って説明しています)。このようにコンテンツとサムネイルに使用する写真は関連したものを使用しましょう。もしサムネイルに使用できそうな画像素材がなけれなフリー素材サイトで検索するのも一つの手です。
見せたい部分は枠ギリギリに配置しない
サムネイル画像は、メディアのコンテンツ一覧ページだけでなくSNSなどでシェアされた時も表示されます。SNSによって表示されるサイズが異なるため場合によってはサムネイル画像の端が見切れた状態で表示される事があります。ですので、見せたい部分は枠ギリギリに配置しないようにしましょう。
サムネイル画像を制作するときの適切なサイズについては「初心者向け!自分でアイキャッチ画像を作るときに気をつけたい事3つ」という記事で詳しくご説明しているのでこちらをご覧ください。
一度作ったデザインとまったく同じものを作らない
まったく同じデザインのサムネイルを連続して作ってしまうと(文字だけ変えて画像や色味はそのまま)、一覧表示で見た時に変わりばえがなく同じコンテンツが続いてるように見えるので、Npnpでは前回制作したサムネイルは使いまわさないようにしています。
ただし、シリーズ化しているコンテンツや関連する記事については「このコンテンツは続きものですよ」ということが伝わるようにデザインの枠組みは変えずに中の画像や文字、カラーを変えて制作しているものもあります。
背景と文字を「暗い色×暗い色」「明るい色×明るい色」の組み合わせで作らない
写真や文字の配置が良くても最終的に画像に記載してある文字が読みにくくなったら意味がありません。
上図のように、「背景も文字も明るい色」「背景も文字も暗い色」で制作すると、「読もう」としない限りは何のことが書かれてあるか分からない画像になってしまいます。逆に文字が読みやすければ配置が少しぐらい微妙かな…と思ってもコンテンツの中身が分かります。
サムネイルには、そのコンテンツへの興味を持ってもらうという役割もあるので、まずはパッと目に入った瞬間に「このコンテンツは◯◯について書かれてあるんだ!」と分かってもらえるような画像を作ることを心掛けましょう。
まとめ
制作チームNpnp(エヌポンプ)がサムネイルを制作する際に最低限気を付けている事をいくつか書き出してみたのですが、サムネイルに限らず、何よりもまずは「見た人に伝えたい内容がわかりやすく伝わる」よう意識しながら制作をしています。
サムネイルには、ユーザーに対してそのコンテンツの内容がわかりやすくかつインパクトを与えて興味を持ってもらうツールの一つです。常にユーザーの目線になって制作し続けることで精度が上がり制作時間の短縮にも繋がると思いますので是非、楽しみながら作ってください。
もちろんコンテンツの中身が充実している事が第一ですよ!
というわけで以上「WEBメディア・オウンドメディアにおけるサムネイルの作成で気をつけている事」でした。
関連記事:ブロガーになる前に知っておきたい「ブログを使った稼ぎ方の種類」
沖縄で格安ホームページ制作をするならエヌポンプにお任せください。
沖縄で活動しているホームページ制作チームの沖縄Npnp(エヌポンプ)では、沖縄県内の企業様や個人事業主様向けのWEBサイト・ホームページ制作を行なっています。その他プロモーション動画の制作やオリジナルイラスト作成、記事コンテンツ制作、YouTubeチャンネルの開設・撮影・運用・動画編集等のお仕事も承っています。
また制作事例一覧ページには掲載の許可をいただきました企業様のホームページ事例を一部ご紹介しております。是非ご覧ください。