眾妙之門

內(nèi)容概要

　　《眾妙之門——網(wǎng)站UI設(shè)計(jì)之道(修訂版)》是知名設(shè)計(jì)網(wǎng)站Smashing
Magazine上線以來(lái)的精華總結(jié)，來(lái)自全球的知名設(shè)計(jì)師無(wú)私地分享了他們多年積累的寶貴經(jīng)驗(yàn)。全書共分10章，前8章討論了和網(wǎng)站UI設(shè)計(jì)相關(guān)的八個(gè)不同的領(lǐng)域，覆蓋面非常廣，具有很強(qiáng)的操作性和專業(yè)性，全書邏輯嚴(yán)密、言簡(jiǎn)意賅，設(shè)計(jì)人員可以快速地找到自己想要的東西。第9章以訪談的形式介紹了多位專家對(duì)一系列重要問(wèn)題的看法，入木三分，極富啟發(fā)性。第10章以講故事的方式，把Smashing
Magazine的創(chuàng)辦和發(fā)展過(guò)程娓娓道來(lái)，同時(shí)毫不保留地分享了兩位創(chuàng)始人的成功秘訣和價(jià)值觀，讓人受益匪淺。
《眾妙之門——網(wǎng)站UI設(shè)計(jì)之道(修訂版)》最大的價(jià)值在于它在傳授具體經(jīng)驗(yàn)的同時(shí)，也對(duì)設(shè)計(jì)思想和設(shè)計(jì)理念進(jìn)行了深入的探討，在“授人以魚”的同時(shí)，不忘“授人以漁”。相信廣大讀者讀完這本《眾妙之門——網(wǎng)站UI設(shè)計(jì)之道(修訂版)》，一定會(huì)有一種相識(shí)恨晚的感覺。

作者簡(jiǎn)介

Smashing Magazine是世界知名的頂級(jí)技術(shù)類博客，主要面向Web設(shè)計(jì)與開發(fā)人員。
成立于2006年9月的Smashing Magazine旨在向Web設(shè)計(jì)者和開發(fā)者提供優(yōu)質(zhì)創(chuàng)新的信息和最新的技術(shù)趨勢(shì)。

書籍目錄

