WEBサイト制作ツール [Photoshop]WEBsite Design Tools

[PART1] Photoshopの基礎知識と基本操作

【STEP01】Photoshopと画像処理

Photoshopは、パソコンを使ってスキャナやデジカメから取り込んだデータを補正・加工したり、デザインを行うための画像処理ソフトウェアです。

Photoshopは、ビットマップを処理する

  • パソコンソフトのなかでグラフィックソフトに分類されるソフトウエアには、ビットマップデータを扱うソフトとベクトルデータを扱うソフトがあります。前者の代表が Adobe Photoshopです。後者の代表には Adobe Illustratorがあります。
  • ビットマップデータとは、パソコンモニタ上のピクセル単位で構成している画像データです。ビットマップデータは、ラスター画像とも呼ばれています。

ページトップへ戻る

目的に応じたカラーモードに変換する

  • カラー画像の表現方法には、テレビやパソコンモニタで行っているRGB方式、印刷のインク色で表現するCMYKなどいくつかの表現方法があります。
    Photoshopでは、Web用にはRGB、商業印刷用にはCMYK、ダブルトーンというように、さまざまな目的に応じたカラーモードの画像を作成できます。
  • 画像はRGBからレッド、グリーン、ブルーそれぞれのチャンネルとして記録さて、それぞれを同時に見るとカラーの画像として表現されているのがチャンネルパレットを見るとわかります。

ページトップへ戻る

印刷やWEB用の画像データを作成する

  • Photoshopは、JPEG、GIF、PNG形式といった画像形式で書き出すことができるので、バナーやボタンなどの WEB画像制作にも最適です。
  • 画像の保存には、「 WEBおよびデバイス用に保存」機能を使って、ファイルサイズを最適化したり、ターゲットとなるデバイスに最適な大きさで保存することもできます。
  • Photoshopは、デザインやクリエイティブなどさまざまな分野で利用されています。
    印刷によって表現するエディトリアルデザイン、Webのホームページのための画像作成、写真を表現するたまのデザイン、CD-ROMの製作なと、デジタルにとってさまざまなものを表現するためには、いまや Photoshopを抜きに語ることができないでしょう。
  • Photoshopは、紙に印刷する、モニタに表示するなど、目的によって画像の解像度 (表現の細かさ )を設定できます。 DTPで印刷のために作成した画像も、簡単に Web用に変換することができます。
  • Photoshopでは、1センチの長さの中にいくつピクセルがあるかで、画像の解像度を測ります (pixels/inch)。
    カラー印刷に適用できる 350ppiという解像度のデータは1インチ四方には 350×350=122500個のピクセルが存在することになります。
    Webなどで使う 72ppiの画像の場合は、1インチ四方には 72×72で 5184個のピクセルがあるということです。

ページトップへ戻る

写真だけではなくロゴや形状の作成も簡単

  • Photoshopでは、画像だけでなく、文字や Illustratorのような形状 (シェイプ )もレイヤーとして作成・編集することができます。
    また、シェイプやテキスト作成後も、パスを変形したり文字書式や内容を自由に変更することが可能です。
  • また、画像、シェイプ、テキストには、用意されたレイヤースタイルを適用することによって、簡単にドロップシャドウや光彩、ベベル、エンボスといった効果を適用することができます。

ページトップへ戻る


Photoshopは、目的によって画像の解像度を設定できます。

350dpiは、1インチ四方に350x350=122,500個のピクセルが存在する

 

画像ph_cgweb11

ページトップへ戻る