なんとか、中級編の道場レッスンを終了しました。
途中いろいろ正常に操作しなかったりして、「なんで？」と頭をひねることが多かったです。合格がもらえるまで、初級編の倍くらいの時間がかかってしまいました。
正直、正常に操作しなくて途中で答えをみたものの、「ここのコードは同じなのになんで動作しないの！？」となったり、逆に見た目はほぼ完全に一致しているのに合格がもらえなかったり、今回もいろんな壁が待ち受けていました。
合格をもらって、全体を振り返った時点で自分なりに気が付いたことをまとめておきたいと思います。もし、これから道場編をやります！っていう方がいらっしゃったら、参考にしてもらえると良いかなと思います。
①まず一番大事だと思ったのは、目標物の全体像を確認して、どこにどういった配置をするのかをざっくりと意識しておくこと。そのうえで、全体の骨組みを考えます。（いきなり書き始めるんじゃなくて、ヘッダー、メイン、フッターのさらに中身の骨組みまで考えておく）
②①をもとにCSSを書いていく時の注意点：グループ化してまとめてCSSを適用したいところは複数クラスの指定（ボタンを複数作る時）をしたり、レイアウト全体で共通に適用させたいクラスにCSSを適用させるときには、あまりたくさんの設定をせずに同じクラス名だからこそ、共通の設定だけに絞ったりすることを忘れない。
③CSSを書き始める前に、CSSの「指定が競合した時の優先順位」、「詳細度の計算」、というワードについて事前にググるか、教科書を見ておいた方が良いと思います。私の場合は、それを知らずに書き始めたものだから、コードを書き始めた中盤～終わりまでずっと苦しみました。幸いにも、このワードについて知ることができたので、自分のコードを見直してなんとか修正することができましたが、正直、悩みつくしてスキップしようかと思いました。「指定が競合すること」ってきっと分かっていてもやってしまうものだと思うから、事前にこういったことがあると知っておくと、対策も立てやすいと思います。
ぜひ、参考にしてください。
ちなみに、これも参考までに↓
私が持っているHTMLとCSSの教科書です。独学を始める前に購入したので、まだ全体を通してきちんと読んでいませんが、③の「指定が競合した時の優先順位」では、手元にあったこの本で解決できました。Web上だけでなく、何か手元に置いておいていつでも見られる教科書があるのって心強いです。
よくわかるHTML5+CSS3の教科書 第3版 大藤幹著 マイナビ出版
それでは次回はHTML＆CSSのFlexbox編ですね。頑張っていきます。
コメント