交互分析:什么时候该用target=_blank

target=_blank,是html中锚链接中target属性的一个选择值,即点击链接的时候是否打开新页面。如果写上target=_blank,则在点击链接的时候需要打开新的页面。我在使用网站的时候,发现国内的网站好多地方都在使用target=_blank,而国外的网站则多数在当前标签打开新页面,那么什么时候应当使用target=_blank,什么时候不使用呢?的确应当思考一下。
使用的宗旨:“需要打开新的页面,但是当前页面不想被关闭”

应当使用target=_blank的情况

一、站外链接#

我们在使用某一网站的时候,往往在网站页面的页脚会有一些站外链接,或者是一些莫名其妙弹窗的广告,这些链接往往与网站并不属于同一站点,而是出于一些商业的需求或者为了提高用户体验添加的。这个时候当用户在点击该标签时,网站的运营者并不希望新打开的页面替换掉我自己网站的页面。所以从网站自身的角度来看,应当在新标签打开页面。

Paste_Image.png

二、由概述到详细的页面

这种情况是比较常见的一种情况,即我从一个概述或者统筹总结性质的页面,进入到其中某一小块的详细页面中。在我们使用百度搜索相关信息时,我从搜索的结果到实际搜索到的页面时,就应当打开一个新的页面。因为我并不知道我所要打开的页面是否就是我想要的。同时,我仍然希望可以看到搜索的结果以便我可以方便的浏览其他的结果页面。当我们浏览淘宝的时候,搜索到的商品结果也需要做一个较为全面的对比,此时,我也需要从新的标签打开页面。使用知乎时候,我浏览在自己的timeline上面,突然发现一个问题或者某一用户我比较感兴趣,但是我目前的主要操作点仍然在timeline上面,所以我需要从一个新的标签打开该页面。所以在这种由概述到详细的页面跳转时,从用户体验方面应当从新标签打开页面。

Paste_Image.png

三、用户在当前页面的操作成本较高的时候

我们在注册一个比较有专业性质的网站时,往往需要填写一堆的表单,但是在最后的时候会有一个用户协议需要勾选同时可以点开。这个时候,用户协议应当采用的方法就是新标签打开,因为我当前的用户操作成本较高,如果在当前页面打开,那之前所有的操作都被进行了刷新,从用户层面来说一定会异常的懊恼,甚至关闭网站,损失用户或者流量。所以,在用户进行一些操作成本较高的操作时,比如注册或者进行一些上传图片,文章的操作等都需要进行新标签的打开。必要的情况下,用户在刷新页面的时候也要进行弹窗的提醒,警示用户该页面的输入信息将会丢失。

Paste_Image.png

四、页面中有正在进行的操作

在我们观看视频网站的时候,暂停时一般会弹出一些广告。如果当我们点击广告将当前页面刷新了,那当我再次希望观看这个视频的时候,我需要一切都重头再来。我需要再次观看好几分钟的广告,需要拖动进度条找到自己观看到什么时候了,这些对于用户来说,都是糟糕的体验。所以在当前页面有用户正在进行的操作时,比如观看视频,收听音乐,观看某一小说的某一章节,都应当在点击链接时从新的标签打开页面。

Paste_Image.png

五、当前页面的位置节点比较重要

一个页面或者一个网站往往都会遵循二八原则,即我整个页面可能主要的信息只占了整个页面内容的20%,或者网站中所有用户浏览量最大,用户转化率最高的页面只占了整个网站所有页面的20%,这些页面,这些位置无疑是十分重要的。所以为了将用户停留在这些页面,在用户点击其中的某些链接的时候,往往需要从新标签打开。

不适用target=_blank的情况

一、流程清晰且唯一

在我们使用购物网站的时候,到了购物车结算以及确认订单这一步时,流程已经十分的明确了,当我选择填写完必要的信息后,提交订单或者取消该订单目的都十分的明确,这个时候再从一个新的标签打开该页面就没有任何的必要了。在上传一些图片的时候,上传完毕后需要填写图片的一些相关信息,而此时图片已经上传完毕,信息不可更改且接下来的操作也十分的明确,在点击下一步操作的时候就可以在当前页面重新打开新的页面了。所以,在用户接下来的操作已经十分明确的时候就完全可以从当前页面打开新页面而不是新建一个标签了。

Paste_Image.png

二、当前页面在点击后无实际意义

有时候在填写一些重要信息时,网站需要我们再次将自己填写的信息确认一遍,比如报考四六级等。确认完毕后,这个页面就没有任何存在的意义了,无论我们接下来要进行什么操作,这个页面留给我们的意义都不大,所以此时,在进行其他操作的时候就可以将其覆盖了。

三、用户群体明确知道该如何打开新标签

其实浏览器中隐藏着关于打开新标签的功能,当我用鼠标中间点击某一链接的时候,就可以打开新标签;按住ctrl键点击链接也是点开新标签;鼠标在链接右击有在新页面打开标签的选项。然而这些小技巧在国内的用户是很少知道的,但是用户数量少并不代表没有。如果我网站的用户群体刚好是这样的一群人,比如一个资深电脑玩家的论坛,就完全可以不去使用target=_blank,而是将打开标签的方式交给用户,让用户去做抉择。

四、网站追求简洁的效果

其实在点击链接从新标签打开这种操作大部分时候看起来往往很不错,但是有些时候它并不是一个明智的选择。因为如果一直从新标签打开,你的浏览器会多了一堆的标签,用户用起来没准会很烦恼。当用户想要关闭的时候也需要一直的点点点,这并不是一个十分优秀的用户体验。所以如果你的网站追求简洁的效果且内容不多,用户在任何情况下可以比较方便的触及到你网站的任何位置,不妨使用下载当前页面打开,它会使你的用户感觉到十分的清爽,干净。

总之,是否从新标签打开页面看起来也许并不是特别起眼,甚至可以说是一个很小的细节。但是正是这种小细节往往决定了你网站的用户粘性,是否可以在竞品中胜出。网站的交互设计者应当慎重的考虑下这些小细节。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,186评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,858评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,620评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,888评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,009评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,149评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,204评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,956评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,385评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,698评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,863评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,544评论 4 335
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,185评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,899评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,141评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,684评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,750评论 2 351

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,744评论 1 92
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,644评论 18 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,898评论 25 707
  • 随着html5的普及和Web技术的净化,从Windows XP的IE6到IE8、IE9、IE10、IE11,Edg...
    波段顶底阅读 2,199评论 1 1
  • 两本书,两个女人。 林语堂言古中国文学中最可爱的两个女子。一个是芸娘,一个是秋芙。 芸娘是...
    西北偏点北阅读 608评论 0 2