WEB開發(fā)本身涵蓋了許多領(lǐng)域的許多技術(shù)，那么，有哪些是WEB開發(fā)者必備的技能呢？這是一個(gè) Quora 上用戶提出的問題，其中Ellyse Taylor的回答獲得了1900+的贊同，今天就Coder資源網(wǎng)就為大家翻譯整理其回答內(nèi)容，希望大家能夠從中學(xué)到一些東西。

By Ellyse Taylor：

可能很多人對下面這個(gè)列表中的大部分內(nèi)容都已經(jīng)了解了，但其中必定有一些是你之前沒有看到過，或者沒有完全理解的，甚至有些你可能從來沒聽說過。

1. 界面和用戶體驗(yàn)

• 注意，瀏覽器的實(shí)現(xiàn)標(biāo)準(zhǔn)是不一致的，請確保你的網(wǎng)站能夠兼容所有主流的瀏覽器。最少需要測試的有 Gecko 引擎(Firefox)，WebKit引擎(Safari以及一些手機(jī)瀏覽器)，Chrome，你所要支持的 IE 瀏覽器，以及 Opera。此外，你還需要了解不同系統(tǒng)下，瀏覽器是如何渲染網(wǎng)頁的。
• 考慮一下人們不使用主流瀏覽器的情況，如手機(jī)，屏幕閱讀器和搜索引擎。一些可用的輔助信息：WAI 和 Section508，移動開發(fā)：MobiForge。
• 階段：如何在不影響用戶的情況下部署更新。有一個(gè)或多個(gè)可以用來改變架構(gòu)、代碼或全部內(nèi)容，并確保它們在可控范圍內(nèi)實(shí)現(xiàn)部署的測試或臨時(shí)環(huán)境。有一種自動化的方式把更新部署到線上網(wǎng)站。最有效的實(shí)現(xiàn)方式是結(jié)合使用版本控制系統(tǒng)(CVS、Subversion等)和自動構(gòu)建機(jī)制(Ant、NAnt等)。
• 不要直接向用戶顯示不友好的錯(cuò)誤信息。
• 不要用純文本的方式顯示用戶的電子郵件，因?yàn)樗麄兛赡軙焕]件煩到死。
• 為用戶生成的鏈接添加 rel=”nofollow” 屬性，以避免垃圾郵件。
• 為你的網(wǎng)站建立周全的限制–這條也同時(shí)屬于安全方面。
• 學(xué)習(xí)如何進(jìn)一步的提高。
• POST 提交成功后進(jìn)行重定向，以免刷新造成重復(fù)提交。
• 別忘了考慮無障礙訪問。這總是不錯(cuò)的，在某些情況下，這甚至是法律要求的。 WAI-ARIA 和 WCAG 2 里都有關(guān)于這方面很好的資源。
• 不要讓我思考。

2. 安全

• OWASP開發(fā)指南 幾乎覆蓋了網(wǎng)站安全所有的內(nèi)容。
• 了解注入，尤其是 SQL注入，并學(xué)會如何阻止它。
• 永遠(yuǎn)不要相信用戶的輸入，以及其他任何請求（包括Cookies和隱藏域的值）。
• 使用鹽值(salt)哈希密碼，并對不同的行使用不同的鹽值，防止攻擊。使用哈希算法如 bcrypt 或 scrypt(更安全，但比較新)(1, 2)來存儲密碼。(如何安全的存儲密碼)。NIST也允許使用PBKDF2來加密密碼。避免直接使用 MD5 和 SHA 等算法。
• 不要企圖拿出自己喜歡的認(rèn)證系統(tǒng)。這是很容易出錯(cuò)的，并且是不可測的，甚至直到你被攻擊了你才知道。
• 了解信用卡處理規(guī)則。(也可查看該問題)
• 在登錄頁和任何需要輸入敏感數(shù)據(jù)的頁面使用SSL/HTTPS。
• 防止 session 被劫持。
• 避免跨站腳本(XSS)。
• 避免點(diǎn)擊劫持。
• 保持系統(tǒng)更新到最新的補(bǔ)丁。
• 確保數(shù)據(jù)庫連接信息的安全。
• 讓自己了解最新的攻擊技術(shù)和會影響你平臺的漏洞。
• 閱讀谷歌瀏覽器安全手冊。
• 閱讀WEB應(yīng)用黑客手冊。
• 考慮最小特權(quán)原則，盡量使用非root用戶運(yùn)行服務(wù)器(以tomcat為例)。

