网页前端，指的就是用户“看得见”的、浏览器呈现给用户的那一部分。与之对应的、用户看不见的用于数据处理的部分是后端。
一个良好的设计应该将前后端充分分离——这样程序猿可以专注于后端的功能实现，而设计狮可以专注于前端的设计。
前端语言
前端有且只有三种语言：HTML、CSS、JavaScript。尽管看起来很多，实际上每一样都不难学——它们是互相配合使用的。
- HTML 用于描述“网页里有什么东西”。最新的标准是 HTML5。
- CSS 用于描述“网页的东西长什么样”。最新的标准是 CSS3。
- 为了支持一些动态语言功能，例如变量，人们在 CSS 的基础上进行了改进。常见的有两种语言：LESS、Sass。LESS 和 Sass 均会把它们的代码“翻译”成对应的 CSS 代码。但是，通过这两种“动态”语言，开发者可以维护良好的编码风格，从而提高生产力。
- JavaScript 是一种脚本语言，主要用于操作网页上的元素 (DOM)。也可用于客户端的计算，例如在客户端的表单验证。
- 派生语言：CoffeeScript、TypeScript 等，它们均吸收了其他语言的长处，避免了 JavaScript 的某些弊端。它们可以将自己的代码编译成合法的 JavaScript 代码。
注意
前端和后端的开发有很大区别——前端更专注于漂亮而又交互良好的用户界面。
在设计时要考虑到不同浏览器的差异：
- 桌面浏览器
- 不支持 HTML5 和 CSS3 的 IE6/7/8
- IE 9/10/11
- Chrome
- Firefox
- Safari
- Opera
- 移动设备（手机/平板）
- Android 内置浏览器
- Firefox
- Chrome
- Safari
- 应用内浏览器：如 QQ、微信
尤其是 JavaScript 代码，如果未充分考虑浏览器兼容性，网站的功能会大打折扣。
设计时还应该考虑不同尺寸（分辨率）的差异，例如小屏和大屏手机、平板、1024x768、1366x768、1600x900、Retina 屏等。
流行框架
对于个人而言，从零开始设计网页是不明智的，特别是在需要兼顾移动设备的情况下。因此采用一些框架可以节省很多时间。
HTML5 Boilerplate 是一个良好的开始。
Bootstrap 和 Foundation 等都是一套设计好的样式，并且提供了很多可以直接使用的组件。因为这些样式用得太滥了，所以你可能更愿意重新设计样式（或者仅仅换个配色）。
至于 JavaScript，现在有大量封装好的 JavaScript 库，可用于动画、DOM 操作、AJAX、MVC 等各个方面，如 jQuery、Prototype.js、AngularJS、Backbone.js。
编辑器
如果前后端在一起，推荐 Jetbrains 家的产品——IntelliJ IDEA、WebStorm、PHPStorm……它们的价格非常贵，所以可以使用社区版本或学生优惠（不要钱）。
如果只写前端，推荐 Adobe Brackets。值得一提的是它的 Live Preview 功能，可以一边改代码一边看效果——有两个显示器那么工作就更轻松了。