こんにちは、WEB専攻のかわしまです。
今回は私がコーディングするときに個人的に気をつけていることを、備忘録も兼ねて記事にしようと思います。
コーディングをするときに気をつけること
①名前のつけ方
コーディングを始めたばかりの頃は、クラス名やファイル名を「a」「aa」など、適当に設定したりしていました。
でも、それだとエラーが出たりして後からコーディングを見返したとき、どの部分のコードなのか、何をするためのcssなのかが分からず、探すだけで時間を取られてしまいました。
なので私は、誰が見ても分かりやすいコードを作るため、大きく２つのルールを自分で決めました。
その１ クラス名は分かりやすく！
「div class=”a”」や、「div class=”abc”」など、適当につけるのではなく、例えばロゴやメニューがはいるヘッダー部分のクラス名なら、
「div class=”header_menu”」、
メインビジュアルが入る部分なら
「div class=”main_visual”」
とつける、など、当たり前だけど忘れてしまいがちなのですが、これを意識するだけで探す時間が大分短くなりました。
↑実際のコーディング
その２ 「<!–>」と「/*–*/」でコンテンツごとに分ける！
以前いいなと思ったWEBサイトのコードを見たときに、非表示のコードを利用しコンテンツごとに分けていたのが、すごくいいなと思い私も意識し始めました。
例えばヘッダー、商品の紹介、商品のレビューで構成されたサイトのコーディングをするとき、
<!—-ヘッダー—>
〜〜〜ヘッダーのコード〜〜〜
<!—-商品紹介—>
〜〜〜商品紹介のコード〜〜〜
<!—-レビュー—>
〜〜〜レビューのコード〜〜〜
と書くと、どこにどのコンテンツのコードがあるのかが一目で分かり、また整理されて綺麗なコードになります。
同じようにcssでも
/*—ヘッダー—*/
〜〜〜ヘッダー部分のcss〜〜〜
/*–マウスオーバーアニメーションー—*/
〜〜〜css〜〜〜
と書くと、こちらも一目でどこにどのcssがあるのかが分かりやすくなります。
↑html
↑css
以上が、私がコーディングで気をつけていること名前編です。
当たり前のことばかりですみません！私もまだまだ勉強中なので、他にこうした方がいいよ、などありましたら教えていただけると嬉しいですo(^_^)o
ここまで読んでくださりありがとうございました！
