4月に入ってからWebデザインのコーディングの勉強を始めました。
Deliaです。
今回、一冊の入門書をやり終えたので、
知識ゼロの完全未経験からの挑戦でどの程度の理解に及んだのか、本のレビューを兼ねて
書いていこうと思います。
Contents
HTML＆CSSとWebデザインが１冊できちんと身につく本
私がHTMLとCSSを学ぶのに参考にした本。
「HTML＆CSSとWebデザインが１冊できちんと身につく本」（著）服部 雄樹
主にネットの記事を参考にして選びました。
重要視したのは…
- 心が折れないくらい簡単な内容（最重要）
- 実際に手を動かしながら読み進められる
- 一冊を通してWebサイト制作の流れが学べる
購入してよかった
結論から言うと、購入して大正解でした。
始める前は、HTML？CSS？の状態。
何となくふんわりとは理解してるけど
それぞれどんな役割なのかがまるでわかりませんでした。
しかしこの本では知識が全く無い人でも
順を追って理解していけるような構成になていました。
Webデザインの基本知識について
序章では知識の無い初心者にもわかりやすく親切に解説しています。
Webサイトの特性やWebサイトが表示される仕組み、Webサイトを構成するファイルなどの本当に初歩の初歩から解説されています。
そもそも「デザイン」とは…
アーティストは自身が「何を表現したいか」が全て
デザイナーは主観や好みよりも「誰に何をどう伝えるか」が大切
なるほど！大切なことですね…！
作業環境の整え方
初めてコーディングの練習をするにあたり疑問なのが
テキストエディタは何を使えばいいのか。
正直色々な種類があってわかりませんでした。
この本では使用するテキストエディタのDL方法と簡単な使い方も丁寧に記載されていました。
サンプルページの作成
写真家のポートフォリオをテーマに実際にサンプルページを作成していきます。
え！？いきなり！？
と思いましたが、大丈夫です。
指示どうりコードを書いていくだけです！
私が一冊やり終える時には理解できるようになりました。
HTMLの基本知識
HTMLとはテキストに目印をつけて文書に構造を与えるための言語のこと。
それぞれのテキストは役割を持った「要素」となる。
それらの集合体が１つのWebページを形成していると言うこと。
目印＝タグ
タグに挟まれた塊＝要素
タグに属性を書き加えることで、要素に細かい設定をすることができる。
などなど、丁寧に解説されていました。
ページの基本情報をあらわす主なタグ
- meta要素 Webページの仕様情報
- title要素 Webページのタイトル
- link要素 外部ファイルを読み込ませる
- style要素 CSSを記述する
ページの内容をあらわす主なタグ
- body要素 コンテンツを記述する
- p要素 文章の段落を指定する
- h1〜h6要素 文章の見出しを指定する
- section要素 章や節などのまとまりを作る
- article要素 独立したコンテンツとしてまとめる
- nav要素 ナビゲーションを指定する
- aside要素 補足情報を掲載する
- div要素 要素を入れる箱として使用する
CSSの基本知識
CSSとは
HTMLが文章構造を指定する言語であるのに対して、
CSSはそのHTML文章のレイアウトや装飾などの見た目を指定するための言語です。
スタイルシートの基本文法
CSSの記述はセレクタ、プロパティ、値の３つで構成される。
- セレクタ 適用する対象
- プロパティ スタイルの種類
- 値 適応させたい結果
一冊やり終えてみて
HTMLもCSSもふんわりとしたイメージしかわからない状態でのスタートでしたが、
まさにそういった人向けに制作されている本だなと感じました。
基本中の基本が理解できる
これ、大事だと思います。
実はこの本を買う前にネットの記事でおすすめされていた別のHTML、CSSの勉強本を購入して実際にやろうとしてみましたが、
よくわからないので挫折しました。
私は
なぜこれがこうなるのかという理論を自分なりに理解して納得できないと腹に入らないタイプなので、HTML、CSSの世界に入るための基本中の基本が理解できました。
タグの種類や使い所はまだよくわからない
こういったいわゆるプログラミング学習において
言語の丸暗記は非効率ということは知っていたので
あまり気にしていません。
もちろんテキストを進める中で、毎ページでタグや要素、セレクタなど
新しいことが増えていきます。
このレベルの学習段階では指示通りにコードを記述していくだけなので、
全てを理解して更に知識を定着させることはまぁ私には不可能な話です。
それでもわからないものには直接書き込むなどしてその都度調べながら進めました。
必ず次に繋がる
この本での学習を終えてみて、モチベーションがグッとあがりました。
私は現在最初に買って挫折した本を進めています。
想像通り普通に内容が理解できるようになりました。
一通り終わったら現在途中で止まってしまっている動画講座の続きを始める予定です。
そして基礎を網羅的に学習したらLP作成にステップアップする予定です。
もう一度読み返すべき
やり終えた後に最初の基本項目のページを再読するのをおすすめします。
中盤〜後半は正直ほとんど手を動かしているので
序盤で丁寧に解説されている基本の内容を覚えたようで実はふわふわしてます。
軽くでいいので再読すると
「あ、そういえばそうだった！」と知識が定着すると思います。
入門書におすすめ
私と同じように知識ゼロで独学を始めようという方や
基本中の基本を学習したいという方におすすめできると思います。
正直、この本に出てくる内容を完璧におさえるだけでそれっぽいサイトは
作れるなぁって思います。
ただ、すでに結構知識のある方などは
今更感のある内容に思えるかもしれません。笑
