以下是緊接著上文?SKYUI設(shè)計(jì)觀點(diǎn)-網(wǎng)頁(yè)設(shè)計(jì)的“道”(上）

來(lái)繼續(xù)闡述我們的觀點(diǎn)

放棄控制，變得靈活吧 ? ??--SKYUI設(shè)計(jì)師

五、“道”

“通過(guò)運(yùn)用而形成了道、之后便丟失了“形”、不必在乎形體上的觀念、而是讓感知滲入這個(gè)世界、就像溪流奔涌至海洋一樣“

(始制有名，名亦既有，夫亦將知止，知止可以不殆。譬道之在天下，猶川谷之于江海)

道德經(jīng)；第32章 形體

那怎么才能設(shè)計(jì)出具備通用性的頁(yè)面呢？首先有幾種思考的方式對(duì)解決問(wèn)題很有幫助。然后我會(huì)講點(diǎn)具有實(shí)用性的建議來(lái)幫助你避免這些問(wèn)題。

第一，想想，你的頁(yè)面的目的是什么，而不要想頁(yè)面的視覺(jué)效果。讓你的設(shè)計(jì)溯源一下，回到為用戶提供服務(wù)上，而不是首先考慮頁(yè)面的視覺(jué)效果。功能至上，而不是先制作特殊的外觀再讓添加頁(yè)面功能。這個(gè)想法的基礎(chǔ)在于把內(nèi)容與外觀分離。你可能已經(jīng)聽(tīng)過(guò)不下一百遍了，但或許如果你這么做將是你邁出最重要的一步。讓我們看一個(gè)簡(jiǎn)單的例子。頁(yè)面上有些文本是斜體的。為什么采用斜體呢？可能是用來(lái)做強(qiáng)調(diào)。可能是引用。也可能是用英語(yǔ)表達(dá)的外國(guó)詞語(yǔ)。在傳統(tǒng)出版業(yè)中，形式來(lái)自于功能。網(wǎng)絡(luò)出版業(yè)的優(yōu)點(diǎn)就在于我們可以在頁(yè)面外觀上突出那些我們想要突出的。如果斜體的功能是用來(lái)做強(qiáng)調(diào)，那么請(qǐng)用<em>標(biāo)簽，而不是<i>標(biāo)簽，這樣除了PC的之外的網(wǎng)頁(yè)瀏覽器也能恰當(dāng)?shù)奶幚怼母叩膶哟蝸?lái)說(shuō)，別用HTML做外觀。別用那些<font> <b> <i>這種標(biāo)簽。當(dāng)HTML能按需提供合適的元素時(shí)候再去用。如果不能，用類別。當(dāng)然，記得要用樣式表來(lái)傳達(dá)信息。要往前看，而不是回首。

如果你能恰當(dāng)?shù)膽?yīng)用樣式表，那么我還建議不要去改變頁(yè)面的外觀，不要依賴樣式表去轉(zhuǎn)換信息，那么你的頁(yè)面將會(huì)良好的運(yùn)作在任何瀏覽器上。不支持樣式表的瀏覽器也就是看起來(lái)平淡一點(diǎn)而已。我們最大的關(guān)注點(diǎn)在于那些有漏洞樣式表所支持的瀏覽器。今天這是一個(gè)問(wèn)題，但是不久的將來(lái)，這會(huì)被解決。現(xiàn)在，你可以把自己局限在有良好支持的CSS的子集中，而且比之HTML能夠提供更好的視覺(jué)效果。這部分寫的夠多了，不再重復(fù)。(HTML做結(jié)構(gòu)，CSS做樣式）在實(shí)際應(yīng)用中，當(dāng)設(shè)計(jì)樣式表會(huì)影響到頁(yè)面的適用性的時(shí)候，有些要做到，有些則要避免。除此之外，不要依賴樣式表來(lái)實(shí)現(xiàn)頁(yè)面的通用性。過(guò)于絕對(duì)的單位，像像素和磅數(shù)要避免（下面我會(huì)講）色彩要謹(jǐn)慎使用，不要依賴色彩。

字體

一般Windows，Mac或其他系統(tǒng)上僅僅安裝了幾種字體。這些系統(tǒng)上的默認(rèn)字體都各不相同。已經(jīng)有很多瀏覽器，讀者可以自行決定頁(yè)面所呈現(xiàn)的字體。引入CSS，可提供多種字體選擇，覆蓋多種接口。但是不要指望一種字體一直都起作用，不管該字體多么常見(jiàn)。更重要的還是字體的大小，你可能察覺(jué)到同樣的字體，同樣的字重，在Mac中看起來(lái)比Windoes小一點(diǎn)。這是因?yàn)镸ac的自行分辨率是72dpi,Windows的自行分辨率是96dpi。導(dǎo)致的差別很顯著。想要在Mac上和Windows上形成同樣的文本效果幾乎是不可能的。但如果你堅(jiān)信適用性這一信條，那么便沒(méi)關(guān)系？什么？如果你關(guān)注的是網(wǎng)頁(yè)頁(yè)面如果精確的顯示，這就說(shuō)明了你

