CMSであるWordPressで記事を書く場合、あまりHTMLを意識しなくても更新出来てしまいますよね。
最初の内はそれでいいと思いますが、どうせならウェブの世界に片足を突っ込んだ訳なので、ウェブの仕組みを覚えておいた方が、取り組みもより有意義になりますよ。
ウェブの仕組みとは、ウェブ構成しているHTMLタグのこと。
ウェブ上の教養みたいなものなので、この存在を知っておくと損することはないです。
今回は、「ブログ記事を書くユーザーなら覚えておいて損がないHTMLタグ5選」をご紹介します。
<a>タグ（リンクの指定）
<a>タグでは、リンクの指定ができます。
関連記事、外部サイトで紹介したい記事、外部のウェブサービスで作成したページ…etc。
こういったページからページへの移動させる為に、リンクを指定を使います。
<a href=”https://konohaya.com/” target=”_blank”>このは屋のブログ</a>
という記述になります。
href=”https://konohaya.com/”の箇所でURLを指定し、target=”_blank”では別タブで開くようにする指定をしています。
リンク指定したい文字列をタグで囲み、最後に</a>で閉じる形ですね。
よく使うタグなので、覚えておいた損はないです。
<blockquote> タグ（引用文を掲載する際に使用）
<blockquote> タグは、引用文を掲載する際に使用します。
重複コンテンツを避ける為と、著作権コンテンツで後々問題にならないように、引用文にしておく為に使います。
使い方は、<blockquote> 引用文をここに記載</blockquote> といった形式で記述します。
<style>タグ（CSSを直接指定できる）
<style>タグを使うことで、フォントサイズや背景色などを柔軟に指定できます。
<span style=”background-color: #efefef; color: #ffffff; font-size: 25px;”>ここの文字列を記載
</span>
で、指定ができます。
「background-color: #efefef;」で背景をグレイ色にし、「color: #ffffff;」でテキスト色を白にしています。
そして、「font-size: 25px;」でフォントサイズは25pxに指定しています。
こういった柔軟な設定が出来るので、よく使います。
<img>タグ（画像の指定）
<img>タグでは、画像の指定で使います。
<img src=”画像のURL” width=”200″ height=”92″/>
で、指定ができます。
「src=”画像のURL”」の箇所で、表示させたい画像のURLを指定します。
あとは、「width=”300″ height=”100″」で幅と高さの指定が可能です。
これを覚えておくと、画像の大きさの柔軟な変更が出来ますよ。（表示後の確認は必ずしてください。）
<iframe>タグ（外部サイトのコンテンツ表示）
<iframe>タグは、外部サイトのコンテンツを表示させる為に使用します。
<iframe width=”560″ height=”315″ src=”外部サイトのコンテンツURL”></iframe>
といった形式で記述します。
「src=”外部サイトのコンテンツURL”」で、外部サイトのコンテンツURLを指定しますが、多くの場合は、外部サービスに埋め込みコードと呼ばれるものがあり、そのままコピペできるので、この辺はノータッチでOKです。
「width=”560″ height=”315″」で、任意のサイズに変更できるので、ここを覚えておきましょう。
編集後記
今回は、「ブログ記事を書くユーザーなら覚えておいて損がないHTMLタグ5選」についてご紹介しました。
ご紹介したものは、あくまでHTMLタグの一部です。
他にも無数にありますので、気になったら調べてみてください。
CMSを使っていると、ツールバーでなんとかなりますが、HTMLタグを知っておくとブログのカスタマイズ性が上がり、微調整も出来るようになりますよ。
以下、参考になる記事ですので、ご参照ください。