Web前端4
一 Head區域代碼規範
1 必須加入的標簽
1.1 關鍵字
<meta name="keywords" content="xxxx,xxxx,xxx,xxxxx,xxxx,">
1.2 css
<link href="../css/style.css" rel="stylesheet" type="text/css">
1.3 網頁顯示字符集
簡體中文
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
繁體中文
<meta http-equiv=
英語
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
1.4 網頁標題
<title>xxxxxxxxxxxxxxxxxx</title>
2 可選加入的標簽
2.1 公司版權註釋
<!--- The site is designed by Maiziedu 09/2015--->
2.2 網頁制作者信息
<meta name="author" content="[email protected]">
2.3 網站簡介
<meta name="DESCRIPTION" content="xxxxxxxxxxxxxxxxxx">
2.4 設定網站的到期時間，一旦網頁過期，必須到服務器上重新調閱
<meta http-equiv="expires" content="Wed,26 Feb 1997 08 : 21 : 57 GMT">
2.5 禁止瀏覽器從本地的緩存中調閱頁面內容
<meta http-equiv="Pragma" content="no-cache">
2.6 用來防止別人在框架裏調用你的頁面
<meta http-equiv="Window-target" content="_top">
2.7 自動跳轉
<meta http-equiv="Refresh" content="5:url=http://www.yahoo.con">
5指時間停留5秒
2.8 網頁搜索機器人向導，用來告訴搜索機器人哪些頁面需要索引，哪些頁面不需要索引
<meta name="robots" CONTENT="none">
CONTENT的參數有all、none、index、noindex、follow、nofollow，默認是all
2.9 收藏夾圖標
<link rel ="Shortcut Ion" href="favicon.ico">
2.10 所有的javascript的調用盡量采取外部調用
<script language="JavaScript" src="script/xxxx.js"></script>
二 字體規範
1 在設定字體樣式時對於文字字號樣式和行間距應必須使用css樣式表，禁止在頁面中出現<font size=?>標記
2 字體大小：在網頁中中文應首選使用宋體，英文和數字首選使用verdana和arial兩種字體，一般使用中文宋體的9pt和11pt或12px和14.7px這是經過優化的字號，黑體字或者宋體字加粗時，一般選用11pt和14.7px的字號比較合適
3 為了最大程度的發揮瀏覽器自動排版的功能，在一段完整的文字中請盡量不要使用<br>來人工幹預分段
4 不同於中的文字之間應該有一個半角空格，但避頭的符號之前和避尾的符號之後除外，漢字之間的標點要用全角標點，英文字母和數字周圍的括號應該是用半角括號
5 請不要在網頁中連續出現多於一個的，也盡量少使用全角空格（英文字符集下，全角空格會變成亂碼），空白應該盡量使用text-indent、padding、margin、hspace、vspace以及透明的gif圖片來實現
6 行距建議用百分比來定義，常用的兩個行距的值是line-height:120%/150%
7 排版中我們經常會遇到需要進行首行縮進的處理，不要使用或者全角空格來達到效果，規範的做法是在樣式表中定義p{text-indent:2em;}，然後給每一段加上<p>標記，註意，一般情況下，請不要省略</p>結束標記
三 鏈接和表格使用規範
1 鏈接
1.1 網站中的鏈接路徑全部采用相對路徑
1.2 一般鏈接到某一目錄下的缺省文件的鏈接路徑不必寫全名
1.3 例如：<a href="aboutus/index.htm">
而應該是這樣<a href="aboutus/">
1.4 在瀏覽器裏，當我們點擊空鏈接時，它會自動將當前頁面重置到首端，從而影響用戶正常的閱讀內容，我們用代碼"javascript:void(null)"代替原來的“#”標記
2 表格
2.1 盡量避免表格嵌套過多，後果會對瀏覽器加載延長時間，帶來不友好的用戶體驗
2.2 在寫<table>互相嵌套時，嚴格按照的規範，對於單獨的一個<table>來說，<table><tr>對齊，<td>縮進兩個半角空格，<td>中如果還有嵌套的表格，<table>也縮進兩個半角空格，如果<td>中沒有任何賬號嵌套的表格，</td>結束標記應該與<td>處於同一行，不要換行
2.3 如我們註意在源代碼中不應該有這樣的代碼
<td><img src="../images/sample.gif‘>
</td>
而應該是這樣的
<td><img src="../images/sample.gif"></td>
Web前端4