target= _blankが効かない!問題の原因と解決策を徹底解説!

- target= _blankタグのトラブルの原因とは?
- target= _blankタグのトラブルの解決方法
サイトを作り、情報を発信していると運用しているページのtarget= _blankタグにトラブル問題が発生しがちです。
ミスなくタグを入れたはずなのにリンクが機能していないという問題に遭遇したことはありませんか。その原因と対策を解説していきますので、サイトが正常に機能するようにしましょう。
target= _blankタグが効かない問題とは?
リンクを貼るのに多くの人が使っているtarget= _blankですが、それが効かないというトラブルが発生しています。使用頻度の高いタグだけに、その実情を知ると共に、なぜこうしたことが生じているかを知ることは大事です。
そもそもtarget= _blank機能とは?
まず基礎的なことですが、問題を理解するためにtarget= _blankが何かをおさらいしておきましょう。このタグは、aタグの中に付け加えるもので、リンクに飛ぶための追加指示を加えることができます。
この項目が追加されると、リンクをクリックした時に別のウィンドウもしくは別のタブでリンク先が開きます。元のウィンドウを閉じることなくリンクを開けるので、別サイトなどに飛ばしたい時に多用されます。
特にアフィリエイトサイトでは、広告先のページに飛ばす場合にこのタグを使うことが多い傾向にあります。
リンクが開かないという問題
aタグのみであればリンクをクリックするとリンクが開くものの、target= _blankを追加するとリンクが開かないという問題が、Twitterなどで報告されるようになっています。
aタグ自体は機能しているわけですから、追加情報であるtarget= _blankの方に何らかの問題があることが分かります。
トラブルが生じる環境は?
このトラブルはすべてのパソコンやブラウザで起こっているわけではありません。Twitterでユーザーからの報告が上がっていることからも分かるように、このアプリ内のブラウザの中で問題が発生している状況です。
また、スマホデバイス、特にAndroid端末を使っているユーザーから問題が起こっているという声が多いです。中でもGoogle Chromeでの閲覧をしている時に発生している傾向があります。
このように、全ての環境ではなく、端末やアプリによって一部の環境で生じていることが分かります。
問題が発生し始めた時期とその原因
昔からtarget= _blankを使って別タブなどでサイトを開くというのは、かなりの頻度で使われていた方法で、問題が生じることはありませんでした。しかし、2019年の8月頃からTwitterでのコメントを中心に、トラブルが報告されるようになってきました。
その原因は、主にセキュリティー上の問題だと考えられています。元々このtarget= _blankタグは、悪意のある第三者の使い方によってはトラブルが生じてしまうという問題を持っていました。
そこで、セキュリティーの問題が起こりやすいSNSやスマホで、タグの使用を制限する動きが広がったと見ることができます。
target= _blankがセキュリティー上危険だと言われる理由
このタグには昔からセキュリティー上の脆弱性があると指摘されてきました。その内容とは、リンク元ページのURLを差し替えられてしまうという問題です。
target= _blankで指定されているリンク先が悪意を持ったページである場合、不正な手段を使って、リンク元のURLを変更できてしまうのです。たとえば、Aというサイトにtarget= _blankタグを貼って、Bサイトに飛ばす設定にしているとします。
しかし、Bサイトが悪意を持ったページだと、AのURLがCというサイトにすり替えられてしまうのです。つまり、この脆弱性を突かれると、同じユーザーがAというサイトに行きたくても、Cサイトに自動的に飛んでしまうことになるのです。
target= _blank問題の解決策
自社サイトでリンクが効かないという状態では、商品紹介ができなくなるなどの問題につながることもあります。同時にセキュリティー上のトラブルが起こってしまっては大変ですので、早急に対処しましょう。そのための解決策として大きく二つの方法があります。
- target= _blank自体を使わない
- rel=“noopener”を加える
target= _blank自体を使わない
最もシンプルで簡単な方法としては、target= _blank自体を使わないというものがあります。aタグの中に入れてある項目を削除するだけで良いので、とても簡単です。
ただし、このtarget= _blankを使わないと、同じウィンドウ内でページ移動することになります。元サイトが消えてしまいますので、参照したい場合は「戻る」ボタンをクリックしないといけなくなります。
rel=“noopener”を加える
やはり別タブや別ウィンドウでリンクを開きたいということであれば、rel=“noopener”を加えることになります。aタグの中で、target= _blankの後ろにrel=“noopener”を追加するだけで、これもやはり簡単です。
Googleなどは、開発者向けのコメントをしていて、この方法を推奨していますので、公的な使い方と言えます。また、タグが効かないという問題が生じているブラウザの提供元が言っていることですので、機能面でも安心して利用できるというメリットがあります。
WordPressでサイトを作っている場合は、特に何もしなくても問題ありません。手作業でタグを入力しているのでない限り、ビジュアルエディターで編集をする場合、自動的に上記のrel=“noopener”が追加されているからです。
すでにエディター側で対策済みということですので、気にせずに今までと同じように使い続けられます。
まとめ
使用頻度が高いタグの一つであるtarget= _blankは、リンクが効かないという問題が一部環境で発生しています。解決は簡単にできますので、自社サイトを見直してみましょう。
こうしたタグトラブルというのは突然発生します。こうした事態に備えるためにも、プロの制作会社に運用や改善を依頼することができます。
「比較ビズ」では、複数の実績あるプロの一括比較ができますので、とても簡単に業者選びができます。こうしたサービスを活用して、安全なサイトを作りましょう。

