サイトマップ

【初心者向け】WEBデザインする前にPhotoshopCC大事な環境設定基本知識

検索
ログイン

【初心者向け】PhotoshopCCを始める前に、大事な環境設定基本知識(WEBデザイン編)

【初心者向け】PhotoshopCCを始める前に、大事な環境設定基本知識(WEBデザイン編)
今回はWEBサイトを更新や、デザインする為に、初心者レベルでPhotoshopCCを使用する前に大事な【環境設定基本知識】をご紹介したいと思います。\(o⌒∇⌒o)/

皆さんご存知でしょうか?

Photoshopは2015年から、【Creative Cloudフォトグラフィプラン】というプランが月980円で購入できるサービスを始めました。

プロ以外の方々もPhotoshopを手に入れ易くようになりました。

 

今回はWEBサイトを更新やデザインする為に、初心者レベルでPhotoshopCCを使用する前に

大事な【環境設定基本知識】をご紹介したいと思います。\(o⌒∇⌒o)/

Photoshopとは

Photoshopとは、アドビシステムズが販売している、あらゆるクリエイティブワークの中核となる、世界最高峰の画像編集アプリケーション。

写真、Webサイトやモバイルアプリなどのデザイン、3Dアートワーク、ビデオなどの制作と編集をデスクトップとモバイルデバイスで行えます。

 

※参照元リンク:Adobe Photoshop CC公式ページ

初心者に対して、Photoshopを使って、何ができますか?

WEBサイトを更新やデザインするとき、Photoshopを使って、下記のようなことができます。

写真の編集と作成(サイトのメイン画像とかの作成)

画像の上に文字と図形を追加サイトのコンテンツを追加する際、画像を追加する場合)

図形やグラフとかの作成(ロゴデザインとかもできます!)

画像見出しを作成

 

※何故、WEBサイトに対して、画像が必要ですか?

その理由はこちらからご覧ください:サイトやブログを更新する時、画像の選び方

 

まずはPhotoshop体験版をダウンロードして体験してみましょう

PhotoshopCCでは無償体験版を提供してありますので、

こちらから体験版をダウンロードしてください。

PhotoshopCC体験版をダウンロード[click!]

 

それでは、PhotoshopCCを使用始める前に大事な【環境設定基本知識】をご紹介いたします。

※以下はWindows7をベースとして、PhotoshopCCの環境設定をご紹介します。

STEP01 単位設定

世の中に、色んな単位があります。例えば:mm、cm、inch...等

WEBデザインの世界では、単位が[pixel]になります。WEBデザインする前には必ず、Photoshopの単位を[pixel]に設定してください。

具体的は、Photoshopのメニューバーの[編集]→[環境設定]→[単位・定規]を選択します。(※画像1)

画像2のように、[単位]の[定規]と[文字]を[pixel]に設定します。

それから、[新規ファイル解像度のプリセット]を[pixel/inch]に設定し、右側の[OK]をクリック。

 

 

STEP02 カラー設定

カラー設定というのは[CMYK]か[RGB]に設定すること。

WEBデザインする場合は[RGB]形式に設定することが必要です。印刷系デザイン(チラシやポスターを作る)の場合は[CMYK]です。

まずはメニューバーの[編集]→[カラー設定]を選択します(※画像3)。

画像4のように[作業ベース]の[RGB]を使用中ディスプレーに設定します。[グレー]はWindowsの初期値の[Gray Gamma 2.2]に設定してください。

 

[カラーマネジメント ポリシー]に[プロファイルの不一致]の[開くときに確認]にチェックを入れてください。(※画像4)

※写真やほかのモニター完了でデザイン作成したファイルを開くときなど、プロファイルを含むデータをやり取りする際、必ずチェックを入れておきます。

それから[OK]をクリック。

STEP04 表示設定

作業中のカラー表示モードを設定することです。

WEBデザインの場合、カラー形式はRGBですので、表示設定も[RGB]に設定する必要があります。

具体的な設定は:メニューバーの[表示]→[校正設定]→[モニター RGB]を選択します。(※画像5)


上記のような設定をしますと、STEP03に設定したカラー設定内容でドキュメントが表示されるようになります。

設定完了!まとめ

以上4ステップで、初心者に対して必要な環境設定を完了しました。o(*^▽^*)o~♪

 

これから、どんどんPhotoshopを使って、色んなデザインとかを試してください~

次回はPhotoshopの各基本ツールの使い方をご紹介したいと思います!

 

最後まで読んで頂いてありがとうございます!(*゚v゚*)

この記事は皆さんにお役になりましたら、嬉しいです><

 

よろしければ、『シェアボタン』や『お気に入り』を押してくださいね〜〜〜

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

お気に入りに追加

WenjunQ

デザインのチカラで、クライアントのサイトを成果が出るようなお役に立てるデザイナーを目指し、日々頑張っております。0v0-v

このカテゴリ注目のキーワード

あなたにおススメの記事

この記事へのコメント

コメント(0)

利用規約に違反するコメントを確認された場合はご報告ください

ログインしてコメントを書く
まだコメントはありません。

このカテゴリの新着記事

今すぐどうにかしたい方へおススメ
パソコンが重すぎて仕事にならない今すぐ何とかしたい!誹謗中傷検索順位がズドンと落ちた!
アクセス数ランキング
  • ALL
  • PCトラブル
  • ネットトラブル
  • パソコンスキル
  • ホームページ
コメント数ランキング
  • ALL
  • PCトラブル
  • ネットトラブル
  • パソコンスキル
  • ホームページ
パソコントラブル解決マルウェア対策ネットトラブル解決誹謗中傷対策パソコンのスキルアップ楽しみ方・活用法ホームページWEB活用ノウハウ
pagetop