第1章　現(xiàn)代網(wǎng)絡(luò)應(yīng)用中的用戶界面設(shè)計(jì)
1.1　什么是用戶界面(UI)
1.2　可視界面設(shè)計(jì)的工具箱
1.3　制作有效用戶界面的實(shí)用技巧
1.4　結(jié)論
第2章　CSS布局的藝術(shù)和科學(xué)
2.1　固定寬度布局
2.2　自適應(yīng)布局
2.3　動(dòng)態(tài)網(wǎng)格布局
2.4　自適應(yīng)的流式布局
2.5　彈性布局
2.6　混合布局
2.7　哪種布局最適合您的網(wǎng)站？
第3章　排版：原則、方針和常見錯(cuò)誤
3.1　傳統(tǒng)排版和網(wǎng)站排版
3.2　基本的排版術(shù)語(yǔ)
3.3　相對(duì)和絕對(duì)的字體尺寸單位
3.4　空白是最好的空間
3.5　排版和網(wǎng)格
3.6　垂直節(jié)奏
3.7　分級(jí)(Hierarchy)和分度(scale)
3.8　段落樣式
3.9　通過(guò)字體設(shè)定版式
3.10　CSS字體庫(kù)(CSS Font Stacks)
3.11　文本替換技術(shù)
3.12　@font-face屬性
3.13　選擇正確的字體
3.14　不要穿舞鞋登山
3.15　尺寸很重要
3.16　OpenType、TrueType還是PostScript Type
3.17　注意細(xì)節(jié)
3.18　對(duì)齊和連字符
3.19　總結(jié)
第4章　現(xiàn)代網(wǎng)站的可用性原則
4.1　用戶如何思考？
4.2　使用整潔連貫的視覺設(shè)計(jì)
4.3　固定元素屬于固定位置
4.4　搜索是簡(jiǎn)單的
4.5　鏈接要像鏈接
4.6　僅在必要的時(shí)候使用下拉菜單
4.7　使注冊(cè)表單盡量簡(jiǎn)潔
4.8　考慮添加"返回頁(yè)首"鏈接
4.9　盡可能地避免使用Splash頁(yè)面
4.10　鏈接應(yīng)該在同一窗口打開
4.11　你需要注意以下可用性檢查點(diǎn)
4.12　傳達(dá)你的網(wǎng)站的組織結(jié)構(gòu)
4.13　使用標(biāo)記來(lái)構(gòu)建上下文
4.14　建立良好的導(dǎo)航
4.15　重要的易用性法則和原則
4.16　給用戶一個(gè)5萬(wàn)英尺的視角來(lái)看你的程序
4.17　心理模式和象征物
4.18　組織網(wǎng)站的內(nèi)容
4.19　提供站點(diǎn)地圖
4.20　使用幫助
4.21　建立信任
4.22　不要讓用戶毀掉自己的用戶體驗(yàn)
4.23　及早測(cè)試、經(jīng)常測(cè)試
4.24　總結(jié)
第5章　網(wǎng)站設(shè)計(jì)、可用性和用戶體驗(yàn)中超炫色彩終極使用指南
5.1　色彩學(xué)理論
5.2　色彩和易用性
5.3　色彩與注意力集中
5.4　色彩與體驗(yàn)
5.5　靈感
第6章　網(wǎng)站優(yōu)化
6.1　你將會(huì)用到的工具
6.2　在IMG標(biāo)簽中表明正確的圖片尺寸
6.3　減小圖像的尺寸
6.4　服務(wù)器和內(nèi)容分發(fā)網(wǎng)絡(luò)
6.5　合并CSS和JavaScript
6.6　CSS放在頂部，而JavaScript放在底部
6.7　壓縮CSS和JavaScript
6.8　使用外部CSS和JavaScript文件
6.9　選擇一個(gè)文檔類型
6.10　驗(yàn)證頁(yè)面
6.11　不要使用CSS表達(dá)式
6.12　服務(wù)器部分
6.13　Apache：如何設(shè)置過(guò)期時(shí)間
6.14　YSlow中可以查看缺少expires header的報(bào)警
6.15　Lighttpd：如何設(shè)置過(guò)期頭
6.16　Apache：如何配置ETags
6.17　Lighttpd：如何配置ETags
6.18　為PHP安裝eAccelerator
6.19　MySQL Tuning Primer
6.20　啟用透明壓縮
6.21　盡可能避免重定向
6.22　如何探測(cè)長(zhǎng)時(shí)間跳轉(zhuǎn)鏈？
6.25　完整的鏈接
6.24　避免死鏈接
第7章　為銷售而設(shè)計(jì)--提高訪客轉(zhuǎn)化率
7.1　如何銷售？
7.2　AIDA(注意力、興趣、期望、行動(dòng)）
7.3　展示產(chǎn)品
7.4　使用視頻展示產(chǎn)品
7.5　可以瀏覽的功能列表
7.6　饋贈(zèng)讓客戶想回報(bào)
7.7　從眾心理
7.8　隱性的建議
7.9　永遠(yuǎn)提供下一步操作
7.10　使用稀缺性來(lái)促進(jìn)需求
7.11　退款保障，消除客戶的后顧之憂
7.12　鼓勵(lì)用戶試用
7.13　別讓郵寄費(fèi)用嚇跑了顧客
7.14　消除選擇麻痹
7.15　古騰堡法則
7.16　腳注
7.17　簡(jiǎn)化注冊(cè)
7.18　總結(jié)
第8章　把網(wǎng)站變成非凡的品牌
8.1　建立獨(dú)一無(wú)二的設(shè)計(jì)
8.2　了不起的視覺設(shè)計(jì)
8.3　成為社區(qū)的一部分
8.4　進(jìn)入人們的頭腦中
第9章　向?qū)＜覍W(xué)習(xí)--名家訪談與真知灼見
認(rèn)識(shí)一下我們的專家組成員
9.1　設(shè)計(jì)和開發(fā)
9.2　設(shè)計(jì)過(guò)程
9.3　自我提高和技巧積累
9.4　發(fā)展事業(yè)和做自由職業(yè)者
第10章　幕后故事
10.1　一切是如何開始的
10.2　我們是如何走到今天的
10.3　我們成功故事的關(guān)鍵因素
10.4　幕后在發(fā)生著什么？
10.5　感謝你，設(shè)計(jì)社區(qū)

章節(jié)摘錄

