記事を作成する際、意外と使われていないHTMLタグたち

2017.09.09|サイト構築

クライアントさんからご依頼があって
WPでコーポレートサイトを作ってください
等、サイト作成依頼も請け負っている私ですが、
クライアントさんと話していたり、納品後ブログの更新や記事の更新などを見ていて思うことがあるんです。

「見出しタグとか、強調タグとか使ってください!」

そう、文書構造とか特になくプレーンテキストで記事書いてらっしゃる方がちらほら。

といっても、なんで記事書くのくらい自由に書かせてよ

ってな感じかもしれませんが。

 

Word文書を作るように記事を書いて欲しい

HTMLのコードが~、タグが~
そんな話をしてもよくわかんないと思いますが、
マイクロソフトのWordならご利用になる方も多いのでイメージしやすいかと思いますが、
ほんとに、Word文書作るように記事も作ってください。

Word文書を作るということはどういうことか

Word文書作成する際に、
「段落」「ページ改行」「セクション区切り」「見出し」「太文字(強調)」「イタリック」…などなど
作った文書に色んな「装飾」を付けて文書を作成されるかと思います。

Word文書の場合、きちんと「見出し」や「段落」等をテキストに指定しておけば、
自動で目次が作れたり、ページ内のデザイン変更も一括でできたり、
それ以前にとても見やすい文書になりますよね。

それと同じでWebでブログや記事を書く場合も「見出し」や「段落」等を意識してテキストに指定していくだけでとても見やすい記事になります。

Webの場合はそれだけでなく、ページ内の文書構造をきっちりしておけば、SEO対策にもなるという利点もあります。

また、iPhone等でスマホページを見ている際に、ブラウザのURLや検索文言などを入力するフォーム部分によくこういうマークを見たことがあると思いますが、

「Safari Reader」と言って、CSSを取り除いた文書で記事などを読むことができます。

先ほど記載したように「見出し」などをテキストに指定し、文書構造をきちんとすることで、この機能を使用してもわかりやすく読みやすいように見せることができます。

 

文書構造をきちんと整理することでSEO対策にもなる

上記のようにブログや記事を書く上でWord文書を作るように「見出し」や「段落」を付けたりして文書構造をきちんとすることによって、ページのSEO対策にもなります。

具体的にどういうことかというと

ユーザーだけでなく、Googleにもわかりやすいページになる

ということです。

検索の上位に上がらせるということは、
タイトルと記事内容に適合性があるのか、更新はされているのか…等、色んな条件がありますが、
その条件に当てはまっているかどうかをクローラーが巡回してページをスキャンしてみて回ってるんですね。

ページをスキャンしているときに「見出し」なんかを設定して文書構造をちゃんとすると、
どういったページ化がわかりやすいので、このサイトはいい!ということで検索結果を上位にあげてくれる要因の一つとなるのです。

人間と同じですね。

 

文書構造がきちんとできている、できていないでどれだけ見た目に差がつくか

 

見出しなどを付けた文書

坊ちゃんの冒頭

冒頭文章を100文字抜粋

プレーンテキストで表示

親譲りの無鉄砲で小供の時から損ばかりしている。
小学校に居る時分学校の二階から飛び降りて一週間ほど腰を抜かした事がある。

なぜそんな無闇をしたと聞く人があるかも知れぬ。
別段深い理由でもない。
新築の二階から…

プレーンテキスト
坊ちゃんの冒頭
冒頭文章を100文字抜粋
プレーンテキストで表示
親譲りの無鉄砲で小供の時から損ばかりしている。
小学校に居る時分学校の二階から飛び降りて一週間ほど腰を抜かした事がある。
なぜそんな無闇をしたと聞く人があるかも知れぬ。
別段深い理由でもない。
新築の二階から…

 

という感じで差がつきます。

 

どちらがわかりやすいか、見やすいか、読みやすいか、
人間もクローラーなどのプログラムも同じような感じですね。

 

具体的にどうすればいいのか

では、文書構造をきちんとするために具体的にどうすればいいのか。

最低限

  • 見出し(1~6)
  • 段落
  • 強調

を使ってください。

HTMLタグでいうところの

  • h1~h6
  • p
  • strong

ですね。

これを使用するだけでもだいぶ違いますので、
まずは「見出し」を付けて「段落」分けをして、注目してほしい単語を「強調」してください。

 

HTMLタグがわからなくてもWP等のCMSでは「エディター」を活用!

タグがわからなくても今は「エディター」というものがあります。
記事を編集する際には「エディター」の機能をフル活用して記事を書きましょう。

使い方はWordを使用している方ならほぼ同じです。
だいたい下記表のような表記になっていると思います。

タグ
見出し1 h1
見出し2 h2
見出し3 h3
見出し4 h4
見出し5 h5
見出し6 h6
段落 p
強調 strong

これらは、文書を選択してボタンを押すと指定できます。

ただ単にテキストを入力するだけでなくちょっとひと手間かかるので、
はじめは作成がめんどくさいと感じるかもしれませんが、慣れたら文章構造がきれいになっていない文章が読みにくくてしょうがなくなります(当社比ですので保証はありません)

 

ぜひぜひ、ブログの記事を書くときなどに「文書構造」を意識して「見出し」や「段落」付けしてみてください。

 

まだまだ、文書構造はここまでしっかり作りこめる!
というのはあるんですが…
ひとまずはここまで…