還沒(méi)有想考慮到頁(yè)面的適用性。字體大小是通用性最顯著地問(wèn)題。小號(hào)字體難以閱讀。對(duì)于實(shí)力不錯(cuò)的人來(lái)說(shuō)，當(dāng)他們得知有數(shù)目龐大的人群難以閱讀紙張上14磅以下的字體時(shí)，他們會(huì)很震驚。屏幕的閱讀性比紙張要差，因?yàn)楦偷姆直媛省?

這是否就一位置我們所能使用的最小磅數(shù)就是14 pts?這并不會(huì)幫助那些視力不好的人。那我們最小的字體該用多少？什么都不

用，別用磅數(shù)。這樣就能讓讀者選擇適合他們的字體大小。對(duì)于像素來(lái)說(shuō)也是同理。因?yàn)榉直媛实牟町悾@個(gè)平臺(tái)上的像素會(huì)不同于其他平臺(tái)上的。CSS提供了幾種方式來(lái)改變文本尺寸，以促進(jìn)適用性。我們來(lái)看這

個(gè)例子。通過(guò)CSS你可以用百分比改變字體的大小。比如，標(biāo)題在頁(yè)面的主題中。如果你不設(shè)置主題的問(wèn)題本大小，那么主題的文本便根據(jù)讀者默認(rèn)的大小來(lái)進(jìn)行選擇。僅僅就這樣就促進(jìn)了頁(yè)面的通用性，什么都不用去做。你可能會(huì)說(shuō)，如果我放任管“文本就看起來(lái)太大了”，那么調(diào)小點(diǎn)。但是那是在“你的瀏覽器”里面。你的閱讀者將會(huì)有在他們的瀏覽器中選項(xiàng)選擇更大還是更小，完全取決于個(gè)人愛(ài)好。通過(guò)將一級(jí)標(biāo)題的大小設(shè)置為比文本字體大小大30%，我們可以讓標(biāo)題和其他元素突出。二級(jí)標(biāo)題可以大25%。不管用戶主要文本上選擇什么樣的字體大小。標(biāo)題應(yīng)該顯眼，應(yīng)該按比例的比主要文本字體大。相近的主體的文本可以縮小一些，但是這可能會(huì)導(dǎo)致文本難以閱讀，所以要謹(jǐn)慎。我們做的還很少，僅僅是避免了使用固定大小的字體，使用了合適大小的標(biāo)題，我們還需要做很多保持頁(yè)面的適用性。

布局：

