コーディング・Webデザインの基礎が学べる本!入門からWPまで

コーディング・Webデザインの基礎本

記事内に商品プロモーションを含む場合があります

コーディング・Webデザイン~WordPressオリジナルテーマの学習に役立った本をピックアップしてご紹介します。

コーディング(HTML/CSS)は、Webサイト制作の基本でもあり、必須の知識になります。

筆者の場合、スクールでコーディングからWebデザインまで学びましたが、コーディングの練習や知識のまとめに役立ったのが書籍です。

WordPressのテーマ自作は一気に難易度が上がるので、苦戦する人が多い部分。本の手順に沿って学習することで、動的サイトが作れるようになります。

Web制作で収入を得られるようになるまでには、習得すべきことがほんとに多いです。コーディング、Webデザインの基礎が学べる本から、WordPress・プログラミングの基礎まで、実際に役立った本をご紹介しています。

コーディングの入門書は初心者にもおすすめ、実際にWebサイトが作れるようになりますよ。

目次

【基礎】コーディング初心者におすすめHTML&CSSの本

1冊ですべて身につくHTML&CSSとWebデザイン入門講座

progateを少し進めたら同時進行でホームページを作ってみましょう。手を動かしながら体験学習ができます。

「Webクリエイターボックス」の管理人さんが執筆されたこちらの書籍は、とても有名ですよね。手順通り進めることでオシャレなカフェサイトが完成します。

ホームページってこんな風にして作るんだ~ということが体験できる入門書です。
多くの人が入門書として挙げていて、評価の高い書籍です。実際にホームページ制作を体験してみてください。

図解!HTML&CSSのツボとコツがゼッタイに分かる本

イラストが豊富で絵本のような感覚で読める、でも中身の濃い本です。
コーディングの学習が少し進むと、疑問に思うことが色々出てくるもの。とてもやさしい文章で解説がされていて、とっても読みやすいです。何度も目から鱗~、となりました。

ダウンロードデータがあるので、手を動かしてサイトを作ることができます。
サイト制作をしてみたい方は手を動かして作ってみるとよいでしょう。

疑問点を解消したい目的なら、読み物風に読んでも良いと思います。たまに読み返したくなります。

HTML&CSSとWebデザインが 1冊できちんと身につく本

こちらも、実際にwebサイトを作りながらhtmlとcssを学ぶことができます。1冊ですべて身につくHTML & CSSとWebデザイン入門講座よりは少し手ごたえがあるかな、というレベル感。

フルスクリーン、フレックスボックスなど、5種類のレイアウトをコーディングして学習することができます。完走するとオシャレなサイトが完成します。アレンジ方法も紹介されているのでお得感もあります。

フレキシブルボックスで作るHTML&CSS3レッスンブック

フレキシブルボックスで作るHTML5&CSS3レッスンブックも、サンプルデータをダウンロードすることができます。

モバイルファーストとレスポンシブが学べます。コーディングの基礎を学習しただけでは実践が不安なものですが、解説が詳細でレスポンシブサイトの制作に自信が持てるようになります。

付箋をぺたぺた貼って苦手な個所は振り返って見た記憶があります。画像の配置やフレックスアイテムなど、苦手でまだに付箋が貼ってありました。。


プロの「引き出し」を増やす HTML+CSSコーディングの強化書

こちらの本は、初級を脱したいと思っていた時に、エンジニアでしょーごログを運営されているしょーごさんが紹介されているのを見て購入した本です。

個人的には、ブロークングリッドとCSS設計が非常に気になり購入しました。webデザイン系の本はどれもお値段がそれなりで、こちらの本も税込み3,000円超えの本。

レイアウトに関しては、サンプルデータでパターンを試すことができます。今も読み返すことがあります。CSS設計は詳細な内容を期待していたので、少々物足りない感はありました。


動くWebデザインアイディア帳

jQuery、cssアニメーションで動くデザインを再現することができて楽しめます。コピペで作ることができるので、色々使わせていただいてます。

書籍連動サイトがあったので、書籍はなくてもよかったのかもしれません(期間限定のようです)。jQueryの学習の参考書的にも使えましたし、アイディアの参考にもなるので、購入してよかったと思ってます。

