`
天梯梦
  • 浏览: 13733679 次
  • 性别: Icon_minigender_2
  • 来自: 洛杉矶
社区版块
存档分类
最新评论

九张 Gif 图回顾 Web 设计的 25 年历史

 
阅读更多

Froont,一家为web设计师制作工具的旧金山公司,用9个GIF格式动画来表现网页设计在过去25年的发展历程。如果你想知道为什么CSS这么重要,为什么Flash会逐渐淘汰,这些动画图或许能让你一窥究竟。

九张 Gif 图回顾 Web 设计的 25 年历史

网页设计的单色时代,约1989年。想想Lynx和其他以Unix为基础的web浏览器,这些浏览器只会通过网络从这个终端到另一个终端一个字一个字地蹦出来。没有图形用户界面,只有一串字母和一个闪烁的光标。

九张 Gif 图回顾 Web 设计的 25 年历史

现代化的开始,约1995年。第一个浏览器,例如Mosaic,允许设计人员在网站上显示图片,但是唯一的方法是将这些网页元素丢进不雅的表格布局中。由于这真的很难精确定位,所以设计师得琢磨地非常清楚如何写好表格嵌套表格再嵌套表格的代码以便正确显示内容。

九张 Gif 图回顾 Web 设计的 25 年历史

幸运的是,JavaScript出现了,为设计师提供了很大的便捷。Flash让我们创建动态网站的设计更为简便:例如,弹出窗口和在页面上动态修改内容顺序。但是相较于本地HTML,JavaScript速度很慢。

九张 Gif 图回顾 Web 设计的 25 年历史

尽 管Flash也曾风靡一时,但是现在几乎已经被HTML5干掉了,但是在1996年,它代表了网页设计的一个新高度:能够让设计师按他们自己的方 式使得页面生动起来。这也是Froont飞出页面和开场动画等的黄金时代。但是,Flash会占用计算机大量的处理资源,这也使得它成为一种特别不友好的 技术,尤其是对于移动设备例如笔记本电脑和智能手机而言。

九张 Gif 图回顾 Web 设计的 25 年历史

CSS,首次发布于1998年,解决了很多早期的web设计问题。通过将网站美观度从网页内容中剥离出来,设计师终于可以按照自己的想法制作或者为客户定制网页了。虽然最早的CSS版本不是非常灵活,但是现在的CSS已然成为了设计师需要掌握的最重要的网络技术。

九张 Gif 图回顾 Web 设计的 25 年历史

2007年iPhone的问世给设计人员带来了一个全新的难题:如何在智能手机这个更小的屏幕上设计网页?一开始设计人员想到的是使用一种网格系统,这种网格系统可以根据设备屏幕的尺寸将网页分割成若干列。

九张 Gif 图回顾 Web 设计的 25 年历史

2010年,对于如何在移动设备显示网页的问题,Ethan Marcotte想到了另一种解决方案:响应式设计。

九张 Gif 图回顾 Web 设计的 25 年历史

在响应性设计之后,一种撇去华丽效果重视内容的扁平化设计也出来了。这种设计简化了视觉元素,通过突出漂亮的字体来创建web体验,而且显示在任何设备上的效果都非常棒。

九张 Gif 图回顾 Web 设计的 25 年历史

至于未来会如何?Froont表示,更好的web设计还在研究开发中。以后,设计人员将不需要再担心浏览器的兼容性问题,各种适用于任何设备的工具也都随手可得。以后的技术将不会再成为设计的限制,设计师可以集中精力解决UI和UX问题,而不是把时间浪费在排除故障上。

如果你喜欢这些动画,欢迎为我点赞。

 

本文转自: 九张 Gif 图回顾 Web 设计的 25 年历史

 

 

 

 

 

 

 

 

 

分享到:
评论

相关推荐

    WebColor for Palm V0(配色工具).zip

    1. **webcolor2.gif**:这可能是软件的图标或者示例图像,展示了WebColor在设备上的界面或使用效果,让用户对软件的外观和功能有个直观的认识。 2. **webcolor.html**:这可能是软件的在线帮助文档或介绍页面,包含...

    php 图片目录直读+ flash 显示图片

    本文将深入探讨如何使用PHP实现图片目录直读,并结合Flash技术来动态显示这些图片。 一、PHP图片目录直读 ...了解这些历史知识可以帮助我们更好地理解Web开发的演变,同时也能提高我们在实际项目中的技术选择。

    阳光青春全站 2005 第四版

    【阳光青春全站 2005 第四版】是一个早期的网站开发资源包,它包含了丰富的源代码和相关资料,适用于对Web开发感兴趣的人群,尤其是初学者和那些希望回顾早期互联网设计与开发历史的专业人士。这个压缩包可能是为了...

    国外FLASH整站源文件

    标题中的“国外FLASH整站源文件”指的是一个包含完整Flash网站设计的源代码包,源自海外,用于展示或学习Web页面的动态效果和交互设计。Flash作为一种曾经流行的网页动画和交互设计工具,允许设计师创建丰富的多媒体...

    IE6 PNG图片 BUG

    在IT行业中,尤其是在网页设计和前端开发领域,IE6(Internet Explorer 6)与...随着技术的进步,如今的浏览器已经更好地支持PNG和其他高级特性,但回顾这些历史问题可以帮助我们更好地理解Web发展的历程和现在的标准。

    猫和老鼠的flash动画作业

    虽然现代Web已逐渐转向HTML5,但Flash在教学和历史回顾中仍具有价值。 2. **矢量图形**:Flash基于矢量图形,这意味着图像可以无限放大而不会失去清晰度,这使得Flash动画在不同尺寸的屏幕上都能保持高质量。 3. *...

    flash实用工具

    在IT行业中,Flash是一款历史悠久且曾经广泛应用于网页动画制作、交互设计及教育领域的软件。"Flash实用工具"可能指的是与Adobe Flash相关的辅助程序或者插件,这些工具旨在提高用户在创作Flash内容时的效率和质量。...

    OA办公自动化系统(含论文)源码

    2. **单位通知**:系统能够发布和管理单位内部的通知公告,确保信息的及时传递,同时支持公告的查阅历史,方便员工回顾重要信息。 3. **工作日志**:员工可以记录每日的工作内容,形成工作日志,便于个人反思和上级...

    上传图片的flash2.0插件源码

    在深入解析上传图片的Flash 2.0插件源码之前,我们先简要回顾一下Flash技术及其在Web开发中的应用背景。Adobe Flash是一款广泛应用于创建动画、桌面应用、游戏以及网页交互元素的强大工具。然而,随着HTML5的兴起,...

    colorpad.rar 非常好用的取色器不管对程序员还是美工推荐

    同时,它还提供了颜色历史记录,方便用户回顾和复用先前选取的颜色。对于编程人员来说,ColorPad还可以生成代码段,直接复制到项目中,省去了手动转换的麻烦。 总的来说,无论你是编程新手还是经验丰富的设计师,...

    Borland Delphi v5.0 企业版

    《Borland Delphi v5.0 企业版:编程技术与历史回顾》 Borland Delphi v5.0 企业版是一款历史悠久且深受程序员喜爱的集成开发环境(IDE),它代表了20世纪90年代末至21世纪初软件开发的一个重要里程碑。这款工具以...

    static-2013:2013 年活动网站的静态副本

    4. **图像和其他资源**:包括.jpg, .png, .gif等格式的图片,可能还有.svg矢量图,以及字体文件(.ttf, .otf)用于自定义网页字体。 5. **图标集**:可能包含.ico文件,这是网站的favicon,显示在浏览器的地址栏和...

    flash10.1兼容文件

    标题中的“Flash10.1兼容文件”指的是与Adobe Flash Player 10.1版本兼容的各类文件。Adobe Flash Player是一款广泛...然而,对于那些依赖Flash技术的历史内容,这些兼容文件仍然是回顾过去互联网发展的重要参考资料。

    计算机应用能力测试卷整理.pdf

    1. 围绕“国庆60周年”的短文应描述庆祝活动、国庆的意义以及对国家发展的回顾和展望,分三个段落进行,如历史回顾、当下繁荣和未来展望。 2. 文章编辑排版的具体要求包括:添加标题,使用“华文新魏”字体,字号2...

    人物介绍flash网站模板

    【标题】"人物介绍flash网站模板"涉及到的IT知识点主要包括Flash技术、网页...随着HTML5等现代网页技术的发展,虽然Flash的使用已经减少,但对于回顾过去的设计趋势和技术,这样的模板仍具有一定的历史价值和学习意义。

    ajax实现文件上传

    在探讨 AJAX 如何实现文件上传之前,我们首先简要回顾一下 AJAX 的历史背景及其带来的变革。AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。这项技术的...

Global site tag (gtag.js) - Google Analytics