class名を付ける際に、意図せず同じclass名を付けてしまっていたという問題を回避するためにみなさんはどうされていますか？

Question

HTMLとCSSとJavaScriptの初学者です。

コーディングに慣れてきて、記述する行数が増えていく中で、最近ふと思ったことがあります。

それが「HTMLでclass名をつける際に、意図しない箇所で同じclass名を付けてしまったことにより、CSSを記述する際に意図しない場所のレイアウトまで変更してしまった」という問題をいかにして回避するかということです。

一概にこのやり方が1番良いと言えるものではないと思うのですが、私の頭で考え出したベストな回避策は

「class名を新たに付けるときにVScodeであれば「Ctrl +F」を押して検索窓を開いて、新たに入力する予定のclass名で検索して、一致するものがないか探す」

というものです。

このやり方が1番良いのでしょうか？
みなさんがこの問題についてどのように対処されているのか、ご教授いただければ幸いです。

Comments

[Zuishin]

コピペの集合体ではなく自分で作るなら、記憶にあると思います。
また同じクラス名があっても、階層によりスタイルを切り替えられるので、特に不都合はないと思います。

[Lhankor_Mhy]

BEMなどでCSS設計をすることによって、ある程度は防げると思います。

[maisumakun]

どのようなツール、ライブラリを使っていますか？

[sino3325]

VScodeのみ使っております。
ライブラリはまだ使っていません。
生のJavaScriptで頑張って書いて基礎を固めているところになります。

Answer 1

皆さん、ご回答ありがとうございました。
CSS設計についてまだ学べていないので、それを学んでから改めて考えます。