アメブロのヘッダーカスタマイズはCanvaでスタイリッシュに!

アメブロのヘッダーカスタマイズはCanvaでスタイリッシュに!

ブログと言えば「アメブロ」というくらい、ブログユーザーの支持が高いアメブロ。せっかくアメブロにブログを開設しているなら、デザインをオシャレにカスタマイズしてファンを増やしましょう。

目的を持ってブログを訪れるユーザーも、何となくふらっと訪れたユーザーも、Canvaなら思わず目を止めてしまうオシャレなヘッダー画像にカスタマイズできます。さっそくCanvaを使ったオリジナルヘッダー画像の作成方法と、オシャレな画像テンプレートをチェックしましょう。

アメブロのヘッダーをオリジナルデザインに変えてみよう

アメブロのヘッダーをオリジナルデザインに変えてみよう

ブログの人気度を左右するヘッダー画像。作成のポイントはどこにあるのでしょうか。

ブログヘッダーのデザインがブログの読者数を左右する!

ブログヘッダーのデザインは、ブログのファン数やアクセス数に影響します。ミズーリ大学の研究によると、ユーザーがWebサイトの記事を読むか読まないかの判断は「約2.6秒で行う」という調査結果が報告されており、訪れた人がブログを読むかどうかは「ブログヘッダーのデザインによる」と言っても過言ではありません。

ブログヘッダー画像に入れるべき要素

ブログヘッダーは「デザインだけ」が良くてもNGです。ひと目で「どんな内容のブログか?」「書いている人はどんな人か?」と、ユーザーが気になる情報を端的に盛り込みましょう。ブログカバーには次の要素を入れると良いでしょう。

・タイトル

何についてのブログか分かるタイトルを、ブログヘッダー画像の目立つところに短めに入れましょう。20文字前後が目安です。タイトルから「読者が得られるメリットが伝わるか?」「今読もうと思ってもらえるタイトルかどうか?」、また「具体的でわかりやすいか?」「自分ごととして考えてもらえるか?」などをポイントに作成します。

もしタイトル内で伝えきれないときは、タイトルを補足する「サブキャッチ(タイトル)」で伝えてもOKです。

・具体性

デザインの表現はできるだけ具体的にしましょう。例えばペット関係のブログであれば動物の写真を、スポーツ関係のブログであればスポーツの写真やモチーフを使うと、よりダイレクトに瞬時に伝わりやすくなります。

・当事者性

ユーザーが「自分が読むべきだ」と当事者性を感じることができるかどうかが大切です。画像・タイトル・サブキャッチ全体を見て、客観的に判断してみましょう。

Canvaを使ってオリジナルデザインのヘッダー画像を作成

Canvaを使ってオリジナルデザインのヘッダー画像を作成

それでは、Canvaを使ったオリジナルブログカバーの作成方法についてみていきましょう。

サンプルテンプレートからブログヘッダー画像用のベースデザインを探す

サンプルテンプレートからブログヘッダー画像用のベースデザインを探す

Canvaのトップページにアクセスし、画面左のメニューの「テンプレート」をクリックします。

アメブロのブログヘッダー画像の最大サイズは「横幅1120px、縦幅400px」なので、画面左の「デザインを作成」ボタンを押して表示されるドロップダウンリスト内の「カスタムサイズ」で「横=1120、高さ=400」を指定します。

ブログヘッダー用

ブログヘッダー用などブログに使える数多くのテンプレートが表示されるので、好みのものを選びます。「ブログ ビジネス」など、検索キーワードを追加するとよりイメージに近い画像が探しやすくなります。

好みの画像を見つけたら、必要な部分について編集

好みの画像を見つけたら、必要な部分について編集をしていきましょう。

文字を編集する

画像内の文字を編集

まずは画像内の文字を編集していきます。キャッチ・サブキャッチを入力して、フォントやカラー、文字サイズを調整しましょう。

Canvaは日本語フォントも充実しているので、ブログ内容や画像の雰囲気に合ったものを色々試してみてください。

サイズを調整する

サイズを調整する

有料版であれば、画像の編集途中で画像サイズを変更することも可能です。

ご自身のアメブロのデザインターマに最適なヘッダー画像サイズに調整したければ、画面上の「サイズを変更」ボタンから画像サイズの微調整が可能です。

ブログヘッダー画像をダウンロードする

画像内の文字を編集

画面右上の「ダウンロード」または「パブリッシュ」ボタンをクリックすると、「ダウンロード」が選択できます。ダウンロード画像のファイル形式をPNG形式に指定して、ダウンロードすればブログヘッダー画像の完成です!

Canvaで作ったカバー画像をアップロードする

それでは、Canvaで作成したヘッダー画像をさっそくアメブロにアップロードしていきましょう。

オリジナルヘッダー画像のアップロード方法

Canvaで作ったカバー画像をアップロードする

アメブロの管理画面にアクセスしましょう。アメブロの管理画面から「デザインの設定」を選択後、CSSの編集で「ブログデザインヘッダ・背景用画像の追加」から、Canvaで作成した画像をアップロードします。

ブログデザインをCSSで書き換える

画像をアップロードしたらCSSで書き換えをします。CSS(カスケーディング・スタイル・シート、Cascading Style Sheets)とは、Webページのスタイルを指定するための言語のことで、Webページにスタイルを適用する場合に一般的に使われている言語です。

このように書くと少し難しく感じるかもしれませんが、初心者向けにさまざまなCSSでのカスタマイズ方法が公開されていますので、自分に分かりやすいものを選び、実際に作業をしてみましょう。

Canvaでカバー画像をオシャレにカスタマイズして、アメブロ読者を増やしましょう!

デザイン作成の切り札