文字を装飾するタグはいっぱいある
タイトルから見てお分かりのことと思いますが、CSSを使わずともある程度文字に装飾をすることが可能です。ひとつひとつざっと説明していきます。使うのはそんなに難しくないです。他にもあるのですが長くなってしまうので記事を分けようと思っています。
他にもあるので繋げておきます。
段落を作る<p>タグ
私のようにつらつらと日本語を書く記事を作っていると、段落の１つや２つ無いとかなり読みにくい見た目になってしまいます。羅生門が段落なしでずーっと書かれていたら読むのしんどくないですか？あっ、そうでもない？
というわけで皆さんもご存じのその段落です。
段落タグ<p>の使い方
段落タグの使い方は簡単です。<p>と</p>の間に段落にしたい文字を書くだけです。
では実際にやってみましょう。段落<p>タグで括るとこんな感じになります。↓
段落にすると、段落と段落の間にスペースが空きますよ。
こんな風にね。
↑この中身はこうなっています。↓
<p>段落にすると、段落と段落の間にスペースが空きますよ。</p>
<p>こんな風にね。</p>段落タグ<p>の注意点
段落にすると、最後の行は勝手に改行されるし、その下には１行分の空白が空きます。見やすいといえば見やすいですよね。話が切り替わったときに有効に使うと見る側が読みやすい記事になると思います。（いちもんじはあまり使ってないけど）
水平線を付ける<hr>タグ
無性に水平線を見たいときって無いですか？（いちもんじは無いです）
そんな時に役に立つのがこの<hr>タグになります。どんな時に使うかというと、小説とか書いている方には良いかもね～って感じで。章を区切るときとか。ちょっとやってみましょう。
<hr>タグの使い方
「私はやっていない。」
だが、彼女は言う。
「いいえ、あなたは触ったわ。」
ご覧ください。見事な水平線ですね。コードはこのようになっております↓
そこで彼は言った。<br>
「私はやっていない。」<br>
<hr>
だが、彼女は言う。<br>
「いいえ、あなたは触ったわ。」<hr>タグは終了タグが無くても機能します。いわゆる空要素というやつですね。
<hr>タグを装飾する
ちなみにですが、一文字のホームページの、この見出しの下についている線みたいなのも<hr>タグとCSSでデザインすることが可能です。ただ長くなりそうなので、それはまた別の記事にまとめることにしますね。かわいく仕上げるなら切り取り線にハサミ、みたいな表現も可能です。
文字を強調させる<strong>タグ、<b>タグ
いちもんじがよく使っている、文字を太くするやり方。それには<strong>タグが使われています。また、<b>タグでも文字を太くすることが可能です。ちょっと見てみましょう。
これがbタグです。
どちらのタグもあまり違いを感じませんね。
<strong>タグと<b>タグの使い方
これも簡単で、開始タグと終了タグの間に強調したい文字を書くだけです。
<strong>これがstrongタグ</strong>です。<br>
<b>これがbタグ</b>です。当たり前ですが囲った中の文字だけが強調されます。
<strong>タグと<b>タグの違い
見た目に関しては先ほど見てもらった通りに違いなんてありません。ですが<strong>には「ここ大事だからな～。テストに出るからな～！」といったSEO的に意味のある、重要であることを伝えることが可能なタグで、<b>に関してはただ表面上だけ、デザイン面で強調するだけといった違いがあるとかないとか。
（正直SEO対策でこれが有効だよ！！ってGoogleさんとかが明確にするわけではなく、これはそう言われているよという噂だけなので何とも言えないけれども、火のない所に煙は立たぬ。本当に大事な内容だったらstorngで括ったほうが良いかもしれないです。）
意味的に強調させ斜体にする<em>タグ
強調って、さっき見たやんけ！！と思われる方もいらっしゃると思います。さっきのは太字にして強調する機能を持っていました。しかし！！こちらのemタグは「SEO的に大事だよ！！」ってことを伝える意味を持っていて、且つその囲われた文字を斜体にする能力を持っています。
<em>タグの使い方
<em>タグの使い方はとっても簡単。<em>と</em>の間に強調させたい文字を書き込むだけです。
↑の例で行くと、「emタグ」の部分を<em>タグで括っています。こうです↓
<em>これがemタグ</em>です。<br>ただ、私のこのホームページのフォントを「メイリオ」に設定していて、メイリオの日本語には斜体が無いのかローマ字しか斜体になってくれませんでした。ぐすん。
<em>タグを使用するタイミング
でもさっき<strong>が強調させるとか言うとったでしょ、それなら別に<strong>でいいんじゃないの！？って人もいるでしょう。まあ…その通りなんですけど。
<strong>は強調したい長めの文章に適用させるイメージです。じゃあ<em>タグはなんなの！？って感じですよね。イメージで言うとハリーポッターの日本語訳でこういうのが使われてそうだなって感じです。例えばこんな。↓
正しくは、”Wingardium Leviosa.”
あなたのは、“Wingardium Leviosaaa.”
大事な部分だけ（短い単語とか。この場合は“Wingardium Leviosaaa.”にemタグを適用させています。）にこの<em>タグを使うイメージです。ハリポタのしゃれおつな表現方法を見習いましょう。
文字を斜体にする<i>タグ
先ほどの<em>タグは、意味的に強調させながらSEO的にも働きかけるタグでしたが、ただ斜体にしたい気分の時もあるでしょう。そんな時はこの<i>タグを使いましょう。iはイタリックの略ですね。ありがち～。
<i>タグの使い方
<i>タグの使い方も簡単で、斜体にしたい文字を<i>と</i>で括るだけです。
<i>test</i>これでこうなります。↓
日本語が斜体になってくれないから英語で表現するしかないのが惜しいところです。
