リンク、画像、見出し、中央寄せなど基本的なHTMLタグの使い方

この記事は4分で読めます

こんにちは、カズーイです。

 

今回はリンクタグ、画像タグ、見出しタグ、

中央寄せ、文字サイズ、文字カラーなど、

最低限覚えておいたほうが良いHTMLタグの使い方を解説します。

 

基本的にはタグを自分で打つ機会はほぼないですが、

ワードプレスのサイドバーを編集する場合など、

中には自分で打つ必要が出てくる場面もあるので、

ぜひ動画で学んでみてください。

 

 

リンクタグ

 

ではリンクタグの使い方から解説しましょう。

 

リンクタグとは別のページにリンクを貼るためのタグです。

 

リンクタグの基本的な形はこんな感じ↓

<a href =”URLを入力”>文字を入力</a>

 

これに例えば僕のブログへリンクを送るよう設定したいなら、

<a href=”http://kazui01.com”>公式ブログはこちら</a>

 

こんな感じになります。

 

非常によく使うタグですので、

必ず覚えるようにしてください。

 

 

画像タグ

 

続いて画像タグの使い方です。

 

画像タグは画像をウェブ上で表示されるときに使います。

 

画像タグの最も簡単な形はこちら↓

<img src=”画像のURLを入力” />

 

実はこれで表示できてしまいます。

 

ただし、サイズの設定などを行う場合は、

もう少し複雑になります。

 

<img src=”画像のURL” widht=”数字を入力” height=”数字を入力” />

 

例えばこんな感じになります。

 

さらに画像の説明を入れたいなら、

 

<img src=”画像のURL” widht=”数字を入力” height=”数字を入力” alt=”簡単な説明” />

 

こんな感じです。

 

説明を入れる箇所にキーワードを含めておくと、

SEO対策にもなるので覚えておいて下さい。

 

 

中央寄せ

 

続いて中央寄せのやり方を解説します。

 

中央寄せで1番簡単なのは、

<center></center>になります。

 

例えば、

 

<center>公式ブログはこちら</center>

 

という風に設定すれば「公式ブログはこちら」

という一文が中央に寄ります。

 

ただし、一応言っておくと、

このタグは現在は非推奨となっています。

 

ただ、普通に使えるので気にせず使って構いません。

 

 

見出しタグ

 

続いて見出しタグについて解説します。

 

見出しタグは全部で6種類あって、

<h1><h2><h3>という感じで1~6まであります。

 

<h1>公式ブログはこちら</h1>

という感じで使います。

 

ただし、1~3までしか基本的に使いません。

 

そしてワードプレスは勿論のこと、

HTMLサイトにしろツールを使えば、

見出しタグは1クリックで挿入できるようになっているので、

自分で打つ機会はほぼないと思います。

 

 

改行タグ

 

続いて改行タグの使い方を解説します。

 

改行タグは<br>というタグになります。

 

文章を改行したり、

また行間を開けたいときにも使います。

 

例えば、

 

公式ブログはこちら<br>

公式ブログはこちら

 

となるわけですね。

 

改行したい場合はタグを2個入れればOKです。

 

非常によく使うタグなので覚えておいて下さい。

 

 

太字タグ

 

続いて太字タグの使い方を解説します。

 

文字を太字にするには2つ方法があって、

<storong>というタグと<b>というタグがあります。

 

ただし、意味が違っていて、

<storong>の方は強調を意味します。

 

なのでGoogleが重要なキーワードであると認識するため、

昔はSEO効果があると言われていました。

 

今も効果はあるとかないとか色々言われてますが、

一応できる対策は全てやっておいたほうが良いので、

適度に文章の中に入れておきましょう。

 

勿論、やり過ぎないよう注意してください。

 

一方、<b>の方はただの太字です。

 

なので文字を装飾したいときに使えば良いです。

 

 

文字サイズ

 

続いて文字サイズを変更するタグの使い方を解説します。

 

文字サイズの変更を行うタグは、

 

<font size=”数字を入力”>文字</font>

 

こんな感じになります。

 

まぁこれもほとんど使うことはないと思いますが、

一応覚えておいて下さい。

 

 

文字カラー

 

続いて文字カラーを変更するタグの使い方を解説します。

 

文字カラーの変更を行うタグは、

 

<font color=”色コードを入力”>文字</font>

 

こんな感じになります。

 

これも普通は1クリックで入力できるようになっているので、

ほとんど使う機会はないかと思いますが、

一応覚えておきましょう。

 

ちなみに色コードに関しては、

こちらのサイトが参考になるかと思います↓

http://www.colordic.org/

 

 

引用タグ

 

続いて引用タグの使い方について解説します。

 

引用タグは<blockquoto>というタグになります。

 

例えば、

 

<blockquoto>これは引用です</blockquoto>

 

というような感じで使うと、

挟んである文章は引用だとGoogleが判断するので、

コピペだと間違われずに済みます。

 

コピペはペナルティの対象となるので、

どこかのサイトから引用する場合は、

必ず引用タグを使用してください。

 

 

まとめ

 

ということで今回は、

最低限覚えておいたほうが良いHTMLタグについて解説しました。

 

今回お教えしたタグを使えば、

ちょっとした文字装飾だったり、

レイアウトを整えることはできるので何かと便利です。

 

ぜひ試してみてください。

 

それでは今回はこれで以上になります。

 

動画ではより分かりやすく丁寧に解説していますので、

ぜひ一度ご覧になってみてください。

 

また、何か分からないことなどあれば、

お気軽に問い合わせフォームからご連絡下さい。

 

問い合わせフォームはこちら

 

メルマガに登録して下さっている場合は、

直接返信して頂いても構いません。

 

それでは最後まで読んで頂き、ありがとうございました!

 

  • このエントリーをはてなブックマークに追加
  • LINEで送る

関連記事

管理人:カズーイ


こんにちは。カズーイと申します。

僕はコミュ障、ニート、父の死、借金、叔父の脅迫、夜逃げと、壮絶な人生を歩んできました。

しかし、現在はパソコン1台で月100万円以上を稼いで自由な人生を送っています。

どん底からたった6ヶ月で成功できた秘密は下記からご覧下さい。
プロフィールはこちら

実績画像はこちら
※2016年6月メール1通で200万円達成


いつもクリックありがとうございます。
カズーイの順位はこちらからチェック↓

人気ブログランキングへ
  • このエントリーをはてなブックマークに追加
  • LINEで送る

ビジネスを成功へ導く知識を詰め込んだクラウドサービス「Success Cloud」


ダウンロード数1000人突破。

メルマガにご登録頂けると、動画本数111本、総再生時間1100分以上、総文字数20万字以上で構成された業界初のクラウドサービス「Success Cloud」をお渡ししています。

数百万円以上かけて学んだ思考やノウハウを1つに凝縮するために3ヶ月かけて作成しました。

全てのコンテンツがネット上にあるため、PCからでもスマホからでも見たい時にいつでも好きなだけ学んで頂けます。

メルマガ登録は無料、必要ないと感じれば本文内の解除URLからいつでも解除できます。