コーディングを教えていてよく聞かれる質問のひとつに「オススメの書籍はありますか?」という質問があります。

正直に言うと、書籍自体があまりオススメではなく、可能な限りWEB検索をして情報を収集して欲しいと思っているため、あまり書籍を薦めたことはありません。

と言うのも、必ず一つのことを覚えるのに複数のソースを確認して欲しいからなのです。

書籍に書かれていることを鵜呑みにすると、書籍が間違っていた場合や古い情報だった場合に方向転換がし難くなってしまいます。

常に複数のソースを確認し、正しい情報を仕入れる癖がついていれば、間違った情報をインプットしてしまう可能性がグンと下がります。※とは言え、初学のうちは何が正しいのかを判断するのがそもそも難しいという問題もありますね…

このような理由から、あまり書籍はオススメしないようにしてきたのですが、「書籍がないと勉強が捗らない」「どう検索したらいいかわからないどんなサイトを信用したらいいかわからない」という人が多く存在することがわかってきました。

それとともに、そういった方々に良書を薦めたいという積極的な想いといいますか、悪書となってしまう可能性があるものを出来る限り手にして欲しくないという想いが湧いてきました。

そこで一念発起!

過去5年分のHTML+CSSに関する書籍を読み漁ってみました。

過去5年分ともなると、Amazon検索50ページ分、総額15万円分(定価の単行本だとですが)くらいになります。

調べてみると、Amazonには出品されていない書籍も結構ありましたので、近所の本屋や池袋のジュンク堂書店なども見ていますが、結局はAmazonに出品すらされていない書籍はとても古いか、イマイチであることが多かったです。

こうして確認した約60冊 の中から、以下の観点でオススメと思える書籍を採点・ランキング形式でご紹介します。

※この記事は前提を含めかなり重たく書いていますので、もっとライトに確認したい方用にサマリー版(要約版)をnoteに書きましたのでそちらをご覧ください。

僕がオススメと思う書籍の条件

ここで紹介するのはコーディング初心者・入門者・独学者向けとしてオススメする条件です。

中級者やステップアップしたい方向けのオススメ条件や書籍ではないのでご注意ください。

以下が網羅されていれば良書であると言えるのではないかと思っています。

  • マークアップをきちんと教えているか
  • 初心者が自走できるようになる、ちゃんとした順番であるか
  • 全体像が理解できるか
  • 「なぜ」が書かれているか、押し付けていないか(暗記型ではないか)
  • 複数のやり方が提示されているか
  • 読みやすい、続けやすいデザインか
  • 情報、サンプルが正しいか(正しくない場合、なぜそのようなサンプルなのか説明があるか)
  • 情報が新しいか

この条件がしっくりこない方は、これから紹介する書籍は肌に合わないかもしれませんので、そっとブラウザを閉じて頂く方がよいかもしれません。

また、このあと、少し上記条件の説明を書きますので、早くランキングが見たい方は少し下までスクロールして頂ければと思います。

条件1:マークアップをきちんと教えているか?

まだ何も学びはじめていない方はマークアップという言葉自体がわからないかもしれませんが、コーディングの基礎となるものとなります。

基礎なのに初心者向けの書籍できちんと説明されていないの?と思われる方もいらっしゃるかと思いますが、まったくその通りで、マークアップをきちんと教えずに、とにかくデザインを再現させることを目的とした書籍が少なくありません。

そういった書籍には出会って欲しくないと思っています。

条件2:初心者が自走できるようになる、ちゃんとした順番であるか

その書籍の目的にもよるのですが、初心者向けであれば、読了した際にある程度自力で学べる力が身につけられている必要があると思います。

書籍のサンプルを模写したり、課題をこなすだけで出来た気になり、いざ実践となった時に何も出来ないという状態になってしまうというのもよく聞きます。

条件3:全体像が理解できるか

残念ながら一冊でコーディングに関する知識をすべて習得できる書籍を作るのは現実的には不可能だと思います。

もしも今刊行されたとしても一年後には古くなってしまいます。

ただ、その書籍がコーディングに関する何を教えていて、どの部分をどれくらい習得できるのかを明確にすることはできるはずです。

あたかもこれ一冊ですべてを習得できるような書き方をしていたり、他にも学んで行くべきことが残っているのにも関わらず、その書籍のワークが終わればプロで通用するというような書き方をしている書籍はちょっと違うかなと思います。

条件4:「なぜ」が書かれているか、押し付けていないか(暗記型ではないか)

わかりにくい技術書にありがちなのが「こう書けばこうなります」と何も説明がないパターンです。

人は納得感がないとなかなか知識が自分のものになっていきません。