【Webデザイン】Webデザインの基礎&アイディアの本

いちばんよくわかるWebデザインの基本きちんと入門

webデザインに関する基礎を学べる書籍です。レイアウトから配色などまさに、デザインの基礎が網羅されています。きっちり基礎を身に着けたい方には非常に参考になる書籍です。

ホームページのデザインをする際は、今もパラパラめくることが多いですね。

Webデザイン良質見本帳 目的別に探せて、すぐに使えるアイデア集

いちばんよくわかるWebデザインの基本きちんと入門と迷って、結局こちらも購入しました。2冊は必要ないかもしれませんが、デザインのアイディアにもなるので、両方手元に置いて参考にすることもあります。

言葉をイメージに変える ひらめきデザインひき出し帖

上記2冊同様、アイディアを見つけたいときによく利用します。買ってよかった本の一つです。「かわいい」や「エレガント」「シャープ」といった言葉からデザインを引き出していきます。

言葉からデザインをイメージするのに息詰まることも多いですが、この本はデザインのヒントが盛りだくさん。イメージを言語化するという切り口は、デザインの提案にとてもに役に立ってます。

【中級・上級】WordPressオリジナルテーマ制作が学べる本

WordPressユーザーのためのPHP入門 

ワードプレスでオリジナルテーマを制作するのに必要なのがphp。本書では、ワードプレスの制作に必要な最低限のphpを学ぶことができます。

ワードプレス化には、ワードプレス独自のphpを使用します。ワードプレス化に必須のテンプレートタグや、プログラミングの基礎学習ができるので、webデザイナーさんがワードプレスを学ぶのにぴったりの書籍といえます。


WordPressオリジナルテーマ制作入門

個人的には、この書籍のおかげでワードプレステーマ化が理解できるようになったといっても過言ではありません。手を動かしてワードプレスサイトを作ることで、理解できるようになりました。

カスタム投稿、カスタムフィールドまで網羅されています。ワードプレスのテーマ化は1度ではなかなか理解が難しいですが、本書を繰り返すことでテーマ化ができるようになります。

ワードプレステーマ制作の本も数冊購入してますが、本書は難しすぎず必要な知識は網羅されていて、テーマ制作の入門書としてすすめできます。


WordPress 仕事の現場でサッと使える! デザイン教科書

本書も、ワードプレステーマ化の入門書的な書籍で、「WordPressオリジナルテーマ制作入門」のレベル感の本です。jQuery、cssの読み込み方が異なります。

この2冊が自分で作れるようになると、htmlサイトのワードプレス化はほぼできるようになります。


WordPressデザインレシピ集

671ページまであって、調べたいことから逆引きできる、分厚い辞書みたいな本です。全230項目あり、自分の調べたいことから答えを探し出すことができます。

本書の流れとしては、ワードプレスの操作に関する内容、カスタマイズテクニック、テーマ作成テクニック、さらに高度なテクニック、さらには運用や開発環境構築テクニック、と続きワードプレスに関する項目がほぼ網羅されます。個人的には、辞書的に使わせていただいてます。


WordPress標準デザイン講座20LESSONS

サンプルファイルをダウンロードして、ブログサイトを構築できます。非常にシンプルなブログサイトを制作しながら学ぶことができます。

Localを使用したテスト環境の作り方から、サイト公開までマスターできます。phpの解説もあり分かりやすいです。

その他役立った本

コーディング関連、デザインン関連、ワードプレス関連の書籍の他、プログラミングやデザインツールに関する書籍も購入しました。

特に役立ったのは以下の書籍。

「Photoshop しっかり入門」は、はじめてPhotoshopを使用する方から初級者向けの書籍です。デザインツールは初めてですと使い方がわからないものです。調べる手間も省けて効率アップするので、入門書は1冊あると便利です。

  • Photoshop しっかり入門
  •  jQuery標準デザイン講座
  • Bootstrap4ファーストガイド―CSS設計の手間を大幅に削減!

jQuery、Bootstrapをご紹介してますが、いずれも全ページ読破してはおらず、必要なところをその都度参考にしてる感じです。あればとても便利な書籍です。

目次