WEB制作におけるポイント・Tips集③

この記事は、
WEB制作におけるポイント・Tips集②の続きになります。

---------------------------

DESIGN RULE 56
カラーモードとカラープロファイルを設定しよう

RGB は2 種類ありますが、web で使用される一般的な標準プロファイルはsRGB になります。

sRGB...
国際電気標準会議(IEC）という電気に関する国際規格を統一する機関が決めた色空間の標準規格で、主にパソコンのモニターやデジカメ、プリンタなどにsRGB が使用されています。

Adobe RGB ...
Adobe 社独自の規格でDTP などの印刷分野で一般的に使われていて、sRGB よりAdobeRGB の方が緑や青色の色空間が広くより多くの色を表現できます。

色についてweb 用の設定をしてから制作をはじめましょう。

STEP1
web を制作するときはカラーモードをRGB に設定しましょう。
STEP2
RGB には2 種類あるので、「編集」→「カラー設定」を選択し、
プリセットを[ web・インターネット用- 日本 ] にしてPhotoshop の色の作業環境をweb 向けにしておきましょう。

この設定にしておけば、開く画像にプロファイルがついていれば
Web の標準プロファイルであるsRGB の色域に変換し、プロファイルがない場合はsRGB の色域で作成したものとして開いてくれます。

---------------------------

DESIGN RULE 70
「画像アセット生成」による書き出し

1 つのレイヤーに対して複数画像を書き出したいときには「,（カンマ）」で区切るだけでOK です。Retina 対応と通常の画像を書き出したい時には、カンマを使えば原寸サイズと2 倍サイズで書き出せます。
このとき、200 パーセントで書き出す方は名前に@2x など少し名前を変えておくと同じフォルダーに保存しても上書きされないので便利です。

例：test.png, 200% test@2x.png

---------------------------

半年間noteにまとめてみて継続する難しさもありましたが、
知識が身になった実感があるのでめげずに引き続きWebの勉強頑張ります。
読んでくださりありがとうございました！