HTML5でtarget =“ _ blank”を使用しても大丈夫ですか?


165

target="_blank"HTML5では、HTML5で使用するのはもはや問題であるとどこかで読んだことを覚えていますが、今は見つかりません。

使い続けても大丈夫target="_blank"ですか?

私はそれが一般に悪い考えと考えられていることを知っていますが、PDFのようなもののために新しいウィンドウを開く最も簡単な方法であり、JavaScriptに依存する必要もありません。


5
まあ、一般的にあなたがあなたのサイトから外部サイトを開きたいなら、新しいウィンドウを開くこと(これはおそらくほとんどのブラウザの今日の新しいタブです)は私の意見ではより良い考えです。
hobbes3

7
@ hobbes3、私のナビゲーションと履歴をいじるのをやめてください。閲覧しているのは私であり、リンクを新しい(中クリック)タブで開くか、同じ(左クリック)タブで開くかを決定するのは私です。新しいタブですべてのリンクを開く「合法的なベストプラクティス」に従うように強制するWebサイトに出くわしたとき、私は迅速かつ喜んで離れます。
Albireo 2013年

9
@Albireo、それは私の意見であり、いくつかの人気のあるWebサービスも同じ考えを取り入れています。たとえば、Gmailでメールのリンクをクリックすると、デフォルトで新しいウィンドウが開きます。
hobbes3 2013

12
@Albireoは、ユーザーが常にあなたと同じくらい高度で技術に精通していると想定しています。
マイクキャンベル

3
他の理由がありtargetます。存在します。時々それらは必要です。ステートフルJSを使用して動的に生成されたページ。たとえば、iframeは新しいタブよりも望ましくありません(たとえば、OPの状態としてPDFを表示します)。または、セキュリティで保護されたサイト(銀行など)から外部リンクに送信されたが、コンテンツの期限切れのために[戻る]ボタンを使用できない場合。すべてのことと同様に、このHTML属性は「悪い考え」ではありませんが、すべてのプログラミングにおけるすべてのライブラリ、クラス、関数、プロパティと同様に、慎重に使用する必要があります。
s.co.tt 2014

回答:


159

target="_blank"まだ大丈夫のようです。最新のHTML5ドラフト、ブラウジングコンテキストキーワードとしてリストされています。


54
target="_blank"ユーザーがリンクをクリックするたびに新しいウィンドウが開きます。これが本当にあなたがしたいことではない場合(そしてそれがめったにない場合)はtarget="somethingUnique"、ユーザーがリンクを数回クリックしても、ユーザーが1つのウィンドウのみを開くように使用することを検討してください。これは、より優れたUXを実現します。
BanksySan 2013

4
@BanksySan:target="_blank"良いと思う1つの例は、ボタンの共有です。
Martin Thoma、2014年

長い記事を読んでいて、別のサイト(または同じサイト)の関連情報への参照がある場合。元の記事で自分の場所を失うことなく、2つの間を行き来したいことがよくあります。target = "_ blank"はこれに最適です。ページを離れて、各ページを交互にリロードする必要がある(多くの場合、どちらかのページで私の場所を失う)ことはありません。はい、リンクを右クリックして新しいタブで開くことができることはわかっていますが、集中力が失われるのでしたくないので、ほとんどのWebユーザーがその方法を知らないのではないかと思います。
Bob Ray

target属性には多くの利点があります。私はそれを否定するつもりはありません。ポップアップ広告主はその目的を破壊しましたが、今日、ブラウジング体験以外に非常に多くのサービスが実行されているため、多くの人々は現在の記事やタブから離れたくないが、大量のダウンロードPDFまたはビデオを操作しています。_blankを使用すると、ユーザーが空のタブにデータを入力できるようになります。同じセッション/サイトで多くのリンクを提供する場合は、現在入力されているコンテンツを上書きしないでください。ユニークな名前は、90曲のオーディオリストでは乱雑です。...Viva la target、viva la _blank ...
Jonas Lundman

91

使用しても問題ありtarget="_blank"ません。新しいウィンドウをターゲットにすると、ほとんどのブラウザで常にポップアップアラートが表示されるため、これはXHTMLでは廃止されました。XHTMLは常に検証のターゲット属性でエラーを表示します。

HTML 5はまだ使用しているため、元に戻しました。それは私たちの友人であり、私たちは手放すことができません。

手放すことはありません。


あなたが主張することは、HTML strictに対してのみ有効です。
qwertzman 2013年

XHTMLおよびHTMLの場合。
MEMark 2014年

15

けれどもtarget="_blank"あるHTML5に許容可能な、私は個人的に(でも新しいウィンドウでPDFファイルを開くために)それを使用してみてください決してありません。

HTMLは意味と内容を定義する必要があります。、自問し、「だろうという意味a場合、要素の変更target属性が削除されました?」そうでない場合は、コードをHTMLに含めないでください。(実際、W3Cがそれを守っていたのには驚いています。本当に手放せないのではないでしょうか。)

