我最喜歡web開(kāi)發(fā)的一點(diǎn)是，它包括許多許多不同的技能。作為一個(gè)好的開(kāi)發(fā)者，一定要好好學(xué)習(xí)，天天向上，因?yàn)槲覀冇泻芏嘀匾募寄芤獙W(xué)習(xí)，而且它們總是在不停的發(fā)生變化。

這里我列出了其中最為重要的10個(gè)技能，它們有點(diǎn)傾向于前端開(kāi)發(fā)，但總體上適合所有的開(kāi)發(fā)人員：

1. 正則表達(dá)式
2. 基本SEO
3. 不錯(cuò)的Javascript庫(kù)
4. 跨瀏覽器調(diào)試
5. 圖片處理和優(yōu)化
6. 用有效的HTML/CSS進(jìn)行布局（不適用表）
7. 版權(quán)/基本網(wǎng)絡(luò)法規(guī)
8. Apache rewrite
9. 調(diào)試軟件
10. 版本控制

1. 正則表達(dá)式

正則表達(dá)式 常用于字符串的解析.其最基礎(chǔ)的運(yùn)用便是文本中字符的查找與替換了。而這看起來(lái)并不算什么，正則表達(dá)式的多樣性是其真正強(qiáng)大的原因。往往可以通過(guò)很多方法來(lái)優(yōu)化你的正則表達(dá)式，這也意味著你的應(yīng)用程序的性能的大幅提升。 正則表達(dá)式適用于任何一種編程語(yǔ)言，像JavaScript的replace() ,PHP的 preg_replace(), Apache rewrites等等。 奇怪是的只有為數(shù)不多的web開(kāi)發(fā)者認(rèn)為正則表達(dá)式相當(dāng)有用，如果你還沒(méi)有學(xué)習(xí)，那就準(zhǔn)備好開(kāi)始吧 learn regular expressions。  

2. 基本的搜索引擎優(yōu)化

[[60159]]

對(duì)于網(wǎng)絡(luò)開(kāi)發(fā)者來(lái)說(shuō)，了解搜索引擎優(yōu)化的基本信息是必須的。雖然你可以預(yù)留導(dǎo)向你客戶(hù)端的關(guān)鍵字，開(kāi)發(fā)人員應(yīng)該用有更合理的在頁(yè)面上安排這些關(guān)鍵字的策略。這意味著，在整理前端的標(biāo)記，好好利用 <TITLE>、<META>、<h1>和<h2>標(biāo)簽，同時(shí)在后端組織更加穩(wěn)固的的鏈接和目錄結(jié)構(gòu)。 我找到的學(xué)習(xí)SEO的***資源是 Beginner’s Guide to Search Engine Optimization 和 Search Engine Ranking Factors v2，二者都來(lái)自 SEOmoz。

3. 一個(gè)優(yōu)秀的Javascript庫(kù)

[[60160]]

即使你不太寫(xiě)Javascript代碼，掌握一個(gè)優(yōu)秀的Javascript庫(kù)也會(huì)帶來(lái)很大的幫助。無(wú)論是jQuery（我的***）、Mootools，還是其它什么庫(kù)，都可以讓你的Javascript開(kāi)發(fā)工作事半功倍。首先，這些庫(kù)都提供了跨瀏覽器的功能，使你可以直接上手，不需要再去管這方面的事情。而且，它們都提供了大量簡(jiǎn)單的動(dòng)畫(huà)，像在DOM中選擇節(jié)點(diǎn)這類(lèi)工作變得易如反掌。 更大膽的Javascript程序員也許會(huì)想要接觸Javascript UI語(yǔ)言。以上說(shuō)的幾種庫(kù)都有相關(guān)的插件，但我個(gè)人推薦Dojo with Dijit。

4. 跨瀏覽器調(diào)試

[[60161]]

為了讓網(wǎng)站被更多的人看到，顯然應(yīng)該讓它支持所有主流瀏覽器（IE6、IE7、IE8、FF2、FF3、Safari 4和Opera 9）。每個(gè)人都很厭惡跨瀏覽器調(diào)試，但 ***的方式是預(yù)防，從有效的HTML和良好的reset樣式表開(kāi)始。就我來(lái)說(shuō)，是使用* {magin:0; padding: 0}。不過(guò)，大家也可以使用其它更健壯的方式。 另外，還應(yīng)了解某些瀏覽器的怪癖。***的當(dāng)然是IE家族，特別是IE6（沒(méi)錯(cuò)，一直是它，依然是它）。盡管大多數(shù)問(wèn)題可以歸結(jié)為臭名昭著的haslayout bug，但你不能依賴(lài)某些笨拙的方式來(lái)解決它，例如* {zoom: 1}。

5. 圖片處理和優(yōu)化

[[60162]]

盡管大多數(shù)程序員都是靠專(zhuān)業(yè)的設(shè)計(jì)師來(lái)設(shè)計(jì)圖片，但懂點(diǎn)Photoshop對(duì)程序員來(lái)說(shuō)也很重要。掌握一些圖片處理技術(shù)之后，一些小修改就不需要再踢回給設(shè)計(jì)師，直接自己改了就是，而且，在修改設(shè)計(jì)時(shí)，你還會(huì)馬上知道是否可行。 圖片優(yōu)化是Photoshop技能里對(duì)web程序員最為重要的一項(xiàng)。圖片的大小往往是對(duì)帶寬***的威脅，圖片優(yōu)化直接關(guān)系到網(wǎng)站的載入時(shí)間。 Photoshop和Illustrator的「Save for Web」選項(xiàng)極大地簡(jiǎn)化了圖片優(yōu)化環(huán)節(jié)，大家只需要在PC上按下Ctrl-Alt-Shift-S或在Mac上按下Command-Alt-Shift- S即可進(jìn)入這一向?qū)А?/p>

