HTML5 Boilerplate

web 開發(fā)團(tuán)隊(duì)的一個(gè)常見實(shí)踐是創(chuàng)建一組標(biāo)準(zhǔn)文件，團(tuán)隊(duì)成員基于它們開始 web 開發(fā)流程，包括一個(gè)公共文件結(jié)構(gòu)、基本命名慣例和標(biāo)準(zhǔn)庫(kù)。這樣做能夠更容易啟動(dòng)并運(yùn)行一個(gè)項(xiàng)目。它還能將開發(fā)人員引向內(nèi)部編碼標(biāo)準(zhǔn)并實(shí)施標(biāo)準(zhǔn)文件組織。 HTML5 Boilerplate 就是這種處于 web 開發(fā)最前沿的完美理念的實(shí)現(xiàn)。

結(jié)合了使用 HTML5 需要的幾個(gè)增強(qiáng)和許多其他最佳實(shí)踐，只需最少的前期投資，HTML5 Boilerplate 就能為您的項(xiàng)目提供一個(gè)堅(jiān)如磐石的基礎(chǔ)。本文簡(jiǎn)述了使用 HTML5 Boilerplate 來(lái)開始一個(gè)項(xiàng)目的方法，展示了一些能夠?qū)ζ溥M(jìn)行調(diào)優(yōu)，使其適應(yīng)一個(gè)已有框架和編碼風(fēng)格的方法。

HTML5 Boilerplate 的核心是用于幫助開發(fā) HTML5 站點(diǎn)和應(yīng)用程序的組件，包括：

• Modernizr，一個(gè)小型實(shí)用程序庫(kù)，支持在 Windows? Internet Explorer? 中設(shè)置新的 HTML5 元素樣式，并協(xié)助在所有瀏覽器中進(jìn)行 HTML5/CSS3 特性檢測(cè)。如果您正在使用 HTML5 進(jìn)行開發(fā)且需要支持 Internet Explorer 版本 9 之前的瀏覽器版本 ，那么這個(gè)庫(kù)（或者我稍后將解釋的一個(gè)替代選項(xiàng)）將是您的項(xiàng)目必不可少的一個(gè)組件。
• 構(gòu)建于 HTML5 Doctor Reset 之上的一個(gè) CSS 起始文件，包含幾個(gè)智能默認(rèn)值和增強(qiáng)。
• 內(nèi)置 HTML5 語(yǔ)法，以及一些新的語(yǔ)義元素，用于構(gòu)成您文檔的骨架。

除了這些核心的 HTML5 相關(guān)特性，該項(xiàng)目還實(shí)現(xiàn)了幾個(gè)優(yōu)秀的最佳實(shí)踐。下面列出了部分最佳實(shí)踐：

• 在整個(gè)項(xiàng)目過(guò)程中非常關(guān)注前端性能，采用適當(dāng)?shù)慕Y(jié)構(gòu)（CSS 位于頂部，JavaScript 代碼位于底部），一個(gè) Google Analytics 異步實(shí)現(xiàn)，以及項(xiàng)目的 Apache ANT 構(gòu)建腳本中提供的幾個(gè)基于性能的增強(qiáng)。
• 幾個(gè)跨瀏覽器助手，包括 HTML 元素上的特定于 Internet Explorer 版本的類和一個(gè)針對(duì) Internet Explorer 版本 6 的自動(dòng) PNG 補(bǔ)丁。
• 樣例 .htaccess 和 web.config 文件，幫助您設(shè)置您的服務(wù)器來(lái)利用 HTML5 特性和 web 字體并通過(guò)一個(gè)智能緩存策略加速您的站點(diǎn)。
• 遠(yuǎn)遠(yuǎn)超出典型重置范圍的 CSS 增強(qiáng)。這個(gè)樣式表使用精心挑選和偶爾聰明的默認(rèn)值重構(gòu)元素。它還添加了幾個(gè)方便的助手類。常見的 .clearfix 類是您需要熟悉的類，.hidden 和 .visuallyhidden 等類也包含在內(nèi)且非常有用。骨架打印樣式（Skeleton print styles）、分頁(yè)媒體樣式和用于快速響應(yīng) web 設(shè)計(jì)的媒體查詢也被包含進(jìn)來(lái)。

盡管看起來(lái)已經(jīng)不少了，但上面的列表只是這個(gè)項(xiàng)目附帶的最佳實(shí)踐的一個(gè)樣本。即使對(duì)于持續(xù)關(guān)注這些事情的人來(lái)說(shuō)，這也是一個(gè)令人印象深刻的集 合。事實(shí)上，這個(gè)集合是如此令人印象深刻，以至于該項(xiàng)目承認(rèn)這樣一個(gè)事實(shí)：這個(gè)集合是 “刪除鍵友好的”。這句話的意思是：它是一個(gè)健壯的集合，并不是每個(gè)人都需要在每個(gè)項(xiàng)目中默認(rèn)包含每個(gè)特性。