はじめに
この記事は Calendar for DMMグループ Advent Calendar 2021 | Advent Calendar 2021 - Qiita の2日目の記事です。
前日:事業をスケールさせるエンジニアリング〜技術のコモディティ化にエンジニアは敗北する〜 @石垣 雅人さん
翌日:terraformでどこまでやる?運用を見据えた部分的な管理アプローチのすゝめ @飯田 涼太さん
こんにちは。光岡高宏(@mitsuoka0423) です。
DMMブックスのサーバーサイドエンジニアとして働いており、最近SEO対策に集中して取り組んでいます。
今回は現在進行形で実施している、DMMブックスの商品一覧ページへのSEO対策の一つである「URLの再設計」について紹介します。
まずはDMMブックスの商品一覧ページを紹介
商品一覧ページは、DMMブックス上の全商品をジャンル名・価格などでフィルタし、その結果をリスト形式で表示する機能
を持つページです。
フィルタの条件は、サイトバーのファセットナビゲーションから設定することができます。
この手のフィルタ機能を持つページは、SEOを意識して設計しないと重複コンテンツの問題が発生しやすいため要注意です!
商品一覧ページのSEO対策ポイント
商品一覧ページのSEO対策では、以下の課題を解決するためにURLの再設計(フィルタ条件に対応するクエリ文字列の整理)を行なっています。
- フロアごとに商品一覧ページが存在していて、SEO的価値が分散している
- 1つのフィルタ結果にアクセス可能なURLが複数存在していて、1URL1コンテンツの原則に反している
- パラメータが複雑でわかりにくい
フロアごとに商品一覧ページが存在している
DMMブックスにはフロア
という概念があります。大きいカテゴリのようなもので、フィルタ条件ではfloor
を指定します。
男性コミックフロアページのイメージ
フロアページはサイト構造上、トップページの次に位置し、サイト構造に大きな影響を与えています。
DMMブックスのサイト構造イメージ
トップページ
+ フロアページ(男性コミックフロアページ、女性コミックフロアページ など)
+ 商品一覧ページ(異世界系ジャンルでフィルタしたページ など)
+ 商品詳細ページ
現状、商品一覧ページはフロアページの下のレベルとして実装されています。
これにより困ったことが発生します。商品一覧ページが最大でフロアの数だけ存在してしまいます。
男性コミックフロアの異世界系: https://book.dmm.com/list/comic/?floor=Gcomic&article=genre&id=91775
文芸・ラノベフロアの異世界系: https://book.dmm.com/list/novel/?floor=Gnovel&article=genre&id=91775
女性コミックフロアの異世界系: https://book.dmm.com/list/comic/?floor=Gcomicf&article=genre&id=91775
など
本来の機能としては、全商品から異世界系ジャンルでフィルタすることができ、そのうえで男性コミックや女性コミックでさらに絞り込むことができるのが理想ですが、現状では全商品から異世界系ジャンルをフィルタすることができません。
SEOの観点では、異世界系の商品一覧ページが複数存在するため、マンガ 異世界系
などのキーワードで検索された場合に、表示すべきページが複数存在することになるため、SEO的価値が分散してしまっていると言えます。
また、正規URLとなるページも存在しないため、canonicalを設定することができない状況です。
1つのフィルタ結果にアクセス可能なURLが複数存在している
商品一覧ページのフィルタ機能は、URLのクエリ文字列と連動しています。
例えば、異世界系
ジャンルの商品をフィルタした場合、以下のURLとなります。
https://book.dmm.com/list/comic/?floor=Gcomic&article=genre&id=91775
91775
は異世界系ジャンルに割り振られているIDです。
article
にgenre
、id
に91775
を指定する = 異世界系ジャンルでフィルタする、ということになります。
DMMブックスには、n系パラメータ
と呼ばれるフィルタ条件を汎用的に設定できるパラメータが用意されており、こちらでも異世界系ジャンルを指定することができます。
https://book.dmm.com/list/comic/?floor=Gcomic&n1=DgRJTglEBQ4GgqSI147w0PTp0YWL
こちらにアクセスすると、実は前述のarticle
とid
のURLと全く同じコンテンツが表示されます。
このため、1URL1コンテンツの原則に反してしまっています。
商品一覧ページのパラメータを再設計する
前述の課題を解決するために、商品一覧ページのフィルタ条件を指定するパラメータを再設計することにしました。
課題に対する解決策は以下の通り。
- フロアごとに商品一覧ページが存在していて、SEO的価値が分散している
- -->
フロア
を任意指定に
- -->
- 1つのフィルタ結果にアクセス可能なURLが複数存在していて、1URL1コンテンツの原則に反している
- -->
n系パラメータ
を使用不可に。通常のパラメータ指定に変換
- -->
- パラメータが複雑でわかりにくい
- -->
article
パラメータの記述をシンプル化
- -->
articleパラメータの記述をシンプル化
article
パラメータは、過去の実装に引っ張られて使用していましたが、本来は不要なものです。
パラメータの形式をややこしくしている原因の一つでしたので、パラメータのシンプル化に伴い撤去しました。
before
https://book.dmm.com/list/comic/?floor=Gcomic&article=genre&id=91775
after
https://book.dmm.com/list/comic/?floor=Gcomic&genre=91775
これでURLが少し綺麗になりました。
フロアを任意指定に
今まで必須パラメータであったfloor
の指定を任意に変更しました。
(floor
が指定されていない場合は、全商品からフィルタするようにしました)
before
男性コミックフロアの異世界系: https://book.dmm.com/list/comic/?floor=Gcomic&genre=91775
文芸・ラノベフロアの異世界系: https://book.dmm.com/list/novel/?floor=Gnovel&genre=91775
女性コミックフロアの異世界系: https://book.dmm.com/list/comic/?floor=Gcomicf&genre=91775
after
全商品の異世界系: https://book.dmm.com/list/?genre=91775
URLがだいぶ綺麗になり、どういう条件でフィルタしてるのかがぱっと見てわかるようになってきました。
n系パラメータ使用禁止。
n系パラメータ
は内部にフィルタ条件を保持しているため、理論的に?genre=xxxxx
の形に変換可能です。
パフォーマンスチューニング面で苦労した点があるのですが、DMMブックスの内部的な実装の話になるため今回は省略します。
正規URLにcanonicalを設定してもよいのですが、1URL1コンテンツの原則に反する原因になりやすいので、使用禁止にしました。
before
https://book.dmm.com/list/?n1=DgRJTglEBQ4GgqSI147w0PTp0YWL
after
https://book.dmm.com/list/?genre=91775
まとめ
DMMブックスでは商品一覧ページのURLを整理することで、1URL1コンテンツの原則を守り、またURLをシンプルにする取り組みを実施しています。
今後も継続して検索順位の改善に取り組んでいきます。