6. 使用有效的 HTML/CSS 進(jìn)行頁(yè)面布局（而非表格）

我們需要重視：現(xiàn)在已經(jīng)不是1996年了，即時(shí)是后端開(kāi)發(fā)者也應(yīng)該知道如何寫(xiě)好前端代碼，——使用有效的 HTML 和 CSS——而非一堆表格。標(biāo)記應(yīng)當(dāng)整潔，CSS 和其它類(lèi)型的文檔應(yīng)當(dāng)同 HTML 分離，這樣，就不會(huì)有內(nèi)聯(lián)樣式，特別是不會(huì)有 <font> 標(biāo)簽。 初學(xué)者應(yīng)當(dāng)學(xué)學(xué)到 CSS 標(biāo)簽 以及 CSS 盒子模型。然后學(xué)學(xué) W3C規(guī)則，了解如何寫(xiě)出合理的代碼 你寫(xiě)的 HTML 應(yīng)該符合 xHTML 規(guī)則;應(yīng)該有著合理的嵌套、閉合且含有 alt 屬性信息的圖片標(biāo)簽等等。然后你可以去了解那些節(jié)點(diǎn)能夠嵌套在其它節(jié)點(diǎn)中，已經(jīng)其它的復(fù)雜內(nèi)容。***，你會(huì)發(fā)現(xiàn) w3c 的HTML標(biāo)記驗(yàn)證程序 不再報(bào)錯(cuò)，這樣真的很爽。

7. 版權(quán)/網(wǎng)絡(luò)法規(guī)的基礎(chǔ)

[[60163]]

雖然無(wú)需法學(xué)學(xué)位，但開(kāi)發(fā)者***能夠?qū)Π鏅?quán)和網(wǎng)絡(luò)法規(guī)有基本的了解。 因?yàn)榫W(wǎng)頁(yè)從本質(zhì)上來(lái)講，是一種出版物，而著作權(quán)則是網(wǎng)站最常見(jiàn)的法律問(wèn)題。從用戶(hù)生成的盜取Flicker 圖片的內(nèi)容到對(duì)紐約時(shí)報(bào)內(nèi)容大段的引用，如果不想被起訴，或是收到投訴信件，你***了解這些。當(dāng)然，如果你想提起訴訟或是投遞投訴信，你也***了解這些。 除了著作權(quán)法之外，簽訂注冊(cè)/使用主機(jī)托管或是軟件的協(xié)議時(shí)，你***也好好看看隱私協(xié)議和 COPPA（美國(guó)兒童網(wǎng)路隱私保護(hù)法） 的規(guī)定。

8. Apache 重寫(xiě)

[[60164]]

Apache 的重寫(xiě)功能使原本凌亂的 URL 更加整潔（只要你了解正則表達(dá)式）。你可以將難看的地址： index.php?section=about&page=bioand 重寫(xiě)位更漂亮的：about/bio。 不僅限于規(guī)整 URL，使用 Apache 的 mod_rewrite 能夠很容易的將簡(jiǎn)單的一個(gè)頁(yè)面變成包含路徑的完整應(yīng)用。只需要將查詢(xún)的變量重寫(xiě)為路徑即可。
同樣，你要注意： Apache 重寫(xiě)也是出了名的不好調(diào)試。重寫(xiě)規(guī)則無(wú)法包含任何調(diào)試信息，且常常忽略你引用的其它方法的信息。因此，重寫(xiě)也會(huì)導(dǎo)致一些無(wú)法追蹤的錯(cuò)誤。

9. 調(diào)試工具

[[60165]]

一個(gè)好的調(diào)試器能讓你更快的進(jìn)行網(wǎng)頁(yè)編程。 當(dāng)進(jìn)行前端調(diào)試時(shí)，我喜歡用 Firebug ，你可以點(diǎn)擊頁(yè)面上的元素，它將統(tǒng)計(jì)樣式表中的那些生效的設(shè)置。你可以添加或刪除樣式，同時(shí)也可以修改頁(yè)面。 Firebug 也可以用來(lái)調(diào)試 Javascript。作為 Javascript 的運(yùn)行控制臺(tái)，它能夠更好的組織錯(cuò)誤信息，顯示 fromconsole.log() 的輸出內(nèi)容。***，它還提供網(wǎng)絡(luò)信息，顯示頁(yè)面元素加載事件，以及那些無(wú)法加載，無(wú)法獲取的內(nèi)容。 我不知道如何進(jìn)行后端調(diào)試，不過(guò)我聽(tīng)說(shuō) PHP 有個(gè)叫做 xDebug 的東東。

10. 版本控制

[[60166]]

***但很重要的一點(diǎn), 一個(gè)好的程序員應(yīng)該學(xué)會(huì)控制你的版本。版本控制不僅僅是對(duì)你工作的備份的一種途徑，而且也是你跟其他開(kāi)發(fā)者合作的重要方式。  我個(gè)人比較喜歡 distributed as opposed to centralized （分布式相對(duì)集中）版本控制的方式, 因?yàn)樗袃蓚€(gè)不同層級(jí)的版本控制：你可以先將你的部分修改提交到本地存儲(chǔ)中心，之后將所有的更改推送到服務(wù)器端存儲(chǔ)。這樣允許你在本地做一個(gè)小幅度不穩(wěn)定的修改，然后將團(tuán)隊(duì)中的更新集中提交。 如果采用分布式的版本控制我比較看好 Mercurial, 而如果是集中是的 Subversion很不錯(cuò).

英文原文：10 Things Every Good Web Developer Should Know (A Checklist)

譯文鏈接：http://www.oschina.net/translate/10-things-every-web-developer-should-know