资讯专栏INFORMATION COLUMN

《CSS设计指南》作者Charles Wyke-Smith:技术的目的就是帮助用户获得成功

用户84 / 3299人阅读

摘要:问预处理器的出现是否意味着开发者社区对有所不满你认为有哪些地方需要改变定义了可以做什么,而其他人制造工具让变得更好用。对于现在流行的预处理器,哪一个最好并没有共识,但是是使用更加广泛的一个。

  

非商业转载请注明作译者、出处,并保留本文的原始链接:http://www.ituring.com.cn/article/124049

Charles Wyke-Smith一直从事与线上应用相关的媒体相关工作。1980年代,他与人在旧金山共同创办了PRINTZ Electronic Design公司,当时可是一家全部工作都使用计算机处理的设计工作室。另外,他曾在富国银行、ESPN电子游戏担任领导和顾问工作,在Benefitfocus公司担任过用户体验总监。2009年,他与人合办了PeopleMatter公司,提供人力资源服务。目前,他是一家新的创业公司Bublish的CEO,这家公司提供图书策划等方面的服务。Charles是一位乐手和多本Web开发图书的作者,除了好评如潮的 《CSS设计指南(第3版)》,他还出版过Codin" for the Web, Scriptin" with AJAXVisual Stylin" with CSS3

问:《CSS设计指南》毫无疑问是同类书中的经典,你有升级这本书的打算吗?如果有新版的话,会增加什么内容?

  

我很想继续写新版的《CSS设计指南》——虽然我现在有很重要的工作任务,但是我一直都在坚持做笔记,可以肯定,大概在明年的时候我会开始写作下一个版本。下面是我将会加入到新版中的一部分内容:

使用Bootstrap——这个CSS框架能为你节省很多时间,特别是可以让识别页面栏的响应式网格更轻松地为不同屏幕尺寸设计页面。Bootstrap还能提供大量的界面组件,比如广告形式布局以及覆盖窗口。

使用Less——预处理器会让写CSS和管理CSS变得十分简单,可以参见我对后面问题的回答。

使用jQuery——为了创造出更加复杂的用户界面交互以及在页面和服务器之间传递数据,把jQuery和CSS结合起来是是一种必备技能。

问:在你的书中你曾经说过“曾经的梦想如今已成为现实”这些梦想是什么?什么让CSS3如此强大?对于设计师和程序员,这样的改变意味着什么?

  

在CSS进化过程中实现的梦想究竟是什么?最重要的进展莫过于CSS现在已经可以提供完全把页面(HTML)结构和式样(CSS)拆解开来的功能。这种功能使得在响应式设计的过程中,依赖于展示位置(比如不同尺寸的大小屏幕)的HTML可以使用不同的式样。CSS3同时还提供了精致的HTML选择功能。比如,现在可以把CSS定向到列表中的最后一项,所以就可以把元素精确地定位到页面上,或者可以把多图展示性地使用在一个元素的背景中,而不需要加入到HTML当中。这就意味着内容现在已经是可以移植的,所以,展示在不同网站的HTML能够以各不相同的风格呈现出来。这是内容聚合成功的关键。

问:网页设计的思维和编程的思维有什么区别?

  

设计是为一个问题找到解决方案,而编程则是执行那个设计,将其实现。

问:有很多种CSS预处理器,比如Sass和LESS,何时是使用这些工具的最佳时机?什么时候应该使用纯粹的CSS?

  

使用这些预处理器的合适时机就是现在!它们能为你节省一大把时间,让你的代码可读性更强而且写起来也更快。预处理器让你可以用更简洁的方式写CSS,而且可以让选择器和HTML的嵌套搭配,所以你能够轻松看到内部的进程。你也可以为你的设计中经常出现的颜色和类定义变量,所以你可以为——比如说框边界,设置一个多带带的定义。从此你不需要为每个框键入式样,你可以直接使用类的名称。

问:预处理器的出现是否意味着CSS开发者社区对CSS有所不满?你认为CSS有哪些地方需要改变?

  

