台州页面设计:设计师网页设计简史

作者:台州市久谦网络科技有限公司 浏览: 发表时间:2021-10-20 09:39:06

台州页面设计:设计师网页设计简史

用代码实现网页设计草稿需要很多复杂的方法。当我意识到这一点时,我对网页设计感到厌烦。似乎每个简单的网页问题都有太多的解决方案,但每个解决方案在某些浏览器中可能无法正常工作。有一件事总是让我困惑。为什么要把工作分为设计和编写代码?为什么现在难的事情变简单了,简单的事情却有更多的困难?因此,与其争论设计者是否应该学习编程,或者开发人员是否应该能够设计,不如让我们首先就互联网是如何发展的,以及我们应该如何弥合代码和设计之间的分歧达成共识。

互联网设计之前的黑暗时代(1989)。

互联网设计的开始相当黑暗,屏幕真的很暗,只有几个单色像素在它们之间闪烁。只有字符和制表符(制表符)可以用作设计。所以,让我们快进到图形用户界面成为互联网主流的时代,那是用表格写网页的开创性时代。

表-开始(1995年)。

我们所知道的网页设计起源于可以显示图片的浏览器的诞生。HTML语言中现有的表概念是最接近结构化信息的解决方案。当时的网页设计是用表格覆盖表格,用巧妙的方式覆盖一堆静态单元格和动态单元格。这种方法源于大卫·西格尔的《创建黑仔网站》一书。表格最初是用来做结构化数字的,用它们来处理布局感觉是不对的,但在当时还是设计网页的常用方式。随之而来的问题是,维护这些脆弱的结构特别困难。也是在这个时代,“剪图”一词开始流行。设计师可以设计很酷的布局,但是对于开发者来说,他们还是需要想办法把它切成小块,这样设计才能实现。同时,表格也有一些很棒的特性,比如能够根据像素或百分比垂直对齐元素。这样做的好处是,它是当时最接近网格设计的方法。当时很多开发者都认定自己累了,不喜欢前端开发。

JavaScript增援部队抵达(1995年)。

JavaScript是对HTML局限性的回答。比如一个弹出窗口动态调整某件事的顺序?然后使用JavaScript。但是JavaScript的主要问题是在整个网页结构上又增加了一层,只能独立加载。懒惰的开发人员经常使用它来制作一个简单的补丁,但是如果使用得当,它是极其强大的。如今,如果我们可以用CSS实现一个函数,我们将避免使用JavaScript,但是这种语言仍然处于稳定的位置,无论是对于前端(例如,使用JQuery)还是后端(Node.js)。

自由发展的黄金时代-flash (1996)。

一项新技术诞生了,它承诺了前所未有的自由,打破了过去网页设计的局限。设计师可以随意使用各种形状、布局、动画、交互和字体,所有这些都只需要一个工具,那就是flash。工作完成后,打包一个文件并将其扔给浏览器进行显示。如果用户安装了最新版本的flash插件,并且有耐心等待加载,flash就会像变魔术一样发挥作用。这是推出页面、打开动画和各种互动效果的黄金时代。可惜flash不够开放,不利于搜索引擎抓取,尤其吃处理器。当苹果在2007年决定在第一部iPhone上禁用flash时,至少在网页设计领域,这项技术开始衰落。

CSS(1998)

与flash同时,从技术角度来看,结构设计的解决方案诞生了:级联样式表(CSS)。它的基本思想是将内容与呈现分开。因此,视觉和格式由CSS定义,内容由HTML定义。第一个版本的CSS远不灵活,但更大的问题是有多少浏览器支持它。多年后浏览器开始全面支持CSS,总有bug。在这个时代,一个浏览器往往支持最新的功能,而另一个却不支持,这对开发者来说是一场噩梦。说白了,与其说CSS是一种编程语言,不如说是一种声明语言。网页设计师应该学习编程吗?也许吧。那么他们应该理解CSS是如何工作的吗?当然可以!

移动互联网的崛起:网格与框架(2007)。

在手机上浏览网页本身就是一个挑战。除了每个设备的布局不同之外,在内容一致性上也出现了新的困难:设计应该在小屏幕上保持一致还是应该简化?如何在这么小的屏幕上显示那些四处闪烁的小广告?加载速度也是一个问题,加载大量内容会快速烧掉大量流量费用。改进的第一步是一列一列的网格。经过多次迭代,960网格系统胜出,网格除以十二列成为设计师的日常套路。下一步是标准化常见元素,如表单、导航和按钮,并使它们可重用。简单来说,就是做一个可视化元素的库,所需的代码已经包含进去了。Bootstrap和Fountation等前端开发框架是赢家,网页和应用程序之间的界限逐渐模糊。代价是设计变得相似,如果不理解代码是如何工作的,设计师很难掌握这些技术。

响应式网页设计(2010)

一个叫伊桑·马科特的智者决定用现成的内容和不同的布局来挑战现有的方法。他的方法被称为响应设计。在技术上,我们仍然使用HTML和CSS,所以这个设计是一个概念的演变,尽管仍然有许多误解。对于设计师来说,响应意味着复制多种布局;对于需求方来说,就是:“这个东西可以用在手机上”;对于开发人员来说,这意味着如何访问图片、下载速度、页面的语义元素、移动或桌面的优先级等等。主要优势是内容一致性,即一个网站可以在所有设备上工作。我希望我们至少能在最后一点上达成一致。

平面之年(2010)

设计多个布局需要更多的时间。好在我们决定简化流程,去掉酷影效果,重视内容的优先级,回归设计的原点。精美的照片、字体、锐利的矢量插图和周到的布局,这就是我们现在正在做的。简化视觉元素,做所谓的“平面设计”也是这个过程的一部分。这种设计的好处是我们可以更好地思考文案,信息和内容的水平。那些有高光的按钮换成了图标,这也让我们可以使用矢量图片和图标;同时,线上字体也提供了精美的排版。有趣的是,网页设计再次接近它诞生时的样子。当然,青春是永远不会浪费的。

光明的未来(2014)。

曾几何时,网页设计的圣杯只是试图让东西在浏览器中准确显示。想象一下未来,如果设计师能直接把元素放在屏幕上,清晰的代码就自己写了!我不是说未来就是颠覆现有的秩序,而是说如果设计师能够获得足够的灵活性和掌控力。想象一下,工程师可以解决实际问题,而不是问浏览器兼容性!

许多新的技术概念正朝着这个方向发展。CSS中的新单位,比如vh和hw(地平线的高度和宽度),可以让人们灵活地控制元素的位置,也可以解决困扰很多设计师的问题:为什么CSS中元素垂直居中这么难?Flexbox是CSS中另一个很酷的概念,它允许我们在不输入一堆代码的情况下轻松设置布局的属性。最后是“web组件”,这是更大的努力。由相册、登记表等一组元素打包而成。它提供了一个更简单的工作流程,并帮助我们将页面元素转化为构建网页的部分,这些部分可以很容易地重用和独立修改。


台州页面设计:设计师网页设计简史
长按图片保存/分享

台州市久谦网络科技有限公司  版权所有

 Copyright © 2020 All Rights浙ICP备2020041870号-1 Reserved      网站地图

台州市久谦网络科技有限公司  版权所有 

Copyright © 2020 All Rights Reserved 浙ICP备1245789785号-1      网站地图

添加微信好友,详细了解产品
使用企业微信
“扫一扫”加入群聊
复制成功
添加微信好友,详细了解产品
我知道了