|
有人在Stack Overflow上發(fā)問(wèn)，動(dòng)手開發(fā)網(wǎng)站之前,，需要知道哪些事情,？ 不出意料地，他得到了一大堆回答,。 通常情況下,，你需要把所有人的發(fā)言從頭到尾讀一遍。但是,，Stack Overflow有一個(gè)很貼心的設(shè)計(jì),，它允許在問(wèn)題下方開設(shè)一個(gè)wiki區(qū)，讓所有人共同編輯一個(gè)最佳答案,。于是，就有了下面這篇文章,，一共總結(jié)出六個(gè)方面共計(jì)61條"網(wǎng)站開發(fā)須知",。 我發(fā)現(xiàn)，這種概述性的問(wèn)題,，最適合這種集合群智,、頭腦風(fēng)暴式的回答方式了。這也是我第一次覺得,，Stack Overflow做到了Wikipedia做不到的事,。（難怪它最近擠進(jìn)了全美前400大網(wǎng)站。） 在我的印象中,，關(guān)于網(wǎng)站開發(fā),，這樣全面的概述性文章非常少見，因此也就非常有用,。大家不妨看看,，61件事情中你做到了多少？ （更新：剛剛發(fā)現(xiàn),，一共應(yīng)該是62條建議,，我先前數(shù)錯(cuò)了，這個(gè)......太窘了,。） ============================= 網(wǎng)站開發(fā)人員應(yīng)該知道的61件事 原文網(wǎng)址：http:///questions/72394 譯者：阮一峰 一、界面和用戶體驗(yàn)（Interface and User Experience） 1.1 知道各大瀏覽器執(zhí)行Web標(biāo)準(zhǔn)的情況,，保證你的站點(diǎn)在主要瀏覽器上都能正常運(yùn)行,。你至少要測(cè)試以下引擎：Gecko（用于Firefox）、Webkit（用于Safari,、Chrome和一些手機(jī)瀏覽器）,、IE（你可以利用微軟發(fā)布的Application Compatibility VPC Images進(jìn)行測(cè)試）和Opera。同時(shí),，不同的操作系統(tǒng),，可能也會(huì)影響瀏覽器如何呈現(xiàn)你的網(wǎng)站,。 1.2 除了瀏覽器,，網(wǎng)站還有其他使用方式：手機(jī)、屏幕朗讀器,、搜索引擎等等,。你應(yīng)該知道在這些情況下，你的網(wǎng)站的運(yùn)行狀況,。MobiForge提供了手機(jī)網(wǎng)站開發(fā)的一些相關(guān)知識(shí),。 1.3 知道如何在基本不影響用戶使用的情況下升級(jí)網(wǎng)站。通常來(lái)說(shuō),，你必須有版本控制系統(tǒng)（CVS,、Subversion、Git等等）和數(shù)據(jù)備份機(jī)制（backup）,。 1.4 不要讓用戶看到那些不友好的出錯(cuò)提示,。 1.5 不要直接顯示用戶的Email地址，至少不要用純文本顯示,。 1.6 為你的網(wǎng)站設(shè)置一些合理的使用限制,，一旦超過(guò)門檻值，就自動(dòng)停止服務(wù),。（這也與網(wǎng)站安全相關(guān),。） 1.7 知道如何實(shí)現(xiàn)網(wǎng)頁(yè)的漸進(jìn)式增強(qiáng)（progressive enhancement）。 1.8 用戶發(fā)出POST請(qǐng)求后,，總是將其重導(dǎo)向（redirect）至另外一個(gè)網(wǎng)頁(yè),。 1.9 不要忘記網(wǎng)站的可訪問(wèn)性（accessibility，即殘疾人如何使用網(wǎng)站）,。對(duì)于美國(guó)網(wǎng)站來(lái)說(shuō),，有時(shí)這是法定要求。WAI-ARIA有一些這方面很好的參考資料,。 二,、安全性（Security） 2.1 閱讀《OWASP開發(fā)指南》，它提供了全面的網(wǎng)站安全指導(dǎo)。 2.2 了解SQL注入（SQL injection）及其預(yù)防方法,。 2.3 永遠(yuǎn)不要信任用戶提交的數(shù)據(jù)（cookie也是用戶端提交的?。?/p> 2.4 不要明文（plain-text）儲(chǔ)存用戶的密碼,，要hash處理后再儲(chǔ)存,。 2.5 不要對(duì)你的用戶認(rèn)證系統(tǒng)太自信，它可能很容易就被攻破,，而你事先根本沒意識(shí)到存在相關(guān)漏洞,。 2.6 了解如何處理信用卡。 2.7 在登錄頁(yè)面及其他處理敏感信息的頁(yè)面,，使用SSL/HTTPS,。 2.8 知道如何對(duì)付session劫持（session hijacking）。 2.9 避免"跨站點(diǎn)執(zhí)行"（cross site scripting,，XSS）,。 2.10 避免"跨域偽造請(qǐng)求"（cross site request forgeries，XSRF）,。 2.11 及時(shí)打上補(bǔ)丁,，讓你的系統(tǒng)始終跟上最新版本。 2.12 確認(rèn)你的數(shù)據(jù)庫(kù)連接信息的安全性,。 2.13 跟蹤攻擊技術(shù)的最新發(fā)展,，以及你使用的平臺(tái)的最新安全漏洞。 2.14 閱讀Google的《瀏覽器安全手冊(cè)》（Browser Security Handbook）,。 2.15 閱讀《網(wǎng)絡(luò)軟件的黑客手冊(cè)》（The Web Application Hackers Handbook）,。 三、性能（Performance） 3.1 只要有可能,，就使用緩存（caching）,。正確理解和使用HTTP caching與HTML5離線儲(chǔ)存。 3.2 優(yōu)化圖片,。不要把一個(gè)20KB的圖片文件,，作為重復(fù)出現(xiàn)的網(wǎng)頁(yè)背景圖案。 3.3 學(xué)習(xí)如何用gzip/deflate壓縮內(nèi)容（deflate方式更可?。?。 3.4 將多個(gè)樣式表文件或腳本文件，合為一個(gè)文件,，這樣可以減少瀏覽器的http請(qǐng)求數(shù),，以及減小gzip壓縮后的文件總體積。 3.5 瀏覽Yahoo的Exceptional Performance網(wǎng)站,，里面有大量提升前端性能的優(yōu)秀建議,，還有他們的YSlow工具,。Google的page speed則是另一個(gè)用來(lái)分析網(wǎng)頁(yè)性能的工具。兩者都要求安裝Firebug,。 3.6 如果你的網(wǎng)頁(yè)用到大量的小體積圖片（比如工具欄）,，就應(yīng)該使用CSS Image Sprite，目的是減少http請(qǐng)求數(shù),。 3.7 大流量的網(wǎng)站應(yīng)該考慮將網(wǎng)頁(yè)對(duì)象分散在多個(gè)域名（split components across domains）,。 3.8 靜態(tài)內(nèi)容（比如圖片、CSS,、JavaScript、以及其他cookie無(wú)關(guān)的網(wǎng)頁(yè)內(nèi)容）都應(yīng)該放在一個(gè)不需要使用cookie的獨(dú)立域名之上,。因?yàn)橛蛎氯绻衏ookie,，那么客戶端向該域名發(fā)出的每次http請(qǐng)求，都會(huì)附上cookie內(nèi)容,。這里的一個(gè)好方法就是使用"內(nèi)容分發(fā)網(wǎng)絡(luò)"（Content Delivery Network,，CDN）。 3.9 將瀏覽器完成網(wǎng)頁(yè)渲染所需要的http請(qǐng)求數(shù)最小化,。 3.10 使用Google的Closure Compiler壓縮JavaScript文件,，YUI Compressor亦可。 3.11 確保網(wǎng)站根目錄下有favicon.ico文件,，因?yàn)榧词咕W(wǎng)頁(yè)中根本不包括這個(gè)文件,，瀏覽器也會(huì)自動(dòng)發(fā)出對(duì)它的請(qǐng)求。所以如果這個(gè)文件不存在,，就會(huì)產(chǎn)生大量的404錯(cuò)誤,，消耗光你的服務(wù)器的帶寬。 四,、搜索引擎優(yōu)化（Search Engine Optimization,，SEO） 4.1 使用"搜索引擎友好"的URL形式，比如/pages/45-article-title,，而不是/index.php?page=45,。 4.2 不要使用"點(diǎn)擊這里"之類的超級(jí)鏈接，因?yàn)檫@樣等于浪費(fèi)了一個(gè)SEO機(jī)會(huì),，而且降低了"屏幕朗讀器"（screen reader）的使用效果,。 4.3 創(chuàng)建一個(gè)XML sitemap文件，它的缺省位置一般是/sitemap.xml（即放在網(wǎng)站根目錄下）,。 4.4 當(dāng)你有多個(gè)URL指向同一個(gè)內(nèi)容時(shí),，在網(wǎng)頁(yè)代碼中使用<link rel="canonical" ... />。 4.5 使用Google的Webmaster Tools和Yahoo的Site Explorer,。 4.6 從一開始就使用Google Analytics（或者開源的訪問(wèn)量分析工具Piwik）,。 4.7 知道robots.txt的作用,，以及搜索引擎蜘蛛的工作原理。 4.8 將www.的訪問(wèn)請(qǐng)求導(dǎo)向（使用301 Moved Permanently重定向）,，或者采用相反的做法,，目的是防止Google把它們當(dāng)做兩個(gè)網(wǎng)站，分開計(jì)算排名,。 4.9 知道存在著惡意或行為不正當(dāng)?shù)木W(wǎng)絡(luò)蜘蛛,。 4.10 如果你的網(wǎng)站有非文本的內(nèi)容（比如視頻、音頻等等）,，你應(yīng)該參考Google的sitemap擴(kuò)展協(xié)議,。 五、技術(shù)（Technology） 5.1 理解HTTP協(xié)議,，以及諸如GET,、POST、sessions,、cookies之類的概念,，包括"無(wú)狀態(tài)"（stateless）是什么意思。 5.2 確保你的XHTML/HTML和CSS符合W3C標(biāo)準(zhǔn),，使得它們能夠通過(guò)檢驗(yàn),。這可以使你的網(wǎng)頁(yè)避免觸發(fā)瀏覽器的古怪行為（quirk），而且使它在"屏幕朗讀器"和手機(jī)上也能正常工作,。 5.3 理解瀏覽器如何處理JavaScript腳本,。 5.4 理解網(wǎng)頁(yè)上的JavaScript文件、樣式表文件和其他資源是如何裝載及運(yùn)行的,，考慮它們對(duì)頁(yè)面性能有何影響,。在某些情況下，可能應(yīng)該將腳本文件放置在網(wǎng)頁(yè)的尾部,。 5.5 理解JavaScript沙箱（Javascript sandbox）的工作原理,，尤其是如果你打算使用iframe。 5.6 知道JavaScript可能無(wú)法使用或被禁用,，以及Ajax并不是一定會(huì)運(yùn)行,。記住，"不允許腳本運(yùn)行"（NoScript）正在某些用戶中變得流行,，手機(jī)瀏覽器對(duì)腳本的支持千差萬(wàn)別,，而Google索引網(wǎng)頁(yè)時(shí)不運(yùn)行大部分的腳本文件。 5.7 了解301重定向和302重定向之間的區(qū)別（這也是一個(gè)SEO相關(guān)問(wèn)題）,。 5.8 盡可能多得了解你的部署平臺(tái)（deployment platform）,。 5.9 考慮使用樣式表重置（Reset Style Sheet）。 5.10 考慮使用JavaScript框架（比如jQuery,、MooTools,、Prototype）,，它們可以使你不用考慮瀏覽器之間的差異。 六,、解決bug 6.1 理解程序員20%的時(shí)間用于編碼,，80%的時(shí)間用于維護(hù)，根據(jù)這一點(diǎn)相應(yīng)安排時(shí)間,。 6.2 建立一個(gè)有效的錯(cuò)誤報(bào)告機(jī)制,。 6.3 建立某些途徑或系統(tǒng)，讓用戶可以與你接觸,，向你提出建議和批評(píng),。 6.4 為將來(lái)的維護(hù)和客服人員撰寫文檔，解釋清楚系統(tǒng)是怎么運(yùn)行的,。 6.5 經(jīng)常備份?。ú⑶掖_保這些備份是有效的。）除了備份機(jī)制,，你還必須有一個(gè)恢復(fù)機(jī)制。 6.6 使用某種版本控制系統(tǒng)儲(chǔ)存你的文件,，比如Subversion或Git,。 6.7 不要忘記做單元測(cè)試（Unit Testing），Selenium之類的框架會(huì)對(duì)你有用,。 （完） 原文：http://www./blog/2010/11/61_things_every_web_developer_should_know.html
|
|
|
