こんにちは、デザイナー・ブロガーの
ゆっきー（@elcielo_design）です。
今回は、HTML・CSSの基本等が
学べるような書籍を紹介しようと思います。
この記事の目次
HTML・CSSの基本等の書籍・本
この記事では、HTML・CSSの
基礎等を学べる本を紹介します。
HTML・CSSを初めて学ぶ方は、
まず次に紹介するどれかから選択して、
学び始めるのがおすすめになります。
特に、次のような人は読んでみて下さい。
- HTML・CSSを初めて学習する。
-
HTML・CSSの基本をしっかり学びたい。
-
Webデザイナーを目指している。
また、デザイン書籍等を1ヶ月無料で読むなら、
Amazonの「Kindle Unlimited」がおすすめ。
HTML・CSSの基本等を学べるの
書籍・本まとめ
「HTML・CSSの基本の書籍・本の一覧」
| 系統 | 書籍名 |
| ① HTML・CSSの基礎 | デザインの学校 これからはじめるHTML & CSSの本 |
| スラスラわかる HTML&CSSのきほん | |
| いちばんやさしい HTML&CSS 入門教室 | |
| いちばんよくわかる HTML5&CSS3デザインきちんと入門 |
|
| 世界一わかりやすい HTML＆CSS コーディングとサイト制作の教科書 [改訂2版] |
|
| 本当によくわかる HTML&CSSの教科書 | |
| ② Webデザインと HTML&CSS、 サイト制作基本 |
1冊ですべて身につく HTML &CSSとWebデザイン入門講座 |
| HTML&CSSとWebデザインが1冊で きちんと身につく本 [増補改訂版] |
|
| これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本 |
|
| 実習で身につく!新しいWebデザインの教科書 〜基礎から学べるHTML&CSSデザイン〜 |
|
| マネするだけでセンスいい! CSSデザイン |
下でそれぞれ詳しく紹介しています。
① HTML・CSSの基礎等が
学べる書籍・本
「HTML・CSSの基礎関連本」
- デザインの学校
これからはじめるHTML & CSSの本 -
スラスラわかる HTML&CSSのきほん
- いちばんやさしい HTML&CSS 入門教室
-
いちばんよくわかる
HTML5&CSS3デザインきちんと入門 - 世界一わかりやすい HTML＆CSS
コーディングとサイト制作の教科書
[改訂2版] -
本当によくわかる HTML&CSSの教科書
前半3冊は超初心者向け、
後半3冊は向けだと思います。
デザインの学校
これからはじめるHTML & CSSの本
HTML・CSSの入門書の中でも、
非常に分かりやすい説明が特徴的な本。
| タイトル (書籍名) |
デザインの学校 これからはじめるHTML & CSSの本 |
| 価格 | ¥2,178 (税込) |
| 発売日 | 2017/5/26 |
| 特徴 | ・基礎知識からよく使われるタグまで、 丁寧に学べてとても分かり易い入門書。 ・本自体のレイアウトやデザインも綺麗で 読み進め易い。 ・ソフトをインストールする必要もなくて、 メモ帳のみでも実践できるように構成 |
| 内容 | 01 ウェブページについて知ろう 02 HTMLの基本を理解しよう 03 ウェブページを作ろう 04 サブページを作ろう 05 CSSの基本を理解しよう 06 CSSでレイアウトしよう 07 テキストをデザインしよう 08 背景、影、枠線を付けよう 09 モバイル・ＳＮＳ対応して公開しよう |
| おすすめの人 | ・基本の基本からHTML・CSSを学びたい人 ・他の本では難しくて挫折してしまった人 ・スムーズなステップアップを踏むための 基盤を作りたい人 |
| その他 |
スラスラわかる HTML&CSSのきほん
小さなカフェサイト制作を通して、
HTML&CSSを学べる入門書の一冊。
| タイトル (書籍名) |
スラスラわかる HTML&CSSのきほん |
| 価格 | ¥2,178 (税込) |
| 発売日 | 2018/4/14 |
| 特徴 | ・累計4万部突破の前作の大改訂版 ・写真や絵本を見るように楽しみつつ読める ・図解が多くて、難しい用語もきちんと補足 ・PCだけでなくスマホやタブレットに 対応したサイトが完成できるようになった。 |
| 内容 | Webサイト制作を始める前に / HTMLの基礎 / 制作の準備と基本のHTML / 見出し、段落、リスト / リンクと画像の挿入 / ２ページ目以降を効率的に作成する / CSSの基礎 / CSSでページのスタイルを調整 / フロート、テーブル、フレックスボックス / フォームの作成 / モバイル端末に対応する / Webサイトの公開 |
| おすすめの人 | ・サンプルコードも多いので、直感的に HTML・CSSのイメージを掴みたい人 |
| その他 | ・「楽しく読めた」と言う口コミも多数 ・「いちばんよくわかる HTML5&CSS3デザインきちんと入門」と 同じ著者の本。 |
いちばんやさしい HTML&CSS入門教室
WebエンジニアでUIデザイナーである
岩田宇史さんが執筆をされた
Webサイトの作り方を学べる書籍。
| タイトル (書籍名) |
いちばんやさしい HTML&CSS 入門教室 |
| 価格 | ¥2,178 (税込) |
| 発売日 | 2018/10/20 |
| 特徴 | ・説明がとても丁寧に書かれていて、 初心者でもきちんと理解して読める。 ・実際のWeb現場のトレンドが反映してあり スマホ向けサイトに重点が置かれている。 |
| 内容 | 1 Webサイト制作の準備をしよう 2 HTMLの基本を学ぼう 3 Webページのひな形を作ろう 4 HTMLでトップページを意味付けしよう 5 CSSの基本を学ぼう 6 CSSでトップページを装飾しよう 7 メニューページとアクセスページを作ろう 8 お問い合わせページを作ろう 9 WebサイトをPCに対応させよう 10 Webサイトを公開しよう |
| おすすめの人 | ・Webデザイナー (プログラマー) として これから企業で活躍していきたい人 |
| その他 |
いちばんよくわかる
HTML5&CSS3デザインきちんと入門
多数の図解による読みやすさや
項目ごとの詳しい解説が特徴的な一冊。
| タイトル (書籍名) |
いちばんよくわかる HTML5&CSS3デザインきちんと入門 |
| 価格 | ¥2,728 (税込) |
| 発売日 | 2016/10/27 |
| 特徴 | ・図解が多数使われていて、読み易い上に それなりに深い内容まで勉強できる書籍。 ・Web制作の全体像を把握しやすい構成。 ・1つ1つの項目が丁寧に書かれている。 ・レスポンシブデザインやフレックス ボックスについてもきちんと解説。 ・情報量もある程度ある。 |
| 内容 | 1 Webサイトの仕組みを知ろう 2 HTMLの基礎知識とマークアップの実践例 3 CSSの基礎知識とページデザインの実践例 4 テキストの装飾 5 リンクの設定と画像の表示 6 ボックスと情報の整理 7 テーブル 8 フォーム 9 ページ全体のレイアウトとナビゲーション 10 レスポンシブwebデザインのページを 作成しよう |
| おすすめの人 | ・1つ１つ納得しながら学習を進めたい人 ・タブレットやスマホも意識したサイトを 作りたい人 |
| その他 |
世界一わかりやすい HTML&CSS
コーディングとサイト制作の教科書
[改訂2版]
赤間 公太郎/狩野 咲/鈴木 清敬 技術評論社 2022年01月22日頃
基礎から応用まで順序よく学べる
まさに教科書的なHTML&CSS学習本の一冊。
| タイトル (書籍名) |
世界一わかりやすい HTML＆CSS コーディングとサイト制作の教科書 [改訂2版] |
| 価格 | ¥2,948 (税込) |
| 発売日 | 2022/1/22 |
| 特徴 | ・教科書と言うだけあって、学校学ぶ感覚で 読み進んでいける書籍。 ・ブラウザ、サーバー等とは何かから始まり サイト制作の基礎や公開まで15レッスンで わかりやすく解説されている。 ・各レッスンの章末には練習問題あり。 ・専門学校の教壇に立つ著者陣が 実際の講義内容を体系立て構成される。 |
| 内容 | 1 wwwやwebサイト制作の基本を理解しよう 2 HTMLコーディングの基本を学ぼう 3 画像表示とリンクをマークアップしよう 4 リストとナビゲーションを マークアップしよう 5 表組みをマークアップしよう 6 フォームをマークアップしよう 7 CSSコーディングの基本を学ぼう 8 見出しや段落をスタイリングしよう 9 CSSレイアウトの基本を学ぼう 10 ページ全体をレイアウトしてみよう 11 リストとナビゲーションを スタイリングしよう 12 表をスタイリングしよう 13フォームをスタイリングしよう 14 webサイト制作を実践してみよう 15 webサイトを公開しよう |
| おすすめの人 | ・HTML・CSSを学ぶ初心者 |
| その他 |
本当によくわかる
HTML&CSSの教科書
HTML・CSSが勉強できる一冊。
| タイトル (書籍名) |
本当によくわかる HTML&CSSの教科書 |
| 価格 | ¥1,958 (税込) |
| 発売日 | 2018/9/21 |
| 特徴 | ・サンプルサイト作成を通してWeb制作の 様々なテクニックを身につけられる。 ・Webサイトを公開するまでの手順や ファイルの設置方法、SNSのogpタグの 書き方までしっかり説明されている。 ・この本はコードを書いては 消す方式なのでテンポは悪い。 |
| 内容 | 1 Webサイト制作の事前準備 2 HTMLの基本 3 CSSの基本 4 Webサイトの作成 5 レスポンシブ対応 6 Webサイトの集客 7 Webサイトの公開 付録 シングルページサイトの作成 |
| おすすめの人 | ・Web制作から公開までの一通りのことを 学びたい人 |
| その他 |
② WebデザインとHTML・CSS、
サイト制作の基本等が学べる書籍・本
「WebデザインとHTML&CSSの本」
- 1冊ですべて身につく
HTML &CSSとWebデザイン入門講座 -
HTML&CSSとWebデザインが1冊で
きちんと身につく本 [増補改訂版] - これだけで基本がしっかり身につく
HTML/CSS&Webデザイン1冊目の本 -
実習で身につく!新しいWebデザインの教科書
〜基礎から学べるHTML&CSSデザイン〜 - マネするだけでセンスいい!
CSSデザイン
1冊ですべて身につく
HTML & CSSとWebデザイン入門講座
「Webクリエイターボックス」の
Manaさんが書かれたHTML・CSS入門本。
| タイトル (書籍名) |
1冊ですべて身につく HTML &CSSとWebデザイン入門講座 |
| 価格 | ¥2,486 (税込) |
| 発売日 | 2019/3/16 |
| 特徴 | ・全国の書店員がおすすめする本 (CPU大賞) 第1位受賞、2019年上半期売上 第1位。 ・Amazonのベストセラー本 ・Webサイト制作するための基礎から始まり HTML・CSSの基本が初心者に分かり易く 説明されている。 ・プロの現場で役立つテクニックのみならず 使い易く美しいデザインを作るコツも記載 |
| 内容 | 1 最初に知っておこう! Webサイトの基本 2 Webの基本構造を作る! HTMLの基本 3 Webのデザインを作る! CSSの基本 4 フルスクリーンのWebサイトを制作する 5 2カラムのWebサイトを制作する 6 タイル型のWebサイトを制作する 7 外部メディアを利用する |
| おすすめの人 | ・これからWebサイトを作り始める初心者 ・HTMLとCSSを基本から学びたい人 ・美しいデザインのWebサイトを作りたい人 |
| その他 |
HTML&CSSとWebデザインが
1冊できちんと身につく本
[増補改訂版]
Webサイト制作に必要なHTML・CSSの
知識に加え、Webデザインの定番の
レイアウトやデザインを学べる書籍。
| タイトル (書籍名) |
HTML&CSSとWebデザインが1冊で きちんと身につく本 [増補改訂版] |
| 価格 | ¥2,860 (税込) |
| 発売日 | 2022/1/17 |
| 特徴 | ・チュートリアル形式で、サンプルサイトを 作りつつ必要な知識を順番に身につけれる。 ・複数のレイアウトを一冊で学べる。 ・実践的なテクニックも多く掲載。 ・言語の解説だけでなくWebデザインの 基礎についても解説。 ・レスポンシブデザインによる マルチデバイス対応が分かる。 ・サンプルサイトは見栄えも拘ってある。 ・サンプルデータがダウンロード可能。 |
| 内容 | 1 知っておきたいサイトとデザインの きほん知識 2 サイト制作の前に準備しておくこと 3 知っておきたいHTMLのきほんと書き方 4 知っておきたいCSSのきほんと書き方 5 フルスクリーンページを制作する 6 シングルカラムページを制作する 7 2カラムページを制作する 8 グリッドレイアウトページの制作と 動画の埋め込み 9 問い合わせページを制作する 10 マルチデバイス対応ページを制作する appendix ポートフォリオサイトを オリジナルに改変してみよう |
| おすすめの人 | ・はじめてHTMLやCSSを学び、 これからサイト制作をはじめる人 ・超初心者ではないが未経験から Webデザイナーを目指している人 |
| その他 |
これだけで基本がしっかり身に付く
HTML/CSS&Webデザイン
1冊目の本
Capybara Design 竹内 直人/竹内 瑠美 翔泳社 2021年10月14日頃
Webサイト制作をこれから学ぶ人へ送る
1冊目に最適な超最新のWebデザイン入門書。
| タイトル (書籍名) |
これだけで基本がしっかり身につく HTML/CSS&Webデザイン1冊目の本 |
| 価格 | ¥2,420 (税込) |
| 発売日 | 2021/10/14 |
| 特徴 | ・手を動かして、Webサイトを作ることを 重視した構成。 ・やさしく要点を押さえた解説。 ・オシャレでバリエーション豊かなサンプル サイトで、制作できるサイトは計4種類。 ・豊富な図解とイラスト、キャラクターによる ガイドになっている。 ・コーディングの知識だけでなく、学習を 続ける上での学び方のコツやポイントも紹介 ・重要なポイントの理解を助ける動画もあり。 |
| 内容 | Part1 HTMLを書いてみよう Part2 SNSリンク集を作ってみよう Part3 2カラムページを作ってみよう Part4 1カラムページを作ってみよう Part5 複数ページのサイトを作ってみよう |
| おすすめの人 | ・1冊目の最新のWebデザイン入門書を 探している人 |
| その他 |
実践で身につく!
新しいWebデザインの教科書
～基礎から学べる
HTML&CSSデザイン～
境祐司 エスシーシー 2018年03月19日頃
Webデザインを基礎から習得できる、
コスパ最強？の学習書。
| タイトル (書籍名) |
実習で身につく!新しいWebデザインの教科書 〜基礎から学べるHTML&CSSデザイン〜 |
| 価格 | ¥2,090 (税込) |
| 発売日 | 2018/3/19 |
| 特徴 | ・Webデザイン、HTML、CSSの基礎、 Webレイアウトの基礎と応用等を 図と写真を用いて基礎から詳しく説明。 ・数多くの実習課題を掲載していて、 Webサイトを実際に作成しつつ学習できる。 ・レスポンシブデザインについても 100ページにわたり、随所で解説。 ・自作のWebサイトを客観的に評価する方法と チェックシートあり。 |
| 内容 | 第1章 Webデザインの基礎知識 第2章 HTMLの基礎 第3章 CSSの基礎 第4章 Webレイアウトの基礎 第5章 Webレイアウトの応用 第6章 拡張技術の活用 第7章 Webサイトの検証と公開 |
| おすすめの人 | ・コスパが良いWebデザイン学習本が欲しい人 |
| その他 |
マネするだけでセンスいい!
CSSデザイン
知識ゼロでも大丈夫、
手を動かして楽しく学べて、
Webデザインが一気に分かる本。
| タイトル (書籍名) |
マネするだけでセンスいい! CSSデザイン |
| 価格 | ¥2,728 (税込) |
| 発売日 | 2023/11/21 |
| 特徴 | ・知識ゼロから手を動かして学べる。 ・デザインのコツがスラスラ分かる。 ・現場でお役立ちのTipも満載。 ・CSSでアニメーションも作れる。 |
| 内容 | 1 基礎をしっかり学ぼう 2 HTMLとCSSで簡単アニメーション 3 ヘッダーデザインを作ってみよう 4 カードデザインを作ってみよう 5 フォームデザインを作ってみよう 6 フッターデザインを作ってみよう 7 テーブルデザインを作ってみよう 8 タイムラインデザインを作ってみよう 9 ボタン＆見出しデザインを作ってみよう |
| おすすめの人 | ・これからWebサイト制作をする初心者 ・Webサイトの更新を任されてしまった人 ・一からデザインを作るのに不安のある人 |
| その他 |
まとめ
この記事では、HTML・CSSの
基本が学べる入門書をまとめました。
Webデザインの
知識・技術の土台となる部分になるので、
これらの本の内容をしっかり学んだ上で
専門分野を詳しく学んでいきましょう。
なお、HTML・CSS関連の書籍は、
こちらの記事にまとめています。
