ココル > アイキャッチのサイズは決めておくと統一感が出る

アイキャッチのサイズは決めておくと統一感が出る

  • この記事は約2分で読めるワン。
アマゾン
最大10%ポイントアップキャンペーン!生活/理美容/健康/大型家電等はさらに5.5%ポイントアップ!
2024年3月1日(金)9時00分~2024年3月5日(火)23時59分
アマゾン
Amazon.co.jpの販売する書籍を購入することによって最大25%がポイントで戻って来る!!
2024年02月23日(金) 00時00分 ~2024年03月05日(火) 23時59分

ブログにしろサイトにしろWeb制作において大切かと思うことをご紹介します。今回はアイキャッチについてのご紹介です。

ブログのデザインにもよりますが、記事の一番最初に画像があるかと思います。呼び方は様々あったりもしますがそれがアイキャッチと呼ばれる画像です。メインビジュアルなどとも呼ばれます。

記事を引き立てるための素材として活用されています。またOGPの画像として設定されている場合もあります。 @cocolejp もOGPの画像はアイキャッチを使用しています。

今回はサイズ統一についてまとめていきたいと思います。

デジカメの比率で考える

ブログなどでは写真などを多く使われる場合があります。もちろん最初の見出し画像にもなるアイキャッチにも撮影した画像を使うかと思います。

そのときにそのままデジカメサイズの画像をリサイズして使うだけでなく、画像の比率を少し考えてみてください。

こだわってしまうとアイキャッチの制作で疲れてしまうので、あまり考え込みすぎずシンプルに比率だけを考えてみてください。

通常デジカメの画像は3:4の比率が多く、一眼レフのデジカメの画像は2:3の比率が多いです。

@cocolejp の場合はアイキャッチで高さを出してしまうのはあまり好ましくないと考え16:9の画像でデザインしています。

リニューアル後も柔軟性が比較的高い

ブログなどを運営しているとデザインをリニューアルしたりWordPressを利用されている場合はテーマを変更する時があるかと思います。

その時使っていたデザインではキレイに表示されていたのにリニューアルした途端にデザインが崩れたり、まとまりがなく感じる時があります。

そのときに少しでも視覚的に崩れなどを回避する方法として、アイキャッチ画像のサイズはあらかじめ決めておくとリニューアルしても対応しやすくなります。

記事数が少ない場合はアイキャッチを作り変えても問題ないかと思いますが、記事が多い場合は、多く検索されている記事に対してアイキャッチのデザインを変更するだけで良いかと思います。

なるべく縦画像の画像を使うのではなく横画像を意識して使っていくと比較的レイアウトはまとまりやすくなります。

一般的なサイトは横を意識しているデザインが多いので横画像を意識すると比較的整えやすいです。

後で読み直す

お気に入り登録した記事一覧

記事タイトルとURLをコピーする

Administrator

Joliee

Joliee

東京都内で福祉関係のWEB制作を担当しています。WEB制作についてはCSSで何とかしたいがモットーです。柴犬男子と暮らしています。少しでも体格よくするために始めた筋トレなど学んできたことを少しでもアウトプットできるようにブログに残しています。

樂(ガク)

樂(ガク)

豆柴犬の樂(ガク)です。かまってちゃんな性格な柴犬男子です。好きなものは歯磨きガムです。ドッグフードは生きていくために渋々食べています…