GETパラメタ「?=」を表示しないURLを生成し、擬似静的化ページを作る方法をご紹介します。

パラメタ毎にインデックスさせたいため、GETを使って動的なページを作成する事はしばしばあるかと思います。

そんな中、近年多くの企業サイトで見かける、GETのパラメタ「?=」を表示しないで静的ページのように(擬似静的化)振る舞うページを作成してみたので、ご紹介していきます。

意外と擬似静的化について詳しく載せているサイトが少なかったので、.htaccessの書き方やFORMからGETを投げる方法を解説していこうと思います。

SEO的には動的か静的かの有利はないと言われている・・・

少し調べると色々なサイトで動的か静的かのSEO的な有利さはないと出てきています。

そのため、無理して今ある動的なページを静的なページにする必要性はなさそうです。

しかしながら、某英語辞書サイト等、SEO上位にいるサイトのほとんどが擬似静的化しているので、実は優位性があるのかもしれません(ちなみにGETパラメタを表示していて上位にあるサイトはほとんど見たことがありません・・・)。

GETパラメタ「?=」を表示しないURLを生成し、擬似静的化ページを作る方法をご紹介します。

.htaccessを設定する

まずは「?=」を生成しなくとも、GETパラメタを渡せるように設定していきます。

イメージ(通常)

https://hogehoge.com/index.php?param=15

イメージ(擬似静的化)

https://hogehoge.com/15

上記の様に、「?param=」がなくとも、index.phpにアクセスし、param=15を渡すように設定します。

擬似静的化したいページのディレクトリの.htaccessに以下の内容を追記します。

下記のコマンドによって”https://hogehoge.com/15”にアクセスがあった場合に、内部的に”https://hogehoge.com/index.php?param=15”にリライトしてくれます。

FORMのINPUTからURLを生成する

次に、FORMのINPUTの値を使ってGETパラメタを生成している場合、”method = get”で”type = submit”していると当然のように「?=」が付いたURLが生成され、表示も「?=」が付いたままになってしまいます。重複ページになり兼ねないため、JavaScriptを使って、動的にURLを作成していきます。

HTMLの部分

INPUTとBUTTONを用意し、ボタンを押すと、search()の関数を起動するようにします。ちなみにFORMタグを使わなくなるとEnterキーを押しても自動でボタンをSUBMITしてくれなくなるため、別途 onkeypress=”enter();” を用意しました。

JavaScriptの部分

検索ボタンを押すとsearch()関数が呼び出され、動的にURLを作成し、ページを遷移させます。

これでテキストエリアに例として”15”を入れて検索ボタンを押すと、”https://hogehoge.com/15”のページに遷移します。

”https://hogehoge.com/15”のページに遷移すると、見た目はそのままで”https://hogehoge.com/index.php?param=15”にアクセスしてくれるため、「?=」がなくてもGETを受け渡すことができます。

最後に

上記の方法が簡単そうだったため、今回はこの方法で実装しましたが、リダイレクトをする方法等、他にもたくさん方法はありそうです。

また、WordPress等のCMSを使っていれば設定でパーマリンクを設定してくれますので、上記の様に頑張る必要はありません。

今回作成した上記の方法を使って作成したページのリンクを貼っておくので、参考にしてみてください。

作成したページ
オンラインベトナム語辞書
キーワードを入力して検索ボタンを押すと擬似静的ページに移動します。

 RELATED CONTENTS

コメントを残す

メールアドレスが公開されることはありません。