• 意见反馈中国国家地理网 2019-05-17
  • 网络智库:假如这些山西品牌都还在 2019-05-17
  • 张江汀孟凡利现场调度部署应对强对流天气工作 2019-05-15
  • 面向人才专配公租房共有产权房 2019-05-06
  • 西部网(陕西新闻网)www.cnwest.com 2019-05-06
  • 谢谢这位家长,不然这位雨中护送高考生的交警还没有人知道呢 2019-05-05
  • 海外媒体聚焦消夏节 清爽长春润五洲 2019-04-25
  • 东城区领导资料库--北京频道--人民网 2019-04-25
  • 深改组1000天——亚心网专题 2019-04-21
  • 云南金平上亿蝴蝶破茧而出 涧水悠悠蝴蝶翩翩 2019-04-21
  • 安徽加大就业脱贫力度 确保贫困户至少一人就业 2019-04-20
  • 世界杯黄历:日本换帅对战黑马“小哥” 2019-04-13
  • 精兵劲旅·血脉赓续:第79集团军——忠诚有魂  转型重塑开新局 2019-04-10
  • 安徽网记者实拍2018全国高考合肥现场 2019-04-10
  • 西安外事学院在省茶艺大赛中创多项佳绩西安外事学院-陕西教育新闻 2019-04-09
  • 也想出现在这里?联系我们

    1989-2014 网页设计的演变

    2015.02.10 建站相关
    • 文章介绍
    • 升级版本
    • 评价&建议
    也想出现在这里?联系我们

    天津快乐十分预测号码 www.vtwx.net 估计很多做网页的同学还不了解网页的历史,它是什么时候出现的?而那时的网页又是怎样子的呢?

    如果想了解下网页设计的简史,请往看吧,我建议每位网页设计师都应该看看哦!

    1989年:黑暗时代的网页设计

    webdesign01

    当时的网页设计让你不“极简风”也很难,屏幕背景是黑色的,没有图像,只有单色像素风格的纯文字,而那里的设计是通过符号+制表(Tab键)来制作。

    1995年:开始表格式网页设计

    webdesign02

    浏览器的出现使网页设计迈向一大步,它可以让网页显示图像。当构建信息时,通过HTML表格来排版布局,尽管我们知道表格主要目的是构建数字,但它仍然被流行使用了很长一段时间。当设计师制作花哨的布局时,为解决这问题,最佳方法就是切片 + 表格来完成。

    当时表格也有它的好处,比如垂直对齐、可设置像素单位及百分比的功能来制作网格布局。

    1995年:JavaScript 扩展表现范围

    webdesign03

    JavaScript 可以解决HTML一些局限性,比如,需要一个弹提示,这时就需要JS来实现了。那时背景图像、GIF动画、闪字、计数器等工具迅速成为网页必须的噱头。

    1996年:自由的黄金时代 – Flash

    webdesign04

    FLASH,一个突破性的技术出现,打破现有网页设计上的局限,设计师在设计形状、布局、互动以及一些很棒很弦的动画都可以在这一个工具上执行,完成后只是一个单独的文件输出,并能显示在浏览器中。用户浏览它时需要安装插件并等待FLASH加载完成后方可浏览。

    FLASH的功能确实很棒,可惜,它对搜索引擎不太好了,并且消耗了大量的处理器功能。2007年苹果在第一个iPhone时就决定放弃使用他们,而接着Flash开始没落(至少在网页设计方面)。

    1998年:CSS 层叠样式表

    webdesign05

    大约和Flash同一时间,一种更好的设计结构技术诞生: ?层叠样式表 CSS (Cascading Style Sheets)。这里的基本概念是将网站内容和表现分开,所以它的外表和格式都在CSS中定义。

    CSS的第一个版本很不灵活,但最大的问题是浏览器的兼容性,不同浏览器对CSS的支持不一样,这个花了好几年的时候才得到改进。需要明确的是CSS不是一个程序言语(coding language),这相当一个声明性的语言。

    2007年:混乱的移动 – 网格和框架

    webdesign06

    手机网页本身就是一个挑战,除了各种不同设备对应不同尺寸的布局,它的内容应该和小屏幕上的相同或是单独剥离出来?是否添加广告到小屏幕上?访问速度也是问题,因为内容太大,访客浏览网页慢、流量增加,从而成本也增加。

    第一步改进是使用栅格的概念,各种栅格系统的诞生,最终960栅格系统胜出,而这12列栅格被设计师经常使用。

    接下来步骤就是标准化形状、导航、按钮等常用元素,将其规范起来,以实现更简单且可重复使用?;旧?,就是制作一个包含其代码的视觉库。在这里,Bootstrap?和?Foundation?胜出,它被用在许多网站和APP应用上。缺点就是使用这个框架的外观往往看起来像一样的,而设计师不知道的代码是如何工作的。

    2010年:响应式网页设计(Responsive Web Design)

    webdesign07

    2010年?ETHAN MARCOTTE 提出响应式网页设计以实现不同的布局,这也是响应式网页设计的起源。技术上, 我们依然是用HTML和CSS来编写。这意味着响应式设计可以在大量的布局中使用,主要优点就是相同的Web站点可以工作在桌面电脑、移动手机端,而不需要再独立一个手机端出来。

    2010年:扁平化的时代

    webdesign08

    设计一些布局需要大量的时间,幸运的是我们决定抛弃界面上那些花哨的装饰元素(如3D、阴影效果、纹理材质),并回归到根的设计,优先专注内容。精美的摄影图像、插图、排版、易于使用的布局是我们现在应该考虑的。简化可视元素仅仅是扁平化设计过程的一部分,重要的是该以内容为中心。把光泽的按钮换成图标,并使用SVG或图标字体。

    2014年:网页设计的未来是光明的

    webdesign09

    到现在为止,网页设计的目的是呈现视觉信息,这是在浏览器中展示。设计师搬东西在屏幕上时,请试着想像一下,它能否用简约代码编写,我意思不是改变事物的秩序,但要有充分的灵活性和控制性!请尽量想象,这样开发者不必担心浏览器的兼容性,可以专注解决实际问题。

    目前还有些新的技术,如CSS3出现新的VH, VW单位(视窗高度和宽度)可以更灵活的定位元素。它还解决了一直困扰许多设计师问题:为什么CSS垂直居中这么难。Flexbox是另一个新概念技术,也许未来你会使用它来布局页面。

    关于Web的未来,你有什么看法?

    • 2015.02.10初次和大家见面了!

    已拥有1人对该主题的建议

    1. 沙发
      聖君同學:

      时代的变迁。。。(扁平化好看)

      2016-10-16 下午 2:43 [回复]

    发表评论

    还能输入240个字
    也想出现在这里?联系我们
    wordpress香港主机

    Hi, 欢迎加入Wordpress技术交流群,带你装逼带你飞!

    我要入群
    也想出现在这里?联系我们
    wordpress爱找主题推荐
    也想出现在这里?联系我们
    wordpress主机推荐
    也想出现在这里?联系我们

    我来推荐一个更牛逼的给你看看?

    • 猛戳我吧
  • 意见反馈中国国家地理网 2019-05-17
  • 网络智库:假如这些山西品牌都还在 2019-05-17
  • 张江汀孟凡利现场调度部署应对强对流天气工作 2019-05-15
  • 面向人才专配公租房共有产权房 2019-05-06
  • 西部网(陕西新闻网)www.cnwest.com 2019-05-06
  • 谢谢这位家长,不然这位雨中护送高考生的交警还没有人知道呢 2019-05-05
  • 海外媒体聚焦消夏节 清爽长春润五洲 2019-04-25
  • 东城区领导资料库--北京频道--人民网 2019-04-25
  • 深改组1000天——亚心网专题 2019-04-21
  • 云南金平上亿蝴蝶破茧而出 涧水悠悠蝴蝶翩翩 2019-04-21
  • 安徽加大就业脱贫力度 确保贫困户至少一人就业 2019-04-20
  • 世界杯黄历:日本换帅对战黑马“小哥” 2019-04-13
  • 精兵劲旅·血脉赓续:第79集团军——忠诚有魂  转型重塑开新局 2019-04-10
  • 安徽网记者实拍2018全国高考合肥现场 2019-04-10
  • 西安外事学院在省茶艺大赛中创多项佳绩西安外事学院-陕西教育新闻 2019-04-09
  • 福彩中奖新闻事件 即开型福彩中奖率低 时时彩直播软件 江西多乐彩跨度走势图 双色球专家杀号 山东群英会20选5走势图 欢乐生肖彩票 4场进球中奖规则 安徽时时彩开奖走势图表 时时彩分析软件 pk10精准实用7码公式 体彩大乐透20选5 1987年美国彩票大奖 排列5走势图带连线图表 时时彩走势图老时时彩 体彩14场胜负对阵表