在HTML5流行的时代，网站前端也越来越受到大家的关注，但是还是有很多人表示有怀疑前端到底是做什么的，能够在网站建设中起到什么作用呢？很多公司的职位划分的时候是没有前端这个职位，只有特别*或者具有很完善的公司体系才会安排这个职位，很多公司的安排会把前端与设计何为一起，还有把前端和后台建设合在一体，所以网站建设中前端给人的印象不是十分的深刻。

 

前端的职位已经不像很早以前，网站存在着简单的模板样式，那时的页面设计风格相对单一，对应的页面需求比较简单，并且当时的浏览器也基本是 IE6 的天下，javascript 也只是网页*的代名词，HTML 页面本身没有引起太多人的关注，似乎只要能用 div 甚至 table 加 css 辅助把图片定好位，把页面内容预留好就 OK 了，并且这种观念存在了很长一段时间。

随着3G业务的风靡，还有不同人群对网站建设要求的层次不同，网站的设计风格越来越个性化、*化、精良化。交互复杂性的增加，AJAX 的应用，浏览器的更新换代，又让大家重新对*基本的页面本身重视起来。然后热议的就是浏览器的兼容性，碰到问题*热衷的就是满网络搜索 hack，顺便再骂骂 IE6、7……当这些都做一遍后，似乎又遇到了瓶颈，又开始寻找出路。我们就从这个阶段开始说起。

网站前端具体能够给网站带来哪些好处呢：

（1）能够给网站结构布局带来良好的展现：拿到设计图后一定要静心思考，多观察。先分框架然后规划结构，编写代码。特别在大型项目中，合理使用模块化的开发不论从整体进行还是拓展维护都有相当大的好处。

（2）关于 hack

很多同学在页面开发时上网搜索*多的就是 hack 了，是否我们完全要依赖 hack 来实现页面兼容性，答案是否定的。大家经常比喻 IE6 向我们撒了一个谎，结果我们要再撒一百个谎来圆这个谎。不否认 IE6 经常让我们口吐鲜血，但不代表我们用更多的“谎言”来弥补就可以心安理得。大部分情况下可以通过变换思路调整 HTML 结构，或使用一些虽然无法解释但相对安全的 css 来干掉 hack。谁都无法预计使用 hack 什么时候会让我们栽一个大跟头。比如触发 layout 或 position:relative 就可以帮助解决很多 IE6 的问题。

（3）优美的代码：看到合理的标签使用、良好的注释、清晰的代码结构、用意准确的 css 不仅犹如欣赏一个艺术品，更为下游开发和协同开发降低了不小的沟通成本。特别是 HTML5 提供了更丰富的语义化标签，它们都苦苦地在等待战场上的冲锋号，让我们去解放它们吧！

(4)“工欲善其事，必先利其器”，除了实战经验和代码习惯的形成可以帮助我们提率外，想要提高对自己开发的进度掌控能力，还有很多辅助工具可以帮助我们进行页面开发。比如使用 Less 或 Sass 可以帮助我们拓展和组织 CSS，大大提高 CSS 的编写效率增加了可维护性。

(5)与HTML5的结合，HTML5时代的来临伴随着移动互联网的兴起创造了更大的机会，还有太多的东西值得我们去学习去发现。 HTML5 提供了丰富的 JS API 接口，需要我们去研究；CSS3的绚丽吸引了足够多的眼球，需要我们去研究；移动设备上如何开发更加适配的页面，需要我们去研究……