「仕様で決まっている」というそもそものルール以外は、なるべく「なぜ」そのようにするのかが書かれている書籍の方がよいでしょう。

「なぜ」が無く、覚えるだけの暗記型だと基礎力が身につかず、応用力を発揮できません。

無駄だと思う方もいるかと思いますが、章末の小話的なコンテンツがある書籍はポイントが高いです。

条件5:複数のやり方が提示されているか

HTMLにもCSSにも仕様があるので限りなく正解に近い答えというのは存在しますが、コーディングは少し特殊なところがあり、必ずしも一つのやり方が正解というものではありません。

ところが書籍である都合上、複数のやり方を紹介するのは難しく、あたかも紹介しているやり方が唯一無二の正解であるかのように書かれていることがありますが、それが大きな勘違いを生むことがあります。

なるべく複数の回答のアプローチが示されている書籍の方がよいと思います。

条件6:読みやすい、続けやすいデザインか

内容がよければ装丁やデザインはどうでもいいという方もいらっしゃると思いますが、僕は書籍を購入するうえでは大切な要素であると思っています。

読みやすさや持ち運びやすさ、所有感、また手にとって開きたくなるようなワクワク感など、これらはコーディングの勉強を進めるうえで非常に大事です。

悩んだら、是非、気分のアガる書籍を選んでみてください。

条件7:情報、サンプルが正しいか

これを条件に入れるかどうか悩むレベルですが、間違った情報が載っている書籍もあったりします。

それは理解を促すためにあえて正しくはないサンプルを用いる場合があったり、当時は正しくても時間が経つことによって正しくなくなってしまった情報というものがあったりします。

しかしながら初心者にはそれを見極めるのは難しいでしょう。

だからこそこういったオススメ記事を参考にするしかないのかもしれません。

条件8:情報が新しいか

条件7と被る部分もありますが、古い情報はそれだけで正しくなくなっている場合もあります。

良書と言われている書籍でも、時代とともに悪書になってしまうこともありえます。

新しいから良い、古いから悪いというということではありませんが、小まめに改訂していない限り、古い書籍には新しい情報は載せられません。

そういった意味では新しい書籍の方が望ましい場合が多いと思います。


かなり長くなりましたが、これらの条件をある程度満たしている書籍が良書であると僕は定義したいと思います。

ランキングでは、これらの観点をもう少しわかりやすく5個の項目に分けてレーティングし、そのうえでターゲット別にランキングを作成してみました。

是非、参考にしてみてください。

一応、書いておきますが、執筆者や出版社への忖度はありませんし、誰かが良いとオススメしていたからという意見のすり寄せもありません。

よくも悪くも僕個人の感想から導き出されたランキングです。

※同じレーティングなのに点数に差があるものはここに記載できなかった項目に差があるものです。
※レーティング及び採点は厳密ではありません。相対的な比較として見て頂ければと思います。

総合ランキング

まずは総合ランキングです。

こういった方に向けたオススメであるとか、こんな特徴があるという採点ではなく、特に条件を与えられなかった際にはこの順番にオススメするだろうなと思ったランキングです。

マークアップをきちんと説明している書籍が上位を占めています。


1位

総合満足度99点
マークアップ★★★★★ 5
情報の正しさ★★★★★ 5
デザイン・構成・工夫★★★★★ 5
初心者向け具合★★★★★ 5

もっと僅差になるかなと思っていたのですが、これが頭一つ抜け出て1位です。

若干物足りない説明の箇所があったり、ページ構成が独特なのが玉に瑕ですが、それを補って余りあると思います。

※「改訂新版」の方ですのでお気を付けください。

2位

総合満足度95点
マークアップ★★★★★ 5
情報の正しさ★★★★★ 5
デザイン・構成・工夫★★★★ 4
初心者向け具合★★★★★ 3

ちゃんとした勉強ができるという方にはおすすめです。ちょっと僕はできないかも…。

この一冊を終える頃にはかなりの実力がつくのではないかと思います。

3位

総合満足度95点
マークアップ★★★★★ 5
情報の正しさ★★★★ 4
デザイン・構成・工夫★★★★ 4
初心者向け具合★★★★★ 5

とてもバランスがよい書籍でした。

残念ながら2015年末の発売ということで情報が古い部分(とは言えフォローもされていてすごいなと)があるため少し及ばず。

改訂版が出れば1位になりそうな気がします。

4位

総合満足度85点
マークアップ★★★★★ 5
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★★ 2
初心者向け具合★★★★★ 3

装丁が好みではないのであまり期待はしておらず、パラパラめくってもデザイン性が感じられず、ランク外かとも思いましたが、若干古い情報(レイアウトでfloatを主体にしている)以外は内容はよかったです。

