html中链接地址的重要性

html中链接地址的重要性

    也许这个标题已经没有什么吸引力了，大家可能都已经沉静在高深的技术方面的研究了。

    也有很多人认为今天已经进入了一个高速互联网时期，也有人曾经说过，如果你的浏览器没有开启支持javascript，那是你活该，但是当我今天在次访问国外一家知名网站的时候，突然发现了我在两年前犯过的一个错误。这个错误从表面上来看，的确算不了什么，因为其实这与交互设计师有关系。因为作为前端工程师的我根本不知道怎么办了嘛，这是托辞。

    那究竟是什么问题呢？的确，有人曾经说过我，你说事情就说重点嘛，为什么先要来一段，才把重点说出来呢？的确只说重点，可以提高沟通的效率，但是有时候并非如何。好了，问题是什么呢？现在告诉大家：

    就是在你书写html的时候，链接地址为井号(#)，就这样的一段代码：例子。

    肯定你会说，这有什么问题呢？难道不是这样吗？是的，如果你不接触后端模板(php的smarty)的话，只需要向后端工程师提交静态的页面的话，这样做我觉得真的没有什么问题。但是作为一名前端工程师不管你是否会接触到后端模板，但是你在还原设计稿的时候，一定要做到心里有数，这里的心里有数是什么意思呢？其实就是你的链接将指向什么地方，这一点非常重要。

    这时候有人又会说了，这屁大一点的事，为什么要拿出来说，但是我觉得这真的很重要。

    其实一个真正的网站是靠链接将所有的网页链起来，形成的网站，给我的感觉是，如果没有链接，就根本没有网站这么一说，嘿嘿，那有人会说，你究竟想说什么？好吧，其实我们经常会发生上面说的这种事情主要体现在什么地方呢？其实就是用javascript来代替链接实现某些功能的时候，或者说用javascript来实现某些功能的时候，而我们操作的标签是a，当然不排除这是属于滥用a标签造成的，我们先排除滥用的可能，那其实造成这种原因的有两种情况：

    1、前端工程师对整个网站(产品)架构不熟悉；

    2、交互设计师对整体架构设计考虑不周全，前端工程师在实现时也未考虑

    正因为这两个原因造成了在链接的地址中为#的现象。为什么我会这样说呢？在这里举一两个最简单的例子来说明情况：

    1、tab选项卡：这是我们经常会见到的，其实tab选项卡就是将一个一个的分类中的一些值得推荐的信息在一个有限的区域，而经常大家会看到一个更多链接，指向这个分类的页面，而大多前端工程师在实现这个tab选项卡这个交互功能的时候，每一个tab可能是一个li，但是里面一般情况下会有一个a，那么这人a的href是#，其实这个地方完全是可以给他一个这个分类的链接，为什么给#不行，要给链接的，其实就是我最开始说的，如果遇到网络条件不好的情况下，可能这时候js还没有加载完成，用户又去点击这个tab的时候。

    2、下拉式城市选择：这种效果其实现在随处可见了，就拿QQ团购来说(http://tuan.qq.com/)，在logo的右侧是有一个城市选择的，因为这个地方的城市选择是用js实现的下拉效果，但是如果当我的网速过慢，js未加载的时候，这个下拉菜单其实是不起作用了，但是因为QQ团购这里给选择城市的这个功能中用的a，而给a的链接地址是#，就造成了，我无法选择城市，如果这里他给我一个另外的网页，那么这样我就可以跳转到其他页面选择我需要的城市，虽然这样也许给用户体验感觉不好，但是总比用户点很多次无效好吧?这个问题有几种情况，就是交互设计师根本没有考虑，根本没有单独的一个页面用来选择城市的，还有就是交互交互设计师考虑了这个页面，前端工程师并没有将链接指向过去，还有就是交互设计师没有考虑到这一点，前端工程师也没有考虑这一点，所有人全部忽略。

    也许还是有很多人觉得这并没有什么？但是我觉得这种一个比较小的细节，还是比较重要的。虽然有时候全局比细节重要，其实这就是因为全局考虑不周，而却又在细节上体现出来了。

建议继续学习：