デザイン、コンテンツ、ライティング、コーディングがほぼ同時並行で走るという案件にて、
htmlやscssが頻繁に書き換わるという事案が発生していました。

そんな中、そもそものclass名の名付け方これであってるんだろうか。という疑問が湧き上がり、基礎の基礎に立ちかえることとしました。
個人開発で勉強していたので、「誰が見てもわかりやすい・理解しやすい」というコードをもっとめざして行きたいです。

そもそもBEMとは

Block Element Modifierの略。

・Block ：大枠となる独立した要素
・Element：Blockの中の要素
・Modifier：BlockやElementスタイル

このような構成で、わかりやすくcssを設計するために作られた命名規則。
一番ポピュラーな命名規則だと思われます。

書き方

class="block__element–-modifier"

このように、アンダースコア・ハイフンを2文字ずつ使う。
複数単語が発生する場合は、ハイフン１つで区切る。

どんな単語を使っていいかわからない場合は、こんなサイトもあるので日本語で調べてみるのもよし。

こちらの記事を参考に書いていますので、頻出の単語はここで調べる方が良さそう！
とてもよくまとまっており、私の記事を見るより全然オススメします。

個人的には、inner,outer,wrapper,containerの扱いが微妙なところがあり、意識できていません...
あまり階層を深くしすぎないhtmlを書けるといいなと感じました！
html設計も勉強したい。