図解＆動画でよくわかる

Transcription

1 無料ソフトですぐできる ヘッダー画像の作り 図解マニュアル 制作著作 : スタジオ 163 松崎 郎

2 著作権について この商品の開封をもって下記の事項に同意したものとみなします 本商品は 著作権法で保護されている著作物です 許可無く 内容の 部または全部をいかなる 段においても複製 転載 転売等することを禁じます 許可無く 有償 無償を問わず第三者に譲渡することもできません 著作権法等の違反がある場合は 法律に基づき損害賠償を請求いたします この商品の内容は秘匿性が いものであるため 情報の 部 は全部をいかなる 段においても複製 転載 転売等することを禁じます 免責事項 本商品に書かれた内容は 作成時点での作者の 解等です 本商品に含まれる情報の正確さには 分注意を払いましたが 本商品から得た情報により いかなる障害 損害が じても 作者及び販売者は 切の責任を負いません 本商品の作者は事前許可を得ずに内容の訂正 変更等を う権利を有します 関連動画の再 について この商品の関連動画は Windows と Mac のどちらでもご覧になれます 動画の再 には最新バージョンの Flash Player( 無償 ) が必要です adobe 社のホームページから無料でダウンロードできます オンライン動画はインターネットに接続した状態でご覧下さい ブロードバンド環境推奨です また 動画をご覧になるには JavaScript が有効になっている必要があります

3 このレポートでは ヘッダー画像の作り を図解 りで解説します 今回のレポートの動画版もあります こんにちは 松崎 郎と申します 動画商材制作の専 家です 各種動画マニュアル 図解マニュアル 声セミナーなどを 制作 販売しています 主な実績には 1 億 8 千万円を売り上げた おずこと岡崎よしあき の 給 8 万円 の動画マニュアルと図解マニュアル 同じく岡崎 が販売されている オーバーチュア アドワーズ の制作があります 他有名起業家の 声 動画を制作させていただいています 私 が制作販売している教材には Yahoo! オークション最初の 歩 コピペ動画マーケティング サーバーの使い 講座 などがあります ジョイントベンチャー商材として 2008 年に 松崎 郎 & ムカイツヨシのあっと動画 を発売しました 同じく 2008 年に 7 のアフィリエイターの成功の真実をまとめた アフィリエイト成功への最後の鍵伝授 を発売しました 2005 年より動画ブログ ビデオブログ制作講座 を ち上げ 現在も更新中です 2006 年には 動画専 サイト ネットビジネス TV みるぞうをスタートさせ マーケティング情報を動画で配信しております 紹介はこれくらいにして 早速ヘッダー画像の解説に りましょう

4 画像処理ソフトですが ここではウインドウズに始めから ってくるペイントを使います 本来は ペイントでいろいろ画像加 するというのは あまりお薦めはしてないんです やっぱり 機能に限界があって いろんなことができないからです ただ 画像処理ソフトは慣れないうちは操作が複雑で 使うのが難しいものが多いです 今回はすばやく簡単に作ってみようということで ペイントでやってみます ある程度やってみられましたら もう少し上級のソフトを使われるほうがいいでしょう まず ヘッダー画像に使う素材をどこから持ってくるのかをお話しします 素材は無料のものと有料のものがあります グーグルで検索します

5 写真素材 とかで検索すると 本当にいっぱいでてきます いったいどれがいいのかわからなくなってくると思うんですが ともかく 無料のものでやってみようというのであれば 無料 という 葉を れて検索されるといいですね そして 無料のものもサイトがたくさんあって いろんな が無料の素材を提供してくれています 同じような素材配信サイトでも サイトにより規約が全然違います ですから それぞれの規約をみっちり念 りに読んでいかなくてはいけません 無料のものではさらに 商 利 はお断り という所もあります ですから 無料で使えて尚且つ商 利 の出来るところを探さなくてはいけないということです そんな中で いいなと思ったサイトの1つに リンクスタイル というところがありました リンクスタイル まず無料ということと 商 利 が出来るということが 切です そして ご利 規約 をまず念 りに読んでください

6 この ご利 規約 に何をしていい 何をしてはいけないと書いてあります そしてサイトによって違いますが ほとんどの所がその商 利 が可能でも 制限があります 分のホームページとかで使うのはいいけども その写真を加 して に配ったりしてはダメとかです 例えば私が このサイトの写真を使ってヘッダー画像を作って 皆さんにさしあげますよとか そういうのはダメなわけです そういうところがが多いですね 分だけが使うことに限られるという所がほとんどです このリンクスタイルは 無料とはいえ プロのカメラマンの が撮っただけあって本当に質のいい写真がいっぱいあります それから 有料の でお薦めはということでしたら いち押しがこちらですね 素材辞典フォトバイブル です これは素材写真が2 万個 っていて 6700 円です 私も何年も使っていますが これひとつあればまずほとんどのものが この中から探し出せます 私は 8000 円位で買いましたが Amazon では 6700 円で買えるようです Amazon なら送料無料で送ってきますね これはいち押しのお薦めです 今回の画像もこの 素材辞典フォトバイブル を使って作っています フォトバイブルは 100 のカテゴリに分かれていて それぞれのテーマに写真が 200 個ずつ っています 炎 のイメージとか 空 とか 体のパーツ とか 性の 美容 関係に使えそうなものとか のしつけ に使えそうなものとか ウエディング 関係のサイト向けとか ヘッダーだけじゃなくて ホームページやブログなど

