網頁製做規範

時間 2020-05-31

標籤網頁製做規範欄目 HTML 简体版

原文原文鏈接

01 命名規範 javascript

文件命名的原則：以最少的字母達到最容易理解的意義。
通常文件及目錄命名規範：
每個目錄中應該包含一個缺省的html 文件，文件名統一用index.htm
文件名稱統一用小寫的英文字母、數字和下劃線的組合
儘可能按單詞的英語翻譯爲名稱。例如：feedback(信息反饋)，aboutus(關於咱們)
多個同類型文件使用英文字母加數字命名，字母和數字之間用_分隔。例如：news_01.htm。注意，數字位數與文件個數成正比，不夠的用0補齊。例如共有200條新聞，其中第18條命名爲news_018.htmcss

圖片的命名規範：
名稱分爲頭尾兩兩部分，用下劃線隔開。
頭部分表示此圖片的大類性質。例如：放置在頁面頂部的廣告、裝飾圖案等長方形的圖片咱們取名：banner ；標誌性的圖片咱們取名爲：logo ；在頁面上位置不固定而且帶有連接的小圖片咱們取名爲button ；在頁面上某一個位置連續出現，性質相同的連接欄目的圖片咱們取名：menu ；裝飾用的照片咱們取名：pic ；不帶連接表示標題的圖片咱們取名：title 依照此原則類推。 html

尾部分用來表示圖片的具體含義，用英文字母表示。例如：banner_sohu.gif banner_sina.gif menu_aboutus.gif menu_job.gif title_news.gif logo_police.gif logo_national.gif pic_people.jpg pic_hill.jpg.
有onmouse效果的圖片，兩張分別在原有文件名後加"_on"和"_off"命名。java

其它文件命名規範
js的命名原則以功能的英語單詞爲名。例如：廣告條的js文件名爲:ad.js
全部的CGI文件後綴爲cgi。全部CGI程序的配置文件爲config.cgiweb

02 目錄結構規範數據庫

目錄創建的原則：以最少的層次提供最清晰簡便的訪問結構。
目錄的命名以小寫英文字母，下劃線組成。(參照命名規範)
根目錄通常只存放index.htm以及其餘必須的系統文件
每一個主要欄目開設一個相應的獨立目錄
根目錄下的p_w_picpaths用於存放各頁面都要使用的公用圖片，子目錄下的p_w_picpaths目錄存放本欄目頁面使用的私有圖片
全部JS,ASP,PHP等腳本存放在根目錄下的scripts目錄
全部CGI程序存放在根目錄下的cgi-bin目錄
全部CSS文件存放在根目錄下style目錄
每一個語言版本存放於獨立的目錄。例如：簡體中文gb
全部flash, avi, ram, quicktime 等多媒體文件存放在根目錄下的media目錄編程

03 尺寸規範瀏覽器

尺寸規範請根據您的實際狀況調整：
頁面標準按800*600分辨率製做，推薦尺寸爲766*430px
頁面長度原則上不超過3屏，寬度不超過1屏
每一個標準頁面爲A4幅面大小，即8.5X11英寸
全尺寸banner爲468*60px，半尺寸banner爲234*60px，小banner爲88*31px，另外120*90，120*60也是小圖標的標準尺寸
每一個非首頁靜態頁面含圖片字節不超過60K，全尺寸banner不超過14K緩存

　
04 首頁代碼規範安全

首頁的代碼關鍵在head區，head區是指首頁HTML代碼的<head>和</head>之間的內容。
head區必須加入的標識
公司版權註釋 
網頁顯示字符集例如：
簡體中文：<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">

原始製做者信息 <META name="author" content="webmaster@yoursite.com">
網站簡介 <META NAME="DESCRIPTION" CONTENT="這裏填您網站的簡介">
搜索關鍵字 <META NAME="keywords" CONTENT="關鍵字1,關鍵字2,關鍵字3,...">
網頁的css規範 <LINK href="style/style.css" rel="stylesheet" type="text/css">
網頁標題 <title>這裏是你的網頁標題</title>

