はてなブログ 超初心者がタイトル入りヘッダー画像を作ってみた！
新しいブログに移転しました。約5秒で自動的に移行します。
今日も引き続きブログカスタマイズのお話。
超初心者のわたしがどの様にヘッダー画像を用意したか、謀議録として残しておきたいと思います。
ブログのヘッダーに使いたい画像を用意する
まずはヘッダーにしたい画像を選ぶところからスタート。
わたしのスマホのカメラロールは子供の写真ばっかりで、そんな気の利いた写真がなかったので、無料で画像をネット上で使用することを許可してくれているサイトさんを探しました。
検索でも色々出てきますけど、見た感じ写真ACとかPixabayは有名みたいでした。
その中でも便利なサイトさんを見つけましたので、ここでご紹介しておきます。
それがこちらの「ピクタグ」
なんと現時点で43の無料画像提供サイトの検索を横断して一気にできるというのです！
ひとつのサイトでなかなか気に入ったものを見つけられない時、いちいち色々なサイトを行ったり来たりしなくて済むのはとっても便利。
良いなぁと思った画像は規約を確認して、ダウンロード。
でも大抵、はてなブログのヘッダー画像として使うには、そのままではサイズが大きいです。
わたしも例外なくヘッダーに合う様に調整が必要でした。
画像のサイズをブログのヘッダー用に調整して圧縮する
はてなブログのヘッダーの推奨サイズは1000X200だったので、フリーサイトからダウンロードした画像はサイズが大きく、それを調整したり、部分的に切り取ったりする必要がありました。
画像のサイズを調整する方法ですが、わたしは知り合いに教えてもらって使ったことがあった「iLoveIMG」を今回も使わせてもらいました。
サイズ変更、切り抜き、そして画像の圧縮までしてくれるという、とっても便利サイトさんなのでここに貼り付けておきます。
最近は本当に無料サービスが充実してて嬉しい限り。
やり方は簡単。
サイズ変更、切り抜き、圧縮、どれでも作業したいタグをクリックしたら、画面の指示にしたがって、変更したい画像をドラッグするか、選択してアップロード。
その画面で必要な作業をしたら、右下の水色ボタンで作業終了。
少し待てば自動でダウンロード開始してくれるという優れもの。
最近はスマホ写真なんかだとアプリでも簡単にできるけど、PCで作業するにはオススメです。
ヘッダー画像に文字を乗せる方法
これももはやスマホのアプリでもできますけど、PC作業にはこちらが使い用が良さそうでした。
わたし、実は一時期無謀にも絵を描いてみたくて、この手のシステムやアプリを色々検索したことがありました。
この「Pixlr Editor」はプラウザ上で作業ができるので、こうしたちょっとした作業だけしたい場合に使い勝手が良いかなぁと思って、今回は使ってみた次第です。
使い方は多くのお絵描きツールと似てるので、そういったものを使ったことがある人でしたら感覚的に使えるんじゃないかなぁと思います。
実際、わたしレベルでも苦労はしなかったです。
まず、Pixlr Editorを開いたら、最初の蝶々右上の「X」で蝶々を消します。
（実はこの最初だけ迷いました…）
そしたら、「File」の「New Image...」を選んで
サイズを「Width」を「1000」、「Height」を「200」にしてOKをクリック。
1000x200の真っ白なキャンパスが出てきます。
次に、「Open Image...」から使いたい画像を選びます。
そうすると、真っ白な画像と、使いたい画像の両方が表示されますので、「Layers」（青緑の箇所）でクリックし、そのままドラッグして、真っ白なところまで持っていきます。
そうすると、白の1000x200のキャンパスに無理やり使いたい画像が納まります。
そこで、左上の三角と十字のマークを一度クリックしてから、画像をクリックしたまま動かすと、画像が動いてくれ流ので、ちょうど良いところまで持っていけばOKです。
次はタイトル入れです。
タイトルは左下の「A」をクリックして出てきたウィンドウの「Text」の中に打ち込みます。
「Font」でフォントを色々選べますし、「Size」で大きさ「Color」で色も自由に選べるので、オリジナリティに富んだタイトルを創ることが可能です。
これでタイトル入り画像ヘッダーの完成！
わたしは何かと調整に時間がかかってしましましたが、作業自体はそんなに難しいことはありませんでした。
ということで、以上がわたしのヘッダー画像準備の記録でした。
もし、ヘッダー画像に悩まれている方が、こんな場末のブログにたどり着いて参考にしてくださったなら嬉しいです。
