どうも。ノッツです(^o^)/
ブロガーの皆さん、ブログに画像を載せるのにどのような手順で行っていますか？
人それぞれだと思いますが、何かの参考になればと私がブログに画像をアップするまでの流れを紹介しようと思います。
今回は、iPhoneやiPadで撮影した写真やスクリーンショットについてです。
基本的にiPhoneで説明していきますが、iPadの場合も同じです。主に、Macのデフォルトのアプリケーション、Adobe製品であるPhotoshop CCを利用します。
Photoshop CCは、Creative Cloudに申し込むことで使うことができますよ。
追記：PCのスクリーンショットとカメラの写真をブログにアップするまでの流れの記事を書きました。
iPhoneやiPadで撮影した画像をパソコンに取り込む方法
まず、iPhoneで撮影した写真やスクリーンショットをパソコン（Mac）に取り込むので、その方法を説明していきます。
写真アプリの起動
Macにデフォルトで入っている（Yosemite以降）、【写真】アプリを使用します。
写真アプリを起動し、タブから「読み込み」を選択します。
このとき、iPhoneとMacをLightningケーブルで接続しておく必要があります。
Lightningケーブルを接続しなくともクラウド経由で取り込むこともできますが、その場合は以下の設定を予めしておく必要があります。
iPhoneの【設定アプリ】から【iCloud】をタップします。《iCloud》画面の「写真」をタップし、「iCloudフォトライブラリ」をオンにします。
Macの写真アプリのメニューから【写真】から【環境設定】をクリックします。《iCloud》画面の「iCloudフォトライブラリ」をオンにします。
こうすることで、クラウド経由で自動的に写真アプリに取り込まれます。
写真アプリ内に取り込み
写真アプリ内に取り込むために、ドラッグ&ドロップなどで取り込みたい画像を選択します。
今回は全ての画像を選択したので「すべての新しい写真を取り込む」を選択し、写真アプリ内に取り込みます。
写真アプリを使う場合、一旦写真アプリ内に取り込まないとMacのFinder内に取り込むことができません。直接取り込める方法があればいいのですが…
一部の写真を取り込みたい場合は「選択項目を取り込む」を選択します。
取り込みが完了すると、アルバムに移動し取り込まれていることを確認します。
Mac内に移動
続いて、写真アプリ内の写真をMac内に移動します。
アルバムからMac内に取り込みたい写真をドラッグ&ドロップなどで選択し、ドラッグ&ドロップでMac内のFinderなどに移動させます。
取り込み先のFinderの名前は、「日付@分かりやすい名前」にしています。今回は「2015-07-30@iPhoneの画像をUPする方法」です。
この方が過去にブログにUPした画像を後から探しやすいためです。
ファイル名の変更
写真アプリ内からMac内のFinderに移動すると以下のようになります。
ファイル名がデフォルトの状態になっているので、分かりやすいファイル名に変更しています。
分かりやすいファイル名に変更したほうがSEO的に良いと思っているからです。
以下の記事のように一括で変更したほうが効率的です。
ファイル名を変更して以下のようにしました。
Photoshop CCで編集
Photoshop CCを使って画像を簡単に編集します。
ブログに載せる画像を一旦全て開きます（Web用に最適な画像として保存も行うので）。
基本的にやることは、説明をしている箇所を示すために赤色などで囲んだり、見せたくない箇所をモザイクをかける2通りです。
編集する必要のない画像は、ここの編集作業を飛ばします。
iPhoneの画像は、スクリーンショットのみしか基本使いません。
写真を使うときは色などを編集することが多いですが、こちらの方法は別記事でUPします。
追記：写真をブログにアップする方法の記事を書きました。
説明をしている箇所を示す
赤色で囲む場合は以下のようにします。
「角丸長方形ツール」を選択します。このとき「シェイプ」になっていることを確認します。
あとは色や線の太さなどを設定し、説明したい箇所をドラッグ&ドロップすればできます。
見せたくない箇所にモザイクをかける
モザイクをかける場合は以下のようにします。
「長方形選択ツール」を選択し、モザイクをかけたい箇所をドラッグ&ドロップで選択します。
メニューの【フィルター】から【ピクセレート】の「モザイク」をクリックします。
モザイクのセルの大きさを選び、「OK」をクリックします。
画面上でモザイクのかかり具合を確認できるので便利です。
これでモザイクをかけることができます。
2回目以降、同じフィルターをかける場合は、command +control+ F でできるので便利です。
PhotoshopでWEB用に書き出し
編集が終わると、Web用に最適な画像として書き出しを行います。
アクション機能を使って予め登録しているのでワンタップで終わらせしますが、まだアクション機能を設定していないとして説明します。
アクション機能については以下の記事で説明しています。アクションとして以下の操作を登録して使うことで、効率よくWeb用に最適な画像を作成できます。
メニューの【ファイル】から【書き出し】の「書き出し形式」をクリックします。
《書き出し形式》画面となるので、保存形式や画像サイズを設定します。
私は以下のように設定しています
- 保存形式：JPG
- 画質：30%
- 画像サイズ幅：700px
設定する際に注目すべきところは、プレビュー画面の右下にでているファイルサイズです。
画像サイズを変更すると、そのときのファイルサイズが確認できます。
あまり大きいサイズにするとSEO的やユーザービリティ的によくないのでなるべく小さいサイズに設定します。
拡大縮小機能を使って、変更後の画質も確認できます。
設定が終われば、「書き出し」をクリックします。
書き出し専用のFinderに書き出した画像を保存するようにしています。
「書き出し」をクリックすることでWeb用に最適な画像が作成され保存されます。
上記で説明してきたことをアクションで登録することで、次からはワンクリックで書き出しが実行されます。
画質を30、50、70の場合を作っていますが、最近は画質30しか使っていません。
ブログ（WordPress）にアップ
最後に、作成した画像をブログにアップします。
WordPressの場合は、ドラッグ&ドロップでブログ内に選択した画像を一気に取り込めるので簡単です。
さいごに
私がiPhoneやiPadの画像をブログに取り込むまでの流れをPhotoshop CCでの編集を交えて説明してきました。
この方法は無限通りあると思いますが、私はこの流れで取り込んでいます。
Photoshop CCを利用する場合、アクション機能を使って登録してしまえば、簡単にWeb用に最適な画像が作成できるので便利です。
Photoshop CCは、体験期間を利用することで一定期間無料で使うことができます。
Photoshop CCの体験版はこちら。
Photoshop CCについてはこちらから。
⇒ Photoshop CC
Photoshop CCを一つ利用したい場合はCreative Cloudの単体プランとなり月額2,180円かかります。
Photoshop CCの他に、Lightroom CCやLightroom Classic
CCを利用したい場合は、Creative Cloudのフォトプラン
というPhotoshop CCとLightroom CC、Lightroom Classic CCがセットに使える月額980円のプランもありますので、3つ使いたい場合はこちらのプランを使うといいと思います。こっちのほうが安いです。
フォトプランの体験版はこちらから。
フォトプランについてはこちらから。
⇒ フォトプラン
フォトプランは単体プランと比べると、オンラインストレージが20GB（単体プランは100GB）となったり、Typekitが使えないなどといったことがありますが、安く使えるのでそれほど気にすることではないでしょう。
Photoshop CCやLightroom CC、Lightroom Classic CCの他に、Illustrator CCやInDesign
CCなども使いたい場合は、Creative Cloudのコンプリートプランという月額4,980円のたくさんのソフトが使用できるプランを使うといいでしょう。
プラン違いは、Creative Cloudのプラン比較表に書かれているのでこちらを御覧ください。
コメント