版權(quán)頁(yè)：   插圖：    實(shí)際上，在指字體時(shí)人們經(jīng)常把“typeface”（字體）和“font”（字體文件）混用。typeface指的是某類特殊字體設(shè)計(jì)，而font指的是包含我們使用字形的那個(gè)文件。比如，George指的是typeface，而Georgia－Bold.ttf指的是font，一個(gè)包含了這個(gè)字體所有粗體字形的文件。換句話說(shuō)，對(duì)字母、數(shù)字和符號(hào)等的實(shí)體化集合（無(wú)論是金屬塊還是計(jì)算機(jī)文件）就是一種“font”（你選擇并使用的文件）。 當(dāng)我們指字體集合的設(shè)計(jì)時(shí)（也就是字體看上去的樣子），我們指的是“type－face”。打個(gè)比方，我們播放MP3文件，但是我們聽到的卻是優(yōu)美的歌曲。 3.3 相對(duì)和絕對(duì)的字體尺寸單位 也許數(shù)字化排版最不同的特點(diǎn)就是用戶能夠根據(jù)自己的偏好調(diào)整字體大小。當(dāng)選擇了一個(gè)字體大小后，網(wǎng)站開發(fā)者可以使用絕對(duì)或是相對(duì)的度量單位，也可以在CSS中設(shè)置?？傮w來(lái)說(shuō)，絕對(duì)單位更適合印刷品的設(shè)計(jì)，把它們用于網(wǎng)站排版不是很好的實(shí)踐。唯一的例外是打印樣式表，絕對(duì)單位可以幫助定義文檔上設(shè)計(jì)區(qū)域的大小。目前被支持的度量單位包括pt、pc、cm、mm和in。但是像xx－small、x－small、small、medium、large、x－large和xx－large，也同樣可以選擇。 設(shè)定“絕對(duì)”的字體大小并不意味著用戶不能增加或減少字體的大小?，F(xiàn)代瀏覽器允許大量針對(duì)文本的操作。甚至，絕對(duì)單位使設(shè)計(jì)者在父元素和子元素之間設(shè)定比例變成了不可能的事情，即使用戶手動(dòng)地增加或減少字體的大小，字體的大小也會(huì)不變。因此，“absolute”屬性與樣式表中元素的定義相關(guān)，而與屏幕顯示無(wú)關(guān)。 設(shè)定“絕對(duì)”的字體大小并不意味著用戶不能增加或減少字體的大小 現(xiàn)代瀏覽器會(huì)默認(rèn)把元素的字體大小設(shè)定為16像素。如果你不在樣式表中明確地指定其他值，將會(huì)使用這個(gè)值。為了避免復(fù)雜的計(jì)算，Richard Rutter建議把的字體大小設(shè)為62.5%，這將把文字的大小降低到10像素（16像素×0.625）。相應(yīng)地，當(dāng)把標(biāo)題字體大小設(shè)定為18像素時(shí)，使用1.8em，而不使用1.125em（18像素：16像素=1.125）更合適一些。 實(shí)際上，字體大小通常使用相對(duì)單位，比如px、em或%。px（像素）與顯示器的分辨率相關(guān)。分辨率越高，像素密度越大。通常這也意味著字體看上去會(huì)更小。 “em”是通過(guò)你使用的字體大小來(lái)定義的度量單位。1它代表了基線（baseline）之間的距離，當(dāng)字體屬性被設(shè)定為solid（不含行高）時(shí)。em是一個(gè)相對(duì)的單位，它的值一般是文本元素父元素大小的倍數(shù)。所以，1em對(duì)于16點(diǎn)（point2）的字體而言，意味著16點(diǎn)。如果用戶瀏覽器默認(rèn)的字體大小是16像素，那么1em就代表16像素，這基本僅僅是文本顯示尺寸的一個(gè)屬性值。如果用戶把字體尺寸降低到14像素，那么2em將代表28像素。 使用em作為字體大小單位的好處是，這個(gè)度量單位在設(shè)定父元素和子元素的比例方面有著天生的能力，以及對(duì)CSS繼承特性的利用。利用這個(gè)特性子元素可以繼承父元素的大小，除非明確聲明了進(jìn)行尺寸更改。比如，如果默認(rèn)字體大小是16像素，元素的字體大小為2em，之內(nèi)的頁(yè)眉字體大小為1.5em，那么頁(yè)眉的字體大小將是元素的1.5倍，也就是1.5×2×16像素=48像素。 在某種程度上，百分比近似于em值：CSS中文檔的根、繼承和父子元素的相對(duì)關(guān)系會(huì)為每一個(gè)元素定義大小。所以在上面的例子中，可以定義元素的字體大小為200%，頁(yè)眉的字體大小為150%，結(jié)果是相同的（48px）。 在一些環(huán)境中，將最小寬度和最大寬度屬性設(shè)置為em或百分比對(duì)于獲得一個(gè)可讀性好的行寬會(huì)很有幫助。通常，字符的平均寬度是2／3 em。因此30em和50em可以被視為理想的行寬。 因?yàn)镮E6不允許用戶按像素縮放文本，因此建議使用em或百分比值。不過(guò)，當(dāng)使用相對(duì)單位時(shí)要小心謹(jǐn)慎。使用一些尺度和分級(jí)（參考下文）來(lái)確保不同重量的文本元素能夠準(zhǔn)確、恰當(dāng)?shù)爻尸F(xiàn)。

媒體關(guān)注與評(píng)論

知名設(shè)計(jì)網(wǎng)站Smashing Magazine上線以來(lái)的精華總結(jié)，來(lái)自全球的知名設(shè)計(jì)師無(wú)私地分享了多年積累的寶貴經(jīng)驗(yàn)。這是一本設(shè)計(jì)原理和實(shí)踐并重的設(shè)計(jì)書，推薦給每一位前端設(shè)計(jì)師閱讀?！喙?騰訊社交用戶體驗(yàn)設(shè)計(jì)部 前端工程師

編輯推薦

《眾妙之門——網(wǎng)站UI設(shè)計(jì)之道(修訂版)》是經(jīng)典暢銷書  《眾妙之門——網(wǎng)站UI設(shè)計(jì)之道》的全新改版，知名設(shè)計(jì)網(wǎng)站Smashing Magazine的精華總結(jié)，全球知名設(shè)計(jì)師無(wú)私分享他們多年積累的寶貴經(jīng)驗(yàn)，深入探討網(wǎng)站UI設(shè)計(jì)思想和設(shè)計(jì)理念。

圖書封面

圖書標(biāo)簽Tags

無(wú)

評(píng)論、評(píng)分、閱讀與下載

---

    眾妙之門 PDF格式下載

---