ABOUT
運営情報
ウェブデザインを独学で勉強するなら、初心者におすすめの本5選｜レスポンシブ /jQuery/HTML・CSS
更新日：2018年03月05日
2017年04月からブログをはじめました。それまでブログはおろかSNSもしてこなかった筆者が当ブログを通じて、ウェブデザインにハマり、実際に独学で勉強してきました。
今回は、筆者が実際に読んできた中で、最初に学ぶ上で比較的読みやすいおすすめ本をご紹介致します。
- 筆者は全くのウェブデザイン知識ゼロのサラリーマン
- ウェブデザインを勉強するなら基本的な用語から
- コードを見ても拒否反応をしないこと
- 今回ご紹介する本のおすすめの方
- ウェブデザインを独学で勉強するなら、おすすめしたい本
- ウェブデザインの初心者は独学なら本から勉強しよう！
- はてなブログを運営するならおすすめのブログがあります。
筆者は全くのウェブデザイン知識ゼロのサラリーマン
筆者は文系卒のサラリーマンです。ブログを始めるまではそれこそ「プログラミング言語とは何？」とか「コードを見た際にマトリックスの世界がイメージで出てくる」程でした。
ブログの記事作成もままならない状況の中、同時並行でブログデザインのカスタマイズを行っていました。 今までのデザイン変遷は『ブログ運営報告｜2017年の振り返りと課題から見える2018年の目標と4つの対策』で掲載しています。
ウェブデザインを勉強するなら基本的な用語から
実際にウェブデザインを勉強していくと、プログラミングならではの用語が沢山出てきます。
「HTML」とか「CSS」とか「レスポンシブ」とか。正直、最初は聞いた時はわからないですよね。
その為、用語の理解をしていないとネット検索したり、本で調べたりと手間がかかり、作業をする上で効率が圧倒的に悪くなります。最初に学ぶなら基本的な用語から理解し、学習することをおすすめします。
コードを見ても拒否反応をしないこと
プログラミングは失敗がつきものです。初心者が最初からうまくいくことは殆どないです。その為、ひたすら英語の文字列を見続けることになると思いますので、拒否反応を起こさないように少しずつ練習したほうがいいと思います。
筆者も1000回以上は絶対失敗したと思います。
今回ご紹介する本のおすすめの方
ウェブデザイン初心者や筆者と同じようなウェブ経験ゼロの方にもおすすめ致します。「レスポンシブデザインって何？」とか「jQueryとは」と内容が把握できていない方にもおすすめです。
これらの本はブログをはじめて3か月間の間に読んで、トライした本です。
ウェブデザインを独学で勉強するなら、おすすめしたい本
1．HTML5&CSS3デザインブック
HTML5&CSS3デザインブック (ステップバイステップ形式でマスターできる)
posted with カエレバ
エビスコム ソシム 2014-10-28
1-1.概要
スマートフォン・タブレットなど多様なデバイスに対応する「レスポンシブWebデザイン」を中心とした現在のWebページのレイアウトを自在に作成できるスキルを身につけることを目的とした本書。
1-2.購入理由
『レスポンシブWebデザイン』を基礎学習する本として、WEBデザイナーの方からおススメの本として紹介されている本書。
基礎から書かれており、本の構成もページを進めながらデザインを構築していく「ステップバイステップ形式」を採用している為、一つひとつ理解が深めやすいと思ったからです。
全6部構成となっている本書。最初は基礎的な構造を学び、ブログデザイン案とビジネスサイト案の二つを実際にデザインを着手しながら、それぞれの違いも学べる点も魅力。
2．レスポンシブWebデザインマルチデバイス時代のコンセプトとテクニック
レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック
posted with カエレバ
菊池崇 アスキー・メディアワークス 2013-07-30
2-1.概要
レスポンシブWebデザインの原理・原則に重きをおいて説明している本書。
最初のページには、レスポンシブWebデザインの考え方や背景などが説明されており、「なぜレスポンシブWebデザインが浸透するに至ったか」を学ぶことが出来ます。
勿論、本書にもデザインサンプルは用意されております。
2-2.購入理由
2013年7月に発売した本書。既に4年前の本ですが、筆者が読む中で最もWEBデザインの概念を学ぶ要素が強かったです。
WEBデザインを学ぶことは、実際に作業しながら進めていきますが、基本的な概念や背景を理解した上で実践するほうが、頭の理解度は全然違います。そして本書はその点で優れているなと思います。
理論を学ぶことで、作業に対する理解がより深まると思ったからです。
3．Web制作の現場で使うjQueryデザイン入門
Web制作の現場で使うjQueryデザイン入門[改訂新版]
posted with カエレバ
西畑一馬 KADOKAWA/アスキー・メディアワークス 2013-03-07
3-1.概要
Webサイトをより効果的に見やすくする方法として、やはりjQueryの存在は欠かせないかと。この本では「概要からダウンロード方法、導入に必要な準備」も説明されているので、はじめての方でも安心して作業準備が出来ます。
また“スライドメニュー“や“モーダルウィンドウ“などいくつか例が準備されている為、実際に本サンプルを使用しながら、理解を深めることが出来ます。
3-2.購入理由
デザインを勉強していくと、効率と見やすさを重視したWEBサイトを構築するにあたり、必ず次のステップとしてJavascriptの勉強を出て来るかと思います。その中でも「jQuery」を覚えていくと、動作なども活用できるので、損はないです。
ネット上に「コピペ可能なモノ」も多く提供されているのですが、動作不順が起きた時に基本的な構造を知らないと、どう修正していいかがわからないので、どこがエラーが起きているのかをある程度把握できるようになる、そして基礎を学びたい上では、この本は読みやすいと思います。
4．HTML5&CSS3マスターブック
4-1.概要
そもそも「Webサイトって何?」という本当に基礎の基礎から始められる本です。具体的には、インターネットの基本からHTMLとCSSの基本と使いこなしを学べるので、一番最初に読みたい本
4-2.購入理由
基礎的な用語の勉強の勉強としてはこの本がぴったり。本当にはじめての方におすすめで、初心者の方なら知識の再確認や再認識にぴったりの本です。
プログラミングの基礎も勿論あります。ただデザインの参考集ではないので、デザインサンプルを求めている方向けではないです。
是非、はじめてブログを始める方は最低限の知識として持っていても損はないと思います。
5．6ステップでマスターする 「最新標準」HTML CSSデザイン
エビスコム マイナビ出版 2016-08-24
5-1.概要
かなりおしゃれなデザインを実践で学べる本です。これは用語やコードなどをある程度理解した方におすすめしたい本です。6つのセクションからステップバイステップで学習できる一冊。
5-2.購入理由
サンプルコードもしっかり用意されている点が魅力ポイントです。コンテンツページのや記事一覧の作成など部分的にパーツが用意されているので、部分活用も可能です。デザイン自体がおしゃれなので、コーポレートサイトでも全然活用できます。
ウェブデザインの初心者は独学なら本から勉強しよう！
まずは用語の理解やボックスの作成などの基礎理解は本で流れを掴むのがいいと思います。筆者の勉強法は、以下の通りで進めてきました。
- 本で基礎を学び
- ネットで好きなデザインのサイトを探し
- GoogleChromeで検証→確認
- 実際にコードを試す
他サイトのデザインをグーグルクロームで見ることで、プログラム構造をみることが出来ます。
はてなブログを運営するならおすすめのブログがあります。
ただカスタマイズをしたいという方なら、以下の記事に掲載されているブログは本当にコピペ可能なコードも紹介されています。どれもハイクオリティのサイトばかりなので、是非一読することをおすすめいたします。
全てはてなブログ運営者ですが、はてなブログの方でなくても、勉強になると思います。
おしまい。
【文字数：3803文字、作成時間:3時間15分】
