Initial Site

Initial Site

Initial Site

【ターゲットブランク】target=_blankなのか。target=blankなのか。それとも、target=newなのか。WEB屋のメモ帳

  • ヤスダ  2016/07/19 13:16
CropperCapture1

こんにちは。WEB屋の保田です。
(長くなってしまったので、結果は下に大きく赤文字で書いてあります。)

内部リンク、外部リンクだろうが、スマートフォンだろうが、リンクタグをどう開くかは訪問者に決定させたほうがいいっていうGOOGLE推奨ルールがあるし、W3Cでは使用を推奨されてないために、あまり使用を避けたいのですが、リンク方法の注文によっては使わないといけないターゲットブランクについて書きます。

HTML覚えたての頃、target=”_blank”って記述する場合に、target=”blank”って記述しても同じような動作をするので、なにも気にせずWEB作成してきてしまいました。

しかし、target=”_blank”target=”blank”は違いました。それと、blank以外も。10年間も気が付きませんでした。

(´・ω・`)< さっそくテストページを作って試してみました!

target=”_blank”は、毎回新規タブを産み出します。10回クリックしたら10個新規タブを開きます。
target=”_new”は、1つしか新規タブを産み出しません。10回クリックしてもその新規タブの内容が変わって表示されます。
target=”new”でもtarget=”_new”と同じ動き。
target=”hogehoge”でもtarget=”_new”と同じ動き。
target=”blank”でもtarget=”_new”と同じ動き。
target=””だとtargetを記述してないときと同じ動き。

つまり、target=”_blank”target=”blank”と記述すると、target=”_new”として動いていました。

(´・ω・`)< よく分からないからオフィシャルを見てみます。

W3CのHTML仕様(https://www.w3.org/TR/html/)も調べてみました。

target = browsing-context name or keyword CHANGED
A name or keyword giving a browsing context for UAs to use when following the hyperlink.

Any string that is either of the following:
・a browsing-context name
・any case-insensitive match for one of the following literal strings: "_blank", "_self", "_parent", or "_top".


ターゲットに記述できるキーワードは、ウィンドウやタブ名または、ターゲット属性。
表示リンクをたどる際に、ターゲットがウィンドウやタブの画面遷移方法を変更します。

次のいずれかである任意の文字列:
・ウィンドウやタブ名
・ターゲット属性は、"_blank"、"_self"、"_parent"、"_top"の4種類です。

(´・ω・`)< ん?target=”_new”なるものが書いてありません。

しかし、「target=”_new”」で検索すると何件も、_newに書かれたページがヒットします。これはなにやらおかしいです。


Browsing-context name
Any string, with the following restrictions:
・must not start with a "_" character
・must be at least one character long


ウィンドウやタブ名
以下の制限が任意の文字列:
・は、「_」文字で始めることはできません
・は、少なくとも1文字の長さが必要

(´・ω・`)<なるほど。

ルール上、target=”_new”というキーワードの記述は書式違反。
target=”new”というキーワードの記述は、“new”という新しいページを開いていました。

結局、target=”new”でいいのではないかという話でした。(スマホユーザーが増えたので、ユーザー目線考えると、なるべくターゲットブランクを使わないほうがいいのだけども。。。)


この教えて!gooも分かりやすかったです。(http://oshiete.goo.ne.jp/qa/4344852.html
それ以外はフレームのターゲット名として利用され、同名のウィンドウが存在しない場合は、新規ウィンドウを開くという仕様です。因みに、ブラウザによっては同名のウィンドウが存在した場合はそのウィンドウを再利用(上書き)する場合があります。

次回もWEBの記事を書きたい。WEB屋の保田でした。

フリー写真素材ぱくたそターゲットは”pakutaso”にしてみました。


コメントをどうぞ

技術の記事

  1. golf-787826_1920
    あぁOBだ、確かに道は逸れた、しかし それこそOB訪問
  2. YAZIUP_ストレス社会を乗り切るために!耐性を高めよう
    苦しんでいる貴方へ贈るアイデア発想法(後編)
  3. YAZIUP_ストレス社会を乗り切るために!耐性を高めよう
    苦しんでいる貴方へ贈るアイデア発想法(前編)
  4. 2
    photoshopで簡単な加工からそれなりに綺麗にする方法

おすすめ記事

  1. ジョブズ4
    人生の点と点をつなげて線にする『自分史』。
  2. スギ花粉
    鼻がムズムズ目がカユカユな花粉症についてまとめてみた
  3. 『テレビ観ないんだよね…』と言うのがかっこいいと思っている人に告ぐ!
  4. 出典:無料壁紙:格闘技がテーマの写真やイラスト画像まとめ(格闘家・ブルースリー)
    ブルース・リーの出身地ってどこだかわかりますか?
  5. 月額課金地獄
    ネットサービスの月額課金地獄沼にハマる方法
  6. ハイビスカス
    ウチナーンチュが沖縄に帰った時に必ず行くお店10選+α
  7. イニシャルサイトコーポレートサイト
    コーポレートサイトをリニューアルしました
  8. なんでもQ
    相談Q&Aサイト「なんでもQ」開発中です!
  9. さんぽすフォトコンペ開催中
    今年もさんぽすフォトコンペ開催しました!

人気の記事

  1. ファミコン
    パズドラ、モンスト、白猫に続く次のゲームは…?
  2. konagaya_20150303
    日常でつい使ってしまう間違えやすい日本語
  3. クロックスの偽物と本物の違い
    クロックスの本物と偽物の違いを比べてみました
  4. konagaya20150513
    初心者でも気軽に登れて絶景が見れる山