一、網(wǎng)站的總體組織結(jié)構(gòu)規(guī)范:
1、網(wǎng)站的組織
一個(gè)組織結(jié)構(gòu)良好的網(wǎng)站既是一個(gè)便于管理的網(wǎng)站。網(wǎng)站的預(yù)先規(guī)劃一定要做好,文件、目錄的命名既要符合www服務(wù)器的規(guī)定,又要清晰有邏輯性。如有的網(wǎng)站后綴要求為“.html”,而非“.htm”。
(1)目錄結(jié)構(gòu)不要太深,因?yàn)樘畹哪夸浗Y(jié)構(gòu)會(huì)導(dǎo)致較長的URL。
(2)強(qiáng)烈建議有頁面增加簡短注釋語。便于以后的更新和增加網(wǎng)頁的易讀性。而注釋并不會(huì)下載至客戶端,不影響瀏覽速度。
(3)多數(shù)頁共有的部分置于SSI包含文件中,如每頁的頭部、尾部導(dǎo)航條,版權(quán)信息和廣告條。這樣做的目的是方便以后的更改,如要更改導(dǎo)航條的鏈接,只需修改SSI文件即可,提高了效率。由于個(gè)人網(wǎng)站不能夠自己確定SSI包含文件,它需要服務(wù)器端配置,所以可以用Dreamweaver提供的Library庫文件的包含功能,達(dá)到相同的效果。
(4)建議多數(shù)頁面共有的javascript或Vbscript采用外鏈。這樣可以減少瀏覽器讀代碼的時(shí)間。
(5)不要用嵌套超過3層的表格和太復(fù)雜的表格.嵌套表格太多,瀏覽器解釋html代碼的時(shí)間越長,正確顯示頁面的時(shí)間越長.我們可以注意到很多網(wǎng)站先顯示上面部分,再逐漸顯示下面的內(nèi)容,其實(shí)就是用表格造成的.
2、目錄結(jié)構(gòu)
(1)原則上,相近的內(nèi)容放在同一目錄下,目錄名總以小寫的英文字符串命名且不含空格和特殊字符(下劃線和破折號(hào)除外),最好不要超過8個(gè)字符。
(2)網(wǎng)站根目錄下包含以下幾個(gè)目錄:
library
images
scripts
(3)對(duì)目錄級(jí)資源的引用在url的尾部要有下劃線,以避免服務(wù)器的重定向,從而節(jié)省時(shí)間。
3、文件、目錄命名規(guī)則:
(1)所有的文件、目錄的命名總以小寫的英文字符串命名且不含空格和特殊字符(下劃線和破折號(hào)除外),最好不要超過8個(gè)字符。
(2)所有的html文件后綴統(tǒng)一為“.htm”,其它文件的后綴使用相應(yīng)的格式。(3)文件名用代表其含義的英文單詞,不易翻譯的用關(guān)鍵字拼音。
4、url鏈接
(1)帶域名的絕對(duì)路徑鏈接,如:
81Channel首頁
(2)不帶域名的絕對(duì)路徑鏈接,如:
81Channel首頁(注意路徑前有“/”)(3)相對(duì)路徑鏈接,如:
81Channel首頁
(4)鏈接別的資源采用域名而不用IP地址的形式。非要用IP地址的話,這IP地址必須是Internet的合法地址。
(5)絕對(duì)不能用下列形式的鏈接:
測(cè)試鏈接
----以上鏈接用的是file://本地驅(qū)動(dòng)器,對(duì)用戶而言是不可見的。
二、頁面設(shè)計(jì)規(guī)范
整個(gè)頁面的設(shè)計(jì)可分為7部分:網(wǎng)站標(biāo)識(shí)(logo),頻道標(biāo)題,日期,導(dǎo)航,廣告,內(nèi)容區(qū),版權(quán)信息。
1、標(biāo)識(shí)(logo)
標(biāo)識(shí)是品牌的象征,突出網(wǎng)站鮮明的個(gè)性、整體的構(gòu)思,標(biāo)識(shí)統(tǒng)一置于左上角,文件名為"\images\logo.jpg",各頻道可以有自己的logo標(biāo)識(shí),要突出頻道的特色。
2、頻道標(biāo)題(title)
采用圖片形式,其鏈接采用熱點(diǎn)地圖鏈接,在dreamweaver中可以非常方便的設(shè)置熱點(diǎn)鏈接.
3、日期
日期部分采用javascript腳本編程顯示;
4、導(dǎo)航
(1)導(dǎo)航要簡單、清晰、開放、邏輯性強(qiáng),不要用超過3層的鏈接,又不是做商業(yè)網(wǎng)站追求PV,節(jié)省用戶寶貴的時(shí)間。
(2)用于導(dǎo)航的文字要簡明扼要,含蓋的范圍不要太廣,且應(yīng)限制在一行以內(nèi)。
(3)保證每頁都有到網(wǎng)站首頁的鏈接,利?*** istory面版返回,不要堆砌太多的鏈接,讓用戶無所侍從。
(4)突出最近更新的信息,可以加上更新時(shí)間或New標(biāo)識(shí)。
(5)頁面頂部和尾部導(dǎo)航條代碼放在Library庫文件highchannel.lbi和lowchannel.lbi中,分別引用。
5、廣告
由于本網(wǎng)站是個(gè)人網(wǎng)站,所以必須有提供空間的網(wǎng)站的廣告,如163、263的logo,盡量把它放置于一單獨(dú)的彈出式窗口中,如下形式調(diào)用:window.open(para參數(shù)表)
6、內(nèi)容區(qū)(content)
正文內(nèi)容全部定義為9pt大?。ú荒転槟J(rèn)),標(biāo)題為加粗的10pt,其字體為默認(rèn)字體。
7、版權(quán)信息
純粹是為了避免下面的內(nèi)容太空,加上它,不僅充實(shí)了內(nèi)容,而且使網(wǎng)站看上去比較規(guī)范。
8、其它注意事項(xiàng)
(1)設(shè)計(jì)工具用Dreamweaver3.0、Flash、Photoshop等。
(2)頁面要兼容兩種瀏覽器,但以IE為主。
(3)整個(gè)頁面布局合理,保持均衡,但又要突出重點(diǎn)。
(4)一般,頁面背景用淺色和純色且直接用16進(jìn)制顏色定義,不要用色圖定義。
(5)每個(gè)頁面都要定義簡明準(zhǔn)確的Title。
(6)保持干凈的html代碼,可以自動(dòng)和手動(dòng)清除多余tag。
(7)頁面的長度<=3屏,建議采用錨鏈接到其它頁或用分頁顯示,并增加“上一頁”、“下一頁”等的鏈接。(8)頁面的寬度<=1屏。
三、Html編碼規(guī)范
1、meta標(biāo)記
meta提供一些搜索引擎可以利用的信息,搜索引擎主要使用兩個(gè)屬性Description和Keywords,如:
.
.另外還有三種非常有用的meta標(biāo)記:
.
.
.
2、專用標(biāo)記的使用規(guī)定
為了保證頁面對(duì)瀏覽器的兼容性,不要使用某種瀏覽器專用的標(biāo)識(shí)。
3、Frame
不建議使用Frame幀結(jié)構(gòu),因?yàn)镕rame不便于維護(hù)且容易迷惑用戶,只有在使用比如聊天室之類的特殊頁面時(shí)才采用。
4、表格
.再次強(qiáng)調(diào)不要使用太多的嵌套表格和復(fù)雜的表格。
.表格的定義使用像素。不要采用百分比,因?yàn)樗鼤?huì)因?yàn)槠聊坏拇笮∽詣?dòng)調(diào)整。
5、圖片
.所有的圖片都要定義高度和寬度,并加替代文本即要定義Alt="替代文本",同時(shí)替代文本要與主題一致。
.在使用
資訊推薦
- 關(guān)于2016年春節(jié)放假安排2016-01-26
- 為了方便同事們提前訂票回家過年,現(xiàn)在公司春節(jié)放假時(shí)間安排通知。
春節(jié)放假時(shí)間為:2016年2月3到 2月14日。共11天。
廣大客戶在我...
- 如何做好創(chuàng)業(yè)型網(wǎng)站運(yùn)營2016-03-07
- 1、緊記網(wǎng)站定位,制訂網(wǎng)站長期與短期經(jīng)營目標(biāo)。
網(wǎng)站定位是網(wǎng)站發(fā)展之本,不管是營銷型網(wǎng)站建設(shè)還是創(chuàng)業(yè)型網(wǎng)站運(yùn)營,網(wǎng)站經(jīng)營偏離了定位或定位不...
- 奢侈品B2C的網(wǎng)站規(guī)劃該如何做2016-03-07
- 電子商務(wù)(EC,也就是E-Commerce的縮寫),關(guān)于電子商務(wù)的定義世人眾說紛紜,從不同的角度出發(fā)有不同的定義??梢岳斫鉃橐?Internet為依托,借助一定...
- 微信:支付寶搶紅包要到春晚,我們今晚就開始!2016-01-26
- 昨天上午 11 點(diǎn),支付寶通過一個(gè)長微博,公布了大家期待已久的與央視春晚獨(dú)家合作的互動(dòng)玩法,核心點(diǎn)在于必須主動(dòng)通過社交拓展才能夠獲得最多的紅包。
支...