W3C定义了CSS3可以做什么,而其他人制造工具让CSS变得更好用。对于现在流行的预处理器,哪一个最好并没有共识,但是Less是使用更加广泛的一个。我认为不满可以驱动创新,很明显,Less诞生于“让写CSS变得更有效率”这个需求。未来很有可能Less的编码风格会变成写CSS的标准方式。

问:对于已经掌握CSS(3),Sass,Bootstrap,CSS Sprites这些工具的资深前端程序员,你建议他们下一步在哪方面提升自己?

  

我对类似的程序员和设计师的建议是,不要只关注你的技能,而是要从全局思考,关注用户体验。诸如编程和平面设计这样的技能虽然重要,但也只是达到你想传达的体验的手段。比如说,程序员创造的Web页面总是试图把所有可以提供的数据都展示给用户,同时提供很多选项。这只是程序员在展示他的技能,而非帮助使用者。对于用户来说更好的方案,是把任务精心地分割成简单的步骤,仅仅展示过程中每一步需要的数据。

设计并不仅仅是视觉或者仅仅是编码——设计是为了解决问题。从这个角度上来说,平面艺术家和程序员都是设计师。我希望所有从事Web相关工作的人都用这个方式思考。

在Web上,好的设计意味着让用户接触到内容,以及赋予他们和内容交互的能力(做出选择,输入文本,播放视频,等等)。我们应该关注如何让用户达到目的——把任务和内容放在第一位,创造清晰而直观的工作流,提供可以指导用户在任务中找到方向的导航。

设计师通常会从平面设计开始,他们挑选颜色,选择图片,然后创造Photoshop页面布局。程序员们通常想要从数据结构建模和编写代码开始。但是更好的方法是从一张空白页面开始,首先应该组织内容以及通往内容的控件,然后加入刚刚好的视觉效果用来展示内容和元素之间的关系,最后,在品牌和风格化的外表上层稍加装饰。编程是在用户和服务器之间挪动内容的工作,同时应用控制进程的规则,所以编程也是支撑用户体验的工作。

换句话说,从理解用户开始,同时创造出你认为他们想要的体验。在纸上或者Balsamiq上画出你的想法,然后找几位目标使用者,在他们身上做测试。吸收他们的反馈,然后重新构造、重新展示,直到达到你想要的效果。如果你能够用这种方法沟通你的设计目的,而且使用者对他们所见很感兴趣,那么你就可以开始发展内容了,然后再通过代码和设计技巧用最以用户为中心的方式来传达内容。利用你的技巧让用户达到目的,而非炫技。好的设计是不可见的——用户不需要思考,而是马上就理解了他们可以完成的任务,而且在完成任务的过程中,对他们需要传递的东西有着充分的控制。

技巧很重要,而且不断的发展更新你的技巧也很重要,但是真正专业的程序员和设计师知道这些技巧的目的都是为了让用户获得成功。

问:你曾在很多不同领域以不同角色工作过。你是一位设计师,咨询师,一位程序员,甚至你曾在人力资源服务业和出版业工作。在这些工作的背后是否有一个共同的兴趣支撑着你?这些角色之间的联系是什么?

  

我每天工作的主题就是让人们达到目的。有人可能在寻找金融服务,找工作,或者想要写一本书。如果说我还算成功的话,那就是因为我设计线上产品的能力,在这些产品上人们可以很轻松很快捷地做到他们想做的事。我的技巧只是辅助我的工具,在其他任何语境下技巧的价值都微乎其微。我爱学习——如果你停止了学习并不停地重新发明自己,你将永远不会成功。教育对我来说是需要穷尽一生,每天都要做的工作。

问:电子书市场现在的发展状况怎么样?你对未来的期待是什么?

  

电子书一直处在进化的过程中——电子书越来越像Web(当然,电子书其实就是一堆HTML),电子书和Web的发展历程随着时间的推进,变得越来越像。纸质书不会消失,就像是电视来了,但是广播也没有消失一样。我所期待的电子书在未来会变得越来越具有交互性,而且作者会持续不断地更新电子书,而不是像纸质书一样,出版了之后就不会再改变。