ただ…この書籍を最後まで続けられるかはちょっと難しいかもしれません。

5位

総合満足度80点
マークアップ★★★★ 4
情報の正しさ★★★★ 4
デザイン・構成・工夫★★★★★ 2
初心者向け具合★★★★ 4

総合的には良かったのですが、Chapter4以降の唐突感が強く、順番に難があると感じます。

もう少しレクチャーの順番に工夫があればあるいは1位だったかも?

特別ランクイン

総合満足度75点
マークアップ★★★★★ 5
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★★ 2
初心者向け具合★★★★★ 2

2015年の発売ということで情報の古さを感じてしまいますが、内容はよかったです。

あぁ、こんな風に説明している書籍があったんだという発見をした感じです。

ただ、デザインの問題でとても読みにくかったです。


という感じで、総合ランキングTOP5と次点の1冊を合わせた6冊を選出いたしました。

1位と3位と5位以外はどれも初心者向け具合が少し足りない感じはします。

オススメ上位ランクのはずなのに褒めてないですね。すみません。

プラスαの1冊は、どうしても紹介したかったというよりも、この6冊までがマークアップの説明がちゃんとされていたためで、他の書籍はその部分が甘く思えたので差を出すためにランクインさせてみました。

超入門者向けランキング

情報の正確性などは少し劣るものの、初心者やコードや勉強自体に苦手意識がある方などでも続けやすいであろうという観点でのランキングです。


1位

総合満足度90点
マークアップ★★★★★ 3
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★ 4
初心者向け具合★★★★★ 5

もともと超入門者向けのランキングなのであたりまえなのですが、ちょっと好き嫌いがわかれやすい感じです。

説明に用いられる「例え」が秀逸で理解しやすい工夫がされているなと思います。

2位

総合満足度85点
マークアップ★★★★★ 3
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★ 4
初心者向け具合★★★★★ 5

とてもわかりやすいですが、全体の情報量や説明の深さなどが少し物足りないです。

一通りやった後、他の書籍などで「あぁそういうことだったのか」と理解する流れになる気がします。

3位

総合満足度85点
マークアップ★★★★★ 3
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★ 4
初心者向け具合★★★★★ 5

コーディング初心者というよりもPC初心者までターゲットにしているのではないかというくらい優しく書かれている。

これで難しいと感じるとすれば、かなり情報の正確性や網羅性は捨てて探す必要があると思います。※逆に当ランキングにランクインしている本は全滅だと思います。

4位

総合満足度75点
マークアップ★★★★★ 3
情報の正しさ★★★★★ 4
デザイン・構成・工夫★★★★★ 3
初心者向け具合★★★★ 4

初心者向けに上手に書かれていると思いますが、よくも悪くも振り切れていないので、どういう人に刺さるのか難しい気がします。

あまりよくない言葉を使うとすれば中途半端な印象です。

あと、もう少し順番に工夫が欲しいと感じました。


これらの書籍はどれも優しさを強く感じました。

優しさと正確さとわかりやすさと価格と差別化と…様々なバランスをとりながら生まれたのだなと思います。

前者の総合ランキングと比較して大別したときに、自分がどちらのグループの書籍の方が向いているかを考えると、自分に合った書籍に出会える確率が高くなるのではないかと思います。

いったんまとめます

繰り返しになりますが、個人および企業への忖度などは特にありません。

強いて言えば、強い批判は書かないようにはしています。

参考にして頂きつつも、最後はご自身の好みで選んで頂ければと思っています。

と言うのも、ある書籍が、ある人の良書であっても別の人にとっては必ずしもそうであるとは言い切れません。

「今回は失敗したなぁ、じゃあ次は別の書籍にチャレンジしてみよう!」となればよいですが、「時間を無駄にしたなぁ。やっぱりコーディングは難しい・つまらない」となってしまうのがとてももどかしく感じます。

本当はもう少し細かく、こんな人にはこの書籍という風にオススメできるのが親切だとは思うのですが、本当にその人に合うかどうかは千差万別なので最後は自分で選んでみてください。

できれば目当ての書籍を何冊かに絞ってから書店へ行き、実際に手に取ってパラパラめくってみたうえで選んで頂ければ、それがご自身にとっての良書になるのではないかと思います。

※できれば電子書籍ではない方がよいとは思いますが、そこはライフ(スタディ)スタイルに合っているのが一番だと思いますので深く言及はいたしません。

この記事が皆さんの書籍選びの一助になることを願っています。

以下は二次会(有志での参加)的なノリで読んで頂ければと思います。

ランクインしなかった書籍

ランクインしなかったという時点で色々と察して頂ければと思います。

