網站建設標準_網站實施規范
一、網站建設目錄規范
《網站建設目錄規范試行》（以下簡稱《規范》）目的是從整體上規范網站建設過程中的統一性和可擴展性，方便于團隊中更好的協作及設計者以后的維護。請注意《規范》中的用詞，以確定哪些是“必須”哪些是“參考”。
此《規范》為試行版，內容在不斷完善更新中。如果你有什么意見和建議，或發現內容有什么錯誤請積極指正，我們將及時改進修正。
網站建設標準,網站制作,網頁設計,網站建設公司
二、網站建設基本流程規范
網站建設（或者升級改版）應包含下列基本流程：
1、制定網站規劃方案：包括網站預期目標、行業競爭狀況分析、網站欄目結構、用戶行為分析及內容規劃、網頁模版設計、網站服務器技術選型、網站運營維護規范等基本內容；
3、網站測試；
4、網站內容發布；
5、網站維護及管理。
三、網站優化規范
網站優化的最終目的是為用戶獲取有價值信息提供方便，網站優化包括三個方面：對用戶獲取信息優化、搜索引擎優化、網站維護優化。
1、網站欄目結構合理，欄目設置不要過于復雜；
2、網站導航清晰且全站統一，通過任何一個網頁可以逐級返回上一級欄目直到首頁；
3、網頁布局設計合理，網站設計符合用戶瀏覽習慣；
4、重要文字信息盡可能出現在網頁靠前位置；
5、字體清晰，CSS風格協調一致；
6、最多3次點擊可到達產品詳細內容頁面；
7、通過網站任何一個網頁不超過3次點擊可達到站內其他任何一個網頁；
8、遵照搜索引擎為管理員提供的網站優化指南，通過網站結構和內容等基本要素的優化為搜索引擎檢索信息提供方便，不采用任何被搜索引擎視為垃圾信息的方法和欺騙搜索引擎的方式（如堆積關鍵詞、用戶不可見文本、頁面跳轉、復制網頁等等）；
9、網站首頁、欄目首頁及產品內容頁面均有一定的文字信息量；
10、每個網頁有獨立的、可概括說明該網頁核心內容的網頁標題（而不是全站或者一個欄目共用一個網頁標題）；
11、每個網頁有獨立的、與該網頁內容相關的META標簽設計（包括description和keywords）；
12、每個網頁有獨立的URL；
13、產品內容頁面URL盡可能簡短且體現出產品屬性；
14、產品/企業新聞詳細內容頁面是獨立網頁不是彈出窗口；
15、對于產品品種多的企業網站，要有合理的產品分頁方式；
16、網站內容保持適當的更新周期。
四、網站建設實施規范
A、網站建設尺寸規范
1、頁面標準按800*600分辨率全屏制作，每個頁面的寬度為778象素；頁面標準按1024*768分辨率全屏制作，每個頁面的寬度為1004象素； 1024*768分辨率，建議寬度使用960像素。
2、全尺寸Banner統一規格為470×70px，半尺寸banner為234*60px，小banner為88*31px ；部分banner可根椐實際情況設置尺寸；
3、Logo統一為160*70px；
B、網站建設目錄規范
遵從原則：以最少的層次提供最清晰簡便的訪問結構；以最少的字母達到最容易理解的意義。
1、 目錄以代表此目錄文件內容含義的英文單詞命名，目錄名若為單個單詞，均須小寫，目錄名若大于等于兩個單詞，從第二個單詞起的每個單詞的首字母大寫，其余字母小寫。
2、 網站根目錄：只允許存放網站缺省命名文件索引文件（如default.shtml）一個，以及其它必備的文件（如golas.asa, Web.config）。
3、 網站根目錄下開設images子目錄，用以存放不同欄目的頁面都要用到的公共圖片，例如網站標識、導航欄圖片、按鈕等。每個目錄下私有圖片存放于各自獨立images目錄。
4、 在網站根目錄下開設Templates目錄，用以存放各欄目的模板文件；Templates 中另建與網站根目錄下對應的欄目目錄，存放不同欄目對應的模板文件，每個目錄中默認文件：content.htm , list.htm 分別是內容頁的模板、列表頁的模板，其他需要用到的模板根據實際用處按規定命名，在文件命名規則中詳細闡述。
5、 在網站根目錄下開設styles、scripts目錄，分別存放樣式表文件與客戶端腳本文件。
6、 在網站根目錄下開設upload子目錄，用以存放網站后臺上傳的文件；
根據實際需要建立download目錄，用以存放提供給瀏覽者下載的文件。
7、 在網站根目錄下開設include目錄，存放公用的包含文件（如top.htm、head.htm、foot.htm）。
8、在網站根目錄下開設plus目錄，存放所有網站建設中用到的服務器端的程序文件（如 search.asp、function.asp）。
9、每個語言版本存放于獨立的目錄。已有版本語言設置為：
簡體中文 \gb
繁體中文 \big5
英 語 \en
韓 語 \kr
日 語 \jp
俄 語 \ru
10、在網站根目錄下按照欄目結構，為每個主要功能(主菜單)建立一個相應的獨立目錄。目錄名為此欄目的英文翻譯（例如：關于我們 \aboutus信息反饋 \feedback產 品 \product），根據需要在每一個欄目目錄中開設images子目錄，用以放置此欄目專用圖片。(例如：\aboutus\images；\ product\images)。
總結：
所有的js文件存放在根目錄下下的scripts目錄；
所有的CSS文件存放在根目錄下的styles目錄；
所有的程序存放在根目錄下的plus目錄；
所有公用的包含文件存放在根目錄下的include目錄；
所有的模板文件存放在根目錄下的Templates目錄；
所有的公用的圖片文件存放在根目錄下的images目錄；
所有的上傳文件存放在根目錄下的upload目錄；
所有的提供給瀏覽者下在的文件存放在根目錄下的download目錄；
如果建設中的網站為多語言版本的，根據其語言版本存放于獨立的目錄，
目錄命名規則以國家英文簡碼為準；
C、網站建設文字，標點規范
1、非正文頁面每頁內容盡量在1000字以內網頁的文字必須采用樣式定義，以避免由于顯示器的差異造成頁面差異；
2 、文章正文內容，CSS樣式設置應該有交互性，可以讓訪問者自已調整文字的大小及行距等；（以適應不同訪問者訪問，增加網站的友好性。）默認為：字號用點數pt和像素px來定義，pt一般使用中文宋體的9pt和11pt，px一般使用中文宋體12px 和14，黑體字或者宋體字加粗時，一般選用11pt和14.7px；行距建議用百分比來定義，常用的兩個行距的值是line-height:120%/150%.
3 、中文版中正文默認使用宋體；
4 、英文版中正文默認使用Arial字體；
5 、中文段首要空2個漢字的位置，西文段首不空；
6 、西文中一定要用西文半角標點符號，西文中不得使用全角符號（請注意空格）；
D、網站建設導航規范
1、每一個頁面都因該出現的固定信息：
內容包括：主頁，網站介紹，站點視圖，聯系方式，反饋，搜索工具，常見問題解答，實際內容欄目(包括相關站點鏈接、新聞頁)；
2、每頁必須有導航條，格式例：首頁->頻道名稱->欄目名稱->文章標題；菜單名稱要統一：標題欄目前后一致；
3、欄目如果采用圖標, 圖片的ALT屬性要寫本圖片或按鈕的名稱，以避免圖像表達不清或圖像無法下載。
4、無任何鏈接內容的不做成按鈕的形式。
5、每個頁面底端都需要加注《版權聲明》，要根據不同的語言版本調用。標注方法：中文版—中英文；英文版—中英文；法文版—中法文；日文版—中日文；韓文版—中韓文；（標注內容需用圖片，防止訪問者字符編碼不全顯示不正常）；
6、網站文字鏈接的顏色在點擊前和點擊后要有區別。讓訪問者知道哪些內容是看過的，哪些內容還未訪問；
E、網站建設文件命名規范
遵從原則：以最少的字母達到最容易理解的意義。
文件的名稱全部用小寫英文字母、數字、下劃線的組合，其中不得包含漢字、空格和特殊字符；命名原則的指導思想：一是使得你自己和工作組的每一個成員能夠方便的理解每一個文件的意義;二是當我們在文件夾中使用按名稱排序時能夠排列在一起，以便查找、修改、替換、計算負載量等等操作；
1、網站主頁，各欄目主頁的名稱一定要用“default.擴展名”命名；
2、文件以代表此文件內容含義的英文單詞命名，文件名為單個單詞，均須小寫，文件名大于等于兩個單詞，從第二個單詞起的每個單詞的首字母大寫，其余字母小寫。如aboutLeftMenu.htm
3、圖片的命名原則遵循以下幾條規范：
1) 圖片名稱為首、尾兩部分，尾部分第一個字母大寫以作區分。
2) 首部分表示圖片大類性質。如廣告（banner）、標志（logo）、菜單（menu）、按鈕（button）、標題圖片（title）等。有onmouse效果的圖片，兩張分別在原有文件名后加"_on"和"_off"命名。(可進一步完善此規范，并把一系列命名規則整理成條款列出)
3) 尾部分表示圖片的具體含義。
4) 圖片文件命名舉例如下：menuAboutUs.gif、menuNews.gif、logo.gif、bannerYahoo.gif、bannerSina.gif、buttonSearch.gif
F、網站建設文件格式規范
1、圖片的使用以JPG及GIF為主，顏色較豐富變化較多的圖片使用JPG文件，其他則建議使用GIF文件；
2、靜態網頁及被調用和包含的網頁文件均以.htm為擴展名
G、網站建設文件存放規范
這部分內容與網站目錄規范基本相同，
1、如果建設中的網站為多語言版本的，文版主文件夾必須用英文簡碼命名。如：韓文版的所有內容都必須放到kr文件夾中。其他的子文件夾或文件要和中文版的名字一一對應；
2、各頁面所用的圖片要放到相應的images文件夾中；子欄目頁面用到的圖片放到欄目目錄的images文件夾中；
3、站點中所使用到的JavaScript文件都存放在根目錄下的scripts目錄中；
4、站點中所使用的樣式表文件都放到根目錄下的styles目錄中，原則上是每個欄目都要有自己的樣式表文件，并有一個公用的樣式表文件，但在具體使用中可以根據站點規模的大小靈活操作；
5、所有的程序及應用文件都放在站點根目錄下的plus目錄中；
6、所有公用的包含文件和被調用的文件都放在include目錄中，每個欄目私有的包含及調用文件可放各自的欄目目錄中；
7、站點中使用的模板文件都放在站點根目錄下的Templates目錄中，并按照其所屬欄目分別放在對應的目錄中，Templates目錄中的目錄結構應該與站點中的主欄目結構一致，保證目錄的對應；
8、通過網站后臺上傳的文件均放在站點根目錄的upload目錄中，并設置目錄權限為不可執行腳本；
9、所有提供給瀏覽者下載的文件存放在根目錄下的download目錄中，如果這個目錄中的文件可以通過后臺上傳，要設置目錄權限為不可執行腳本；
H、網站鏈接結構規范
遵從原則：用最少的鏈接，使瀏覽最有效率
1、首頁與一級頁面間，使用星狀鏈接結構
2、一級頁面與二級頁面間，使用樹狀鏈接結構
4、 超過三級頁面，在頁面顯眼位置，設置導航，回到首頁或相關欄目。
I、HTML書寫規范
head區代碼規范
1、 版權注釋
<!--- The site is designed by --->
2、 網頁顯示字符集
簡體中文：
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">
繁體中文：
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=BIG5">
英 語：
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
……
3、 制作者信息
<META name="author" content="mail@mail.com">
4、 網站簡介
<META NAME="DESCRIPTION" CONTENT="當前頁的介紹">
5、 搜索關鍵字
<META NAME="keywords" CONTENT="關鍵字,關鍵字1,關鍵字2,關鍵字3">
6、網頁的css規范
<LINK href="xxx/xxx.css" rel="stylesheet" type="text/css">
7、 內容頁標題
<title>內容標題 - 欄目名稱 - 網站名稱</title>
列表欄目頁標題
<title>欄目名稱 - 網站名稱</title>
8、所有的javascript調用盡量采取外部調用
<SCRIPT LANGUAGE="JavaScript" SRC="xxx/xxxxx.js"></SCRIPT>
可選加入標簽
1、 設定網頁的到期時間。一旦網頁過期，必須到服務器上重新調閱。
<META HTTP-EQUIV="expires" CONTENT="Wed, 18 Feb 2004 08:21:57 GMT">
2、 禁止瀏覽器從本地機的緩存中調閱頁面內容。
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
3、防止其它網站在框架里調用本站頁面。
<META HTTP-EQUIV="Window-target" CONTENT="_top">
4、自動跳轉。<META HTTP-EQUIV="Refresh" CONTENT="5;URL=http://www.****. **">
5、網頁搜索機器人向導，告訴搜索機器人哪些頁面需要索引，哪些頁面不需要索引。用以保護需點數才能瀏覽的頁面。
<META NAME="robots" CONTENT="none">
CONTENT的參數有all,none,index,noindex,follow,nofollow。默認是all。
6、 收藏夾圖標 <link rel = "Shortcut Icon" href="***.ico">
內容的代碼書寫規范
html中javascript的書寫：
<head>
…..
<script type="text/javascript">
<!—
…..
-->
</script>
</head>
html中元素的書寫：
1、 元素屬性值必須包含在雙引號中；
<font color=”#000000” size=”3” face=”Arial”>
2、 form 中必須加action屬性，并且不能為空。
<form action=”/r/add.cgi” method=”post”>
如果不需要使用action屬性，也必須定義：
<form action=”no” >
3、 img的alt屬性不可以缺少；
<img src="/q/img/btn_style.gif" border="0" alt="Select”>
4、 head與</head>之間必須有title；
<head>
……
<title>your title </title>
……
</head>
5、 tr、td必須定義在table之間；
<table>
<tr>
<td>……</td>
….
</tr>
</table>
6、 button按鈕必須定義在form之間，否則netscape不支持；
<form action=”……” method=”post”>
<input type=”button” name=”but” value=”back”>
</form>
7、 在javascript中的字符串中出現的“/”前要用轉義符“\”：
<script type=”text/javascript”>
<!—
function check(str) {
var str=”\/r\/add.cgi”;
……
}
-->
</script>
8、 onclick 屬性必須和 onkeypress 成對寫( onmousedown + onkeydown、onmouseup + onkeyup)
<a href=”javascript:void[0]” onClick=”javascript:wopen(….);return false” onkeypress=”javascript:wopen(…);return false”>mm</a>
9、 用URL傳值時直接寫&是不可以的，可用&替換：
<a href=”/r/add.cgi?uid=sqz&sid=1&pid=1”></a>
縮近規則：
<table>中<td></td>,<tr></tr>等必須保持嚴格的縮近規則，以"Tab"鍵為準：
<table>
<tr>
<td>
<table>
<tr>
<td>…</td>
…
</tr>
</table>
</td>
….
</tr>
</table>
程序代碼規范
程序注釋規范
數據庫使用規范
附一、當網站注重百度優化時，網站中的路徑盡量全部采用相對路徑。
因為在目前搜索引擎中百度對絕對路徑比較排斥。
附二、CSS樣式表命名規則
樣式命名
登錄條:loginBar
標志:logo
側欄:sideBar
廣告:banner
導航:nav
子導航:subNav
菜單:menu
子菜單:subMenu
搜索:search
滾動:scroll
頁面主體:main
內容:content
標簽頁:tab
文章列表:list
提示信息:msg
小技巧:tips
欄目標題:title
友情鏈接:friendLink
頁腳:footer
加入:joinus
指南:guild
服務:service
熱點:hot
新聞:news
下載:download
注冊:regsiter
狀態:status
按鈕:btn
投票:vote
合作伙伴:partner
版權:copyRight
CSSID的命名
外套:wrap
主導航:mainNav
子導航:subnav
頁腳:footer
整個頁面:content
頁眉:header
頁腳:footer
商標:label
標題:title
主導航:mainNav(globalNav)
頂導航:topnav
邊導航:sidebar
左導航:leftsideBar
右導航:rightsideBar
旗志:logo
標語:banner
菜單內容1:menu1Content
菜單容量:menuContainer
子菜單:submenu
邊導航圖標:sidebarIcon
注釋:note
面包屑:breadCrumb(即頁面所處位置導航提示)
容器:container
內容:content
搜索:search
登陸:login
功能區:shop(如購物車，收銀臺)
當前的current
樣式文件命名
主要的:master.css
布局版面:layout.css
專欄:columns.css
文字:font.css
打印樣式:print.css
主題:themes.css
注釋的寫法
/* Footer */
內容區
/* End Footer */
關于匠人匠心
匠人匠心科技核心技術團隊組建于2015年8月，于2016年注冊于天津市北辰區，公司專注于高端網站建設，APP定制開發，網絡推廣運營等互聯網專業服務。在競爭激烈的網站建設行業，始終堅持以技術為核心，組建強大的技術開發團隊，研發獨立且具有自主版權的網站管理系統CMS，CMF，安全穩定、簡單易用；在業內具有強大的競爭力。匠人匠心科技的近期目標是打造一流的網站建設及運營團隊，把商務和文化、技術和藝術完美地結合在一起，為企業塑造品牌、創造效益。做網站，就找匠人匠心科技！期待與您的合作。點擊了解更多：價格高的網站與價格低的網站有何區別？
匠人匠心科技秉承“追求卓越、開拓創新、團結進取、共創未來”的企業精神，致力于為企業提供全面的網絡傳播與技術應用整體解決方案，真正實現企業互聯網信息智能化，提高企業在網絡科技時代的市場競爭力。以客戶為中心，以技術為基礎，以質量求生存，以誠信求發展，我們為您提供一個無懈可擊的展示空間，為您的企業訂做有競爭力的展示平臺！
匠人匠心科技每天都會不定時更新有關天津網站制作以及網絡營銷推廣的文章，希望對您有用，您也可以關注我們的微信賬號二維碼，咨詢任何關于網站建設方面的問題。
我們的微信二維碼
