概要

HTML・CSS・JavaScript・PHP を横断してWebの全体像を最短で把握する

想定読者

これからWeb制作・開発に関わる非エンジニア職・文系学生・職種転換者で、フロントエンドからサーバーサイドまで全体像を一冊で把握したい人。分厚い専門書を読む前に全体像を掴んでおきたいエンジニア志望者にも向く

こんな人には向いていない

• すでにHTML/CSSの基礎を習得しており、JavaScriptフレームワーク(React/Vue等)やバックエンド設計を学びたい中級者には本書の扱い深度が物足りない
• PHPを業務システムに本格適用したいエンジニアには、Laravel等のフレームワーク解説が含まれないため実務への直結が薄い
• 最新のES6+記法やWebpack・Viteなどモダンなフロントエンドツールチェーンを中心に学びたい読者には、本書のJavaScript解説はブラウザ組み込みAPIを中心としており対象範囲が異なる

読了後にできるようになること

• HTML/CSSの基本タグ・セレクタ・ボックスモデルを組み合わせてWebページを構成できる
• メディアクエリを使ったレスポンシブWebデザインの基本的な実装ができる
• JavaScriptの変数・関数・配列・オブジェクトを用いた基本的なデータ操作ができる
• DOM操作とフォーム処理を組み合わせてインタラクティブなUIを実装できる
• PHPとデータベースを使ってサーバーサイドのデータ保存・取得を実装できる
• AjaxによるWebAPIの非同期呼び出しの仕組みを理解し、簡単なデータ取得処理を書ける

本書のキー概念(章解説)

• 第 1 章 HTMLによるWebページ作成 — HTML の基本構造・タグの役割・リンク・画像挿入を扱う。後続の CSS・JavaScript の前提となるため丁寧に進める
• 第 2 章 CSSによる装飾とレイアウト — セレクタ・ボックスモデル・Flexbox を中心に扱う。第3章のレスポンシブデザインと直接つながる章
• 第 3 章 レスポンシブWebデザイン — メディアクエリによる画面サイズ対応。Webデザイン編の集大成でスマートフォン表示への適用までカバー
• 第 4 章 JavaScriptの基本 — 変数・関数・条件分岐・ループを扱う。プログラミング未経験者はここで最初の壁を感じやすいため例題を手で写経することを推奨
• 第 5 章 JavaScriptによるデータ操作 — 配列・オブジェクト・JSON形式のデータ操作を扱う。第8章のAjax通信との接続に必要な基礎
• 第 6 章 DOM、Form、jQuery — HTML要素の動的操作と入力フォームの処理。実用的なインタラクション実装の核心章
• 第 7 章 サーバサイドプログラミング（PHP） — PHPの文法からMySQLとの連携まで。この章からローカルサーバー環境(XAMPP等)が必要になるため事前準備を
• 第 8 章 非同期通信Ajax — Web APIの呼び出しと非同期処理の基本的な仕組みを学ぶ。現代のWebアプリの動作原理を理解する上で重要な章
• 第 9 章 グラフィックス描画（Canvas） — HTML5 Canvas要素でのグラフィック描画。第10章のスケジュール管理アプリで活用される応用技術の準備章
• 第 10 章 スケジュール管理アプリ — 第1〜9章の技術を統合した最終成果物。HTML/CSS/JS/PHP/Ajax/Canvasの連携を体験できる集大成章

ハイライト

• Webページ制作・Webアプリケーション開発の入門書。制作・開発の全体像を概観し、Webのデザインとプログラミングの基礎を学べます(本書の立ち位置を端的に示す一文。特定技術の専門書ではなく「全体像を概観する」という設計意図が購入判断に直結する)
• 覚えることも作業量も必要最小限でOK。分厚い本が苦手でも安心。例題や練習問題を解いて、理解を深められる。実用的なアプリケーション（スケジュール管理アプリ）を作成できる(学習コストと最終成果物の両面を同時に示す箇所。「読みきれる」かどうかを判断する情報として有効)

編集メモ

Qiita記事での本書への言及は確認できず(qiita_article_count=0)。Rakutenランキング情報も入力なし。Web入門書として複数技術を横断的に扱う構成は学習の出発点として有用だが、外部シグナルが取得できないためsupplementaryとする

読む前に押さえておきたいこと

• PCの基本操作とファイル管理(フォルダ構成・テキストエディタの操作)。プログラミング経験は不要
• Webブラウザでのサイト閲覧経験があれば、学習の文脈がつかみやすい(必須ではない)

学習のコツ

• 第1〜3章(Webデザイン編)は独立して進められるが、第4章以降でHTML/CSSの知識が前提として出てくるため、関心がプログラミングにあっても1〜3章は通読しておくと詰まりにくい
• 第7章(PHP)から先はローカルサーバー環境が必要。XAMPPやMAMPの環境構築を第7章の前に済ませておくと、学習のリズムが崩れない
• 第10章(スケジュール管理アプリ)は各章の技術を統合する集大成のため、第7〜9章を終えた直後に取り組むと連携のイメージが定着しやすい
• 例題は手で写経し、章末の練習問題に自力で取り組む流れが本書の推奨スタイル。コピーペーストのみで進めると動作確認はできるが理解の定着が薄くなる