ppt模板 网页设计发展史.pptx

网页设计史1990s THE EARLY基于文本设计的网页90年代初的第一个网站是单栏设计的，基于文本页面的HTML设 计 代 表大 事 件发展了超文本标记语言（HTML）规范Yahoo! (1996)1990s THE MID基于表单设计的网站在线网页设计表单布局可以创造出多栏目的网页，这扩大了基于文本的设计模式，更好的体现了内容组织与导航布局设 计 代 表大 事 件Yahoo! (2002)1990s THE LATE. FLASH的崛起.90年代后期，Flash开始吸引设计师们的眼球，许多网站是由表格设计和Flash元素相组合的设 计 代 表大 事 件Altavista (2002)2000s THE YEAR. CSS设计全面占领主流网页.1.层桑样式表（CSS）可将网页内容与样式分离2.利用CSS控制Web页面的外观，如背景色，文本大小等可以都可以自定义，而不是沿用HTML网页本身3.可以定义多页结构，省去了为每页创建新的标记结构的麻烦设 计 代 表大 事 件2000s THE EARLY TO MID. JavaScript的崛起.1.网页设计师开始舍弃表格转而使用JavaScript来布局页面2.JavaScript成功将智能添加到了网页中。利用它，设计师可以在没有Flash的情况下使用动画菜单计算机数据设 计 代 表大 事 件Apple (2000)2000s THE MID. The Semantic Web.1.语义网掀起了网页设计热潮，旨在让计算机能同时像使用者一样了解网页2.W3C通过语义网使得计算机充满灵性色彩，能够理解人类的需求，并且能够执行繁琐的运算与程序以满足用户各种需求，并且用户可以毫不费劲的享受其带来的功能3.语义网的设计师试图通过插入机器可读的元数据网页和与之相关的超链接来实现这一目标，从而使得计算更好的识别网页设 计 代 表众多的技术被相继的开发出来，以满足设计师更多的需求2000s THE LATE. WEB 2.0 .1.在21世纪后期，网页设计开始走向交互内容和应用程序2.基于Web2.0，设计师为了更好的传递内容开发应用程序，因而对JavaScript和XML给予了极大的关注与重视设 计 代 表大 事 件移动网页1.2008年移动访问量首次超过互联网。自此，越来越多的网页开始选择设计移动版本的页面2.移动网页包办了最基本的页面布局，提供用户浏览主要信息，并注重于于东客户端的兼容性设 计 代 表大 事 件响应式网页1.流动布局（fluid grid）是一种自适应的网格布局，其中每个元素都可以yogaCSS语言根据屏幕分辨率按比例缩放，不需要进一步的结构或后端编码2.触摸屏，重力感应横竖屏幕切换，手势控制等案例时的苹果官网主页主页看起来就和一份彩色报纸一样Mac OS 8的设计1998当时的苹果主打的iMac产品为iMac G3，也就是电影《乔布斯》结尾处乔纳森手稿上的那台线条流畅，充满浪漫主义气息的半透明外壳的一体机1998年时，苹果对自己的官网进行了大幅精简，并在主页用大量空间突出了全新iMac的广告，苹果在官网上力推当时最新推出的iBook系列笔记本电脑。我们将这款线条柔和色彩活泼的笔记本亲切的称为“贝壳机”。苹果的台式机和笔记本产品线全部更新换代，在乔布斯和乔纳森的主导下，苹果几乎全部产品线，都开始在工业设计上融入多彩的元素，使用晶莹剔透的高品质工程塑料来制作外壳。在99年的这张网页截图上，我们可以看到底部中央的AirPort和左侧的高端工作站 Mac Pro G3 也使用了同样的设计语言。1999Mac OS 9也在同年推出，设计上延续了Mac OS 8。但是在用色和字体上看出，这一次的升级在视觉上更加现代了，图标和UI控件的细节打磨得更加细腻了时，苹果在自己的官网主页设计了一个顶部导航栏，而这一设计一直沿用到了现在。更令人难忘的是顶部导航栏所制作出的水滴质感，也许我们今天看并没有太深的感受，但是这种名为Aqua（拉丁语，水）的设计风格，是整个UI设计发展史上的一个重要里程碑。2000Mac OS X DP2，第二个开发预览版Mac OS X DP3，第三个开发预览版苹果在UI设计上开始从打磨水滴质感开始“抄现实”，拟物化设计之路也由此展开。2001将左上角的红色苹果Logo更换成了蓝色的水滴风果一直在官网最显著的位置以巨大的空间着重推荐自己的最新产品。苹果在网页设计上不再拘泥于白色背景+产品图的经典搭配，更具包容性。2007苹果再次对官网的顶部导航栏进行了重新设计，而