Illustratorでのウェブデザイン制作によく使うショートカット[随時更新]

Illustratorでのウェブデザイン制作によく使うショートカット[随時更新]

2025年05月19日 /最終更新:2025年05月19日

Illustratorを使用してウェブデザインの制作を行う場合に頻繁に使用するショートカットを紹介します。

Illustratorでのウェブデザイン制作によく使うショートカット[随時更新]

Illustratorを使用してウェブデザインの制作を行う場合に頻繁に使用するショートカットの紹介です。

Illustratorでのウェブデザイン制作作業の流れ

まずIllustratorでウェブデザイン制作する場合の作業の流れを確認します。

  1. ファイルを作成
  2. ガイドを引く
  3. デザインを作る
  4. 保存する

基本的にはウェブデザインだからと言って特別な工程はなく一般的なファイル作成の流れと同じです。

ショートカットの紹介

ファイルを作成・保存・閉じる

ファイル操作編
目的 ショートカット 上部メニューから
新規ファイルを作成 Crtl + N ファイル > 新規
保存 Crtl + S ファイル > 保存
閉じる Crtl + W ファイル > 閉じる
終了 Crtl + Q ファイル > 終了

ガイドを引く

ガイド編
目的 ショートカット 上部メニューから
ガイドを作成 オブジェクトを選択してCrtl + 5 表示 > ガイド > ガイドを作成
ガイドをロック オブジェクトを選択してAlt + Crtl + : 表示 > ガイド > ガイドをロック
ガイドを隠す オブジェクトを選択してCrtl + : 表示 > ガイド > ガイドを隠す

ツールを駆使してデザインを作る

拡大・縮小・移動編
目的 ショートカット ツール名
キャンバスを拡大 Ctrl + Space + 拡大したい部分をクリック ズームイン(拡大)ツール
キャンバスを縮小 Ctrl + Alt + Space + 縮小したい部分をクリック ズームアウト(縮小)ツール
キャンバスを移動 Space + ドラッグ  手のひらツール
選択系ツール編
目的 ショートカット ツールパネルアイコン
選択ツール V
ダイレクト選択ツール A
描画系ツール編
目的 ショートカット ツールパネルアイコン
ペンツール P
長方形ツール M
楕円形ツール L
直線ツール
テキスト系ツール編
目的 ショートカット ツールパネルアイコン
横書き文字ツール T
変形系ツール編
目的 ショートカット ツールパネルアイコン
回転ツール R
リフレクトツール O
特殊加工系ツール編
目的 ショートカット ツールパネルアイコン
シェイプ形成ツール Shift + M
線幅ツール Shift + W
ブレンドツール W
カラー系ツール編
目的 ショートカット ツールパネルアイコン
スポイトツール I