[译] 设计一个页面原则上应该指的是编写 HTML 和 CSS

栏目: CSS · 发布时间: 5年前

内容简介:在 90 年代后期的互联网泡沫期间,我做了一堆 Photoshop 切图工作。如你所知,设计师将 PSD 文件切片后交给切图仔拼接到 HTML 上,这很悲惨。这些 mock 式的设计总是专注于像素的完美契合,但这却逐渐歪曲和偏离了 web 的本质。间隔像素,还记得吗?我们制作网页的原材料,特别是 HTML,到后来的 CSS,都在做着他们本不该做的事情。后来很幸运的是我能与真正了解 HTML 和 CSS 的设计师合作。这启示了我,不仅让我感觉设计

在 90 年代后期的互联网泡沫期间,我做了一堆 Photoshop 切图工作。如你所知,设计师将 PSD 文件切片后交给切图仔拼接到 HTML 上,这很悲惨。

这些 mock 式的设计总是专注于像素的完美契合,但这却逐渐歪曲和偏离了 web 的本质。间隔像素,还记得吗?我们制作网页的原材料,特别是 HTML,到后来的 CSS,都在做着他们本不该做的事情。

后来很幸运的是我能与真正了解 HTML 和 CSS 的设计师合作。这启示了我,不仅让我感觉设计 是网页的一部分 ,而不是 一味的堆叠 ,给我的体验始终更好。我们更少地关注它的呈现,更多专注它的作用。

我认为这在很大程度上归功于它是真实的。设计与真实 HTML/CSS 代码协作的反馈回路,因为它注定之后要被部署,为设计师提供来自现实世界的反馈来使其更好。而设计师有能力自己完成工作这一事实将会使反馈的回路更短。如果没有做出改变,就会要求其他人实施改变,思考其有效性,然后不断重复这一过程,这就是改变、检查、改变、往复循环的流程。

有一段时间,我感觉这几乎是常态。局限于 Photoshop 模拟图像的网页设计师变得越来越罕见,他们在使用他们的资源方面变得越来越好。

但正如巨大的隔阂一文中指出的那样,退化却始终潜伏着,因为对于设计师这个行业而言直接去编写与 web 相关的工作是很困难的,某些需要使用 JavaScript 的才能实现的想法已经吓跑了一些设计师,这听起来就是一个讽刺。

在 Basecamp,网页设计师都会编写 HTML、CSS 以及必要的 JavaScript 和 Rails 代码!这意味着他们可以完全独立地在真正的应用程序里复现他们的设计理念!很多时候,JavaScript 和 Rails 代码在与 程序员 进行简短的咨询后都可以直接上线。

其他时候编程工作涉及更多,专职程序员将与其结对完成要上线的功能。我没法用言语形容与知道页面设计有哪些限制的设计师合作有多么愉快,并且我们可以做完比起任何一个人更多的工作。当你在基本面上重叠时,你会更频繁地在同一页面上。(虽然我们仍然交易让步!)

我们有可能找到这样优秀的独角兽设计师吗?也许,我猜?比如谁呢?斯科特、JZ 、康纳、乔纳斯、瑞安和杰森通过在工作中不断的投入,在今天都成长为了这样的设计师。不要被他人的轻视或者像“这对他们来说太难了”的废话影响。

如今这个问题也与 我们 如何制作网页有关。Basecamp 是著名的,也可以说不太出名的一家,这主要取决于你问的是谁,那是一家不愿意迎接重量级 SPA 的复杂新世界大门的公司。我们使用服务器端渲染,并使用 Turbolinks 和Stimulus 构建。设计师采用的所有 工具 都是容易上手和且实际的,因为设计师主要关注的是 HTML 和 CSS,以及一些用于交互的 JavaScript。

它并不像是一个秘密!实际上,我们在 Basecamp 开发的允许设计人员以这种方式工作的框架都已经开源。虽然现在对设计师而言,JavaScript 的环境并不友好,甚至像是一场人为的灾难,但也仍然可以做出不同的选择并达到不同的设计。

有一件事是肯定的:我不会回到过去!不要回到设计师的黑暗时代,他们无法使自己的设计独立工作,无法直接改变,也无法将它们部署上线!

我同样不感兴趣的是回到你需要一个由极少人组成的专家团队来完成任何工作的想法。那种“全栈”在某种程度上是一种讽刺而不是使设计师自给自足。设计师对他们的创造力的概念要求负担过重,他们应该被鼓励去学习如何在使用网站开发的原材料(HTML、CSS 和 JS)去呈现自己的想法。全栈那样的想法就不用了,谢谢!

设计一款现代化的网页,通过令人愉快的设计取悦用户,这并不是难以理解的复杂迷宫。我们正是这样做的!

如果发现译文存在错误或其他需要改进的地方,欢迎到 掘金翻译计划 对译文进行修改并 PR,也可获得相应奖励积分。文章开头的 本文永久链接 即为本文在 GitHub 上的 MarkDown 链接。

掘金翻译计划 是一个翻译优质互联网技术文章的社区,文章来源为掘金 上的英文分享文章。内容覆盖 AndroidiOS前端后端区块链产品设计人工智能 等领域,想要查看更多优质译文请持续关注 掘金翻译计划 、官方微博、 知乎专栏


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

产品的视角:从热闹到门道

产品的视角:从热闹到门道

后显慧 / 机械工业出版社 / 2016-1-1 / 69.00

本书在创造性的提出互联网产品定义的基础上,为读者提供了一个从0基础到产品操盘手的产品思维培养方法! 全书以互联网产品定义为基础,提出了产品思维学习的RAC模型,通过认识产品、还原产品和创造产品三个阶段去培养产品思维和产品认知。 通过大量的图片和视觉引导的方法,作者像零基础的用户深入浅出的描绘了一条产品经理的自我修养路径,并且提供了知识地图(knowledge map)和阅读雷达等工具,......一起来看看 《产品的视角:从热闹到门道》 这本书的介绍吧!

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具