7 サイトの中の素材にも使えます それではヘッダー画像の作り を解説していきます 今回はこの 海の写真を使いました これをペイントで加 していきますので ペイントで開きます

8 このフォトバイブルの素材というのは 横幅が 640 ピクセルです ですから標準的なヘッダーとしてはちょっと幅が狭いです それなので 少し広げてあげなくてはならないです 広げるには 変形 キャンバスの とサイズ をクリックします 先にキャンバスのサイズを決めてしまいます <ポイント> ペイントの場合は 画像の きさを変えるときに 細かくピクセル単位で指定できません 元の きさに対して % で指定します キャンバスのほうはピクセル単位で決められますので 先にキャンバスのサイズを決めておきます ここでは横幅は 750 ピクセルにします さは今のままにしておきます 半 で幅の 640 を 750 に変えます

9 すると 下のようにキャンバス ( い部分 ) の幅が広がりました そして今度は素材の を広げます 素材を選択ツールで選びます 次に 変形 伸縮と傾き をクリックします

10 ここで注意するのがピクセルでは指定できなくて % で指定するという所です だいたい 120% でやると ちょっとはみ出るんですけど ちょうどいいくらいになりますので 120% で伸ばしてあげます 画像も横幅が広がりました 次にどの部分をヘッダーに使うかということを考えて 使いたい部分を選択します

11 まず選んでおいて このままドッラッグして上に合わせてしまいます ヘッダーの左上を合わせます 下の の余分な部分はそのままにしておいてかまいません この後なくしてしまいます

12 <ポイント> キャンバスのまわりには や真ん中に い さな点があります ( 前図の枠内参照 ) ここにマウスのポインタを当てて ドラッグするとキャンバスの きさを変えることができます ここでは キャンバスの下の真ん中の い点で調節します そのままマウスポインタをあてて ポインタが両 印になったらドラッグして 出来上がり画像の下の所まで 希望する きさになるまでドラッグします 余分なところがなくなり 希望する きさのヘッダー画像ができました

13 出来た画像を ファイル から 名前を付けて保存 します それでは次に 画像の上の を使う場合をやってみましょう まず 変形 キャンバスの とサイズ をクリックします 次にキャンバスの幅をきめます これはそれぞれのサイトに合う きさが 750 とか 800 とかいろいろあると思います ここでは今回も 750 とします

14 それから今度は上の を使いますので 画像の上の部分を選択します 次に 変形 伸縮と傾き をクリック そして伸縮と傾きの 120 を れます

15 すると ここまで伸びますよね 次に下の の余分な所を縮めます い点にポインタをあてます

16 ポインタが両 印に変わったら余分な所をドラッグして縮めます ヘッダーの きさに縮めることができました

17 そしてこれを保存します ファイル 名前を付けて保存 をクリックして完成です 画像に 字を れる場合を解説します SEO 対策のことを考えれば 画像ソフトよりも HTML 上で れた がいいです ペイントの場合は機能に限界があってそんなにきれいなデザインもできませんので あまりこれでやる意味というのもないですが 簡単にやるにはどんなふうにやるかを解説しておきます この A( テキスト ) というのが 字を れるボタンです まず 字を れる場所を決めます

18 真っ になりました このままでは具合が悪いですね この下の にあるボタン 重なり の選択で 下の を選択します そうすると い下地ではなくて透明の下地になり 画像の上に 字が重ねられます

19 タイトルをいれていきます ここにタイトルを れます と しています 次に きさと フォントなどを変えます まず変えたい 字を選択します フォントと 字の きさを決めます

20 を変えるには 番下のパレットの所で 希望の を選びます 画像をクリックすると 字が ります <ポイント> ペイントの場合 画像に れた 字は変更がききません 場所がちょっとおかしかったなとか もうひと回り きくしたいなとかいう時に もう変更がきかないんですね すでに これは画像になってしまっているんです だから 例えばこのままで切り取れてしまいます 画像になっているというこ

21 とです テキストのように 字部分だけを選択できません だから それをやり直すときは Ctrl+Z もしくは 編集 元に戻す を クリックして 以前の 字の ってない状態にまで戻します そしてもう 1 回テキストを選択してやり直していきます 今度は場所を少し変えてやってみましょう もう 度 A( テキスト ) ボタンをクリックします

22 もう 度 字を れる場所を選択します 字を した後 もう少し きくしたいなあと思えば ドロップダウンメニューでテキストサイズを変更します 28 だったのを 36 にしてみます 出来上がったものを ファイル から 名前を付けて保存 します

