上記の他に以下のような規則も必要に応じて設けると良いでしょう。 接頭辞(プレフィックス)を必要に応じて付ける(例:is-xxxx) 単語は略語を使用しない(NG例:cnt, hdg, tbl) 参考 変数名の命名規則/**ケースの使い分け 命名方法 命名規則が決まればそれに則って命名すれば良いのですが、どういう単語を使えば良いのか指標がほしいところです。 英単語がすぐ出てこないような時はネーミング辞書 Codicを使ってみると良いです。命名の参考としては良いツールだと思います。 目的や内容によっては汎用的に使える英単語も存在します。例えば、レイアウト用の要素としてcontainer, row, col。ジャンル・業界別の要素としてabout, results,productsなど。 レイアウト用のclass名や汎用class名に関してはいろんなCSSフレームワークのコードを見て研究すること
![フロントエンドの命名や設計の基本と自分の現在の設計 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/eaf2ce530639de5fa1ff74a2fac26ced63349954/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUUzJTgzJTk1JUUzJTgzJUFEJUUzJTgzJUIzJUUzJTgzJTg4JUUzJTgyJUE4JUUzJTgzJUIzJUUzJTgzJTg5JUUzJTgxJUFFJUU1JTkxJUJEJUU1JTkwJThEJUUzJTgyJTg0JUU4JUE4JUFEJUU4JUE4JTg4JUUzJTgxJUFFJUU1JTlGJUJBJUU2JTlDJUFDJUUzJTgxJUE4JUU4JTg3JUFBJUU1JTg4JTg2JUUzJTgxJUFFJUU3JThGJUJFJUU1JTlDJUE4JUUzJTgxJUFFJUU4JUE4JUFEJUU4JUE4JTg4JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz1kNjE4M2U1N2I2ODc2ODMwOThmZmQxNTkyMTVjZDU4MA%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBidWNoaXlhNHRoJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1kMWFhZjQ5NDc1OGU0Mjc0ZWRkYTAyMmFjYTRhM2IyOQ%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D9db9fbc8d7ecc7da5eae3c70a95a7741)