山形県出身。埼玉県越谷市と山形県上山市の2拠点で活動中のフリーランス。開業5年目でSUGI WORK代表。国内・海外法人から行政案件まで経験。WEB制作をはじめ、デザイナー・エンジニア・出張撮影・ドローン空撮・取材・自社メディア運営など幅広い分野で活動中。中小企業の課題解決が得意。
ホームページ更新・管理の費用・相場に関連する記事
ホームページ更新・管理に関連する記事
-
2022年05月23日ホームページ更新・管理ホームページリニューアル時のお知らせ方法は?例文や制作会社の選び方も併せて …
-
2022年05月19日ホームページ更新・管理Shopifyの費用はどんな風にかかってくるの?
-
2022年05月19日ホームページ更新・管理Shopifyの手数料はどんな仕組みになっている?プランごとの差もチェックしてみ …
-
2022年05月10日ホームページ更新・管理wordpressでカレンダーを入れるためにはどうしたらいい?
-
2022年05月10日ホームページ更新・管理ワードプレスを高速化させるコツやメリットを解説
-
2022年05月09日ホームページ更新・管理BtoBのECサイトの成功事例特集【担当者必見】
Web制作会社・システム開発会社に関連する記事
-
2022年05月23日ホームページ更新・管理ホームページリニューアル時のお知らせ方法は?例文や制作会社の選び方も併せて …
-
2022年05月19日ホームページ制作・デザインshopifyの実際の評判は?口コミサイトを検証してみた
-
2022年05月19日Web制作会社・システム開発会社shopifyでできることとは?機能性を高めるアプリの存在がポイント
-
2022年05月19日Web制作会社・システム開発会社shopify構築にかかる費用はどのくらい?外注ならどのくらいの予算を見込むべき?
-
2022年05月19日ホームページ制作・デザインShopifyテーマはどれが正解か|テーマの種類や選び方のコツを解説
-
2022年05月19日ホームページ更新・管理Shopifyの費用はどんな風にかかってくるの?
スマートフォンやブラウザ環境は、技術革新とセキュリティなどの理由から日々アップデートされています。毎日・毎月アップデートされている訳ではないですが、「target= _blankが効かない」といった不具合は年に何度か耳にします。
target= _blankのように多くの方が利用しているソースコードであれば、不具合は早急に修正(もしくは別の解決策が提示される)ことが多いですが、このように困った時に「原因を調べる力」が必要になります。
ページを修正していて、どうしても困ってしまった場合はバックアップを取りながら作業をする・WEB制作の知り合いやプロに早めに相談するのがおすすめです。事例が多く報告されているものもあれば、大幅な修正が必要なケースもあるため、難しく感じたら早めにプロへ相談してみてください。