サイト全体に「モダンブラック 」スキン適用中。

h1~h6は順番通りに使わないとSEO的に不利なのでしょうか? | ブログ相談 | Cocoon フォーラム

書き込みの前に以下の3点をご確認ください。

  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示してください
  3. 該当部分のキャプチャ環境情報とともに書き込んでいただけると助かります

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法 
  7. ブラウザ環境チェックツール

フォーラムの内容は、CCライセンス(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムのTwitterアカウント(@CocoonForum)はこちら

スポンサーリンク
h1~h6は順番通りに使わないとSEO...
 
Share:

[解決済] h1~h6は順番通りに使わないとSEO的に不利なのでしょうか?  

  RSS

初心者ブロガー
 初心者ブロガー
(@初心者ブロガー)
ゲスト
参加: 2か月 前
投稿: 19
2019年1月9日 22:06  

はじめまして。

cocoonという素晴らしいテーマがあると知り、流されるがままブログを作ってみたのですが右も左も分からない状態です。cssやhtml知識も全くないので、ズレた質問だったらすみません。

自分はひとつのブログでひろい分野のことを書きたいと思っています(いわゆる雑記ブログ)。

そこで、

https://beginner-net.com/1368.html

を参考にしてh1~h6にバリエーションをもたせて、各ブログのジャンルごとに見出しタグの種類と色を変えたいと考えています。(例えば、ライフハックものだったらオレンジ、読書系だったら初期設定の灰色)

h1はタイトルになるのでそのままにし、h2、h4、h6をオレンジにしてライフハックの記事に使用し、h3、h5を読書系に使うとします。

 その場合、ライフハックものを書くとしたらh1→h2→h4→h6という順番で見出しタグを使用することになり、読書ものを書くとしたらh1→h3→h5という順番で見出しタグを使用することになります。

見出しタグについて調べていると「h1はふたつ使うとバグる(自分は二つ使う予定がないので大丈夫ですが)」だとか「SEO的にh1~h6は順番に使用すべき」と書いてある記事を見かけました。

見出しタグの見た目的に言えば順番通りに使うべきだと思いますが、自分はアレンジするつもりなのでそこはクリアです。

しかし、googleがブログを評価する際、プログラミング?的にh1~h6を順番に使ってなければならないとなると、自分の使い方はSEO的に不利になってしまいます。

そこで質問なのですが、Googleがそのページを評価するときに、h1~h6を順番通りに使っていないと悪い評価になる、なんてことはあるのでしょうか?

それともh1~h6はwordpressで記事を書く際の便宜上の名であって、そもそも順番は関係ないのでしょうか?(例えば、見た目は悪くなるがh1→h6→h3の順番で使おうがなんら問題がないだとか)

分かりにくい質問で申し訳ありません。よろしくお願いいたします。


未解決
たなかま
(@tanakama)
Estimable Memberサイト
参加: 1年 前
投稿: 196
2019年1月9日 23:13  

こんばんは。

基本的に見出しデザインを変えたい場合は、

①見出しごとにclassを付けるか、②body要素にカテゴリーidのclassがあるので、カテゴリのclassで分岐させるとスマートです。

①の場合のCSS

.article h2.orange{
/*見出しがオレンジになるようにcssを書く*/
}

①の場合のHTML

<h2 class="orange">見出し</h2>

などですが、やはりHTMLとCSSの基礎知識は必要です。スキルを上げてからでもいいと思います。

あと、最初はh2がないと目次が付かなかったと思います。

▼SEOの見解はこちら

h1はふたつ使うとバグる

h1を2つ作るのは、問題ありません。(正式な使い方です)ただし、1つの記事に2つのトピックスを書く必要性がないので、だいたいみんなh1は、1つしか置きません。検索ユーザーにとっても、1つの記事に1つのトピックスが分かりやすいと良いと思います。

SEO的にh1~h6は順番に使用すべき

見出し構造が違っても、Googleから悪い評価になることはありません。でも順番にしない理由はあまりないので、みんな順番に書いていますね。(目次をコントロールしたいとかでh4をh3にしたりするのはありですが)

あとは正式な見出し構造にすれば、今後何があっても間違いない、という考え方もあります。

(検索エンジンからの悪い評価にならないにしても)デザインを理由に見出し構造を変えるんでしたら、あまりやるメリットがないとかも・・・と個人的に思います。

HTMLとCSSのカスタマイズからチャレンジするのが良いかなって思いました。


わいひら 件のいいね!
わいひら
(@yhira)
メンバーサイト Admin
参加: 1年 前
投稿: 4133
2019年1月10日 01:26  

そこで質問なのですが、Googleがそのページを評価するときに、h1~h6を順番通りに使っていないと悪い評価になる、なんてことはあるのでしょうか?

僕もないと思います。
Googleは、読み手に見えないHTML記述なんかより、コンテンツを重視します。

例えば、読み手の気持ちになって考えてもらうとわかると思うのですが、以下の2つだったらどっちが読みたいかということだと思います。

  • 見出しがきちっと順番につけられているけどつまらないコンテンツ
  • 見出しは順番通りではなくて適当だけど面白くてどんどん読みたいコンテンツ

当然、Googleは後者を優遇すると思います。
Googleの中の人の意見はこんな感じ。
https://webtan.impress.co.jp/e/2018/04/20/29008


初心者ブロガー
 初心者ブロガー
(@初心者ブロガー)
ゲスト
参加: 2か月 前
投稿: 19
2019年1月10日 15:29  

>>たなかまさん

詳しくありがとうございます。

そうですよね。よりいいブログをつくるためにそちらの方も勉強したいと思います。

よろしければもう少しだけ質問させてください。

①の場合のCSS

.article h2.orange{
/*見出しがオレンジになるようにcssを書く*/
}

①の場合のHTML

<h2 class="orange">見出し</h2>

ですが、

①のCSSの場合は画像の赤枠にそれを書き足せばいいのでしょうか

また、①のHTMLの場合、画像のように編集すればよいのでしょうか?

なお、二つの方法を試してみましたができませんでした・・・

またbodyというのは、こちらの赤枠内のことを指しているのでしょうか?

本当に初歩的な質問で申し訳ありません。

もしよろしければ教えてくださると嬉しいです。

あと、最初はh2がないと目次が付かなかったと思います。

確かにそうでですよね。実はそういった仕様を利用し、カテゴリによって目次をないような記事もつくってみたいなあと考えていました。

その場合、h1→h3という使い方になるので今回のような疑問がでてきていました。

 

>>わいひらさん

ご回答ありがとうございます。

まさにおっしゃる通りで、

  • 見出しは順番通りではなくて適当だけど面白くてどんどん読みたいコンテンツ

のほうが良いと自分も考えています。

URL読みました。ありがとうございます!


たなかま
(@tanakama)
Estimable Memberサイト
参加: 1年 前
投稿: 196
2019年1月10日 18:28  

こんばんは。

CSSを記述する場所は、提示されていた記事にもある

外観>テーマ>カスタマイズ>追加CSSの箇所です。(添付画像参照)

そちらに以下の記述を入れます。(class名をorangeからgreenに変更しています)

.article h2.green{
padding: 0.6em;
background: #eff5f3;
border-left: solid 6px #5dae93;
}

HTMLの見出しの記述は、いただいたキャプチャで合っていると思います。

②body要素にカテゴリーidのclassがあるので、カテゴリのclassで分岐させるとスマートです。

この②のやり方は、カテゴリーidを調べないといけないので、今回は割愛しますね。

※②の場合も、追加CSSに記述します。

かにそうでですよね。実はそういった仕様を利用し、カテゴリによって目次をないような記事もつくってみたいなあと考えていました。

僕だったら目次プラグインを使っちゃいますね。SEOは気にする必要はなくても、h2がないのは、個人的に気になっちゃう性格なので。

また何かあればおっしゃってください。


わいひら 件のいいね!
初心者ブロガー
 初心者ブロガー
(@初心者ブロガー)
ゲスト
参加: 2か月 前
投稿: 19
2019年1月10日 22:11  

>>たなかまさん

ああ、なるほど理解しました。

追加CSSには「こうやって本文?のHTMLに入力すると、こういう風になるよ」という文字(class)と効果を書いておき、実際の本文のHTMLにその文字を書くと追加CSSに書いた効果が出てくるというイメージですね

いろいろ試してみてできました。本当に初心者すぎてすみません。

すごく便利だと感じたので少しずつ勉強していこうと思います。

目次プラグインに関してもひとまず自分で調べてみようと思います。またなにかありましたら教えていただけると嬉しいです。

本当にありがとうございました。


わいひら 件のいいね!
Share:
スポンサーリンク
わいひらをフォローする
おすすめサーバ
mixhost

プラン変更で負荷対策が行えるので、ブログ向きのレンタルサーバーです。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
○サーバ引っ越しオプションあり(有料)
○アダルト・出会い系サイト可

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
△DBは7日分だけ無料復旧可能(ファイルは有料)
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可

性能も兼ね備えながら安くブログ運営を開始したいのであればここ1択。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
○サーバ引っ越しオプションあり(有料)
△アダルト・出会い系サイト可(条件あり)
△開始したてなので運営能力は未知数(対応良)

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
サイトを続けるうちにアクセスが増えれば、プランのアップグレートで対応可能です。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越しオプションあり(無料)
○http/2(高速化プロトコル)に対応
○アダルト・出会い系サイト可
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)

Cocoon
  
動作中

ログイン または 登録 してください

タイトルとURLをコピーしました