3. 性能

• 如果有必要的話，實(shí)現(xiàn)緩存，請正確理解和使用HTTP緩存。
• 優(yōu)化圖片。不要使用20K的圖片作為平鋪背景。
• 學(xué)習(xí)如何 gzip/deflate 內(nèi)容（deflate效果更好）。
• 合并樣式表與腳本文件以減小瀏覽器鏈接數(shù)，同時(shí)提高 gzip 的壓縮能力。
• 瀏覽雅虎性能卓越的網(wǎng)站，以及大量的指南，其中包含提升前端性能和YSlow工具（需要安裝Firefox, Safari, Chrome 或 Opera）。此外，Google page speed(瀏覽器擴(kuò)展)也是一個(gè)性能分析工具，它同時(shí)可以優(yōu)化你的圖片。
• 對于小的如工具欄圖片，使用CSS Image Sprites(參考最小化HTTP請求)。
• 訪問量大的網(wǎng)站應(yīng)該考慮跨域拆分組件。
• 靜態(tài)內(nèi)容（如圖片、CSS、JavaScript及不需要訪問cookie的內(nèi)容）應(yīng)該放在一個(gè)單獨(dú)的域下，因?yàn)橛蚣捌渥佑虻拿恳粋€(gè)請求都會發(fā)送cookie。這里是使用內(nèi)容分發(fā)網(wǎng)絡(luò)（CDN）的一個(gè)很好的選擇。
• 減少瀏覽器渲染頁面所需的HTTP請求的總數(shù)量。
• 利用Google Closure Compiler及其他壓縮JS的工具。
• 確保網(wǎng)站根目錄下有一個(gè)favicon.ico文件，即使在HTML中并沒有提到它，瀏覽器也會自動加載它。如果你沒有 /favicon.ico ，就會返回很多404錯(cuò)誤，消耗服務(wù)器帶寬。

4. SEO (Search Engine Optimization) 搜索引擎優(yōu)化

• 使用“搜索引擎友好”的URL，如 http://example.com/pages/45-article-title 而不是 http://ofexample.com/index.php?page=45。
• 在動態(tài)內(nèi)容中，把 # 改成 #! ，然后在服務(wù)器端使用$_REQUEST["_escaped_fragment_"]。換句話說 ./#!page=1 變成了 ./?_escaped_fragments_=page=1。此外，對于使用 FF.b4 or Chromium 的用戶，history.pushState({"foo":"bar"}, "About", "./?page=1"); 是一個(gè)非常棒的命令。因此，即使地址欄已經(jīng)改變了，頁面也不會刷新。
• 不要使用“點(diǎn)擊這里”這樣的鏈接。你是在浪費(fèi)一個(gè)搜索引擎優(yōu)化的機(jī)會，而且它讓使用用屏幕閱讀器人們更難閱讀。
• 有一個(gè)XML網(wǎng)站地圖，最好在默認(rèn)位置 /sitemap.xml。
• 當(dāng)有多個(gè)URL指向同一個(gè)內(nèi)容的時(shí)候，使用 <link rel="canonical" ... /> ，這個(gè)問題可以通過 Google Webmaster Tools 來解決。
• 使用 Google Webmaster Tools 和 Bing Webmaster Tools。
• 安裝 Google Analytics 或者其他開源分析工具如：Piwik。
• 了解 robots.txt 及搜索引擎蜘蛛 是如果工作的。
• 使用重定向（301）www.example.com 到 example.com(或者反過來)，防止它們平分谷歌網(wǎng)站排名。
• 要知道有 badly-behaved 蜘蛛的存在。
• 如果你的網(wǎng)站有非文本內(nèi)容，Tim Farley 的回答中有一些非常有用的信息。

