「PC用販売説明文」「スマートフォン用説明文」とGoogleのSEO対策について

Question

現状弊社では下記の構成で商品ページを作成しています。

PC用販売説明文 : 商品画像複数枚をタグを使い構成しています。スペックなどの表記も画像の中に記述しています。テキストやaltなどは一切使用していません。

スマートフォン用説明文 : PC用販売説明文の画像をキャプチャし一枚の長い画像として、Goldから画像を読み込んでいます。コチラに関しましてはスペックや商品情報をtableを使いテキストで表記しています。

◎質問内容
・どのような構成で作成することがGoogleのスコア的にベストであるか(例えば、画像とテキストを混在させるべきかなど)
・スコアが下がるhtmlタグやcssタグなど

以上お手数ですが何卒よろしくお願い致します。

Accepted Answer

ECマスターズの橋本です。

Googleは年間400回以上のアルゴリズム変更を行っており、
基本的には公開していない為、どこにも正式な情報はありません。
しかし、検証を繰り返したことによって、最適であると
判断された一つの可能性としてWEB上には、
無数のGoogleのSEOとして上がっている状態です。

こちらでテキストで回答するよりも、
まとまった情報として良質なページをご案内する方が、
わかりやすい為、選別した記事をご案内いたします。


＞・どのような構成で作成することがGoogleのスコア的にベストであるか(例えば、画像とテキストを混在させるべきかなど)

Googleなどの検索エンジンは、
ウェブページを順位付けする為に、
ウェブページ自体を日々評価しております。

その評価の一つとして、画像やテキストの内容や、
画像やテキスト量の比率、全体に占める広告の比率
などを軸に、ウェブページを評価します。

ご質問の画像とテキストという点については、
Googleは質の高い情報を発信しているページを、
評価を高くし、順位を付けている為、

前提としては、
質の良い情報を伝えているページにする事が必要です。

その為には、テキスト量も必要になります。

【SEO】検索上位化に必要な文字数は？
http://seolaboratory.jp/internal/2016040831342.php

また、使用している画像に関しても、
オリジナル性の高い画像が優位なようです。

画像とコンテンツ評価の関係
https://note.mu/isay53/n/ncffa0d0d99bc


質の高い情報量という点においては、
最近ではコンテンツマーケティングという手法で、
SEO対策を実施している会社も増えてきていますね。
以下にて解説しております。
https://ec-masters.club/forum/post_view.php?id=2704


単純なテキストを並べたものや画像の比率というよりも、
その情報そのものに、
良質な情報であれば良いという考え方が大切です。

そういった背景がある中で、
昨年12月よりGoogleからの楽天ショップの評価が下がっており、
Googleでの順位後退やindexの削除などが顕著に出ております。

これは、例えば商品ページを、
画像のみやiframeのみで構成されている場合、
Googleから見ると、何も情報が無いページと判断し、
低評価を受けた結果として、Googleのindex数が、
減少している事があげられます。

楽天側はそれを懸念しており、それを改善する為に、
先日の楽天サポートニュースにて以下の案内がありました。

iframeタグと、Flashコンテンツご利用についてのご案内
https://mainmenu.rms.rakuten.co.jp/auth/index.phtml?params=info_b/20160331-02-1.html&s=&param2=2

つまりは、Googleなど外部検索エンジン対策をする際は、
コンテンツを充実させるという事が重要になるという事ですね。


＞・スコアが下がるhtmlタグやcssタグなど

こちらに関しては、以下にてまとめてありますので、
ご参照いただければと思います。

http://seolaboratory.jp/other/2016010721789.php
http://niwakasoft.jp/column/coding_conventions/

なお、モバイルフレンドリー対応も必須となりますので、
あわせてご対応いただければと思います。

楽天GOLDページのモバイルフレンドリー対応の推奨について
https://mainmenu.rms.rakuten.co.jp/auth/index.phtml?params=info_b/20160512-01-02.html&s=&param2=2

こちらは、フォーラムでは以下にて解説しております。
https://ec-masters.club/forum/post_view.php?id=2868

Answer

迅速にご対応頂きありがとうございます。

モバイルフレンドリーの設定について
「対応案A GOLDのSPページがある場合」に該当しています。

a.弊社のGOLDのトップページを下記と仮定した場合、
下記の記述で間違っていないでしょうか。

PC:http://www.rakuten.ne.jp/gold/●●●●●/
SP:http://www.rakuten.ne.jp/gold/●●●●●/sp/index.html

b.下記の「PCページ」「SPページ」の下のソースですが、
全てPCのGOLDのトップページのhtmlに記述すると言う事でしょうか。



・PCページ
　1. GOLD領域のPCTOPページへのリダイレクト設定

　
(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config'))


　2. GOLD領域のPCTOPページへのメタタグ設定

　　



・SP

(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config')) 


　4. GOLD領域のSPTOPページへのメタタグ設定 

タグ内に以下の文面を記述

Answer

ECマスターズの田中です。

＞a.弊社のGOLDのトップページを下記と仮定した場合、
＞下記の記述で間違っていないでしょうか。
はい、間違いありません。
SP用ページの「index.html」は省略していただいても結構です。

＞b.下記の「PCページ」「SPページ」の下のソースですが、
＞全てPCのGOLDのトップページのhtmlに記述すると言う事でしょうか。
全てPCのhtmlに記述するのではなく、
「PCページ」の下のソースをPCのhtmlに、「SPページ」の下のソースをSPのhtmlに
それぞれ記述してください。

また、ソースに含まれるURLも修正が必要です。
下記にて、タグの意味も含めて説明させていただきます。

＞・PCページ
＞　
＞(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config'))

上記タグのJavaScriptでは、
現在どのデバイス（PCかSP）で閲覧しているかを判断し、
「data-page-type」の値と異なる場合は、
「data-redirect-url」のURLにリダイレクトさせる、
という処理を行っております。

そのため、リダイレクト先となる「data-redirect-url」には
SPのトップページを指定する必要があります。

＞　

上記「」タグでは、
横幅640ピクセル未満の環境で閲覧している場合（つまり、主にSPで閲覧している場合）は
「href」のページを表示させるべきだと、検索エンジンに認識させる処理を行っております。

そのため、この「href」にも、SPのトップページを指定する必要があります。

＞

上記「」タグは、
内容が重複する複数のURLを関連付けて、検索エンジンに認識させる処理を行っております。

「href」には、主となるページのURLを指定する形になりますが、
PC用ページの更新を怠っているなどの特別な事情がなければ、PC用ページのURLを指定していただければ結構です。

「」「」各タグの
詳しい説明は、下記URLの記事をご参照ください。
https://ferret-plus.com/1809

＞・SPページ
＞
＞(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config')) 

先述のタグと同様の処理で、
今回はSPで閲覧していない（PCで閲覧している）場合にリダイレクトするURLを指定する形になりますので、
いただいたソースの通り、PC用のURLを指定していただければ結構です。

＞ 

先述の「」と同様の意味で、URLを統一させる必要がありますので、
URLは変えずにこのままの状態で結構です。


まとめると、
PCページ・SPページにそれぞれ追記するソースは、
下記の通りになります。
（index.html は、省略していただいても結構です）

・PCページ


(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config'))
　


・SPページ


(function(c){c.getAttribute('data-page-type')!==(/Android.+Mobile|iPhone|iPod/.test(navigator.userAgent)?'sp':'pc')&&(location.href=c.getAttribute('data-redirect-url'))})(document.getElementById('gold-redirect-config'))