アフィリエイトブログでもよく使う必須アイテムです。
アフィリエイトサイトも最近は、高品質で使いやすいブログツールでサクサク作れますね。
本当に楽になりました。
でもＨＴＭＬタグを知らないと大変なことになりますよ。
ワードプレステーマなど、どのツールを使ってもＨＴＭＬタグは避けて通れないからです。
ワードプレステーマを例に挙げると、
- サーチコンソールやアナリティクスのコードタグをどこへ設置したらよいか分からない。
「セクション内」って何？「直前」ってどこ？ - ＡＳＰリンクタグを貼ったがなぜか離脱率が多いのは個別ウィンドウだった！
ＨＴＭＬタグのどこを消すの？ - 画像や記事がずれたり、とんずら行方不明。回り込みだった！
- 著作権侵害で訴えられた（＞＿＜）
- グーグルのモバイルユーザビリティで「文字が小さくて読めな～い！」と警告がきた！
- グーグルのモバイルユーザビリティで「画像サイズが小さ～い！」と警告がきた！
- ワードプレステーマを購入したがＨＴＭＬタグがたくさん出てきて操作できない。
▼ＨＴＭＬタグの実例は、当サイト内にも詳しく書いています。▼
では本題に入ります。
目次
必要最小限知っておくべきＨＴＭＬタグ
ここからは、
アフィリエイターが知っておくべき
必要最小限のＨＴＭＬタグを紹介します。
ワードプレスは「html」ではなく「php」ですが
テキスト編集モードで使うタグは同じです。
ワードプレスの場合は「ビジュアルモード」で作成してもよいですが、そのとき自動変換される「テキストモード」でも確認する習慣が大事です。
htmlタグの構造はＳＥＯ設定に必須
ホームページは、以下のhtmlタグ（構文例）で
設定されます。
ワードプレスは「html」ではなく「php」なので、
構成が違いますがここからの説明では気にしなくてよいです。
ホームページhtmlタグ構成例
＜ｈｔｍｌ＞
＜ｈｅａｄ＞
＜／ｈｅａｄ＞
＜ｂｏｄｙ＞
＜／ｂｏｄｙ＞
＜／ｈｔｍｌ＞
以上のタグを最低限知っておかないと、
グーグルで認識されませんので説明しますね。
グーグルサーチコンソールでサイトの所有権を確認後、
HTMLメタタグをサイトのテーマファイルに貼り付けます。
グーグルサーチコンソールのHTMLメタタグ
ワードプレスの「テーマ編集」で、
headセクション内の、最初のbodyセクションの前に貼り付けます。
グーグルサーチコンソールに戻り、
確認をクリックして完了です。
グーグルアナリティクスの場合は、
タグを＜ｈｅａｄ＞の真下に貼り付けて完了です。
ワードプレスの文字編集例
文字の大きさ・強調・色などを編集するときは、
以下のタグを使います。
文字の大きさ＝＜ｆｏｎｔ ｓｉｚｅ＝”１～７”＞文字＜／ｆｏｎｔ＞
文字を太くする＝＜ｓｔｒｏｎｇ＞文字＜／ｓｔｒｏｎｇ＞
文字の色＝＜ｆｏｎｔ ｃｏｌｏｒ＝”ｒｅｄまたは＃カラーコード”＞色＜／ｆｏｎｔ ＞
アンダーライン＝＜ｕ＞文字＜／ｕ＞
文字の背景色＝＜ｓｐａｎ ｓｔｙｌｅ＝ｂａｃｋｇｒｏｕｎｄ－ｃｏｌｏｒ：＃カラーコード＞背景＜／ｓｐａｎ＞
スマホで１６px（ピクセル）
改行タグと段落タグで記事を読みやすくする
改行タグ＝＜ｂｒ＞
段落タグ＝＜ｐ＞文章＜／ｐ＞
改行タグを使いすぎると面倒だし、
とくにスマホ表示が不自然になるので、
記事のセンテンスごとに段落タグを使ったほうがよいと思います。
リストタグで簡潔な箇条書き
リストタグで簡潔な箇条書きが作れます。
面倒くさいのでついつい直接入力してしまいますが
ＳＥＯ上不利な評価になります。
グーグルさんはちゃんと見ていますよ^^
じ～～っ．．（＠＿＠）
でも「やっぱ面倒だ！」．．ですよね。
▼ワードプレステーマDiverではサクサクッと作れます。▼
divタグで文字や画像の位置変更と囲い枠
文字や画像の位置を左、中、右に変更します。
文字や画像の位置を左＝＜ｄｉｖ ａｌｉｇｎ="ｌｅｆｔ"＞左＜／ｄｉｖ＞
またｄｉｖタグは、囲い枠などの入力補助など
多くの機能に使われるので覚えておきましょう。
記事タイトルタグ（ｈ１）
ワードプレスなどの編集画面で記事タイトルを入力すると自動生成されます。
ここは追加編集することはありませんが、
とくに記事内でむやみに使わないでください。
ＳＥＯ上、記事タイトルタグ＜ｈ１＞は
最も重要な位置づけです。
記事タイトルタグ＝＜ｈ１＞記事タイトルタグ＜／ｈ１＞
キーワードを配列して、ユーザーを引きつけるタイトルを作ります。
見出しタイトルタグ＜ｈ２～ｈ６＞
「大見出し」または「中見出し」が＜ｈ２＞タグです。
＜ｈ２＞タグも＜ｈ１＞と同じく、ＳＥＯ上、重要です。
以降、「小見出し」＜ｈ３～ｈ６＞がありますが、
せいぜい使っても＜ｈ４＞までですね。
見出し配列の例は以下のような構成です。
＜ｈ１＞記事タイトルタグ＜／ｈ１＞
＜ｈ２＞大見出しタイトルタグ＜／ｈ２＞
＜ｈ３＞小見出しタイトルタグ＜／ｈ３＞
＜ｈ４＞小見出しタイトルタグ＜／ｈ４＞
＜ｈ２＞大見出しタイトルタグ＜／ｈ２＞
・
・
・
画像は必須！イメージタグ
アフィリエイトサイトに写真やイラストなどの画像はもはや必須です！
画像＝＜ｉｍｇ ｓｒｃ＝"素材ファイル" ａｌｔ＝"" ｗｉｄｔｈ="幅" ｈｅｉｇｈｔ＝"高さ" ＞
イメージタグでは＜／ｉｍｇ＞は不要です。
ｗｉｄｔｈ="幅"の数値を変えて、見やすい大きさにしましょう。
スマホ基準がオススメです。
なおＡＭＰを使う場合は、
挿入前に画像容量横幅ピクセル＝１２００以上にしないとグーグルから警告がきます。
ホームページで表示されないので、
ＪＰＧ、ＰＮＧ、ＧＩＦを使うこと。
リンクタグを知らないと離脱される
リンクタグの機能は、別のサイト（ＡＳＰ含む）や
記事見出しにジャンプします。
別の記事（ＡＳＰ含む）＝＜ａ ｈｒｅｆ＝"ＵＲＬ"＞文章またはイメージタグ＜／ａ＞
特定の見出しにジャンプ＝＜ａ ｈｒｅｆ＝"#見出しタグid＝">文章＜／ａ＞
リンクタグは個別ウィンドウを使わないほうがよい
＜ａ ｈｒｅｆ＝"ＵＲＬ" ｔａｒｇｅｔ＝"＿ｂｌａｎｋ"＞を個別ウィンドウタグと言います。
とくにスマホで個別ウィンドウを表示させるとユーザーが本記事に戻ってこない。
すなわち離脱することが多いので使わないような潮流になっています。
２０１９年９月現在、大手ＡＳＰさんからも「アフィリリンクの個別ウィンドウは中止」または「アフィリリンクから削除してもよい」というメールが多数配信されています。
「個別ウィンドウタグは使用不可」になりますね。
引用タグでグーグルに認識させて著作権を守る
別サイトからのコピペは絶対ＮＧですが、引用文を使いたともありますね。
しかしグーグルさんはちゃんと見ていますよ^^
じ～～っ．．（＠＿＠）
記事に【引用】と書いただけではダメ。
以下のタグを使わないとペナルティーを喰らいますよ。
・引用タグ長目の文章＝＜ｂｌｏｃｋｑｕｏｔｅ＞引用文＜／ｂｌｏｃｋｑｕｏｔｅ＞
・引用タグ長目の文章＝＜ｑ＞引用文＜／ｑ＞
・引用タグにＵＲＬ＝＜ｂｌｏｃｋｑｕｏｔｅ＞＜ｃｉｔｅ＞ＵＲＬ＜／ｃｉｔｅ＞＜／ｂｌｏｃｋｑｕｏｔｅ＞
テーブルタグ（参考）
基本的に以下に示す配置を知っておけば良いです。
最近のワードプレステーマでは編集することはめったにありません。
＜ｔａｂｌｅ＞
＜ｔｂｏｄｙ＞
＜ｔｒ＞
＜ｔｈ＞列文字＜／ｔｈ＞
＜／ｔｒ＞
＜ｔｒ＞
＜ｔｄ＞データ＜／ｔｄ＞
＜／ｔｒ＞
＜／ｔｂｏｄｙ＞
＜／ｔａｂｌｅ＞
↓
以降追加
アフィリエイトＨＴＭＬタグ知識まとめ
冒頭にもかきましたが、ワードプレステーマの「ビジュアルモード」で作成しても「テキストモード」で確認する習慣が大事です。
困ったことが少なからず発生するからです。
参考ですがわたしのワードプレスの作り方を
紹介します。
- キーワード選定とタイトル・見出しをエクセルで作成。
- 画像素材を準備する。
- タイトル・見出しを基にメモ帳で記事作成。
- 「テキストモード」に貼り付け、仕上げ。
- 「ビジュアルモード」でチェックする。
- 不具合表示を修正する。
これで『アフィリエイトサイト作成で必要最小限知っておくべきＨＴＭＬタグ』を終わります。
他にも役立つタグが有るのでチェックしてみてください。
最後までお読みくださりありがとうございました（ｍ＿ｍ）。