5. 技術(shù)

• 理解HTTP以及GET、POST、session、cookie以及“無狀態(tài)”的意思。
• 撰寫XHTML/HTML和CSS要遵循W3C規(guī)范，并確保它們通過校驗(yàn)。這樣做的目的是為了避免瀏覽器的怪癖模式，并且這使得非標(biāo)準(zhǔn)瀏覽器如屏幕閱讀器和移動設(shè)備更加容易實(shí)現(xiàn)。
• 理解瀏覽器是如何處理JavaScript 的。
• 理解JavaScript 、樣式表、以及頁面使用的其他資源是如何加載的，并考慮它們對感知性能的影響?，F(xiàn)在普遍認(rèn)同的一種做法是把除分析代碼等以外的腳本文件放在頁面底部。
• 了解JavaScript 沙箱是如何工作的，特別是當(dāng)你想使用 iframe 的時(shí)候。
• 需要注意到，JavaScript是可以被禁用的，因此AJAX只是一個(gè)擴(kuò)展，而不是基準(zhǔn)。雖然大部分用戶并沒有禁用它，但記住，NoScript正在變得越來越流行。并且，谷歌在索引你的網(wǎng)站時(shí)也不會運(yùn)行JavaScript。
• 學(xué)習(xí) 301 和 302 重定向之間的不同。
• 盡可能多地了解你的部署平臺。
• 考慮使用 Reset Style Sheet 或 normalize.css。
• 考慮使用JavaScript框架(如jQuery, MooTools, Prototype, Dojo 或 YUI 3)，這可以避免很多使用JavaScript操作DOM時(shí)的差異。
• 在考慮感知性能和框架的同時(shí)，考慮使用服務(wù)，如Google Libraries API，來加載框架，這樣瀏覽器可以使用已經(jīng)緩存的框架而不是從你的網(wǎng)站上下載。
• 不要重復(fù)造輪子。在做任何事情之前，先搜索相關(guān)的組件或者實(shí)例。99%的可能別人已經(jīng)實(shí)現(xiàn)了并發(fā)布出了開源的代碼。
• 在確定需求之前，盡量不要使用超過20個(gè)的庫，這是非常不利的。特別是客戶端WEB，保存輕便、快速、靈活是最重要的。

6. BUG修復(fù)

• 要了解你花費(fèi)20%的時(shí)間寫代碼而花費(fèi)80%的時(shí)間來維護(hù)，因此寫代碼時(shí)一定注意。
• 建立一個(gè)好的錯(cuò)誤報(bào)告解決方案。
• 建立一個(gè)別人可以提建議和批評的系統(tǒng)。
• 為未來的支持人員和維護(hù)人員建立良好的文檔。
• 經(jīng)常備份！Ed Lucas 的回答中有一些建議。有一個(gè)恢復(fù)策略，而不只是一個(gè)備份策略。
• 使用版本控制系統(tǒng)，如 Subversion、Mercurial 或 Git。
• 不要忘記驗(yàn)收測試。Selenium 等框架可以幫到你。
• 請確保您有足夠的日志記錄的地方，可以使用框架如log4j, log4net 或 log4r。當(dāng)網(wǎng)站出現(xiàn)問題的時(shí)候，你需要能夠找到問題所在。
• 日志要記錄已處理異常和未處理異常。分析日志輸出，因?yàn)樗鼤@示出你網(wǎng)站的關(guān)鍵問題。

這里有些省略的東西并不是因?yàn)樗鼈儧]用，而是因?yàn)樗鼈冞^于詳細(xì)或者超出了范圍，或者說的太遠(yuǎn)了。當(dāng)然，上面的內(nèi)容可能也有一些遺漏或者錯(cuò)誤。

via：Quora，由 Specs 翻譯整理，發(fā)布在 Coder資源網(wǎng)，轉(zhuǎn)載請注明來源。