世界第一个网页是由英国物理学家提姆（Tim Berners-Lee）在欧洲粒子物理研究所 （CERN）时发明，当初成立的目的，是为了让世界各地的物理学家可以方便交换研究资料而开发，后来CERN在1993年4月30日决定以免授权费的方式，将WWW（World Wide Web）和全世界同享。 27年前诞生的CERN的网页只运用了简单的URL、http和html组成，这样的创举改变了全世界的网络世界，也让他在2002年入选BBC最伟大的100名英国人 。

1993 文字和空格

在互联网真正开始之时，黑色的接口仅能显示单色的像素。 当时的网页设计仅能使用文字和空格排列组合。 虽然图形化的界面早在80年代初就有了，但在此时普及率并不高。 直到90年代，图形化界面才真正进入千家万户。

1995 网页的兴起，Table 的使用

能够显示图片的浏览器的诞生，是促使网页设计这个行业诞生的重要先决条件。 在当时最接近于信息结构化的概念，是 HTML 中已有的元素：表格（Table）。 所以，David Siegel 在他的网页设计书《Creating Killer Sites》讲述了他设计优秀网站的秘诀：在表格中嵌套表格，将静态的表格和动态的表格以巧妙的方式结合到一起。 表格正确的用法应该是在表现数据，但是在那个时代，这种方法大为流传。

网页设计所面临的另外一个问题，就是如何保持网页设计脆弱的结构。 也正是因为这种需求，切片设计（Slicing Design）逐渐流行了起来。 设计师创建出漂亮的网页排版，开发者将整个设计稿切片，找出呈现设计的最佳方法。 另一方面，表格也有好用的地方，比如垂直对齐，以像素为单位或者以百分比来控制对齐。 在当时，表格可是近乎栅格系统一般的灵活的设计神器，也正是因此，那个时代的开发者并不喜欢前端的代码。

1995 JavaScript 打破局限

JavaScript 解决 HTML 一些局限。 举个例子，如果你想写个弹出窗，或者想动态修改某些对象的顺序？ HTML不行，但是JS可以！ 当时背景图像、GIF 动画、闪烁文字字、计数器等工具迅速成为网页设计的噱头。 不过 JS 主要问题在于，它处于整个网页布局的顶层并且需要单独加载。 很多时候它仅仅被当作一个简单的补丁，但如果使用得当，JS可以非常强大。 今天，同样的功能如果CSS能实现，我们会尽量避免使用JS。 不可否认的是，JS 本身确实很强大，前端常用的jQuery，后端的Node.js都是不可多得的好东西。

1996 Flash自由的黄金年代

Flash为网页开发者/设计师带来了前所未有的自由，它打破了之前网页设计固有的限制。 设计师可以随心所欲地在网页上展现任何形状、排版、动画和互动，也可以使用任何喜欢的字体。 所有的这一切最终会被打包成为一个文件，然后被发送到浏览器端显示出来。 这也就意味着，用户只需要拥有最新的 Flash 插件和些许等待时间，就可以享有一个魔术般的网页。 这是启动页面（splash pages）、介绍动画以及各种交互特效的黄金时代。 不幸的是，这种设计并不开放，也不利于搜寻，还消耗大量的运算能力。 2007 年，当苹果发布他们的第一台 iPhone，就决定彻底放弃 Flash，也正是在这个时候，Flash 开始走下坡路——至少在网页设计领域，且逐渐被 html5 取代。

1998 CSS  (Cascading Style Sheets)

CSS 与 Flash 约同期出现，是一种更好的网页结构化设计工具。 CSS 的基本概念是将网页内容和设计样式分开管理，所以网页的外观和排版等属性将会在 CSS 中被定义，但内容依然保留在 HTML 中。 早期版本的 CSS 并没有现在那么灵活它最大的障碍在于许多浏览器还没来得及接纳这一新技术，对于开发者而言，这是一个头疼的事情。 需要明确说明的是，CSS 并非全新的编程语言，它仅仅只是一种声明性语言。 那么网页设计师需要学习编程吗？ 可能需要。 但是网页设计师需要懂得CSS么？ 当然需要。

2007 Grid Syste iPHONE 问世

在手机上浏览网页本就是一种全新的挑战。 设计师除了要为不同尺寸的屏幕装置设计不同的排版布局，还面临着内容控制的问题：小屏幕上展示的内容要和桌面端一样多，还是需要单独抽离开来？ 桌面端网页上的广告要如何在手机上呈现？ 加载速度也是一个大问题，移动设备的网络加载速度不够快，且桌面端网页会消耗大量的流量。

第一个重大的改进是栅格系统的出现。 960- Grid System 或 12- Grid System，12- Grid System 被设计师们广泛的接纳，甚至成为许多设计师最常用的设计工具。 各种常见的设计元素诸如表格、导航、按钮被标准化成为可复用的套件，构成了视觉元素库。 其中最典型的代表就是 Bootstrap 和 Foundation，使得网站和APP之间的界限逐渐模糊。 它们也不是没有缺点，借助这些元素库设计出来的网页往往大同小异，而且网页设计师要想使用它们还得深入了解相关的代码知识。

2010 RWD 网页设计（Responsive Web Design）

设计师 Ethan Marcotte 决定挑战传统的网页设计，让网页在内容不变的前提下，版面布局随着显示器的尺寸的变化而变化，将这种设计命名为 RWD 网页设计。 设计师只需要 HTML 和 CSS 就可以实现这种功能。 不过大家对于RWD 网页设计依然有些许误解。 对于设计师而言，RWD 网页设计意味着为设计许多不同的布局。 对于用户而言，RWD 网页设计就意味着这个网页可以在手机上完美浏览。 对于开发者而言，RWD 网页设计意味着如何控制好网站图片在移动端和桌面端，在不同情形和语义下，拥有良好的下载速度和呈现效果。 简而言之，就是一个网站能在任何情况下良好展现，且更利于搜索引擎优化。

2010 Flat Design 扁平化设计

以往设计会耗费太多时间在繁杂的设计上，如不必要的阴影、纹理、装饰等，现今开始抛弃复杂的光影效果。 设计走向化繁为简，回归到设计的根本，专注在内容呈现。 将复杂的效果淡化后，这些简化的视觉元素就是说谓的扁平化设计。 充满光影特效的按钮被扁平化的图标所替代，向量图 SVG 和图形字 Font icon 体开始被广泛使用，简约的界面与流畅操作，给用户更直觉的设计。

2014 网页设计璀璨的未来

网页设计演化至今，目的在于呈现直觉的内容、快速的传递讯息。 在许多设计平台上，设计师只需要在屏幕上移动不同的控件就可以生成整洁的代码，且这些代码非常灵活，可控度极高！ 开发者无需担心浏览器兼容性，可以专注于更加实际的问题！ 网页设计的概念与技术不断推陈出新。 在 CSS 中新诞生的属性，如 vh 和 vw（viewport height 与 width），就使得网页设计的元素的定位控制更加灵活自由，一次性解决了设计师纠结多年的顽疾。 带有影片型网站、矢量图形 SVG 和 图形字 Font icon... 等技术使网站效能更加优化。