網(wǎng)站設(shè)計(jì),包含的內(nèi)容非常多。大體分兩個(gè)方面:
一方面是純網(wǎng)站本身的設(shè)計(jì)比如文字排版,圖片制作,平面設(shè)計(jì),三維立體設(shè)計(jì),靜態(tài)無聲圖文,動(dòng)態(tài)有聲影像等;另一方面是網(wǎng)站的延伸設(shè)計(jì),包括網(wǎng)站的主題定位和瀏覽群的定位,智能交互,制作策劃,形象包裝,宣傳營銷等等。
下面是大致的提綱:
1.定位你的網(wǎng)站主題和名稱;
2.定位你的網(wǎng)站CI形象;
3.確定你的欄目和版塊;
4.網(wǎng)站的整體風(fēng)格創(chuàng)意設(shè)計(jì)
5.網(wǎng)站的層次結(jié)構(gòu)和鏈接結(jié)構(gòu)
6.首頁的設(shè)計(jì)
7.版面布局的竅門
8.色彩的搭配
9.效果與速度
10.替瀏覽者考慮
11.細(xì)微之處見功力
12.建設(shè)完成度與推出時(shí)間
13.交互性與親和度
14.考慮不同的瀏覽器和分辨率
15.字體的設(shè)置和表格的嵌套
16.新技術(shù)的運(yùn)用取舍
17.設(shè)計(jì)好你的banner和位置
18.語句文字--融入感情
19.對(duì)網(wǎng)站設(shè)計(jì)初學(xué)者的建議
以上是本“系列”文章的提綱,會(huì)根據(jù)實(shí)際撰寫情況作些變動(dòng)。每星期一篇。我們開始之前,首先明確幾個(gè)前提:
一.網(wǎng)站設(shè)計(jì)與網(wǎng)站制作。我們說網(wǎng)站“設(shè)計(jì)”而不是網(wǎng)站“制作”,它們的區(qū)別在于設(shè)計(jì)是一個(gè)思考的過程,而制作只是將思考的結(jié)果表現(xiàn)出來。一個(gè)成功的網(wǎng)站首先需要一個(gè)優(yōu)秀的設(shè)計(jì),然后輔之優(yōu)秀的制作。設(shè)計(jì)是網(wǎng)站的核心和靈魂,一個(gè)相同的設(shè)計(jì)可以有多種制作表現(xiàn)的方式。
二.我們說的“網(wǎng)站”是指有確定主題和明確目的的實(shí)用性站點(diǎn),不包括純表現(xiàn)類或者純文字類網(wǎng)站。
三.在文章中,可能舉例說明或點(diǎn)評(píng)到某些具體站點(diǎn)。
一:定位你的網(wǎng)站主題和名稱
設(shè)計(jì)一個(gè)站點(diǎn),首先遇到的問題就是定位網(wǎng)站主題。
所謂主題也就是你的網(wǎng)站的題材。網(wǎng)絡(luò)上的網(wǎng)站題材千奇百怪,琳瑯滿目。只要你想的到,就可以把它制作出來。下面是美國《個(gè)人電腦》雜志(PCMagazine)評(píng)出的99年度排名前100位的全美知名網(wǎng)站的十類題材,對(duì)我們有一些參考價(jià)值。
第1類:網(wǎng)上求職
第2類:網(wǎng)上聊天/即時(shí)信息/ICQ
第3類:網(wǎng)上社區(qū)/討論/郵件列表
第4類:計(jì)算機(jī)技術(shù)
第5類:網(wǎng)頁/網(wǎng)站開發(fā)
第6類:娛樂網(wǎng)站
第7類:旅行
第8類:參考/資訊
第9類:家庭/教育
第10類:生活/時(shí)尚
每個(gè)大類都可以繼續(xù)細(xì)分,比如娛樂類再分為體育/電影/音樂大類,音樂又可以按格式分為MP3,VQF,Ra,按表現(xiàn)形式分古典,現(xiàn)代,搖滾等。以上都只是最常見的題材,還有許多專業(yè)的,另類的,獨(dú)特的題材可以選擇,比如中醫(yī),熱帶魚,天氣預(yù)報(bào)等等,同時(shí),各個(gè)題材相聯(lián)系和交叉結(jié)合可以產(chǎn)生新得題材,例如旅游論壇(旅游+討論),經(jīng)典入球播放(足球+影視)按這樣分下去,題材可以有成千上萬個(gè),你不會(huì)再為題材重復(fù),難以選擇而煩惱了吧:)
對(duì)于題材的選擇,我的建議是:
1.主題要小而精。定位要小,內(nèi)容要精。如果你想制作一個(gè)包羅萬象的站點(diǎn),把所有您認(rèn)為精彩的東西都放在上面,那么往往會(huì)事與愿違,給人的感覺是沒有主題,沒有特色,樣樣有卻樣樣都很膚淺,因?yàn)槟豢赡苡心敲炊嗟木θゾS護(hù)它。網(wǎng)絡(luò)的最大特點(diǎn)就是新和快,目前最熱門的個(gè)人主頁都是天天更新甚至幾小時(shí)更新一次。最新的調(diào)查結(jié)果也顯示,網(wǎng)絡(luò)上的“主題站”比“萬全站”更受人們喜愛,就好比專賣店和百貨商店,如果我需要買某方面的東西,肯定會(huì)選擇專買店。再舉個(gè)例子,我的一位網(wǎng)友KK希望制作文學(xué)方面的題材,但是文學(xué)也包括許多許多內(nèi)容,有小說,詩歌,散文;有科幻,武俠,推理;阿捷仔細(xì)了解了他的擅長和想要提供的主要內(nèi)容,最后將題材定位在網(wǎng)絡(luò)文學(xué)上,刪除了原有的一些無關(guān)的文學(xué)作品,集中擴(kuò)大和整理網(wǎng)絡(luò)文學(xué)作品。網(wǎng)站推出后,很快受到大家的喜愛。
2.題材最好是你自己擅長或者喜愛的內(nèi)容。比如:您對(duì)擅長編程,就可以建立一個(gè)編程愛好者網(wǎng)站;對(duì)足球感興趣,可以報(bào)道最新的戰(zhàn)況,球星動(dòng)態(tài)等。這樣在制作時(shí),才不會(huì)覺得無聊或者力不從心。興趣是制作網(wǎng)站的動(dòng)力,沒有熱情,很難設(shè)計(jì)制作出杰出的作品。
3.題材不要太濫或者目標(biāo)太高。“太濫”是指到處可見,人人都有的題材;比如軟件下載,免費(fèi)信息?!澳繕?biāo)太高”是指在這一題材上已經(jīng)有非常優(yōu)秀,知名度很高的站點(diǎn),你要超過它是很困難的。除非你下決心和有實(shí)力競爭并超過它,記住,在互聯(lián)網(wǎng)上只有第一,人們往往只記得最好的網(wǎng)站,第二第三名的印象則會(huì)淺得多。
OK,如果你已經(jīng)有一個(gè)絕妙的主意了,那我們開始為網(wǎng)站起名字。您可能認(rèn)為起名字與網(wǎng)站設(shè)計(jì)無關(guān),其實(shí)網(wǎng)站名稱也是網(wǎng)站設(shè)計(jì)的一部分,而且是很關(guān)鍵的一個(gè)要素。你來看,“電腦學(xué)習(xí)室”和“電腦之家”顯然是后者簡練;“迷笛樂園”和“MIDI樂園”顯然是后者明晰;“兒童天地”和“中國幼兒園”顯然是后者大氣。我們都知道PIIICUP的中文名稱“奔騰”,如果改為“奔跑”,可能就沒有今天這么“火”了。和現(xiàn)實(shí)生活中一樣,網(wǎng)站名稱是否正氣,響亮,易記,對(duì)網(wǎng)站的形象和宣傳推廣也有很大影響。一般的建議是:
1.名稱要正。這個(gè)“正”是阿捷自己的說法,其實(shí)就是要合法,和理,和情。不能用反動(dòng)的,色情的,迷信的,危害社會(huì)安全的名詞語句。
2.名稱要易記。根據(jù)中文網(wǎng)站瀏覽者的特點(diǎn),除非特定需要,網(wǎng)站名稱最好用中文名稱,不要使用英文或者中英文混合型名稱。例如:beyondstudio和超越工作室,后者更親切好記。另外,網(wǎng)站名稱的字?jǐn)?shù)應(yīng)該控制在六個(gè)字(最好四個(gè)字)以內(nèi),比如“XX閣”“XX設(shè)計(jì)室”,四個(gè)字的可以用成語,如“一網(wǎng)打進(jìn)”。字?jǐn)?shù)少還有個(gè)好處,一般友情鏈接的小logo尺寸是88X31,而六個(gè)字的寬度是78左右,適合于其他站點(diǎn)的鏈接排版。
3.名稱要有特色。名稱平實(shí)就可以接受,如果能體現(xiàn)一定的內(nèi)涵,給瀏覽者更多的視覺沖擊和空間想象力,則為上品。這里舉幾個(gè)阿捷認(rèn)為很好的名稱:音樂前衛(wèi),網(wǎng)頁陶吧,天籟絕音。在體現(xiàn)出網(wǎng)站主題的同時(shí),能點(diǎn)出特色之處。
總之,定位題材和名稱是設(shè)計(jì)一個(gè)網(wǎng)站的第一步,也是很重要的一部分。如果能找到一個(gè)滿意的名稱,花一天時(shí)間翻字典也是值得的。
定位你的網(wǎng)站CI形象。
所謂CI,是借用的廣告術(shù)語。(CI是英文corporateidentity的縮寫),意思是通過視覺來統(tǒng)一企業(yè)的形象。現(xiàn)實(shí)生活中的CI策劃比比皆是,杰出的例子如:可口可樂公司,全球統(tǒng)一的標(biāo)志,色彩和產(chǎn)品包裝,給我們的印象極為深刻。更多的例子如SONY,三菱,麥當(dāng)勞等等。
一個(gè)杰出的網(wǎng)站,和實(shí)體公司一樣,也需要整體的形象包裝和設(shè)計(jì)。準(zhǔn)確的,有創(chuàng)意的CI設(shè)計(jì),對(duì)網(wǎng)站的宣傳推廣有事半功倍的效果。在您的網(wǎng)站主題和名稱定下來之后,需要思考的就是網(wǎng)站的CI形象。
1.設(shè)計(jì)網(wǎng)站的標(biāo)志(logo).首先你需要設(shè)計(jì)制作一個(gè)網(wǎng)站的標(biāo)志(logo)。就如同商標(biāo)一樣,logo是你站點(diǎn)特色和內(nèi)涵的集中體現(xiàn),看見logo就讓大家聯(lián)想起你的站點(diǎn)。注意:這里的logo不是指88X31的小圖標(biāo)banner,而是網(wǎng)站的標(biāo)志。
標(biāo)志可以是中文,英文字母,可以是符號(hào),圖案,可以是動(dòng)物或者人物等等。比如:soim是用soim的英文作為標(biāo)志,新浪用字母sina+眼睛作為標(biāo)志。標(biāo)志的設(shè)計(jì)創(chuàng)意來自你網(wǎng)站的名稱和內(nèi)容。
(1).網(wǎng)站有代表性的人物,動(dòng)物,花草,可以用它們作為設(shè)計(jì)的藍(lán)本,加以卡通化和藝術(shù)化,例如迪斯尼的米老鼠,搜狐的卡通狐貍,鯊?fù)w壇的籃球鯊魚。
(2).網(wǎng)站有專業(yè)性的,可以以本專業(yè)有代表的物品作為標(biāo)志。比如中國銀行的銅板標(biāo)志,奔馳汽車的方向盤標(biāo)志。
(3).最常用和最簡單的方式是用自己網(wǎng)站的英文名稱作標(biāo)志。采用不同的字體,字母的變形,字母的組合可以很容易制作好自己的標(biāo)志。
2.設(shè)計(jì)網(wǎng)站的標(biāo)準(zhǔn)色彩。網(wǎng)站給人的第一印象來自視覺沖擊,確定網(wǎng)站的標(biāo)準(zhǔn)色彩是相當(dāng)重要的一步。不同的色彩搭配產(chǎn)生不同的效果,并可能影響到訪問者的情緒。
“標(biāo)準(zhǔn)色彩”是指能體現(xiàn)網(wǎng)站型象和延伸內(nèi)涵的色彩。舉個(gè)實(shí)際的例子就明白了:IBM的深藍(lán)色,肯得基的紅色條型,windows視窗標(biāo)志上的紅藍(lán)黃綠色塊,都使我們覺得很貼切,很和諧。如果將IBM改用綠色或金黃色,我們會(huì)有什么感覺?
一般來說,一個(gè)網(wǎng)站的標(biāo)準(zhǔn)色彩不超過3種,太多則讓人眼花繚亂。標(biāo)準(zhǔn)色彩要用于網(wǎng)站的標(biāo)志,標(biāo)題,主菜單和主色塊。給人以整體統(tǒng)一的感覺。至于其它色彩也可以使用,只是作為點(diǎn)綴和襯托,絕不能喧賓奪主。
一般來說,適合于網(wǎng)頁標(biāo)準(zhǔn)色的顏色有:藍(lán)色,黃/橙色,黑/灰/白色三大系列色。
3.設(shè)計(jì)網(wǎng)站的標(biāo)準(zhǔn)字體。和標(biāo)準(zhǔn)色彩一樣,標(biāo)準(zhǔn)字體是指用于標(biāo)志,標(biāo)題,主菜單的特有字體。一般我們網(wǎng)頁默認(rèn)的字體是宋體。為了體現(xiàn)站點(diǎn)的“與眾不同”和特有風(fēng)格,我們可以根據(jù)需要選擇一些特別字體。例如,為了體現(xiàn)專業(yè)可以使用粗仿宋體,體現(xiàn)設(shè)計(jì)精美可以用廣告體,體現(xiàn)親切隨意可以用手寫體等等。當(dāng)然這些都是阿捷的個(gè)人看法,你可以根據(jù)自己網(wǎng)站所表達(dá)的內(nèi)涵,選擇更貼切的字體。目前常見的中文字體有二三十種,常見的英文字體有近百種。需要說明的是:使用非默認(rèn)字體只能用圖片的形式,因?yàn)楹芸赡転g覽者的PC里沒有安裝你的特別字體,那么您的辛苦設(shè)計(jì)制作便付之東流啦!
4.設(shè)計(jì)網(wǎng)站的宣傳標(biāo)語。也可以說是網(wǎng)站的精神,網(wǎng)站的目標(biāo)。用一句話甚至一個(gè)詞來高度概括。類似實(shí)際生活中的廣告金句。例如:鵲巢的“味道好極了”;麥斯威爾的“好東西和好朋友一起分享”;Intel的“給你一個(gè)奔騰的心”。
以上四方面:標(biāo)志,色彩,字體,標(biāo)語,是一個(gè)網(wǎng)站樹立CI形象的關(guān)鍵,確切的說是網(wǎng)站的表面文章,設(shè)計(jì)并完成這幾步,你的網(wǎng)站將脫胎換骨,整體形象有一個(gè)提高。形象地說:你從一個(gè)土氣的農(nóng)民轉(zhuǎn)變?yōu)橐晃晃餮b革履的白領(lǐng)人士。(注意:我們只是以平面靜態(tài)來設(shè)計(jì)CI,還沒有引入聲音,三維立體等因素。)
確定網(wǎng)站的欄目和版塊
經(jīng)驗(yàn)告訴我們,建立一個(gè)網(wǎng)站好比寫一篇文章,首先要擬好提綱,文章才能主題明確,層次清晰;也好比造一座高樓,首先要設(shè)計(jì)好框架圖紙,才能使樓房結(jié)構(gòu)合理。
初學(xué)者,最容易犯的錯(cuò)誤就是:確定題材后立刻開始制作。當(dāng)你一頁一頁制作完畢后才發(fā)現(xiàn):網(wǎng)站結(jié)構(gòu)不清晰,目錄龐雜,內(nèi)容東一塊西一塊。結(jié)果不但瀏覽者看得糊涂,自己擴(kuò)充和維護(hù)網(wǎng)站也相當(dāng)困難,您的網(wǎng)站或許就此半途而廢,更糟糕的是:你因此失去了制作主頁的信心和興趣!
所以,我們?cè)趧?dòng)手制作網(wǎng)頁前,一定要考慮好以下三方面:
1.確定欄目和版塊;
2.確定網(wǎng)站的目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)
3.確定網(wǎng)站的整體風(fēng)格創(chuàng)意設(shè)計(jì)
今天我們首先來討論“確定網(wǎng)站的欄目和版塊”。
網(wǎng)站的題材確定后,相信你已經(jīng)收集和組織了許多相關(guān)的資料內(nèi)容。你一定認(rèn)為這些都是最好的,肯定能吸引網(wǎng)友們來瀏覽網(wǎng)站。但是你有沒有將最好的,最吸引人的內(nèi)容放在最突出的位置呢?有沒有讓好東西在版面分布上占絕對(duì)優(yōu)勢呢?
我看見許多個(gè)人主頁的欄目(主菜單)并不是這樣的。舉個(gè)例子:有一個(gè)以提供動(dòng)畫素材為主題的站點(diǎn),它的主欄目是:關(guān)于站長,本站導(dǎo)航,動(dòng)畫寶庫,本站論壇,本站留言本,聯(lián)系站長。首頁上寫著本站網(wǎng)址和版權(quán)申明(居然還有將本站設(shè)為首頁字樣)。最主要的,最吸引人的動(dòng)畫素材在主欄目里占1/6,在首頁上一字沒提。我想即使這個(gè)站點(diǎn)的確有大量的,精美的動(dòng)畫素材,也很難吸引瀏覽者繼續(xù)挖掘。
欄目的實(shí)質(zhì)是一個(gè)網(wǎng)站的大綱索引,索引應(yīng)該將網(wǎng)站的主體明確顯示出來。在制定欄目的時(shí)候,要仔細(xì)考慮,合理安排。一般的網(wǎng)站欄目安排要注意以下幾方面:
1.一定記住要緊扣你的主題!
一般的做法是:將你的主題按一定的方法分類并將它們作為網(wǎng)站的主欄目。例如上面的例子,可以將欄目分為動(dòng)物動(dòng)畫,標(biāo)志動(dòng)畫,三維動(dòng)畫,卡通動(dòng)畫等,在首頁上標(biāo)明最近更新的動(dòng)畫。記住:主題欄目個(gè)數(shù)在總欄目中要占絕對(duì)優(yōu)勢,這樣的網(wǎng)站顯的專業(yè),主題突出,容易給人留下深刻印象。
2.設(shè)一個(gè)最近更新或網(wǎng)站指南欄目
如果你的首頁沒有安排版面放置最近更新內(nèi)容信息,就有必要設(shè)立一個(gè)“最近更新”的欄目。這樣做是為了照顧常來的訪客,讓你的主頁更有人性化。
如果你的主頁內(nèi)容龐大(超過15MB),層次較多,而又沒有站內(nèi)的搜索引擎,建議您設(shè)置“本站指南”欄目??梢詭椭踉L者快速找到他們想要的內(nèi)容。
3.設(shè)定一個(gè)可以雙向交流的欄目
不需要很多,但一定要有。比如論壇,留言本,郵件列表等,可以讓瀏覽者留下他們的信息。有調(diào)查表明,提供雙向交流的站點(diǎn)比簡單的留一個(gè)"Emailme"的站點(diǎn)更具有親和力。
4.設(shè)一個(gè)下載或常見問題回答欄目
網(wǎng)絡(luò)的特點(diǎn)是信息共享。如果你看到一個(gè)站點(diǎn)有大量的優(yōu)秀的有價(jià)值的資料,你肯定希望能一次性下載,而不是一頁一頁瀏覽存盤?!皩⑿谋刃摹痹谀阕约旱闹黜撋显O(shè)置一個(gè)資料下載欄目,會(huì)得到大家的喜歡。有些站點(diǎn)為了廣告顯示量,一篇文章還要分幾頁顯示,我覺得遲早會(huì)因訪問量下降而淘汰(個(gè)人意見:)。另外,如果您的站點(diǎn)經(jīng)常收到網(wǎng)友關(guān)于某方面的問題來信,你最好設(shè)立一個(gè)常見問題回答的欄目,既方便了網(wǎng)友,也可以節(jié)約自己更多時(shí)間用以學(xué)習(xí)。
至于其他的輔助內(nèi)容,如關(guān)于本站,版權(quán)信息等可以不放在主欄目里,以免沖淡主題??偨Y(jié)以上幾點(diǎn),我們得出劃分欄目需要注意的是:
●盡可能刪除與主題無關(guān)的欄目
●盡可能將網(wǎng)站最有價(jià)值的內(nèi)容列在欄目上
●盡可能方便訪問者的瀏覽和查詢
上面說的是欄目,我們?cè)倏纯窗鎵K設(shè)置。版塊比欄目的概念要大一些,每個(gè)版塊都有自己的欄目。舉個(gè)例子:網(wǎng)易的站點(diǎn)分新聞,體育,財(cái)經(jīng),娛樂,教育等版塊,每個(gè)版塊下面有各有自己的主欄目。一般的個(gè)人站點(diǎn)內(nèi)容少,只有主欄目(主菜單)就夠了,不需要設(shè)置版塊。如果你覺得的確有必要設(shè)置版塊的,應(yīng)該注意1.各版塊要有相對(duì)獨(dú)立性。2.各版塊要有相互關(guān)聯(lián)。3.版塊的內(nèi)容要圍繞站點(diǎn)主題。關(guān)于版塊方面,主要是門戶站點(diǎn)等較大ICP需要考慮的問題,阿捷在此
不再作展開討論。
確定網(wǎng)站的目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)
上篇講到:我們?cè)趧?dòng)手制作網(wǎng)頁前,一定要考慮好以下三方面:
1.確定欄目和版塊;
2.確定網(wǎng)站的目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)
3.確定網(wǎng)站的整體風(fēng)格創(chuàng)意設(shè)計(jì)
今天我們繼續(xù)來討論“確定網(wǎng)站的目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)”。
一.網(wǎng)站的目錄結(jié)構(gòu)
網(wǎng)站的目錄是指你建立網(wǎng)站時(shí)創(chuàng)建的目錄。例如:在用frontpage98建立網(wǎng)站時(shí)都默認(rèn)建立了根目錄和images子目錄。目錄的結(jié)構(gòu)是一個(gè)容易忽略的問題,大多數(shù)站長都是未經(jīng)規(guī)劃,隨意創(chuàng)建子目錄。目錄結(jié)構(gòu)的好壞,對(duì)瀏覽者來說并沒有什么太大的感覺,但是對(duì)于站點(diǎn)本身的上傳維護(hù),內(nèi)容未來的擴(kuò)充和移植有著重要的影響。下面是建立目錄結(jié)構(gòu)的一些建議:
●不要將所有文件都存放在根目錄下。
有網(wǎng)友為了方便,將所有文件都放在根目錄下。這樣做造成的不利影響在于:
1.文件管理混亂。你常常搞不清哪些文件需要編輯和更新,哪些無用的文件可以刪除,哪些是相關(guān)聯(lián)的文件,影響工作效率。
2.上傳速度慢。服務(wù)器一般都會(huì)為根目錄建立一個(gè)文件索引。當(dāng)您將所有文件都放在根目錄下,那么即使你只上傳更新一個(gè)文件,服務(wù)器也需要將所有文件再檢索一遍,建立新的索引文件。很明顯,文件量越大,等待的時(shí)間也將越長。所以,給您的建議是:盡可能減少根目錄的文件存放數(shù)。
●按欄目內(nèi)容建立子目錄。
子目錄的建立,首先按主菜單欄目建立。例如:網(wǎng)頁教程類站點(diǎn)可以根據(jù)技術(shù)類別分別建立相應(yīng)的目錄,象Flash,Dhtml,javascript等;企業(yè)站點(diǎn)可以按公司簡介,產(chǎn)品介紹,價(jià)格,在線定單,反饋聯(lián)系等建立相應(yīng)目錄。
其他的次要欄目,類似what'snew,友情連接內(nèi)容較多,需要經(jīng)常更新的可以建立獨(dú)立的子目錄。而一些相關(guān)性強(qiáng),不需要經(jīng)常更新的欄目,例如:關(guān)于本站,關(guān)于站長,站點(diǎn)經(jīng)歷等可以合并放在一個(gè)統(tǒng)一目錄下。
所有程序一般都存放在特定目錄。例如:CGI程序放在cgi-bin目錄。便于維護(hù)管理。所有需要下載的內(nèi)容也最好放在一個(gè)目錄下。
●在每個(gè)主目錄下都建立獨(dú)立的images目錄。
默認(rèn)的,一個(gè)站點(diǎn)根目錄下都有一個(gè)images目錄。剛開始學(xué)習(xí)主頁制作時(shí),阿捷習(xí)慣將所有圖片都存放在這個(gè)目錄里。可是后來發(fā)現(xiàn)很不方便,當(dāng)我需要將某個(gè)主欄目打包供網(wǎng)友下載,或者將某個(gè)欄目刪除時(shí),圖片的管理相當(dāng)麻煩。經(jīng)過實(shí)踐發(fā)現(xiàn):為每個(gè)主欄目建立一個(gè)獨(dú)立的images目錄是最方便管理的。而根目錄下的images目錄只是用來放首頁和一些次要欄目的圖片。
●目錄的層次不要太深。
目錄的層次建議不要超過3層。原因很簡單,維護(hù)管理方便。
其它需要注意的還有:
1.不要使用中文目錄;網(wǎng)絡(luò)無國界,使用中文目錄可能對(duì)網(wǎng)址的正確顯示造成困難。
2.不要使用過長的目錄;盡管服務(wù)器支持長文件名,但是太長的目錄名不便于記憶。
3.盡量使用意義明確的目錄;上面的例子中,你可以用Flash,Dhtml,javascript來建立目錄,也可以用1,2,3建立目錄,但是哪一個(gè)更明確,更便于記憶和管理呢?顯然是前者!
隨著網(wǎng)頁技術(shù)的不斷發(fā)展,利用數(shù)據(jù)庫或者其他后臺(tái)程序自動(dòng)生成網(wǎng)頁越來越普遍,網(wǎng)站的目錄結(jié)構(gòu)也必將飛躍到一個(gè)新的結(jié)構(gòu)層次。
二.網(wǎng)站的鏈接結(jié)構(gòu)
網(wǎng)站的鏈接結(jié)構(gòu)是指頁面之間相互鏈接的拓?fù)浣Y(jié)構(gòu)。它建立在目錄結(jié)構(gòu)基礎(chǔ)之上,但可以跨越目錄。形象的說:每個(gè)頁面都是一個(gè)固定點(diǎn),鏈接則是在兩個(gè)固定點(diǎn)之間的連線。一個(gè)點(diǎn)可以和一個(gè)點(diǎn)連接,也可以和多個(gè)點(diǎn)連接。更重要的是,這些點(diǎn)并不是分布在一個(gè)平面上,而是存在于一個(gè)立體的空間中。
●我們研究網(wǎng)站的鏈接結(jié)構(gòu)的目的在于:用最少的鏈接,使得瀏覽最有效率。
一般的,建立網(wǎng)站的鏈接結(jié)構(gòu)有兩種基本方式:
1.樹狀鏈接結(jié)構(gòu)(一對(duì)一)。類似DOS的目錄結(jié)構(gòu),首頁鏈接指向一級(jí)頁面,一級(jí)頁面鏈接指向二級(jí)頁面。立體結(jié)構(gòu)看起來就象蒲公英。這樣的鏈接結(jié)構(gòu)瀏覽時(shí),一級(jí)級(jí)進(jìn)入,一級(jí)級(jí)退出。優(yōu)點(diǎn)是條理清晰,訪問者明確知道自己在什么位置,不會(huì)"迷"路。缺點(diǎn)是瀏覽效率低,一個(gè)欄目下的子頁面到另一個(gè)欄目下的子頁面,必須繞經(jīng)首頁。
2.星狀鏈接結(jié)構(gòu)(一對(duì)多)。類似網(wǎng)絡(luò)服務(wù)器的鏈接,每個(gè)頁面相互之間都建立有鏈接。立體結(jié)構(gòu)象東方明珠電視塔上的鋼球。這種鏈接結(jié)構(gòu)的優(yōu)點(diǎn)是瀏覽方便,隨時(shí)可以到達(dá)自己喜歡的頁面。缺點(diǎn)是鏈接太多,容易使瀏覽者迷路,搞不清自己在什么位置,看了多少內(nèi)容。
這兩種基本結(jié)構(gòu)都只是理想方式,在實(shí)際的網(wǎng)站設(shè)計(jì)中,總是將這兩種結(jié)構(gòu)混合起來使用。我們希望瀏覽者既可以方便快速的達(dá)到自己需要的頁面,又可以清晰的知道自己的位置。所以,最好的辦法是:
●首頁和一級(jí)頁面之間用星狀鏈接結(jié)構(gòu),一級(jí)和二級(jí)頁面之間用樹狀鏈接結(jié)構(gòu)。
其中,首頁,財(cái)經(jīng)新聞頁,娛樂新聞頁,IT新聞頁之間是星狀鏈接,可以互相點(diǎn)擊,直接到達(dá)。而財(cái)經(jīng)新聞頁和它的子頁面之間是樹狀連接,瀏覽財(cái)經(jīng)新聞1后,你必須回到財(cái)經(jīng)新聞頁,才能瀏覽IT新聞2。所以,有站點(diǎn)為了免去返回一級(jí)頁面的麻煩,將二級(jí)頁面直接用新開窗口(POPupwindows)打開,瀏覽結(jié)束后關(guān)閉即可。
注意:以上我們都是用的三級(jí)頁面舉例。如果您的站點(diǎn)內(nèi)容龐大,分類明細(xì),需要超過三級(jí)頁面,那么建議你在頁面里顯示導(dǎo)航條,可以幫助瀏覽者明確自己所處的位置。就是您經(jīng)??吹皆S多網(wǎng)站頁面頂部的,類似這樣:“您現(xiàn)在的位置是:首頁->財(cái)經(jīng)新聞->股市信息->深圳股->深圳發(fā)展”。
關(guān)于鏈接結(jié)構(gòu)的設(shè)計(jì),在實(shí)際的網(wǎng)頁制作中是非常重要一環(huán)。采用什么樣的鏈接結(jié)構(gòu)直接影響到版面的布局。例如你的主菜單放在什么位置,是否每頁都需要放置,是否需要用分幀框架,是否需要加入返回首頁的鏈接。在連接結(jié)構(gòu)確定后,再開始考慮鏈接的效果和形式,是采用下拉表單,還是用DHTML動(dòng)態(tài)菜單等等。
隨著電子商務(wù)的推廣,網(wǎng)站競爭的越來越激烈,對(duì)鏈接結(jié)構(gòu)設(shè)計(jì)的要求已經(jīng)不僅僅局限于可以方便快速的瀏覽,更加注重個(gè)性化和相關(guān)性。例如,一個(gè)愛嬰主題網(wǎng)站里,在8個(gè)月嬰兒的營養(yǎng)問題頁面上,你需要加入8個(gè)月嬰兒的健康問題鏈接,智力培養(yǎng)鏈接,或者是有關(guān)奶粉宣傳的鏈接,一本圖書,一個(gè)玩具的鏈接。因?yàn)楦改覆豢赡艿矫總€(gè)欄目下去尋找關(guān)于8個(gè)月嬰兒的信息,他們可能在找到需要的問題后就離開網(wǎng)站了。如何盡可能留住訪問者,是網(wǎng)站設(shè)計(jì)者未來必須考慮的問題。
|