邊距、頁(yè)面寬度、縮進(jìn)距離是促進(jìn)可讀性的幾個(gè)方面。瀏覽器的窗口會(huì)改變大小，今兒改變了頁(yè)面的大小。不同的網(wǎng)絡(luò)設(shè)備（網(wǎng)絡(luò)電視，高分辨率屏幕，掌上電腦）有不同的窗口尺寸。就像修改字體大小一樣，修改頁(yè)面布局可能會(huì)導(dǎo)致頁(yè)面的通用性問(wèn)題。布局也同樣可以被設(shè)計(jì)為按百分比來(lái)布置具有通用性的頁(yè)面。邊距可以按照屏幕的百分比設(shè)置。用CSS可以自動(dòng)的通過(guò)百分比來(lái)設(shè)置頁(yè)面布局來(lái)創(chuàng)建具有適用性的頁(yè)面。當(dāng)瀏覽器的窗口變寬或是變窄，布局的各個(gè)元素適應(yīng)性的進(jìn)行變化，所以整個(gè)頁(yè)面的布局也具有適應(yīng)性。瀏覽者可以選擇合適的窗口大小。邊距，文本鎖緊，和其他的布局方面也可以被設(shè)置為與文本字體

關(guān)聯(lián)，使用<em>單位來(lái)設(shè)置。如果你設(shè)置：

p??{margin – left: 1.5em}

這就是說(shuō)段落的左邊距為段落字體高度的1.5倍。當(dāng)用戶調(diào)整了字體大小來(lái)讓頁(yè)面看起來(lái)更舒服的時(shí)候，邊距也同樣適當(dāng)?shù)脑黾?，如果他們調(diào)小，那么邊距相應(yīng)改變。

顏色：

網(wǎng)絡(luò)比紙張更加多彩的媒介。顏色的運(yùn)用在網(wǎng)絡(luò)上無(wú)成本。裝飾性的顏色能幫助構(gòu)造視覺(jué)個(gè)性，也具有實(shí)際上的價(jià)值。但也導(dǎo)致了通用性的問(wèn)題。你知道嗎？很多國(guó)家里，無(wú)論能力有多么高，有紅綠色盲的人是不能獲取飛行員執(zhí)照的。因?yàn)榫嫘畔⒖偸且怀刹蛔兊囊约t色代表危險(xiǎn)，綠色代表安全。非常遺憾，警示信號(hào)方面并不具備顏色適用性、替代性。你的網(wǎng)頁(yè)是否以同樣的方式驅(qū)除了個(gè)別用戶？那很令人遺憾，不久的將來(lái)大多數(shù)的網(wǎng)頁(yè)瀏覽器會(huì)給瀏覽者提供簡(jiǎn)便的方式調(diào)整頁(yè)面的色彩，憑借的是用戶樣式表，一種優(yōu)先于你的樣式表的存在怎么避免這種問(wèn)題？用樣式表，而不是用 HTML的<em>元素。避免僅僅依賴色彩的組合去傳遞信息。路途人難以合抱的樹(shù)木開(kāi)始于小小的樹(shù)根；能夠阻止河流溢出的大壩開(kāi)始于一小塊的泥土；一千里的路程開(kāi)始于一個(gè)人的一小步。（合抱之木，生于毫末；九層之臺(tái)，起于累土；千里之行，始于足下。）

道德經(jīng)；第64章.留意開(kāi)始

——《道德經(jīng)》第六十四章

改變我們思考和行為的方式并不容易?！熬o密抓住的信仰不會(huì)容易的放下”但我已經(jīng)慢慢的意識(shí)到很多事情，我以為是理所當(dāng)然

的事情需要重新去評(píng)估。通過(guò)這幾年我所讀、我所見(jiàn)、我所談的，我發(fā)現(xiàn)很多人依然在固守成規(guī)，他們需要重新去思考。現(xiàn)在正是網(wǎng)絡(luò)媒體從紙質(zhì)中脫離的時(shí)代。不用放棄過(guò)去的經(jīng)驗(yàn)與智慧，但要發(fā)展自己的路。網(wǎng)絡(luò)最強(qiáng)大的地方也是它自身的限制所在。網(wǎng)絡(luò)的本性便是靈活，我們?cè)O(shè)計(jì)師和開(kāi)發(fā)者應(yīng)該去堅(jiān)信這種靈活性，以此來(lái)構(gòu)建有靈活性的頁(yè)面，從而具有通用性。