众妙之门

出版时间：2012-11  出版社：人民邮电出版社  作者：Smashing Magazine  页数：261  字数：268000  译者：贾云龙,王士强  
Tag标签：无  

内容概要

　　《众妙之门——网站UI设计之道(修订版)》是知名设计网站Smashing
Magazine上线以来的精华总结，来自全球的知名设计师无私地分享了他们多年积累的宝贵经验。全书共分10章，前8章讨论了和网站UI设计相关的八个不同的领域，覆盖面非常广，具有很强的操作性和专业性，全书逻辑严密、言简意赅，设计人员可以快速地找到自己想要的东西。第9章以访谈的形式介绍了多位专家对一系列重要问题的看法，入木三分，极富启发性。第10章以讲故事的方式，把Smashing
Magazine的创办和发展过程娓娓道来，同时毫不保留地分享了两位创始人的成功秘诀和价值观，让人受益匪浅。
《众妙之门——网站UI设计之道(修订版)》最大的价值在于它在传授具体经验的同时，也对设计思想和设计理念进行了深入的探讨，在“授人以鱼”的同时，不忘“授人以渔”。相信广大读者读完这本《众妙之门——网站UI设计之道(修订版)》，一定会有一种相识恨晚的感觉。

作者简介

Smashing Magazine是世界知名的顶级技术类博客，主要面向Web设计与开发人员。
成立于2006年9月的Smashing Magazine旨在向Web设计者和开发者提供优质创新的信息和最新的技术趋势。

书籍目录

