|
網(wǎng)站中的一些規(guī)范以及標(biāo)準(zhǔn) 一,、 網(wǎng)站服務(wù)器文件部署 1、CSS樣式,、HTML結(jié)構(gòu),、JS行為三者獨(dú)立分開 2,、CSS樣式全部外置在樣式表中，放在文件夾/CSS/中,；JS等腳本文件統(tǒng)一外置在/js/文件夾中,；html文件根據(jù)不同的網(wǎng)站結(jié)構(gòu)有所不同 3、html的命名,，要能代表本頁面的含義,，建議英文單詞或者縮寫或者合成詞，不采用駝峰式,。 EXP1： 4,、每個(gè)完整的網(wǎng)站都應(yīng)該有一個(gè)SEO搜索引擎的引導(dǎo)文件，有些文件不需要搜索的就禁止去搜索,，減輕服務(wù)器壓力,。 EXP:
5、其他 二,、 符合W3C標(biāo)準(zhǔn),，在HTML結(jié)構(gòu)上的標(biāo)準(zhǔn) 1、 指定文檔類型 EXP1: 文檔類型為XHTML 1.0 Transitiona
EXP2: HTML5的標(biāo)準(zhǔn)是
2,、 指定統(tǒng)一的文檔編碼 全站所有網(wǎng)頁最好統(tǒng)一一個(gè)唯一的編碼,，全球最通用的國際編碼是UFT-8， 3,、 每個(gè)頁面統(tǒng)一地址欄logo EXP: 4,、 頁面的title要能代表整個(gè)網(wǎng)站的含義和本頁面的名稱（首頁除外） EXP1: EXP2: 5、 頁面中的Keywords最好加上 每個(gè)頁面一般只有一個(gè)核心關(guān)鍵詞,，頁面中盡量多的提高此關(guān)鍵詞的權(quán)重 6,、 頁面中的Description最好加上 對(duì)該頁面的一個(gè)最簡要的描述 7、 html標(biāo)簽語義化 EXP1：div表示塊狀標(biāo)記,； EXP2：p代表段落標(biāo)記,； EXP3：span行內(nèi)標(biāo)記； EXP4：ul,、ol,、li、dl,、dt,、dd表示列表標(biāo)記 8、 標(biāo)簽嵌套原則 行內(nèi)元素不可嵌套塊狀元素,，EXP：<span><div></div></span>這是不規(guī)范的,； 段落標(biāo)記不可嵌套塊狀元素，EXP：<p></p>不可嵌套DIV 9,、 標(biāo)簽要配對(duì)或要有結(jié)束標(biāo)記 EXP1：<div></div>,、<p></p> EXP2：<img />,、<br /> 10、 代碼注釋 a) HTML注釋 EXP:： b) CSS注釋： EXP: c) JS注釋 EXP: d) 其他 11,、 網(wǎng)頁的寬度,，這里設(shè)計(jì)師出layout的時(shí)候需要注意一下 EXP1：PC上有800px、960px,、1000px,、1200px、1280px,、1920px,、或者更大 EXP2：移動(dòng)平臺(tái)有320px、360px,、480px,、640px或者更大 三、 HTML內(nèi)容上的注意點(diǎn) 1,、圖片img標(biāo)簽需要加alt屬性,，表示該圖片代表的含義 2、內(nèi)容中禁止出現(xiàn)代碼字符 EXP1：英文尖括號(hào)<>和英文雙,、單引號(hào)”,、’，應(yīng)該使用 3,、其他 四、 javascript的規(guī)范 1,、JS文件的開頭信息包括：作者,、日期、功能,、參數(shù)
2,、
3、縮進(jìn) 縮進(jìn)的單位為四個(gè)空格,，可設(shè)定為4個(gè)空格的tab 4,、語句塊 1. 普通代碼段應(yīng)該看起來如下： while (!isDone) { doSomething(); isDone = moreToDo(); } 2. if語句如下： if (someCondition) { statements; } else if (someOtherCondition) { statements; } else { statements; } 3. for語句如下： for (initialization; condition; update) { statements; } 4. while語句如下： while (!isDone) { doSomething(); isDone = moreToDo(); } 5. do...while語句如下： do { statements; } while (condition); 6. switch語句如下： switch (condition) { case ABC: statements; //fallthrough case DEF: statements; break; default: statements; //最后的case語句不需要使用break } 7. try...catch...finally語句如下： try { statements; } catch (e) { statements; } finally { statements; } 5,、減少DOM訪問 l 緩存已經(jīng)訪問過的元素 var objButton = document.getElementById(’button’); // 在使用前置入變量 for (var I = 0; I < 10; I++) { // 不要直接獲取再操作 document.getElementById(’button’).innerHTML += i.toString(); // 這樣正確 objButton.innerHTML += i.toString(); } l "離線"更新節(jié)點(diǎn), 再將它們添加到樹中 for (var i = 0; i < items.length; i++) { var item = document.createElement("li"); item.appendChild(document.createTextNode("Option " + i); list.appendChild(item); } // 上面這樣的操作是很低效的 // 正確 var fragment = document.createDocumentFragment(); for (var i=0; i < items.length; i++){ var item = document.createElement("li"); item.appendChild(document.createTextNode("Option " + i); fragment.appendChild(item); } list.appendChild(fragment); l 避免使用 JavaScript 輸出頁面布局--應(yīng)該是 CSS 的事兒 element.style.backgroundColor = "blue"; element.style.color = "red"; element.style.fontSize = "12em"; // 盡量不要使用javascript同時(shí)更新一個(gè)元素的style // 應(yīng)該定義class，然后更新元素的class .newStyle { background-color: blue; color: red; font-size: 12em; } element.className = "newStyle"; 6,、始終使用分號(hào) 語句結(jié)束后請(qǐng)總是用分號(hào)結(jié)束它,。 var someItem = 'some string'; // 這里的分號(hào)不要省略，雖然對(duì)有些瀏覽器不用分號(hào)也可以 var doSomething = function() { return 'something'; }; // 這里的分號(hào)不要省略,，雖然對(duì)有些瀏覽器不用分號(hào)也可以 7,、文件引用方式 文件名全為小寫字母，單詞以下劃線分割,，后綴名使用*.js,。通用代碼放在項(xiàng)目根目錄下的js目錄中，模塊專屬代碼放在模塊目錄的js目錄中,。 /js/common.js // 通用的腳本庫文件路徑 /module/js/mod_add.js // 彩信增加模塊所用的js文件路徑 文件編碼使用UTF-8,。 文件方式的調(diào)用只使用type和src屬性，如下示例： <script type="text/javascript" src="js/filename.js"></script> 陽獅網(wǎng)帆Jacky |
|
|
