ワードプレスのビジュアルエディタでリンク操作したとき
「リンクを新しいタブで開く」にチェックを入れた時の現象
ワードプレスのビジュアルエディタで、
テキストリンクを
「リンクを新しいタブで開く」にチェックを入れた時、
また、画像にリンクを追加した時の上級者向け設定にある
「リンクを新しいタブで開く」をした時も、
出力されるコードには、
target=”_blank” の他に、
rel=”noopener”
という属性がついています。
ワードプレスのエディタを、テキストモードにすると、
わかります。
noopener の意味
noopenerがない場合の Javascriptの振る舞い
target=”_blank” で、リンクを開くと、
ブラウザの別タブで、リンク先が開きます。
実は、この時、リンク先のページのJavascriptで、
|
1 |
window.opener.location = http://example.com |
などと実行すると、
なんと、リンク元のURLを移動することができるんです。
まさか、リンク先のウェブページの影響で、
自分のページが入れ替わるなんて、思わないですよね。
もし、自分のページから、悪意のあるページへ、
target=”_blank” を使ってリンクを張ってしまうと、
リンク先のページから、自分に似せたページに飛ばされてしまい、
情報を抜き取るフィッシング詐欺に利用できてしまう可能性があります。
このように、リンク先からリンク元のページを似たページにして
情報を抜き取ろうとする攻撃を、
タブナビング(tabnabbing)といいます。
それを防ごうというのが、noopener なのです。
ちなみに、opener と言うのは、「オープンした人・もの」 という意味ですね。
rel=”noopener” を target=”_blank”とセットで使った場合
そこで、このrel=”noopener” を a タグに target=”_blank” とセットで
いれておくと、リンク先のページから、
window.opener で呼び出し元(opener)が参照できなくなり、
window.opener.location 命令での
親ウインドウの操作ができないようにすることができるのです。
ただし、target も、rel もブラウザに対する指示になりますので、
ブラウザが対応している必要があります。
対応してないブラウザ用には rel=”noopener noreferrer” で完璧な対策になるけど弊害が・・・
また、rel=”noreferrer” は、リンク先に、
呼び出し元(リファラ)の情報を渡さないって意味になり、
同様に、リンク先から、window.opener を参照することが
できなくなりますが、弊害も予想されます。
リンク先で、リファラを参照してる場合があるため、
たとえば、アフィリエイトのASPなどで
リンク元のページのURLを見て判断している場合、
成果がカウントできない可能性が出てきます。
まとめ
- rel=”noopener” というのは、target=”_blank” でリンク先を開いた時、
リンク元の画面のリンク先で取得できないようにする指示です。 - tabnabbing というフィッシング詐欺を防ぐ目的で付けられます
- ワードプレスでは、ビジュアルエディタで
「リンクを新しいタブで開く」にチェックを入れると、
target=”_blank” とセットで付加されます。
自分がリンクを貼る時、怪しいサイトでなければ noopener を
付ける必要はなさそうです。
あやしげなサイトにもリンクを貼る必要がある場合、
rel=”noreferrer”とセットで付けておくと、安心です。
コメント
すみません。検索からきました。
サイドカラムなどは全て対応しましたが、これまで記事に書いた「過去記事」はどうやって①から②に変えればよいのでしょうか？聞くだけで申し訳ありません。
①表示項目
②表示項目
記事が5000記事くらいありSearch Regexで編集するのが怖いです。知識がないせいですが、SEOにも関係があると思っているので何とかしたいのですが。。。
お手すきの際に教えて頂けると大変助かります。どうぞよろしくお願い致します。
コメントありがとうございます。
公開コメントだとリンク表示になりよくわからなくなってますので、下に転記しますね。
＞①<a href=”アドレス” rel=”nofollow”>表示項目</a>
＞②<a href=”アドレス” rel=”nofollow”>表示項目</a>
いただいたコメントでは、noopener ではなくnofollow、そして、①と②が同じだったのですが、
木村さんの要望は、nofollow を削除したいということでしょうか？
とりあえず、rel=”nofollow” を消したいという前提で回答させていただきますね。
まず、
■削除したい場合
この場合は、ツールで一気に削除するというのが良いと思います。
Search Regex は、ワードプレスのプラグインですよね。
一気にやると、失敗したときの代償が大きいので、まず、
・念のためバックアップを取っておく(あくまで最悪の場合に対してです。使うことになれば面倒なので、できれば使わないつもりでバックアップしておく^^;)
・Limitを付けて、最初は10記事限定で行う
・最初から変換をしない。
まずは検索だけして、検索箇所があってるか確認
・Limitつけて10個だけ変換したら、変換があってるか確認
ここまでしてから全体に対して、あるいは、最初のうちは、100個単位で順番に確認しながらやっていけば、大きな失敗なくやっていけると思います。
■nofollow をすべては、消さない
nofollow は「リンクを先をたどらない。」という検索ロボットへの指示です。
（参考：サーチコンソールのヘルプ：
https://support.google.com/webmasters/answer/96569?hl=ja）
他のサイトへのリンクであれば、過去の記事については特についたままでもよいと思います。対応する場合でも、アクセスって特定のページに集中している場合が多いと思いますので、5000記事すべてに対応するのではなく、アクセス数の大きい、あるいはポイントとなる記事に絞って対応してもよいのではないでしょうか。
自分のサイトへのリンクでも、どれかからnofollowでないリンクが張られていればインデックスされると思うので、これも、同様に、影響力の大きそうなページだけ編集すればよいのではないかと思います。
以上、参考になれば幸いです。
わかばやし様
私のミスで時間を要してしまい大変申し訳ありません。お聞きしたかったのは、これまで⑤のように自分のサイトや外部リンクに対して行っていました。
⑤表示したいテキスト
これを表示したいテキストにする方法をコメントでお聞きしました。ワードプレスで置換を行うといいのか？と思っており「Search Regex」を使えばよいとわかりますが、やり方がわかりません。
「target=”_blank”」を単純に「target=”_blank” rel=”noopener”」に置換してしまうとアフィリエイトリンクなども返還されごちゃ混ぜになる可能性が高いため、放置するしかないのかもしれないと考えています。
※過去記事は放置でも問題なければ合わせて教えて頂ければと思います
しかし、Googleがだめと言ったらだめなのかもしれないと思い、できれば置換しておいたほうがよいと考えています。ただやり方がわかりません。
「nofollow」について教えて頂きましたが、私のコメントミスです。しばらく前から「rel=”noopener”」について調べていたらこのページにたどり着きました。勝手にコメントをしてさらに間違ってしまい恐縮です。
何もわからず記事だけ書いているだけでは駄目だと改めて気が付きました。
■
もし可能であれば下記コードでも自サイトであれば問題ないのか教えて頂くことは可能でしょうか。
表示したいテキストを入力
「target=”_blank”」を抜いただけですが、私はこれまで自分のサイトを同一ページにする場合は「target=”_self”」入力すると思っていましたが、今回調べてみるとどちらも必要ないと書かれているサイトを多く見つけました。
質問ばかりで大変申し訳ありませんが、ご回答いただけると嬉しく思います。周りには聞ける人がだれ一人おらず、ネット上でも何が本当なのかわからない事も多いためよろしくお願い致します。
ご迷惑は承知ですが、知識がなく聞いてばかりで申し訳ありません。どうぞよろしくお願い致します。
木村さん
ちょっと遅くなり申し訳ありません。
まず、
⑤についてです。リンクで表示されている部分をテキストにすると、
＞ ＜a href=”飛ばしたいアドレス” rel=”nofollow”＞表示したいテキスト＜/a＞
＞ これを、＜a href=”飛ばしたいアドレス” rel=”nofollow”＞表示したいテキスト＜/a＞にする方法
ですね。
でも、今回、
＞「target=”_blank”」を単純に「target=”_blank” rel=”noopener”」
の変換が必要かどうかを聞たいということですね？
そう仮定してお答えすると、noopenerは、アフィリエイトには影響ありませんよ。
2つの理由があります。
報酬がつかなくなるかもといわれているrelの指定が noopener ではなく noreferrer であることと、
noreferrer がついていても、実際には報酬は発生しているとの報告があるからです。
アフィリエイトで必要と言われているものは、リファラーです。
つまり、参照元のURLです。
どこからアクセスしに来たのかということですね。
で、このリファラーが設定されていないと
報酬が発生しない可能性があるものの、
少しネットサーフィンをして^^;調べてみましたが、
実際に報酬が発生しなくなってしまうASPが報告されているのを
見つけられませんでした。
全部をチェックしたわけではないのと、
あくまでネット上の情報ですが・・・
いずれにしても noopenerを付けても問題はないということです。
noopener はつけていた方が安心ですね。木村さんのおっしゃる通り、
＞「target=”_blank”」を単純に「target=”_blank” rel=”noopener”」
の変換が良いと思います。
理由なんですが、GoogleのLighthouseという評価ツールのページ：
https://developers.google.com/web/tools/lighthouse/audits/noopener?hl=ja
を見てみると、target=_blank で外部サイトのリンクを開くと、
ただ単に、戻り先のurlを変更することだけでなく、
ほかのオブジェクトにもアクセスできると書いてあります。
ちょっと気持ち悪いですね。
オブジェクトというのは、例えば、ページ内のコンテンツですね。
・Search Regex については、
選択しながらこれには適用、これには適用しないってことはできないですね。
でも、木村さんのパターンだとすると、正規表現(Regex)使うまでもなく、
「target=”_blank”」→「target=”_blank” rel=”noopener”」
で設定すればよさそうですね。
・
次の質問ですが、
＞下記コードでも自サイトであれば問題ないのか教えて頂くことは可能でしょうか。
＞ ＜a href=”飛ばしたいアドレスを入力” rel=”nofollow”>表示したいテキストを入力＜/a>
ですね。自サイトでなくても問題ないと思いますよ。
逆に自サイトだとして、リンク先が新しく追加したページだとすると、
nofollow を付けていると、リンク先の新しいページがインデックスされない、つまり、
検索結果に上がらなくなってしまうという問題があります。
別のリンクからたどれるなら良いと思うのですが、
ほかにたどれるリンクがなかったりすると、
検索エンジンい登録されず、もったいないですね。
全てのリンクを直す必要はないと思いますが、
グーグルなどロボットがたどれるように、
新しく追加したページへのリンクが複数あれば、
どれかは nofollowを外しておいた方がよいと思います。
以上になります。長文になってしまいましたが、
ご確認よろしくお願いします。
わかばやし様
2度にわたりお返事を頂きありがとうございます。
今後とも記事を拝見させて頂きますので、わからないときには質問をするかもしれません。
ありがとうございました。