ブラウザの動作、特にユーザーとの対話的な動作は、 JavaScriptなどのクライアント側スクリプト言語で実装する必要があります。ブラウザが特定の方法で動作するようにしたい場合、つまり新しいウィンドウを開く場合は、JSを使用する必要があります。しかし、あなたが述べたように、この動作はブラウザがJSに依存することを必要とします。(サイトの品質が低下したり、段階的に向上したりする場合でも、問題はありません。JSが無効になっているユーザーは、それほど多くのことを見逃すことはありません。)

そうは言っても、これらはどちらも正しい答えではありません。どこかにリンクが開く方法は最終的にエンドユーザーが決定する必要があるという意見がありますこの例を見てみましょう。

あなたはウィキペディアをサーフィンしていて、ウサギの穴にどんどん深くなっています。あなたはあなたの読書でリンクに出くわします。

戻る前に、リンク先のページをすぐに読み飛ばしたいとします。新しいタブで開いて、完了したら閉じることができます(「戻る」ボタンを押してページの再読み込みを待機するのに時間がかかりすぎるため)。または、見た目が面白くて、後で使用するために保存したい場合はどうなりますか?多分あなたは代わりに新しい背景タブでそれを開き、現在のページを読み続けるべきです。または、このページを読み終えたと判断して、現在のタブのリンクをクリックするだけでもかまいません。

重要なのは、独自のワークフローがあり、それに応じてブラウザーを動作させたいということです。それがあなたのためにこの種の決定をしたなら、あなたはかなりイライラするかもしれません。

つまり、Web開発者は、リンクの場所、参照するソースのタイプやフォーマット、および何をするかを完全に明確にする必要があります。ツールチップはあなたの友達になることができます(タブレットまたは電話を使用している場合を除きます。その場合、モバイルサイトでこれらを指定します)。私たちは皆、私たちが予期していなかった場所に持って行かれたり、私たちが意図していないことを起こしたりするのがどれほど大変かを知っています。


そして、誰かがすべてのリンクで非常に簡単に神から与えられた制御権を行使できるユーザーウィジェットを設計するのに十分賢い場合(無意識のうちに)、それをブラウザに追加し、すべての<a>タグでそれを提供します。
Mark Goldfain、2014年

私の意見では、この答えは論理的およびアーキテクチャ的に最も正確です。理想的な世界では、作成者は、チャンクの適切なセマンティック識別についてより関心を持つべきであり、チャンクの動作を事前に決定することについては関心を持つべきではありません。新たなアダプティブコンテンツユニバースでは、ウィンドウの動作は、リクエスト時に有効なレスポンシブテーマまたはユーザー設定に依存する場合があります。発信セマンティック「もの」は、変換(DOMまたは正規表現、サーバーまたはブラウザ)によって必要な場合にのみ変更されます。このようにして、ウィンドウの動作はCMSの作成者ではなくユーザー次第です。

12

PDFなどの新しいウィンドウを開く最も簡単な方法です

これは、Windows以外のユーザーを煩わせる最も簡単な方法でもあります。PDFは、他のプラットフォームのブラウザーでも問題なく開きます。新しいウィンドウを開くと、ナビゲーションの履歴がめちゃくちゃになり、スマートフォンなどの小さなプラットフォームでは問題が複雑になります。

古いバージョンのWindowsが壊れたという理由だけで、PDFなどの新しいウィンドウを開かないでください。


11
あなたが人々に何かを使わないように言うときに何が役立つか知っていますか?使用するもの示すHTML5ダウンロード属性:<adownload="[ここにファイル名]]"href="file.ext">etc </a>
ジョン

5

ほとんどのWeb開発者はtarget="_blank"、新しいタブでリンクを開くためだけに使用します。を使用target="_blank"して新しいタブでリンクを開く場合、それは攻撃者に対して脆弱です。新しいタブでリンクを開くと(target="_blank")、新しいタブで開くページは最初のタブにアクセスし、window.openerプロパティを使用してその場所を変更できます。

JavaScriptコード:

window.opener.location.replace(malicious URL)

防止:

rel="nofollow noopener noreferrer"

nofollowがセキュリティに関連しているとは思いませんが、これは検索エンジンボット用です。
ダリルハイン2017年

4

targetはHTML5でも受け入れられますが、推奨されません。PDFファイルにリンクするには、target属性の代わりにdownload属性を使用します。

次に例を示します。

<a href="files/invoice.pdf" download>Invoice</a>

元のファイル名が一意のファイルストレージ用にコード化されている場合は、download属性に値を割り当てることで、わかりやすいダウンロード名を指定できます。

<a href="files/j24oHPqJiUR2ftK0oeNH.pdf" download="invoice.pdf">Invoice</a>

最近のほとんどのブラウザはこの機能をサポートしていますが、一部はサポートしていない場合があることに注意してください。詳細については、caniuse.comを参照してください。



0

次の方法でjqueryを使用して実行できます。これにより、新しいウィンドウで開きます。

<input type="button" id="idboton" value="google" name="boton" /> 

<script type="text/javascript">
    $('#idboton').click(function(){
        window.open('https://www.google.com.co');
    });

</script>

target = "_ blank"のボタンの周りにフォームを追加してみませんか。それはより簡単で、JSの必要性を取り除くようです。
ダリル・ハイン

-1

<link>要素ではなくtarget属性は廃止予定だと思います<a>。それがおそらく、もはや使用する必要がないと聞いた理由です。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.