问:作为Bublish的CEO,你们是如何解决图书市场存在的问题的?你以前的经验和知识是如何帮助你完成现在的工作的?

  

今天的作者也是市场专员——他们直接把自己的作品放在亚马逊和其他图书零售站点上。他们中的大部分人都没有出版社和代理商,他们必须要自己写作,也得自己做推广。Bublish像这些“创业作者”提供写作和社会营销的经验,帮助他们成功。我以前的角色和经历帮助我提出正确的问题,这个问题永远都是:我怎么让这些人成功起来?了解答案的最好方法就是去问他们自己,所以我需要做很多调查,努力走在市场的前面。如果你开始这样思考问题,那么你从事的行业就不那么重要了——你只需要观察和聆听,找到问题,然后你就会发现存在的机会,然后设计解决方案来解决这些问题。我也喜爱书——我是一位热心的读者,当然,也是一位作者,所以我对Bublish充满热情,我很享受设计网站和编写用户界面的过程。

最后,我要向我的中国读者们问好,感谢你们。得知我的书能在全世界范围内帮助别人让我感到无比地高兴!

更多精彩,加入图灵访谈微信!

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/110968.html

相关文章

  • 基础 - 收藏集 - 掘金

    摘要:的语言的动态性意味着我们可以使用以上种数据类型表示变换过渡动画实现案例前端掘金以下所有效果的实现方式均为个人见解,如有不对的地方还请一一指出。 读 zepto 源码之工具函数 - 掘金Zepto 提供了丰富的工具函数,下面来一一解读。 源码版本 本文阅读的源码为 zepto1.2.0 $.extend $.extend 方法可以用来扩展目标对象的属性。目标对象的同名属性会被源对象的属性...

    wuaiqiu 评论0 收藏0
  • 基础 - 收藏集 - 掘金

    摘要:的语言的动态性意味着我们可以使用以上种数据类型表示变换过渡动画实现案例前端掘金以下所有效果的实现方式均为个人见解,如有不对的地方还请一一指出。 读 zepto 源码之工具函数 - 掘金Zepto 提供了丰富的工具函数,下面来一一解读。 源码版本 本文阅读的源码为 zepto1.2.0 $.extend $.extend 方法可以用来扩展目标对象的属性。目标对象的同名属性会被源对象的属性...

    Tamic 评论0 收藏0
  • 技术甜品店 - 收藏集 - 掘金

    摘要:前端切图神器前端掘金安装前端的基础工作就是把设计师的设计稿还原成前端页面,所以切图是作为一个前端的基本技能。 腾讯 Web 工程师的前端书单 - 阅读 - 掘金作者:link 2014年一月以来,自己接触web前端开发已经两年多了,记录一下自己前端学习路上看过的,以及道听途说的一些书,基本上按照由浅入深来介绍。 JavaScript 入门 《JavaScript权威指南(第六版)》 ★...

    Gilbertat 评论0 收藏0
  • [译] 如何恰当地学习 JavaScript

    摘要:原文链接恰当地学习适合第一次编程和非的程序员持续时间到周前提无需编程经验继续下面的课程。如果你没有足够的时间在周内完成全部的章节,学习时间尽力不要超过周。你还不是一个绝地武士,必须持续使用你最新学到的知识和技能,尽可能地经常持续学习和提高。 原文链接:How to Learn JavaScript Properly 恰当地学习 JavaScript (适合第一次编程和非 JavaSc...

    Jason 评论0 收藏0
  • 学习资料 - 收藏集 - 掘金

    摘要:以下是通过年前端程序员必知单页面应用的核心前端掘金这几年里,单页面应用的框架令人应接不暇,各种新的概念也层出不穷。 实战实现一个h5转盘抽奖页面,谈谈代码实现,顺便谈一下优化和数据处理 - 掘金代码地址 前言 这个组件是我写过的关于移动端h5活动转盘抽奖的页面,当时写完之后确定挺好看、挺炫的,所以就把它单独出来了,以后再写类似的页面,可以参考其中的一些实现原理! 主要用到的技术 用Ma...

    marser 评论0 收藏0

发表评论

0条评论

用户84

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<