網(wǎng)站建設時(shí)，需要注意網(wǎng)頁(yè)布局中使用數學(xué)中的模數精確布局

　　在設計中可以使用許多數學(xué)公式，比如常用的黃金分割比就是其中之一。在網(wǎng)頁(yè)設計布局中，我們也能通過(guò)精密的計算來(lái)獲得理想的排版比例，本文將介紹使用數學(xué)中的“模數”來(lái)計算網(wǎng)頁(yè)布局大小，從而獲得更為合理的布局。

　　在IT工業(yè)中，內置標準、國際標準、國家標準才是真正意義的規范、而在應用領(lǐng)域（包括Web 應用的開(kāi)發(fā)）的開(kāi)發(fā)中，標準是各自為政亂七八糟的，微軟如果不考慮市場(chǎng)和經(jīng)濟利益也不是不吊這些標準的。我不得不汗一個(gè)。

　　二、模數網(wǎng)頁(yè)設計中的應用

　　好了，鄙視完小兒科的網(wǎng)頁(yè)設計，我們來(lái)談?wù)?ldquo;模數”在網(wǎng)頁(yè)設計中的用途。

　?。ㄒ唬┚W(wǎng)頁(yè)設計中的尺寸單位

　　網(wǎng)頁(yè)設計中的尺寸單位有那么幾個(gè)：em ex px pt pc in cm mm %

　　最常用的就是px（像素），因為這個(gè)單位與圖片單位可以互通，所以常用。

　?。ǘ┚W(wǎng)頁(yè)設計中的常用模數

　?。?）最常用的是100、10、5的倍數

　　比如分欄的時(shí)候，滿(mǎn)寬式950px，左欄式180px，欄與欄之間的間距是10px、15px、20px

　?。?）模數要盡量取整或末位為偶數

　　這里要在提一下模數中有個(gè)概念就是，不滿(mǎn)足常用模數的，位數盡量要用偶數，為的避免歧義和好記。還有個(gè)道理是，一律取偶數，那么按組件的偶數量組合順序，疊加結果一定是偶數，末尾加再加個(gè)組件一定是奇數了，這樣好判斷是否有錯。

　　比如你的圖片寬是231px，為啥不舍1取整為230px；

　　再比如你的圖片高時(shí)237px，你可以取235px、236px、238px

　?。?）使用模數的好處--輕松獲得秩序美

　　這個(gè)世界上什么是美？是秩序?？纯丛鼐w、看看飄落到你手中尚為融化的雪花、看看人類(lèi)的基因螺旋結構，這些微觀(guān)世界的東西，凝練了美得本源。而自然界、動(dòng)物界、乃至宇宙星系，由于其包含了雜志和不斷地衰減變化，這種“美”只是表象。

　　人之所以是人，就是在一直探索事物的本源。并不斷提煉還原美的本質(zhì)。在中世紀人們迷戀于幾何，在現代人們充分將其提高到工業(yè)設計中。工業(yè)設計是以規范標準和計算設計為基礎的，升華成一套追求完美的秩序。形成秩序的模數，是一個(gè)遞增量，這個(gè)增量可以是倍數、方根、冪、圓周率、素數、或以個(gè)方程式等等。而倍數恰恰是形成秩序的一種最簡(jiǎn)單的方法。所以在工業(yè)設計中，尤其是建設設計中大量運用了倍數來(lái)充當模數。

　　現在我們有了簡(jiǎn)單的倍數類(lèi)模數，那么這個(gè)模數又是怎么把美體現出來(lái)的呢？

　　你說(shuō)我感覺(jué)不到啊。答對了，模數美的確是人無(wú)法直接一下感受到的。因為這種美不僅僅體現在感官上，還體現在設計制作開(kāi)發(fā)過(guò)程中，它不僅提高了制作效率，減小了莫名其妙的累計誤差，還把一種整體的設計美蘊含在整體作品中，它的美是整體美和局部美一種相互轉換。更直白點(diǎn)，你會(huì )在網(wǎng)頁(yè)中感受到一種工業(yè)設計的“精致”和“用心”，反過(guò)來(lái)說(shuō)，一個(gè)界面中的模塊之間的間距或某模塊四個(gè)邊界與其內容的間隔，一會(huì )是8px，一會(huì )是12px，一般用戶(hù)一定會(huì )在潛意識中感覺(jué)不精致，因為設計者沒(méi)有用心，沒(méi)有用模數把秩序美設計進(jìn)去。

　　有多少UI設計師不懂得啥是模數呢？

　　有多少UI設計師因為不用模數而使整個(gè)網(wǎng)站缺乏設計美呢？

　　有多少UI設計師即便是在局部或某組建用了符合秩序的倍數，但沒(méi)有在整頁(yè)布局和整站中是使用統一的模數呢？

　　用你的眼睛細心觀(guān)察，用放大鏡去研究，用心靈去感受，你就知道你的設計師是什么水平了。

　?。?）不被模數所束縛

　　上面一直說(shuō)模數要用倍數，要用偶數。要活血活用啊，一旦秩序美的追求與效率和規范沖突，哪就放棄模數。比如即成的國際標準小logo圖片的尺寸是88*31px，你非得為了符合模數而不遵循國際通用標準而改成88*30px嗎？

　　題外話(huà)，除了模數，IT工業(yè)還有其內置的一套標準，我也懶得去管他，比如圖片和頭像大小，有其一套特殊的模數，16*6、24*24、32*32、48*48、64*64、128*128，你要是非得破壞這個(gè)標準而改成15*15、25*25、030*30、50*50、65*65、130*130，我就真無(wú)語(yǔ)了。

　　咦，我發(fā)現paidai的頭像，居然是50*50px，呵呵?？磥?lái)表現層不必非得拘泥于模數。

　　設計美就是這么簡(jiǎn)單，你必須用計算器來(lái)布局，進(jìn)行完美的網(wǎng)站建設 ！

 

---