絵が書けない人向けのWordPressのヘッダーを作る方法!


 

WordPress ヘッダー 作る

 

ヘッダーとは、サイトの看板や顔になる物です。

アナタはサイトを使ってお金を稼いでいくわけですが、

サイト訪問者からコンテンツだけでなく、

外見から良いサイトだと思われなければなりません。

 

例えばサイト訪問者はヘッダーを見て「オシャレだね」「センス無いね」

脳内で感想を漏らすわけです。

 

とは言いますが・・・・・・・

ヘッダーを作ることは絵が描ける人はともかく

絵が書けない人にとっては非常に困難だと思います。

 

しかし安心して下さい。

本記事は絵が描けない人でも無料でかつ簡単に

ヘッダーを作る方法を解説していきます。

 

実際に私も絵に関してはブランクがあるので

ヘッダー作成に関してはほぼフリー素材の切り貼りで制作しています。

(本記事でのやり方とは違う方法だが)

 

ヘッダーをちゃんと作るとサイトに個性が出て

Googleからも高い評価を受けやすくなるので

しっかりと作っていきましょう。

 

ヘッダーを作る前に

 

ヘッダーを作る前に幾つかの注意点がございます。

次の事を守らないとGoogleからの評価が下がる可能性があります。

 

・サイトの内容に合っているか?

何でも取り扱うようなトレンドアフィリエイトのサイトであれば

あまり気にする事項ではありませんが、

一つの内容に特化したサイトを運営していくのであれば

(例えば『オーガニック』『スマホゲーム』)

内容に合ったヘッダーを作らなくてはいけません。

 

オーガニックのサイトなのに機械的な画像だったり、

スマホゲームのサイトなのにお花畑の画像を使ったヘッダーは

普通に考えたらオカシイですよね。

なのでちゃんとサイトの内容に合うようにヘッダーを作りましょう。

 

・サイトの雰囲気に合っているか?

ヘッダー画像の色やデザインがサイト全体の雰囲気に合っていないと

おかしな事になるのである程度の色彩感覚を意識しましょう。

(原色を使う事は避けましょう)

悪い例①:ヘッダーが派手なでサイト背景が(気持ち悪いし目に悪い)

悪い例②:ヘッダーがメカっぽいが背景が柔らかい色

 

・どんな情報を発信しているか分かるように

サイトのタイトルやサブタイトルをヘッダーに入れて

どんな情報を発信しているのかが分かるようにしましょう。

 

ヘッダー制作に必要な物

 

絵を描いている人であれば、

フォトショ、SAI、アズペ、クリスタ等の

ペイントツールを使用しておりますが、

絵を描いていない人にとってはほぼ無縁な物です。

 

そこでヘッダー制作に使用するツールは『PhotoScape』です。

PhotoScapeとはフリーの画像加工ソフトで操作がとっても簡単です。

※PhotoScapeのダウンロードはこちらから

 

ヘッダーを作ってみよう

 

いよいよヘッダーを作っていくわけですが、その前に素材を用意しましょう。

(素材=フリー画像)

ヘッダーのサイズは横900~1000、縦250~350が理想なので、

ぷくっとの画像なら950×250でちょうど良いですが、

今回はあえて大型の画像であるpicjumboを使用してヘッダーを作ります。

 

WordPress ヘッダー 作る

 

PhotoScapeを起動して画像編集をクリックしましょう。

 

WordPress ヘッダー 作る

 

次にヘッダーに使用したい画像を開きます。

今回は4000×2667の画像を使用しますが、

あまりにも大きいのでリサイズしていきましょう。

 

ヘッダー説明4

 

リサイズを選んで『アスペクト比を保持』にチェックを入れて横幅を1000にします。

(ここでは縦幅を弄らない)

次の作業に移る前に保存をしておきましょう。

保存しないと元のサイズに戻ります。

 

ヘッダー説明5

 

次に縦幅を弄ってサイズを275にして『トリミング』をクリックします。

(横幅は250~350の間なら何でもOK)

 

ヘッダー説明6

 

するとサイズが変わりますので、ここでも保存しましょう。

 

ヘッダー説明7

 

トリミングが完了したので赤枠で囲ってあるコマンドを

クリックして文字を入れていきましょう。

※今回は例として料理系のサイトを作る時のイメージで制作しております。

 

ヘッダー説明8

 

文字を入れましたがそのままでは見えにくいので下にラインを引きました。

ラインを引く時に色を薄くするのであれば、

『不透明度』のつまみを左にずらしましょう。

 

※PhotoScapeにはレイヤー機能が無いので、

文字を入れる時とラインを引く時の順番はどっちでも良いです。

 

これにてヘッダーは完成です。

続いてはヘッダーをサイトに飾りましょう。

 

ヘッダーをサイトに飾ってみよう

 

ヘッダー説明9

 

WordPressの管理画面に入ったら、

『メディア』→『ライブラリ』にヘッダー画像をドラッグします。

その次に『外観』→『ヘッダー』を選択。

上記のような画面が現れるので『新規画像を追加』をクリック。

 

するとライブラリの画面に入るので、ヘッダー画像を選択しましょう。

(切り取りするかどうかの2択が出ますが切り取らないでいいです)

 

ヘッダー説明10

 

そうするとヘッダーが写ります。

『保存して公開』をクリックすればヘッダーを表示する作業は終わりです。

 

まとめ

 

以上で絵が描けない人でも作れるヘッダー画像の解説を終わります。

ヘッダーを作る流れはまとめると以下のようになります。

 

①PhotoScapeをダウンロード

②素材をダウンロードする

③トリミングしたり文字を入れる

④仕上げをする

 

ねっ簡単でしょう?

PhotoScapeはとても扱いやすい画像加工ソフトなので

ヘッダー制作のついでに色々な機能を試してみましょう。

 

サブコンテンツ