23 次におなじ要領で 無料素材を使う場合をやってみましょう 無料素材の リンクスタイル というところから 素材をもらうことにします いろいろ ていいのを選びますが ペイントでやる場合は 使える画像タイプが 常に限られてきます あまりいろいろ細かい加 ができないので ワンポイントみたいな写真だと ちょっと扱いにくいんですね 横 にべたっと使えるものを選んでください それではこんどは樹 でやってみましょう この樹 のなかで 気に った写真を選びます

24 ここの場合は まず画像をダウンロードしますので規約を念 りに読んで 納得がいったら同意してダウンロードするを選択します そしてそれを開きます

25 この写真は 横幅が 2775 ピクセルと かなり きいです ペイントで開いてみます この画 が真っ になっているのはなぜかといいますと 画像が すぎて 部分だけしか えていないからです スクロールしないと全体の画像は れない状態です このままでは 扱いにくいので縮 します

26 変形 伸縮と傾き をクリックします 2775 ピクセルのものを 800 ピクセルにするわけですから 35% くらいでやってみましょう 数字は半 で れてください それでもまだ かなり きいです これから使うところを切り取りましょう

27 今回のは 横幅は 分過ぎるほどあるので 横に伸ばす必要はないですね 画像のどの部分を使うかだいたいのところを決めます 決まったら選択します まず 余分に きめに切り取っておいて 上までもっていきます それからキャンバス ( 全体 ) の きさをみます これだと縦幅が きすぎますね ですから もう少し上によせてみます

28 上によせると 空の部分はどんどん削られていきます 次に 変形 キャンバスの とサイズ をクリックします キャンバスの設定を幅 750 と さはちょっと きめに 300 くらいにしておいて 後で様 を ながら調整していきましょう

29 下の くなった所は ポインタを使って上のほうに縮めてなくします これが縮めた状態です この調整の仕 で 上がまだ広すぎると思われるならもう 1 回キャンバスの調整をして画像を削ってもいいです さらに削る場合は また選択し直します

30 そして上によせます ヘッダーの きさの調整 法で 別のやり をご紹介します さっきの状態から Ctrl+Z で元に戻して 縦が い状態にしてみます それから 変形 伸縮と傾き をクリックします 垂直の部分を 75% とかで縮めて 縦に押しつぶす 法です

31 こうすると た感じもつぶれるんですが 広々とした感じになります 表 されるものは同じ物ですが ヘッダーとしては広がりのあるような感じになります もう少し さらにつぶしてみてもいいですね 80% くらいでやってみましょう どうでしょう 最初の の画像を てるとつぶれたよう えますけれども 初めて る はこれを 番最初に るので そんなにつぶれているとは思わないと思います これが2 番 の 法 垂直の部分を縮めてやる調整の仕 です

32 これも出来上がったら同じように ファイル から 名前をつけて保存 です 画像ができたら ホームページやブログで使ってみてください 以上で有料 無料素材を使ってペイントで作る ヘッダー画像を作り の解 説を終わります 今回ご紹介しました無料サイトとペイントの組み合わせですと今すぐにでもヘッダー画像が作れます 早速やってみてください ある程度 ペイントの使い に慣れたら もっと上級のソフトを使ってみたくなりますね 無料でもとても 機能のソフトがあります GIMP( ギンプ ) というソフトです 海外ソフトですが 本語の解説サイトもありますので いってみてください GIMP 公式サイト ( 英語 ) GIMP 本語解説サイト 素材写真 素材辞典フォトバイブル 20000

33 今回のレポートの動画版もあります 動画を るにはここをクリックしてください インターネットエクスプローラ ーなどのブラウザで ていただけます 最後までご覧いただき ありがとうございました わからないところがありましたらお気軽にご質問ください スタジオ 163 松崎 郎

34 このレポートに掲載した動画はまぐまぐから発 していますメルマガ いきなりドカンの儲け! ネットで稼ぐ最先端の成功法 で配信したものです 最新動画マニュアルを 逃したくない は 確実に受け取れるメールアドレスで登録しておいてください 無料レポートの請求ページでお知らせしましたように メルマガ いきなりドカンの儲け! ネットで稼ぐ最先端の成功法 に代理登録させていただきます 松崎 郎のメルマガをうっかり解除しないようご注意ください ご質問 お問い合わせはお気軽にこちらからどうぞ スタジオ 163 松崎 郎 制作 著作スタジオ 163 松崎 郎

35 松崎 郎制作の動画教材 7 のアフィリエイターへのインタビューで聞き出した アフィリエイトで稼ぐ本当の秘密 動画 10 時間 声 10 時間 図解 り書き起こし 537 ページ しかも再配布権付きで 特典に最適 アフィリエイト成功への最後の鍵伝授

36 簡単に動画や 声を配信したい へ 初 者向けに特化した動画の配信講座 松崎 郎 & ムカイツヨシのあっと動画 松崎 郎の動画マニュアル YouTube マーケティングを極めるならコピペ動画マーケティング