本記事では、コードの単語登録例を紹介します。
HTMLコードやCSSコード、そしてHTML特殊文字などを単語登録する例を紹介します（参考：単語登録のやり方）。
このページの目次
「コード」を入力するのは手間がかかる
ブログを書いたり、サイト制作をするとき、HTMLやCSS、HTML特殊文字などを入力することがあります。
でも、日本語を入力している途中で、全角半角にするのもめんどくさいし、コード自体を打つのも手間なんですよね。
たとえば「<strong>こんな感じ</strong>」で入力したいときなど。
そこで、コード自体も単語登録してしまいましょう。
ただし、もっと長いコードを書くときはスニペットツールなどをオススメします。
【ローマ字入力】「コード」を単語登録する例
では、ローマ字入力で「コード」を単語登録する例を紹介します。
HTMLの単語登録例
まずは、HTMLの単語登録例です。
HTMLの例
ふつうにHTMLを単語登録する例から紹介します。
| 単語 | 読み | 理由 |
|---|---|---|
| <h2> | ｈ２ | そのまま「h2」 |
| </h2> | ・ｈ２ | 「・（スラッシュと同じ位置）」＋「h2」 |
| <strong> | ｓｔ | 「strong」の略 |
| </strong> | ・ｓｔ | 「・（スラッシュと同じ位置）」＋「strong」の略 |
| <!-- | ｖ | 「vanish（見えなくなる）」の略 |
| <!-- | っｖ （ｖｖ） | 「vanish（見えなくなる）」の略 × 2連打 |
| <a href="#"> | あ； | 「 a 」 ＋「セミコロン」 |
| </a> | ・あ | 「・（スラッシュと同じ位置）」＋「 a 」 |
| <a href="https://tangotoroku.com/">単語登録.com</a> | たんご； | 「たんご（単語）」の略 ＋「セミコロン」 （※「単語登録ドットコム」へのリンクコードだから） |
以下にわたしが決めているルールをまとめます。
- 開始タグ
「開始タグ」の場合は基本的には、HTMLタグと同じスペルで登録。長いスペルのものはｓｔのように省略。
<a href="#">をａに登録する場合、「 a 」が母音であるためあ；に登録（参考：母音1文字に単語登録しない）。
- 閉じタグ
「閉じタグ」の場合「・」がスラッシュの位置と同じであるため、・ｓｔのように単語登録すると覚えやすい。
アルファベット1文字で開始タグを登録した場合はアルファベット2連打に登録。ｂ<b>であれば、閉じタグはっｂ（＝「b」の2連打）</b>のように。
- リンクタグ
リンクタグは、タグだけでなく、リンク先URLとキーワードも含めて登録しておくと便利。
読みは「キーワード＋セミコロン」が覚えやすい（参考：セミコロンキーを活用する方法）。
マークダウン記法の例
マークダウン記法でHTMLを入力する場合も考え方は同じです。
| 単語 | 読み | 理由 |
|---|---|---|
| ## | ｈ２ | 「h2」なので。 （※「##」のあとには半角スペースも登録している） |
| ** | ｓｔ | 「strong タグ」なので （※「**」の前には半角スペースも登録している） |
| ** | ・ｓｔ | 「strong の閉じタグ」なので （※「##」のあとには半角スペースも登録している） |
| ［単語登録.com](https://tangotoroku.com/) | たんご； | 「たんご（単語）」の略 ＋「セミコロン」 （※「単語登録ドットコム」へのリンクコードだから） |
CSSの単語登録例
HTMLと同じく、CSSも単語登録しておくと便利です。
| 単語 | 読み | 理由 |
|---|---|---|
| font-size:%; | ｆｓ | 「font-size」の略 （※ よく使う単位「:%;」「:em;」なども一緒に登録） |
| line-height:1.8; | ｌｈ | 「line-hight」の略 （※ よく使う数値も一緒に登録） |
| #ce000d | れｄ （ｒｅｄ） | 「red」の略 （※ よく使う色のコードを登録する） |
| /* | ｖ； | 「vanish（見えなくなる）」の略 ＋ セミコロン |
| */ | っｈ （ｈｈ） | 「vanish（見えなくなる）」の略 × 2連打 ＋ セミコロン |
| */---------------------------*/ | ｌ | 「line（線）」の略 |
この中でもとくに「色コード」を単語登録しておくのはオススメです。
HTML特殊文字の単語登録例
HTML特殊文字の単語登録はかなり重宝します（参考：HTML特殊文字とは？）。
| 単語 | 読み | 理由 |
|---|---|---|
| ¥ | いぇん； | 「¥（yen）」マークなので。うしろに「；」を追加。 |
| \ | ばっくすらっしゅ； | 「\（バックスラッシュ）」マークなので。うしろに「；」を追加。 |
| & | あんｄ； | 「&（and）」マークなので。うしろに「；」を追加。 |
| | ｓｐ | 「space（余白）」の略 |
| < | ＜； | 「<（山カッコ）」なので。うしろに「；」を追加。 |
| > | ＞； | 「>（山カッコ閉じ）」なので。うしろに「；」を追加。 |
| [ | 「； | 「 [（角カッコ）」なので。うしろに「；」を追加。 |
| ] | 」； | 「 ］（角カッコ閉じ）」なので。うしろに「；」を追加。 |
【スマホ】「コード」を辞書登録する例
スマホでコードを入力する機会はほぼないと思われます。
もし登録する場合は、ふつうは言葉の頭にこない文字をくっつけて辞書登録する方法がオススメです。
頭にくっつける文字の種類
わたしの場合は、ーを語の頭に付けると「コード」というふうにルールを決めています。
| 単語 | 読み | 理由 |
|---|---|---|
| <h2> | ーえ | 「ー（長音）」＋「エイチ」の略 |
| </h2> | ーーえ | 「ー（長音）」× 2 ＋「エイチ」の略 |
| <strong> | ーすと | 「ー（長音）」＋「ストロング」の略 |
| </strong> | ーーすと | 「ー（長音）」× 2 ＋「エイチ」の略 |
閉じタグの場合は、「長音」を2回繰り返して登録していますよ。
まとめ
本記事で紹介したコードの単語登録ですが、登録しておくとかなり便利です。
特に、色コードやHTML特殊文字などは登録しておくと、パッと使えるので重宝しますよ。
著書の紹介
わたしは自他共に認める「効率化オタク」です。
そのわたしが、KADOKAWAさんから『効率化オタクが実践する 光速パソコン仕事術』という書籍を出版しました（おかげさまで重版もされました）。
この記事を気に入ってくれたなら、きっと満足していただけるはず。
