コーディングスキル向上への道:インプットの重要性とCSS学習方法

独学で学ぶコーディング・CSS編 Web

インプットが足りないとコーディングは上達しない!

HTML,CSSの基本はある程度学習し理解できたつもりでいるが、いざゼロからコーディングしてみると、キーボードをたたく手が止まってしまう‥。

今までの学習方法に間違いがあるのでしょうか?

いえ、そんなことはありません。まだまだインプットが足りないはず。

こんな状況、例えば英語などの「語学習得」に例えるとよりイメージしやすくなります。

私の場合。

html、CSSの基本は、語学で言うところの「文法」ととらえました。その際が学習してきたことは下記2つです。
●「文法」を理解する
●「文章」を書く

しかし、「文章を書く=コーディング」の段階でつまずいてしまいました。原因を探ってみると、学習の手順に問題があることに気づきました。下記②の「単語」を覚える学習をおこなっていなかったからです。

①「文法」を理解する
②「単語」を覚える
③覚えた「単語」を使って文章を書く

ここでいう「単語」とは「CSSのプロパティや値」を指します。「CSSのプロパティや値」を覚えていないうちから、すらすらとコーディングできるはずがありません。

「CSSのプロパティや値を完璧に覚える」ことができれば理想ですが、まずは苦手意識が克服できるレベルを目指すことにしました。

CSSマスターの基本は「語彙力アップ」。辞典とサイトをうまく活用しよう!

CSSはHTMLとセットで学習するケースが大半なので、「CSSを単独で学ぶ」という発想がそもそもなくやり過ごしていました。学習するにしても「もっと上達してから…」の話と思っていました。

しかし、コーディングを行う際にはHTMLのタグとCSSのプロパティ、値はセットで学んだほうが効率よい場合もあります。

下記記事でも紹介しましたとおり、私は対策のひとつとしてBootstrapのテンプレートファイル一式を題材にして、CSSをカスタマイズして日本語ページを作成しながらCSSを学習する方法にもトライしてみました。

「修正や追加などをページに反映させる」ことを目的にしているので、より実践に近い感覚でコーディングらしいことを学べる感覚はありました。しかし、その時気がついたのはCSSのプロパティや値をあまりにも知らなすぎる」ということでした。

以来、今も活用しているのが下記書籍です。

CSS辞典 第5版 [CSS2/3/4対応] | 翔泳社
次世代規格を先取りしたCSS辞典が登場 本書は、Webデザインに必須の技術「CSS」の文法リファレンスです。大幅改定となる第5版は、現時点の最新状況を反映し、Web制作を学ぶなら必ず押さえておきたい基本のCSS2.1はもちろん、仕様の策定と...

文字通り、辞書を開く感覚で必要なCSS文法を探せる一冊。購入当初は「1日1プロパティを学習する」といったルールを決めて、受験英語の単語学習のように繰り返しくりかえし本書を活用していました。

定価は2300円+税と他の教本並の価格ですが、こちらはブックオフなどで古本を探せば、500円以下で入手できます。

私は現在でも活用していますが、2014年に発行された第5版のため「ブラウザごとの指定方法と対応状況」が最新のものに対応していません。ここはこの書籍のみに頼らず、CSSリファレンスサイトを併用して、最新情報もキャッチしています。

CSS リファレンス - CSS: カスケーディングスタイルシート | MDN
この CSS リファレンス は、すべての標準 CSS プロパティ、擬似クラス、擬似要素、データ型、関数記法、アットルール のアルファベット順の索引として利用できます。また、すべての CSS 種類別セレクター の一覧および 重要な CSS の...

コーディングの際、最初は実装したいスタイルがわからない度に本書で調べて記述を繰り返すことが重要。手を動かして何度も何度も記述しましょう。

繰り返し手を動かしているうちに、何も見ずにある程度かけるようになったらOK。学習時間、個人差もありますので、どのぐらいで到達できるかは反復学習あるのみです。

私の場合は、業務上必要に迫られたこともあり、毎晩勉強(2〜3時間)を重ねた結果、3ヶ月ほどで達成できました。

学習方法は、常に見直しアップデートを!

コーディングをマスターしたいと日々学習を積み重ねていますが、私の場合は完全に独学なため、具体的な目標設定はもちろん、今現在どこまで到達していて、何が足りないかを冷静に見極めながら進めました。

様々なツールを活用して学習する際に私が心がけているのは、HTMLもCSSも「言語を学んでいる」ということ。つまり、どこまで「読める」「書ける」かを常にチェックするよう心がけています。

教本での独学は、他の学習方法に比べると難易度がとても高いことも忘れてはいけません。

教本をメインに活用していて「学習しても全然身につかない」といった悩みが生じることもしばしばあります。

その際、原因はどこにあるのかを特定する必要があります。自分のスキルや今行っている学習方法を客観的に見るチカラです。

●自分の読解力が足りてない
●選んだ教本のレベルが高かった
●教本での学習は継続しづらい等々

読解力、理解力が足りていないのであれば、教本での学習だけでは上達が難しいかもしれません。スクールやメンターを活用して、アドバイスを受ける機会を設けることで上達をねらうことも必要です。

教本の選択を間違ってしまったため、思いどおりに上達しないことも多々あります。

私も初心者の頃はついつい背伸びをしてしまい、今のスキルでは少々難しすぎる教本を

セレクトしてしまった経験があります。

一度購入してしまった教本は決して安い買い物ではないため、もとを取れるよう無理やりでも学習しようと励みます。しかし、かえって逆効果となり学ぼうとすればするほど時間だけが経過してしまうこともあります

「何となく理解できない」「難しくてページを進めない」などの違和感を感じたら、今使用している教本を疑ったほうが良いと思います。

そもそも今使用している教本を選んだ理由を思い出して見てください。吟味を重ねて選んだ一冊ではなく、「とりあえず評判良いから試してみよう」といった理由だったりします。

教本は学習を重ねても、上達できている実感がわかなかったり、学習に苦痛を感じるようであれば、早めに違う教本に切り替えてしまう判断も大切です。

何度か教本を変えてみたけれど、やはり何も変わらないというのであれば、以下のいずれかを疑ってみましよう。

●教本での学習に向いていない
●独学そのものに向いていない

まとめ

●コーディングの上達には、「文法を理解すること」とCSSを用いて「文章を書く(コーディング)能力」が必要。地道な反復練習でインプットを重ねる努力が必要

●CSSのスキルを高めるためには、語彙力を高めることが肝心。書籍やサイトを活用して、プロパティや値等のリファレンス習得を目指そう!

●上達を感じられない場合は、今の学習方法を見直す必要あり。独学では「自分の今のスキル」を客観的に見るチカラも求められます。

●独学は誰でも気軽に始められるが、成果をあげるという点では難易度が高い学習方法。向いていないと感じたら、「誰かに教わるスタイル」も取り入れてみよう!

 

コメント

タイトルとURLをコピーしました