第1章　现代网络应用中的用户界面设计
1.1　什么是用户界面(UI)
1.2　可视界面设计的工具箱
1.3　制作有效用户界面的实用技巧
1.4　结论
第2章　CSS布局的艺术和科学
2.1　固定宽度布局
2.2　自适应布局
2.3　动态网格布局
2.4　自适应的流式布局
2.5　弹性布局
2.6　混合布局
2.7　哪种布局最适合您的网站？
第3章　排版：原则、方针和常见错误
3.1　传统排版和网站排版
3.2　基本的排版术语
3.3　相对和绝对的字体尺寸单位
3.4　空白是最好的空间
3.5　排版和网格
3.6　垂直节奏
3.7　分级(Hierarchy)和分度(scale)
3.8　段落样式
3.9　通过字体设定版式
3.10　CSS字体库(CSS Font Stacks)
3.11　文本替换技术
3.12　@font-face属性
3.13　选择正确的字体
3.14　不要穿舞鞋登山
3.15　尺寸很重要
3.16　OpenType、TrueType还是PostScript Type
3.17　注意细节
3.18　对齐和连字符
3.19　总结
第4章　现代网站的可用性原则
4.1　用户如何思考？
4.2　使用整洁连贯的视觉设计
4.3　固定元素属于固定位置
4.4　搜索是简单的
4.5　链接要像链接
4.6　仅在必要的时候使用下拉菜单
4.7　使注册表单尽量简洁
4.8　考虑添加"返回页首"链接
4.9　尽可能地避免使用Splash页面
4.10　链接应该在同一窗口打开
4.11　你需要注意以下可用性检查点
4.12　传达你的网站的组织结构
4.13　使用标记来构建上下文
4.14　建立良好的导航
4.15　重要的易用性法则和原则
4.16　给用户一个5万英尺的视角来看你的程序
4.17　心理模式和象征物
4.18　组织网站的内容
4.19　提供站点地图
4.20　使用帮助
4.21　建立信任
4.22　不要让用户毁掉自己的用户体验
4.23　及早测试、经常测试
4.24　总结
第5章　网站设计、可用性和用户体验中超炫色彩终极使用指南
5.1　色彩学理论
5.2　色彩和易用性
5.3　色彩与注意力集中
5.4　色彩与体验
5.5　灵感
第6章　网站优化
6.1　你将会用到的工具
6.2　在IMG标签中表明正确的图片尺寸
6.3　减小图像的尺寸
6.4　服务器和内容分发网络
6.5　合并CSS和JavaScript
6.6　CSS放在顶部，而JavaScript放在底部
6.7　压缩CSS和JavaScript
6.8　使用外部CSS和JavaScript文件
6.9　选择一个文档类型
6.10　验证页面
6.11　不要使用CSS表达式
6.12　服务器部分
6.13　Apache：如何设置过期时间
6.14　YSlow中可以查看缺少expires header的报警
6.15　Lighttpd：如何设置过期头
6.16　Apache：如何配置ETags
6.17　Lighttpd：如何配置ETags
6.18　为PHP安装eAccelerator
6.19　MySQL Tuning Primer
6.20　启用透明压缩
6.21　尽可能避免重定向
6.22　如何探测长时间跳转链？
6.25　完整的链接
6.24　避免死链接
第7章　为销售而设计--提高访客转化率
7.1　如何销售？
7.2　AIDA(注意力、兴趣、期望、行动）
7.3　展示产品
7.4　使用视频展示产品
7.5　可以浏览的功能列表
7.6　馈赠让客户想回报
7.7　从众心理
7.8　隐性的建议
7.9　永远提供下一步操作
7.10　使用稀缺性来促进需求
7.11　退款保障，消除客户的后顾之忧
7.12　鼓励用户试用
7.13　别让邮寄费用吓跑了顾客
7.14　消除选择麻痹
7.15　古腾堡法则
7.16　脚注
7.17　简化注册
7.18　总结
第8章　把网站变成非凡的品牌
8.1　建立独一无二的设计
8.2　了不起的视觉设计
8.3　成为社区的一部分
8.4　进入人们的头脑中
第9章　向专家学习--名家访谈与真知灼见
认识一下我们的专家组成员
9.1　设计和开发
9.2　设计过程
9.3　自我提高和技巧积累
9.4　发展事业和做自由职业者
第10章　幕后故事
10.1　一切是如何开始的
10.2　我们是如何走到今天的
10.3　我们成功故事的关键因素
10.4　幕后在发生着什么？
10.5　感谢你，设计社区

章节摘录

版权页：   插图：    实际上，在指字体时人们经常把“typeface”（字体）和“font”（字体文件）混用。typeface指的是某类特殊字体设计，而font指的是包含我们使用字形的那个文件。比如，George指的是typeface，而Georgia－Bold.ttf指的是font，一个包含了这个字体所有粗体字形的文件。换句话说，对字母、数字和符号等的实体化集合（无论是金属块还是计算机文件）就是一种“font”（你选择并使用的文件）。 当我们指字体集合的设计时（也就是字体看上去的样子），我们指的是“type－face”。打个比方，我们播放MP3文件，但是我们听到的却是优美的歌曲。 3.3 相对和绝对的字体尺寸单位 也许数字化排版最不同的特点就是用户能够根据自己的偏好调整字体大小。当选择了一个字体大小后，网站开发者可以使用绝对或是相对的度量单位，也可以在CSS中设置。总体来说，绝对单位更适合印刷品的设计，把它们用于网站排版不是很好的实践。唯一的例外是打印样式表，绝对单位可以帮助定义文档上设计区域的大小。目前被支持的度量单位包括pt、pc、cm、mm和in。但是像xx－small、x－small、small、medium、large、x－large和xx－large，也同样可以选择。 设定“绝对”的字体大小并不意味着用户不能增加或减少字体的大小。现代浏览器允许大量针对文本的操作。甚至，绝对单位使设计者在父元素和子元素之间设定比例变成了不可能的事情，即使用户手动地增加或减少字体的大小，字体的大小也会不变。因此，“absolute”属性与样式表中元素的定义相关，而与屏幕显示无关。 设定“绝对”的字体大小并不意味着用户不能增加或减少字体的大小 现代浏览器会默认把元素的字体大小设定为16像素。如果你不在样式表中明确地指定其他值，将会使用这个值。为了避免复杂的计算，Richard Rutter建议把的字体大小设为62.5%，这将把文字的大小降低到10像素（16像素×0.625）。相应地，当把标题字体大小设定为18像素时，使用1.8em，而不使用1.125em（18像素：16像素=1.125）更合适一些。 实际上，字体大小通常使用相对单位，比如px、em或%。px（像素）与显示器的分辨率相关。分辨率越高，像素密度越大。通常这也意味着字体看上去会更小。 “em”是通过你使用的字体大小来定义的度量单位。1它代表了基线（baseline）之间的距离，当字体属性被设定为solid（不含行高）时。em是一个相对的单位，它的值一般是文本元素父元素大小的倍数。所以，1em对于16点（point2）的字体而言，意味着16点。如果用户浏览器默认的字体大小是16像素，那么1em就代表16像素，这基本仅仅是文本显示尺寸的一个属性值。如果用户把字体尺寸降低到14像素，那么2em将代表28像素。 使用em作为字体大小单位的好处是，这个度量单位在设定父元素和子元素的比例方面有着天生的能力，以及对CSS继承特性的利用。利用这个特性子元素可以继承父元素的大小，除非明确声明了进行尺寸更改。比如，如果默认字体大小是16像素，元素的字体大小为2em，之内的页眉字体大小为1.5em，那么页眉的字体大小将是元素的1.5倍，也就是1.5×2×16像素=48像素。 在某种程度上，百分比近似于em值：CSS中文档的根、继承和父子元素的相对关系会为每一个元素定义大小。所以在上面的例子中，可以定义元素的字体大小为200%，页眉的字体大小为150%，结果是相同的（48px）。 在一些环境中，将最小宽度和最大宽度属性设置为em或百分比对于获得一个可读性好的行宽会很有帮助。通常，字符的平均宽度是2／3 em。因此30em和50em可以被视为理想的行宽。 因为IE6不允许用户按像素缩放文本，因此建议使用em或百分比值。不过，当使用相对单位时要小心谨慎。使用一些尺度和分级（参考下文）来确保不同重量的文本元素能够准确、恰当地呈现。

媒体关注与评论

知名设计网站Smashing Magazine上线以来的精华总结，来自全球的知名设计师无私地分享了多年积累的宝贵经验。这是一本设计原理和实践并重的设计书，推荐给每一位前端设计师阅读。——余果 腾讯社交用户体验设计部 前端工程师

编辑推荐

《众妙之门——网站UI设计之道(修订版)》是经典畅销书  《众妙之门——网站UI设计之道》的全新改版，知名设计网站Smashing Magazine的精华总结，全球知名设计师无私分享他们多年积累的宝贵经验，深入探讨网站UI设计思想和设计理念。

用户评论 (总计56条)

•   做UI设计的人应该看一看，真心不错。
•   主要是针对网站的设计，有些专业术语解释看上去还是有些吃力，不过图配文的方式讲解不会那么闷
•   非常棒的一本书，为从事或者像我一样想要了解这方面内容的童鞋提供了非常丰富的内容。
  　　从相关理论到实践中使用的工具与技巧，一网打尽
  　　与其它同类书籍相比，此书比较特别的地方在于第九第十两章内容，一个众专家的访谈，一个社区成长的历程，与前面八章的理论很好的呼应~~
•   有一定网页设计和交互设计基础后再看这本书体会更多！
•   没有看完，但是从开始就感觉里面的总结和提醒非常实用，的确是技巧和经验的精粹，我想初中级用户应该都能受用！
•   网页永远离不开用户，这本书值得让人深入阅读。
•   值得一读经典书籍
•   还不错，开发人员也值得一看
•   还没看，浏览了一点点，感觉不错，应该可以入门
•   还没看~不过感觉很不错
•   不错，挺好，值得一看，学到了一些东西。
•   很好，很强大，讲的很详细很透彻
•   本来想着很厚很大，不过是正版的。挺不错。
•   还没来得急细看，包装很糟糕。
•   内容精巧翔实，不妨一看！
•   还没来得急看，都是彩页，不错~
•   昨天下的单，本来以为明天才会到的，今天中午收到的，书是之前查过才在网上买的，很不错，书的内容值得一看，当当的发货速度，快递都很快，给力。
•   个人觉得还可以，纸张和印刷都不错
•   这书印刷的很好，是彩印的，文字很精练
•   比较简单易懂，适合初学者！
•   这本书很好，就是太少了，应该再多写点，帮助很大
•   快递很快，昨天刚到，晚上看了一点觉得很适合自己，至于到底好不好，得看完了才知道
•   还没有开始看 快递很给力 晚上还坚持送货 致敬
•   很好的书，值得好好阅读和学习！
•   帮别人买的，比较专业，实用
•   看大家推荐的，买来拜读。
•   内容还不错，正版不正版不知道，但是有几页印刷得不好。送货略慢
•   有点不咋地啊
•   还可以 还没仔细看。也是在网站上看到推荐才买的。看了下目录 还挺仔细的。。
•   很适合初学者，可以了解网页设计原则
•   刚收到，大概翻了一下 内容蛮实用的 深入看完之后 再次与大家分享
•   本来想买2的，结果1和2的封面是一样的，就买成1了，尴尬~！
•   买错了，不过多看看对自己还是有帮助的
•   还没细看 不过大致翻了翻挺有用的
•   一般，看了三分之二。
•   应该有光碟赠送的吧~光碟去哪了呀？书也感觉旧旧的~~哎~~当当肿么不是那么一如既往的好了。。
•   夜宵看了点 等会可能 要看了
•   连字体设计的规范也都是只有英文字体没中文字体，不过大多数还是比较好的，还有就是觉得此书翻译上有些牵强
•   读过最早的一版，觉得挺好的，以为修订版有怎天修改了内容，买回来才知道和第一版一样内容。
•   很适合设计师看，非常不错的一本书
•   内容经典，纸张高级，非常不错，强烈推荐！
•   神级好书，极力推荐！
•   设计部的同事说还不错
•   这也只能作为一本概念设计的书了，很多内容需要自己亲身去体验去实践。
•   内容很详尽，通俗易懂，更多的是理论上的，让你不但知其然，还知其所以然，web前端开发的同志值得一看
•   还不错的，比较系统。
•   讲的什么东西啊，掺杂了一些代码和具体的尺寸，什么导航条多少多少pix，一点建设性的概念都没有。
•   想要在设计上有所进步就收一本吧，这个好像不太适合初学者。
•   如题，不适合新手，很多内容一笔带过，需要深入的地方没有，需要讲解基础的也没有。此书只能拿来浏览，起到梳理知识的作用。
•   内容和印刷都很不错
•   内容很不错，很合适看
•   还不错 全彩
•   众妙之门：网站UI设计之道（修订版）
•   学网页UI的别错过
•   包装完好,内容经典
•   给同事买的反应不错。