しかしながら、ランクインしなかった書籍にも様々な特長や、今現在はランクインしなくても昔は間違いなく良書と呼ばれていた書籍などもありますので、自分が確認したという記録も含めて簡単なコメントと共に記しておきたいと思います。

ここにも載っていない書籍は僕の単なる見落としか、HTML+CSSとは少し違った「デザイン関係」や「HTML5単独」「CSS3特化」「WordPress」「Bootstrap」といった特定分野の書籍、旧版、5年よりも前に刊行された書籍か、記事公開後に発売された書籍だと思います。

例えばですが、O’Reilly Japanのいくつかの関連書籍は入っていなかったりします。

もし、完全な有名どころの書籍を見落としていましたらなんらかの方法でお教えいただけますと助かります。

以下、順番は概ね発売日が新しいものから並んでいます。下に行くほど古いです。

上記ランキングにランクインしているものは除いています。

とてもとても平均点でした。なんとかランクインできないか、この書籍用のランキングを作ろうか悩みました。

買って大きな損はしないと思いますが、若干、浅く広くという印象があります。

入門書ランキングに入りきらなかった感じです。

入門書にしてもちょっと優し過ぎてしまい、サンプルのページを作ること自体が目的になってしまいそうです。

僕はオススメできません。

わかりやすさはあると思いますが、この書籍を読み終えて終わってしまう感じがします。

この書籍に限ったことではありませんが、辞典関係は直ぐに必要なくなります。

「1冊持っておいて損はない」という類のものではないと思いますが、辞典系が好きであれば見やすい方だと思います。

タイトル通り「書きながら」という感じでコーディングはできますが、解説が少な過ぎると思います。

できた気になってしまう書籍だと思います。逆にそういう自信をつけるにはよいかもしれません。

辞典、リファレンス、逆引きは直ぐに必要なくなります。

「電車の中でタグを覚える」といった用途であれば、スマートフォン×説明サイトで解決できる気がします。

コーディングをわかっている人向けのステップアップ用でした。

タイトルにも書いてありましたね。。。

辞典、リファレンス、逆引きは直ぐに必要なくなります。

その中でもかなりの重量級です。。。

書籍レビュー中です。

おそらくランクインはしません。

書籍レビュー中です。

おそらくランクインはしません。

ロジックからではなくデザインからアプローチした書籍。

おもしろいなと思いましたが、終わったあとに迷子になりそうな気がします。

書籍レビュー中です。

おそらくランクインはしません。

書籍レビュー中です。

ランクインの可能性が少しあります。

説明の順番、言葉の選び方、サンプル、すべてが適切だとは思えませんでした。

たにぐち まことさんが、誰向けになぜこの書籍を出したのかがわかりません。

辞典、リファレンス、逆引きは直ぐに必要なくなります。

こういった内容であれば、検索して調べるべきだと思います。

書籍レビュー中です。

おそらくランクインはしません。

辞典、リファレンス、逆引きは直ぐに必要なくなります。

こういった内容であれば、検索して調べるべきだと思います。

初心者むけではありませんでした。

やりたいことの逆引きになるので、やりたいことがわかる人は検索した方が複数ソースの確認ができると思います。

多くの人が表紙で察することができるとは思います。

意外と悪くないかもしれないと読み進めましたが、やはりいただけない説明がありました。

書籍レビュー中です。

おそらくランクインはしません。

書籍レビュー中です。

ランクインの可能性が少しあります。

書籍レビュー中です。

おそらくランクインはしません。

書籍レビュー中です。

おそらくランクインはしません。

説明があっさりし過ぎていて、あっさりを通り越して雑に感じます。

この端的な説明で理解できる頭のよい人が、これでわかった気になってしまうともったいない気がします。

書籍レビュー中です。

ランクインの可能性が少しあります。

書籍レビュー中です。

おそらくランクインはしません。

ポイントは押さえているけれど、説明が上手ではないと思います。

ページ数やレイアウトの問題なのか内容も少し薄く、古い本なのでfloatがでてきます。

書籍レビュー中です。

おそらくランクインはしません。

これも初心者向けではなく、HTML5からの書籍ですね。

初心者にはオススメできません。

多くの人が表紙で察することができるとは思います。

わざわざ2015年発売のこの書籍を手に取る必要はないかなと思います。

辞典、リファレンス、逆引きは直ぐに必要なくなります。

こういった内容であれば、検索して調べるべきだと思います。

レスポンシブデザイン(コーディング)特化の書籍でした。

コーディングが出来るようになるための初心者向けではありません。

古いです。サンプルもダサいです。

内容もちょっと…。

書籍レビュー中です。

おそらくランクインはしません。

書籍レビュー中です。

おそらくランクインはしません。【第3版】が出ています。