日常ぴよぴよ

ひよこのてきとーブログ

パンくずリストのマークアップが何が正しいのか分からなくなってきた件www

      B!     

パンくず

昨日に引き続きSEOネタです。

先日、構造化テストツールが刷新されて、とてもスタイリッシュな見た目になったり、JSON-LDに対応したりしました。

JSON-LDって何?って思う方もいるかも知れませんが、ぼくもよく知りません。
マークアップ界のJavascriptみたいなもんくらいに思ってます(笑)

と言うのも、ぼくはいつもmicrodata方式って方法でマークアップしているので触ったことがないんですよねー。
ワードプレスユーザーの多くがこの方式でマークアップしているはずです。

まあ、そんなことは置いといて、今回はこの新しくなった構造化テストツールでパンくずの構造化テストしたら予想外の結果が出たので、え?どっちなの?ってなった話をさせて頂きます。

現在いるページもリンクさせた方がいいの?

SEOの神様こと辻さんが手をかけたサイト、nanapiをご存知でしょうか?
このサイトは記事をとことんカテゴライズして、マークアップしまくってアクセスを伸ばしまくったサイトでございます。

そんなサイトを刷新された構造化テストツールにかけるとどうなるか

▼こうなります
構造化テスト結果

Google「現在いるページのURLもリンクにしてマークアップしなきゃ、ダメよ~ダメダメ」

え?と思ってナナピの画面に戻ってパンくずを見てみると

▼確かにリンクにはなってない。
ナナピのパンくず

なんなんでしょうね、これ。
以前の古いバージョンの構造化テストツールではこれでよかったんですよ。
現在いるページはリンクさせないでよかったんですよー。

ちなみに、結構多くの国産サイトがこの構造化の状態になっています。

天下のGoogle様はどうなのか

確かにね、このテストツールがあったページのパンくずリストを見てみましたら以下のようにリンクになってましたよ。

構造化testpage

もうひとつ、ウェブマスターツールのパンくずリストについての説明があるページも見てみましょう。

ウェブマスターツールのパンくず説明

うん、リンクになってるね。
ちくしょう!いつの間にだーー!!

というわけで修正しました。

そりゃーまー天下のGoogle様が仰るんだから、リンクにさせますともー。
当サイトも現在いるページのマークアップをGoogle様好みに修正しましたよ。
正直、名だたるSEO担当者様たちが未だにリンクにしていないので正しいのか分からないんですけどねー!!

▼ワードプレスのコードはコチラ

          <div id="breadcrumb">
            <div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="<?php echo home_url(); ?>" itemprop="url"> <span itemprop="title">ホーム</span> </a> &gt; </div>
            <?php $postcat = get_the_category(); ?>
            <?php $catid = $postcat[0]->cat_ID; ?>
            <?php $allcats = array($catid); ?>
            <?php 
while(!$catid==0) {
    $mycat = get_category($catid);
    $catid = $mycat->parent;
    array_push($allcats, $catid);
}
array_pop($allcats);
$allcats = array_reverse($allcats);
?>
            <?php foreach($allcats as $catid): ?>
            <div itemscope itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="<?php echo get_category_link($catid); ?>" itemprop="url"> <span itemprop="title"><?php echo get_cat_name($catid); ?></span> </a> &gt; </div>
            <?php endforeach; ?>

<div itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title"><a href="<?php echo the_permalink(); ?>" itemprop="url"><?php the_title(); //タイトル ?></a></span></div>
	</div>

▼CMSとか使ってない方はこちらを参考にしてください。

<div id="breadcrumb">
	<div itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="http://●TOPページのURL●" itemprop="url"> <span itemprop="title">ホーム</span> </a> &gt; 
	</div>
	<div itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="http://●親カテゴリのURL●" itemprop="url"> <span itemprop="title">★親カテゴリ名★</span> </a> &gt; 
	</div>
	<div itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"> <a href="http://●子カテゴリのURL●" itemprop="url"> <span itemprop="title">★子カテゴリ名★</span> </a> &gt; 
	</div>
	<div itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title"><a href="http://●現在いるページのURL●" itemprop="url">★現在いるページのタイトル★</a></span>
	</div>
</div>

▼CSS(これ入れないと改行になっちゃう)

div #breadcrumb div {
 display: inline;
 font-size: 13px;
}

まとめ

いやーほんと、どっちが正しいんでしょうねー。
StingerとかGushとかの「SEOに強い」と呼ばれているワードプレスのテンプレートを使っている方々は、現在いるページがそもそもパンくずリストに入ってませぬ。

まあね「構造化」っていうくらいですから、どのカテゴリに属しているページかをGoogleが判断できりゃいいのかも知れませんけどねー。

ぼく、裏技的に記事タイトルのH1部分をmicrodataと掛け合わせてみたんですが、TOPページがインデックスされなくなったので慌てて戻しました(笑)
Google様の仰るとおりのルールに従うのが良いなと思いました。

この記事を書いたひと

シブヤタクト
シブヤタクト
日常ぴよぴよの運営者です。
都内の会社でSEO担当しながら、イラストレーターや書道家やったりサイトを作ったりしてます。
Twitter:@pochimin02
ぴよたそという無料イラスト素材サイトも運営してます。