本日はwebでの画像制作について行いました。

———————————-

画像解像度

———————————-

前回の復習

webでは画像解像度72dpiが基本となります。

dpiはドットパーインチで、1インチにいくつのドット(点)があるかを示します。

ppiとして、ピクセルパーインチで、1インチにいくつのピクセルがあるかとする場合もあります。

ドットもピクセルも同じ点を表しているので、dpi、ppiどちらも同じです。

最近のデジカメや、スマホのカメラは性能が高いため、画像をwebで使用するには、高解像度過ぎてしまいます。

解像度を72にしたうえで、サイズの調整をしましょう。

スマホ対応に関して

PCのモニタは、Macは72dpi、Windowsは96dpiが基本です。

(最近はもっと高い解像度のモニタもあります)

スマホの液晶画面は、300dpi以上のものが多いので72dpiを基本に画像サイズを調整するとボケたように見えてしまいます。

単純計算で

72dpiで見たときに10cmの画像は、

144dpiで見ると5cmに見えます。

5cmの画像を10cmに拡大するのでボケてしまうのです。

スマホの画面の横幅いっぱいに画像を表示するには、640から800以上欲しいところです。

———————————-

画像の切り抜き

———————————-

Mac標準のプレビューでも簡単な画像の切り抜きは行えます。

「投げなわで選択」ツールで自由に選択範囲を作り、「ツール」メニューから「切り取り」で切り抜けます。

「スマート投げなわ」ツールは、ざっくり選択すると色の境界線を自動的に選択範囲にしてくれます。

「インスタントアルファ」ツールは、ドラックした場所の同系色が自動的に選択範囲になります。

細かな切り抜きの調整を行う場合は、Photoshopなどのソフトが必要になります。

GIMPなど無料のソフトもあります。

画像の切り抜きは、時間も手間もかかってしまいます。

はじめから切り抜きの必要ない撮影をすることが理想です。

———————————-

Macでスマホ表示確認

———————————-

MacのSafariで、iPhoneでの表示を確認することができます。

「Safari」メニューから「環境設定」を選択。

「詳細」タブの「メニューバーに”開発”メニューを表示」にチェック。

メニューに「開発」メニューが表示されるようになるので、

「開発」メニューから「レスポンシブ・デザイン・モードにする」を選択でiPhoneなどでの表示を確認できます。

———————————-

web上の画像サイズ確認

———————————-

MacのSafariの場合、2本指タップ(右クリック)で「要素の詳細を表示」を選択すると、画像サイズなど様々な要素の確認ができます。

———————————-

その他

———————————-

メールの宛先

To:宛先

Cc:Carbon Copy(カーボンコピー)の略

Bcc:Blind Carbon Copy(ブラインドカーボンコピー)の略

Ccは、複数の人に同じ内容を送信するときに使います。

受け取った人は、自分以外の誰に送られたのかわかります。

Bccは、複数の人に同じ内容を送信することはCcと同じですが、受け取った人は、自分以外の誰に送られたのかはわかりません。