海外&国内SEO情報ウォッチ

「別タブで開く」リンク(target="_blank")は脆弱性あり？【SEO情報まとめ】

外部向けリンクを別タブで開くためにHTMLでtarget = _blank属性を指定するのは実はヤバい? このaタグの使い方には、脆弱性やセキュリティ、パフォーマンスの点で問題があるとグーグルのエンジニアが指摘しています。他にも、SEOコンサルタントを採用するときのポイント、Google検索に有利なCMS、AMPストーリーで考慮すべきことなど、SEO周りの情報をまとめて解説しました。

鈴木謙一 2020/3/13 7:00 SEO | 事例／インタビュー

475 366 331

illustration by つきのあめだま

リンクを別タブで開くためにHTML上でリンクにtarget="_blank"を指定することには「セキュリティとパフォーマンスの点で問題がある」と、グーグルのエンジニアが注意している。

一般的な書き方だと思うのだが、どういうことなのだろうか。何が問題なのか、どうすればいいのかを、わかりやすく解説する。

ほかにも今回は、SEOコンサルタントを採用するときのポイント、グーグル検索に有利なCMS、AMPストーリーのSEOなどなど、幅広い観点からSEOの理解を深められる情報をまとめてお届けする。

SEOコンサルタント採用時のグーグル流ベストプラクティス
グーグル検索ではShopifyが優遇されている！? CMSで違いはあるのか？
AMPストーリーに特化したSEOをグーグルが解説
グーグル検索でニュース記事を目立たせるコツをグーグルが解説
グーグルは、GAやChromeのデータを検索に使っていない
グーグルSEOに精通するための最良の教科書、それは……
逆SEO、カニバリゼーション、AMPストーリーSEO など2月のオフィスアワー
高品質コンテンツを作りたければグーグルを見るな、ユーザーを見ろ
複数の通貨を設定した構造化データをグーグルは認識するか？
FAQリッチリザルトのガイドラインをGoogleが更新。同じ質問と解答の繰り返しを禁止
より多くのデータをSearch Consoleでエクスポート可能に、検索パフォーマンスの分析に有効な改善

この記事の目次：

今週のピックアップ

グーグルのエンジニアが警告、「別タブで開く」リンクは実はヤバいんだって！？
rel="noopener"が基本（Addy Osmani on Twitter）海外情報

HTML上で、外部向けリンクを別ウィンドウで開くために、リンク（a要素）に target="_blank" 属性を指定する ―― これは、太古の昔から行われているやり方だ。

しかし、「リンクにtarget="_blank"を指定するとセキュリティとパフォーマンスの点で問題があるので、rel="noopener" 属性または rel="noreferrer" 属性と併用したほうがいい」という情報を、グーグルのエンジニアがツイートしている。

SEOに直接関係する話題ではないが、意外と知らない人も多いのではないかと思い、ここで紹介する。

Tip: target="_blank" on links to other sites can expose your site to performance and security issues. To fix, add rel="noopener" or rel="noreferrer" to these links: https://t.co/HdA7ooNzx5 ✅ pic.twitter.com/T7X5r7MKWz
— Addy Osmani (@addyosmani) March 1, 2020

外部サイトへのリンクに rel="noopener" を追加すべき理由には

セキュリティ
パフォーマンス

の2つがあり、グーグルのデベロッパーサイトで詳しく説明している。

セキュリティのほうは、次のとおりだ。

また、target="_blank" にはセキュリティ上の脆弱性もあります。リンク先のページでは window.opener を使用して親ウィンドウのオブジェクトにアクセスしたり、window.opener.location = newURL によって親ページの URL を変更したりできます。

target="_blank"のリンクは別タブ（別ウィンドウ）で開かれる。ということは、必ずリンク元のページとリンク先のページの両方がブラウザ内に存在している。

そして、そのようにして開かれたリンク先のページに悪意をもったJavaScriptが記載されていれば、リンク元であるあなたのページを好きに改ざんされてしまう可能性があるのだ。

もう1つのパフォーマンスに関しては、次のように書かれている。

target="_blank" を使用して任意のページから別のページにリンクしている場合、リンク元のページとリンク先のページは同じプロセスで動作します。そのため、リンク先のページで負荷の高い JavaScript が実行されていると、リンク元のページのパフォーマンスが低下するおそれがあります。

ただし、編集部で確認したところ現在のブラウザでは target="_blank" でのリンクでも、必ずしも同じプロセスで新しいタブが開かれるわけではないようだ。

そのため、target="_blank" がついた（信用できるとは限らない外部向け）リンクには、rel="noopener" を付け加えることを原則としておくのがいいだろう。

さらに、たとえば社内情報共有システムやイントラネットから外部サイトへのリンクでは、rel="noreferrer" を使うのもいいだろう。その場合、rel="noopener noreferrer" のように記述すればいい。

こうしておけば、そのリンクをたどってもブラウザはアクセス先のサーバーにリファラーを送信しない。そのため、アクセス解析データやログデータから「なるほど、この会社では内部ネットワーク名がこういう命名パターンなのか」「内部ネットワークにこういうホスト名でWebサーバーが動いているのか」といったことをリンク先サイトの管理者に知られなくて済む。

★★★★☆

すべてのWeb担当者必見！
技術がわかる人に伝えましょう

グーグル検索SEO情報

SEOコンサルタント採用時のグーグル流ベストプラクティス
SEOビギナー動画シリーズが続いてます（Search for Beginners on YouTube）海外情報

SEOビギナーのための動画シリーズをグーグルの検索チームが2019年に始めた。このコラムですでに第7話まで紹介してきたが、第8話と第9話も公開された。

第8話は「SEOとは何か？」がテーマの超入門編だ。

興味深いのは第9話で、テーマは「SEO 専門家を採用するためのヒント」。このコラムの読者のメイン層であるウェブ担当者にとって興味深い内容に違いない。

次のような紹介文になっている。

SEO コンサルタント採用の際に、候補者の評価基準となる最小限の資質を取り上げます。求められる資質から推薦者の確認や専門的な面接まで、最適な SEO コンサルタントをお探しの際に従うべきベストプラクティスを学びましょう。

SEOコンサルタントに依頼する可能性があるなら視聴しておくといい。英語で話しているが、日本語字幕を出せる。動画下の歯車アイコンから設定メニューを表示して［字幕］を選び、下にスクロールして日本語を選択すると日本語字幕にできる。

★★★★☆

SEOコンサルタントを採用するかもしれないすべてのWeb担当者必見！

グーグル検索ではShopifyが優遇されている！? CMSで違いはあるのか？
どんなCMSであっても特別扱いしない（John Mueller on Twitter）海外情報

Shopify（ショッピファイ）という、英語圏で人気があるEコマースのプラットフォームがある。このShopifyに関して次のようなことが言われている。

ここ2～3年、Shopifyで構築したサイトがGoogle検索で優遇されているようだ。

この意見に対して、グーグルのジョン・ミューラー氏が次のようにコメントした。

特定のCMS（やシステム）に手を貸すような検索アルゴリズムを私たちは通常は使っていない。
技術的に正しいことをサイトがやっているなら、特別なことをする必要はそれほどない。改善の余地は常に残されているが、よくできていて安定した基盤は長続きするものだ。

We generally don't have special search algorithms to help any particular CMS. When sites do things technically correct, there's not much need to do anything special :). There's always room for improvement, but a good & stable foundation goes a long way.
— 🍌 John 🍌 (@JohnMu) March 1, 2020