今回は、Photoshopで作ったボタンやバナーをWebサイト用に個別のパーツとして書き出すためのスライス機能を解説しています。
Photoshop上で作成した画像は、インターネットブラウザで表示できる、「jpgやgif、pngなどのファイル形式」に変換して保存する必要があります。
この作業のことを「書き出し」といいます。
Webサイト用の画像は、webページ全体を1枚の画像で構成するのではなく、例えばイメージ画像やボタン、バナーといったように部分ごとにパーツを分けて書き出す必要があります。
この画像を分割する作業のことをスライスといいます。
パーツに分けて書き出した画像をHTMLで組み立てることでwebページを作ることができます。
概要
- ドラックによるスライス
- スライスのコツとショートカットキー
- スライスのサイズや位置を調整する
- スライス選択ツール
- スライスをコピーする方法
- スライスオプション
スライスはPhotoshopでデザイン後、部分ごとにパーツを分けていくという必ず必要となる作業です。
できるだけ効率よく進められるようにショートカットキーを利用するようにしましょう。
【Webデザインを学びながらビジネス力も身につける体験型スクール&オンラインサロン】を運営する50代のWebデザイナー。 元スタイリスト→パソコン初心者→子育てしながらWebでお小遣い稼ぎ考える→ネットショップ運営→アフィリエイター→Webデザイナー→未経験でいきなりフリーランス。 こんな経歴を辿り2013年からWebデザインのオンラインスクールをプラットフォームに頼らず、ほぼ自力で運営しています。 「仕事は自分で創りだすもの」がモットー☆