写给网页设计师的网页设计简史(2)

时间:2014-12-09  来源:酷遨网络

CSS的诞生 (1998)

网页设计 网页设计师 响应式设计

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

栅格与框架:移动端的崛起(2007)

网页设计 网页设计师 响应式设计

此刻,在手机上浏览网页本就是一种全新的挑战。设计师除了要为不同设备设计不同的布局,还面临着内容控制的问题:小屏幕上展示的内容要和桌面端一样多,还是需要剥离开来?桌面端网页上闪亮精致的小广告要如何在手机上呈现?加载速度也是一个大问题,移动端设备的网络加载速度不够快,而且桌面端网页会消耗大量的流量。网页设计亟待改进。

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

响应式网页设计(2010)

网页设计 网页设计师 响应式设计

惊才绝艳的设计师Ethan Marcotte决定挑战传统的网页设计,它让网页在内容不变的前提下,布局随着窗口和屏幕的变化而变化,并且将这种设计命名为响应式网页设计。网页设计师依然只需要HTML和CSS就可以实现这种功能,不得不承认这种设计理念非常超前。不过大家对于响应式设计依然有些许误解。对于设计师而言,响应式设计意味着为设计许多不同的布局。对于用户而言,响应式设计就意味着这个网页可以在手机上完美浏览。对于开发者而言,响应式设计意味着如何控制好网站图片应付移动端和桌面端,在不同情形和语义下,拥有良好的下载速度和呈现效果,等等。简而言之,就是一个网站能在任何情况下良好展现。至少在这一点上,所有人能达成共识。

扁平化的时代(2010)

网页设计 网页设计师 响应式设计

设计网页布局总会花费大量的时间,好在这个时候我们开始抛弃复杂的光影效果,重新专注于根本的内容呈现。在此之前,网页设计讲求精美的图片和排版效果,漂亮的插画与周到的布局设计,而简化这些视觉元素之后,就是我们说所的“扁平化设计”。将复杂的效果淡化之后,视觉的扁平化,也促使内容和信息层级的扁平化。充满光影特效的按钮被扁平化的图标所替代,矢量图形和图标字体也开始被大范围使用,网页字体和版式设计的结合令网页视觉更加漂亮。有趣的是,这时候的网页设计开始有返璞归真的感觉。

光明的未来(2014)

网页设计 网页设计师 响应式设计

技术的革新已经开始将网页设计推动到一个全新的境界。在许多设计平台上,设计师只需要在屏幕上移动不同的控件就可以生成整洁可用的代码出来,并且这些代码非常灵活,可控度极高!试想一下,开发者无需担心浏览器兼容性,可以专注于更加实际的问题!

新诞生的概念正在推动网页设计。CSS中新诞生的属性,诸如vh和vw(viewport height 与 width),就使得网页元素的位置控制更加灵活自由,一次性解决了设计师纠结多年的顽疾。作为CSS一部分的Flexbox则是另一个新事物,它可以快速创建布局,轻松修改属性而无需编写过多代码。

网页设计正在飞速发展,未来还会有越来越多的创新,就让我们拭目以待吧!

 

Copyright Right © 2009-2023 kuaonet.com Powered By 上海网站建设 酷遨网络 Inc