見出し画像

HTML/CSS を勉強するマインドセット

WEB系の職業訓練校に行って、ショーハクです。

最近、HTML/CSSの勉強をしています。

なかなか分からない部分もありますが、楽しんで勉強できています。

すべてのことを網羅的に勉強出来ているわけではありませんが、今はいろんな参考書やGoogle先生が居るので、分からないことも適当に解決できています。

でも、はじめた当初って難しいって、思ってました。

10日前のブログでも紹介しています。

自分自身、考え方次第で苦手意識がなくなっているので、今充実している感じがします。そんな初心者のための初心者による難しいとか思わないようにするマインドセットでも紹介します。

暗記するのではなく全体像を理解する

<!DOCTYPE html> DOCTYPE宣言
<html lang="ja"> 主な言語
<head> WEBページの骨組み
<meta charset="utf-8"> 文字コード変換
<title>サンプル</title> タイトル

</head>
<body> WEBブラウザで表示されるテキストや部分

<p>サンプル</p>

</body>
</html>

大体こういう構造だよねというイメージで、コードを書いています。

基本的な大枠の構造だけ覚えているだけで、プロパティの詳しい意味を覚えようとはしてません。

デザインを分解してみる

分からないことがあったときに使える当たり前の技なんですが、

例えば

文字を太くしたい

背景の色を付けたい

こういう場合、

「太い文字 CSS」

「背景の色 CSS」

ってググればすぐに分かります。それなのに、一つ一つのプロパティを覚えようとするのはおかしな話です。

コードを書いていけばおのずと覚えるんだからって気軽な感じがいいですね。

最低限覚えるべきルールだけ覚えておく

CSSの優先順位だったり、classの指定の仕方だったり、ブロック要素とインライン要素の違いだったりとセオリー的なところだけは暗記しておく必要があります。

逆を返せば、それさえ覚えておけば、後調べればほとんどわかるぜーみたいな感じです。

まぁこれも分からなけば、ググればいいんですけどね。

現場のSEさんとかもめっちゃググってたので、ググる癖はめちゃ大事ですね。必要な情報にたどり着けるというのも一つの能力です。

挙動を確認するためにコードを書く

参考書には論理的な書き方で、コードの説明が書いてありますが、やはりコードは書いて、挙動を確認して、感覚的に覚えるってことは非常に重要だと思います。

+αで、そのコードを使ったでアレンジしたものを作ったりすると使い方もマスター出来て、感覚的に覚えることが出来ますよ。

いっぱい触って、遊んで覚えるのは、結構大事ですね。

あとはサンプル真似て作っていくのがいいみたいですね。ここはまだ試してないので、今後やっていきます!


明日も勉強頑張ります!

この記事が気に入ったらサポートをしてみませんか?