head區能夠選擇加入的標識
設定網頁的到期時間。一旦網頁過時，必須到服務器上從新調閱。
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
禁止瀏覽器從本地機的緩存中調閱頁面內容。
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
用來防止別人在框架裏調用你的頁面。
<META HTTP-EQUIV="Window-target" CONTENT="_top">
自動跳轉。
<META HTTP-EQUIV="Refresh" CONTENT="5;URL=http://www.68design.net">
5指時間停留5秒。

網頁搜索機器人嚮導.用來告訴搜索機器人哪些頁面須要索引，哪些頁面不須要索引。
<META NAME="robots" CONTENT="none">
CONTENT的參數有all,none,index,noindex,follow,nofollow。默認是all。
收藏夾圖標
<link rel = "Shortcut Icon" href="favicon.ico">
JS調用規範
全部的javascript腳本儘可能採起外部調用
<SCRIPT LANGUAGE="JavaScript" SRC="script/xxxxx.js"></SCRIPT>

CSS書寫規範
全部的CSS的儘可能採用外部調用
<LINK href="style/style.css" rel="stylesheet" type="text/css"> 書寫時重定義的最早，僞類其次，自定義最後（其中a:link a:visited a:hover a:actived 要按照順序寫）便於本身和他人閱讀。

爲了保證不一樣瀏覽器上字號保持一致，字號建議用點數pt和像素px來定義，pt通常使用中文宋體的9pt和11pt，px通常使用中文宋體12px 和14.7px 這是通過優化的字號，黑體字或者宋體字加粗時，通常選用11pt和14.7px 的字號比較合適。

CSS推薦模板。

body標識
爲了保證瀏覽器的兼容性，必須設置頁面背景<body bgcolor="#FFFFFF">

05 形象設計規範

網站的CI總體形象包括下面幾個要素

標誌(logo)

網站必須有獨立的標誌

標誌能夠以網站中英文名稱設計，也能夠採用特別的圖案。原則是簡單易記。

標誌必須能夠用黑白和彩色分別清晰表現

標誌圖片的名稱爲"logo_域名.gif"，例如：logo_sina.gif

儘可能提供標誌的矢量圖片

請儘量在每一個頁面上都使用標誌

標準色

網站應該有本身的標準色（主體色）

標準色原則上不超過兩種，若是有兩種，其中一種爲標準色，另外一種爲標準輔助色

標準色應儘可能採用216種web安全色以內的色彩

必須提供標準色確切的RGB和CYMK數值

請儘量使用標準色

標準字體

網站應該定義一種標準字體（指logo上，圖片上使用的字體）

標準字體原則上定義兩種，一種中文字體，一種英文字體（不包括文本內容字體）

必須提供標準字體的名稱和字庫

請儘量使用標準字體

06 內容編輯規範

內容

必須遵照我國《計算機信息網絡國際聯網安全保護管理辦法》的規定

任何單位和我的不得利用國際聯網製做、複製、查閱和傳播下列信息：
(一)煽動抗拒、破壞憲法和法律、行政法規實施的；
(二)煽動顛覆國家政權，推翻社會主義制度的；
(三)煽動分裂國家、破壞國家統一的；
(四)煽動民族仇恨、民族歧視，破壞民族團結的；
(五)捏造或者歪曲事實，散佈謠言，擾亂社會秩序的；
(六)宣揚封建迷信、淫穢、×××、×××、暴力、兇殺、恐怖，教唆犯罪的；
(七)公然侮辱他人或者捏造事實誹謗他人的；
(八)損害國家機關信譽的；
(九)其餘違反憲法和法律、行政法規的。

轉載必須找到原出處，經聯繫後使用

標題

力求簡短、醒目、新穎、吸引人。

正文

文章的段首空兩格，與傳統格式保持一致

段與段之間空一行可使文章更清晰易看

杜絕錯字、別字和自造字

簡體版中不得夾雜繁體字

譯名要按我國規範。例如：singapore統一翻譯"新加坡"不能用"星加坡"

全角數字符號（不含標點）應改成半角

　
07 新技術使用規範

使用新技術原則是：兼容瀏覽器，保證下載速度，照顧最多數的用戶。