How to

【Post_Detail.html】 ←この名前はNGです! HTMLの命名規則をご紹介

「命名規則」は必ず学習してください!

皆さん、こんにちは。ProgLearn編集部です。

突然ですが、「命名規則」というものを意識したことはありますか?

どんぶラッコ
どんぶラッコ
プログラムの中で、ファイル名や関数名をどのように定義したらいいのか、というルールって聞いたことがあります。

その通り。簡単に言えば名前をつける時のルールですね。

初心者がプログラミングを学ぶ際、

「命名規則?そんなもの最初のうちは無視していいよ」

なんて教える人がいますが、私は断固反対です。

何故なら、名前のつけ方に一定のルールを設けることは、プログラムの可読性を高めることに繋がるからです。

その場のノリでコードを書いてしまうと、後から読んで「あれ?ここ、何しているんだっけ?」と一々確認をする手間が発生してしまいます。

また、こんな風に名前がバラバラだったら、どう思いますか?

post.html
postResult.html
post_detail.html

…読みづらいし、新しいファイルを作った時に、どんな名前をつければいいのか、迷ってしまいますよね。

なので、名前のつけ方にルールを設けることは、後々の自分のため、チームのために必要不可欠なことなのです。

あくまでも”よく使われている”ルール

このように書くと、

chat face=”don-bu-rakko.png” name=”どんぶラッコ” align=”left” border=”gray” bg=”gray” ] “命名規則” でググると情報が沢山出てきてしまってどれを信じていいのかわからない… [/chat]

という声を耳にします。

その通り!命名規則は使うプログラミング言語によって、様々な種類があります。

命名規則とはあくまでも「こういう方法がよく使われているよ」という法則です。

極論を言えば、最終的には自分や開発チームが開発しやすいルールがあれば、それを使ってもらえれば構いません。

ただし、ルールの中にはルール通りに書かないと動かないものも存在します(フレームワークを利用するとき など)。

なので、よっぽどの理由がない限り、広く使われているルールを使う方が懸命です。

HTMLでよく使われる命名規則

今回は、HTMLでよく使われる命名規則の例をご紹介しましょう。

「言われてみれば確かに!」となるものが多いかもしれませんね!

小文字を使う

URL(URI)では、大文字小文字が区別されます。

https://www.ibm.com/support/knowledgecenter/ja/SSFKSJ_7.5.0/com.ibm.wmqfte.doc/web_trouble_case.htm

なので、どちらかに統一することが多いです。よほどこのことがない限り、ファイル名は小文字を使われることが多いです。

複数単語の場合はハイフンでつなぐ

複数の単語、例えば green apple のようなものは、 greenapple みたいに繋げて書いてしまうと見づらいですよね。ということで、通常は green-apple のように、ハイフンを間に入れて繋ぎます。

ここで気をつけたいのは、アンダーバー( _ )を使わないこと。一部ブラウザでは勝手に省略されてしまう場合があるためです。

https://restfulapi.net/resource-naming/


以上、HTMLの命名規則の一部をご紹介しました!

編集部
編集部
この他にもまだまだたくさんのルールがあるのでぜひチェックしてみてください!