01. はじめに

Web制作AI活用完全講座へようこそ。

この講座では、Web制作の学習、設計、実装、提案、ディレクション、品質チェックの中で、AIをどのように使うかを学びます。

AIは、Web制作の仕事をすべて自動で終わらせてくれる魔法の道具ではありません。ですが、使い方を理解すれば、調べる、整理する、考える、作る、直す、確認する作業を大きく助けてくれます。

この講座では、AIを「人の代わり」ではなく、Web制作を進めるための補助ツールとして扱います。

この講座の対象

この講座は、Web制作を学習中の人、またはWeb制作の実務でAIを使いたい人を対象にしています。

HTML、CSS、JavaScriptを学んでいる途中でも読めるようにしますが、Web制作の基本的な流れを少しでも知っていると理解しやすくなります。

たとえば、次のような人に向いています。

AIを使う時に大事なのは、答えを丸ごともらうことではありません。

大事なのは、自分が何をしたいのかを整理し、AIに適切な情報を渡し、出てきた答えを自分で確認することです。

Web制作では、見た目、使いやすさ、表示速度、アクセシビリティ、保守性、クライアントの意図など、いろいろな判断が必要になります。AIはその判断材料を出すことはできますが、最終的な判断と責任は人間が持つ必要があります。

この講座では、AIの専門的な内部構造や、AIアプリケーション開発は扱いません。

たとえば、次の内容は深掘りしません。

AIツールは変化が速いため、この講座では細かい画面操作よりも、考え方、使いどころ、安全な進め方を中心に学びます。

最初に、AI時代のWeb制作の全体像を整理します。

そのあと、AIに依頼するためのプロンプト設計、学習中の活用、コーディングでの活用へ進みます。

後半では、Cursor、AIエージェント、MCP、デザインAI、DESIGN.mdを扱います。

すべてを一気に使いこなす必要はありません。まずは「AIに何を任せられるか」「どこは自分で判断するべきか」を分けて考えられるようになることを目指します。

AI活用では、ツール名よりも使い方の考え方が重要です。

ツールが変わっても、前提を渡す、目的を伝える、制約を指定する、出力を確認する、という基本は大きく変わりません。

次の章では、AI時代にWeb制作の仕事がどう変わるのかを整理します。