Web前端開發規範
1.文件書寫規範
1.1 基本要求
1) 頁面標簽的屬性和值用雙引號引起來
2) 所有頁面編碼均采用utf-8
1.2 書寫規範
1)文檔類型聲明及編碼:統一為html5聲明<!DOCTYPE html>;編碼統一為<meta charset=“utf-8”>
2)避免頁面裏面用<style></style>這種方式引入樣式。外鏈的樣式統一寫在<head></head>裏面。非特殊的js文件。統一放在頁面底部。
3)引入的js庫文件
壓縮版格式:jquery-1.8.2.min.js
非壓縮:jquery-1.8.2.js
4)class或者id命名規則: class=“right_nav”。
Js文件名稱用駝峰規則。如:leftMenu.js。
5)對於只包含一條聲明的樣式,為了易讀性和便於快速編輯,建議將語句放在同一行。對於帶有多條聲明的樣式,還是應當將聲明分為多行。每個選 擇器和屬性聲明總是使用新的一行。
/* 單行 */ .span1{
width:
60px;
} .span2
{
width:
140px;
}
/* 多行 */ .sprite
{
display:
inline-block;
width:
16px;
height:
15px;
background-image:
url(../img/sprite.png); }
6)一般情況下一個頁面ID不應該被多次應用於樣式,使用ID唯一有效的是確定網頁或整個站點中的位置。
7)使用4個空格,而不使用tab或者混用空格+tab作為縮進。
8)js禁止全局定義變量。
2.命名規範
1)頁面結構
容器: container 頁頭:header 內容:content/container
頁面主體:main 頁尾:footer 導航:nav 側欄:sidebar
欄目:column 頁面外圍控制整體布局寬度:wrapper
左右中:left right center
(2)導航
導航:nav 主導航:mainbav 子導航:subnav
頂導航:topnav 邊導航:sidebar 左導航:leftsidebar
右導航:rightsidebar 菜單:menu 子菜單:submenu
標題: title 摘要: summary
(3)功能
標誌:logo 廣告:banner 登陸:login 登錄條:loginbar
註冊:regsiter 搜索:search 功能區:shop 標題:title
加入:joinus 狀態:status 按鈕:btn 滾動:scroll