爲何是960px？
一直以來，網頁設計師都但願尋找一個理想的頁面寬度值，既能適應大部分屏幕，又儘量的在一行顯示更多的信息。php
咱們首先會考慮的是全屏自適應，但這並不是一個好的解決方案。一方面，須要作一個能適應各個寬度的設計，從背景圖片，到每一個欄目標題的文字長度，都須要考慮到適應多變的寬度；另外一方面，也是最致命的一點，相比英文單詞，中文方塊字是沒有起伏的，用戶對文字位置記憶的依賴性更大。自適應寬度也就意味着一行顯示的文字數是不定的，閱讀中文文字塊時極可能很難一下找到剛纔讀到的那個地方如今到哪去了。所以，固定頁面寬度比自適應更經常使用。過去，信息閉塞獨立思考的咱們會考慮用主流屏幕寬度－20px（IE中左右邊框＋滾動條的寬度）。在1024＊768的分辨率下，頁面寬度應該爲1004px。但過不了多久，不少人便意識到，有一個更好的寬度——960px。css
960 ＝ 2^6*3*5。與1004這個無厘頭的數字相比，960可以被十二、1五、1六、24整除，得數分別爲80、6四、60、40，這些數字聽着就和諧並且靠譜。所以960很是適合於使用柵格設計系統進行網頁設計。html
爲何要用柵格設計系統?
柵格設計系統，即Gird System（又稱網格設計系統、標準尺寸系統、程序版面設計、瑞士平面設計風格、國際主義平面設計風格），是一種平面設計的方法與風格。運用固定的格子設計版面佈局，其風格工整簡潔，在二戰後大受歡迎，已成爲今日出版物設計的主流風格之一。前端
柵格設計系統在印刷出版物的排版設計中十分廣泛，網頁設計常會從印刷排版中汲取靈感。在網頁設計中採用柵格設計系統不單可以繼承工整簡潔的風格，還能大大的減小設計的工做量；從前端工程的角度來講，這種排版方式優勢不言而喻：自然的規範性和可重用性。從整個團隊來看，使用柵格設計系統能簡化工做流程，便於交流，也便於分工和統一風格。程序員
這是使用3＊3的網格的960px頁面設計草圖，來自「The Principles of Beautiful Web Design」。web
960px是惟一的麼？
960是不是惟一最優的頁面寬度呢？固然不是。目前使用柵格系統的頁面的寬度並不嚴格就是960px，也多是950px，例如yahoo的YUI框架就是950px。關於網頁柵格系統設計的介紹能夠看看TaobaoUED的這篇文章。1024＊768也不會永遠是主流分辨率，隨着分辨率的發展，下一個較優寬度極可能是1440（2^5*3^2*5），或者是一個沒有分辨率的時代，頁面可以按比例自動縮放（就像如今在移動版safari看到的那樣）。另外，好的設計和創意經常須要打破規則，柵格設計系統也並不是網頁排版惟一可用的風格，在主流以外會一直存在一些很優秀的非960px頁面（尤爲是全flash網站）；有時候人們會議論他們seo上的缺陷，或者兼容性、用戶體驗不夠好，但從藝術的角度上他們依然很優秀。spring
爲何用960 Grid System？
960 Grid System是由Nathan Smith開發的CSS框架，有12列、16列、24列三個版本。CSS對於不少程序員來講可能徹底不屑於優化，但它確實和其餘的程序代碼同樣須要架構和優化。即便運營的是一個很小的網站，適當地組織、重用CSS代碼可以節省至關多的時間和成本。CSS框架正是那個能讓你在每一個網站都屢試不爽的東西，把那些無聊重複的工做都交給它們吧，把本身的精力集中在怎麼創造更使人動心的設計上！瀏覽器
並且，960 Grid System不只僅提供了CSS框架，它還提供了可打印的縮略圖表，Firewofks、Phototshop、OmniGraffle 和Vision的模板源文件⋯⋯你可讓項目組的不少人都用上它。架構
它也能爲你減小了不少兼容性問題，它支持被yahoo評爲A級別的瀏覽器：框架
用960 Grid System作出來的東西好看麼？
這個問題頗有現實主意色彩。使用960 Grid System創造好網站的能力毋庸置疑，在它的網站上列出了許多成功案例。此外，wordpress用戶熟悉的WooThemes也用了960Grid System。
具體到中文的環境中，每一個設計師都有本身的判斷。例如我本身以爲16列的網格系統比較適合中文企業網站，你可能會有別的見解。可是並非用了它就必定能創造出使人滿意的網頁。「Frameworks are merely tools that help people achieve solutions, not the solutions themselves. It’s up to designers and developers to combat class-itis and div-itis.（框架只是幫助人們獲取解決解決方案的工具，不是解決方案自己。它取決於設計師和開發者如何駕馭class和div）」。
對於開發者來講，用框架總好於不用。還有不少優秀的CSS框架可用。960 Grid System是一個比較單純的框架，它不關心字體、顏色⋯⋯你能夠爲本身的網站定製一份字體顏色的框架。但框架也意味着不免會有一些你用不上的樣式，若是你的網站很在乎這方面的問題，須要謹慎考慮使用框架。
最後，值得一讀的一些參考文章
彬Go的文章：
《960網格系統（翻譯）》
《960 Grid System 基本原理及使用方法（翻譯） 》
《使用Photoshop+960 Grid System模板進行網頁設計 》
《精選15個國外CSS框架》
一些經典的使用教程
Fight Div-itis and Class-itis With the 960 Grid System
Prototyping With The Grid 960 CSS Framework