如何設(shè)計(jì)好網(wǎng)站的主頁

網(wǎng)站的主頁就像是人的一張臉，非常的重要。那么我們應(yīng)該如何設(shè)計(jì)好自己的網(wǎng)站呢。下面成都網(wǎng)站設(shè)計(jì)-創(chuàng)新互聯(lián)為大家詳細(xì)講解一下：

1.讓讀者有理由逗留。要把網(wǎng)頁作得趣味盎然，引人入勝。但首要的是要讓它有用處。這樣做的一個(gè)很簡(jiǎn)單的辦法是提供相互參與———讓讀者做一些事情，如報(bào)名獲取定期發(fā)送的通訊，并用某種方式報(bào)答他們的參與，如每周抽獎(jiǎng)或給予下載一些東西的機(jī)會(huì)。

2.對(duì)訪問者來說最具價(jià)值的站點(diǎn)是那些立刻就能讓人明白哪些信息可以獲取，怎樣獲取，以及可能還有怎樣讓讀者來更正他自己認(rèn)為有錯(cuò)誤的地方或加上他自己的內(nèi)容。

3.簽上自己的名字，并展示得到的榮譽(yù)———但不要在這里弄上一個(gè)長(zhǎng)長(zhǎng)的簽名。少許的自我宣傳可能是中肯的，尤其是當(dāng)你想讓自己的網(wǎng)頁具有個(gè)人特色時(shí)，但這可能會(huì)帶來困窘和妨礙實(shí)質(zhì)內(nèi)容。你所要作的只是連接到關(guān)于作者的那一頁，該頁也是棄權(quán)、版權(quán)聲明及類似說明的合適地方。

4.不要包括一些一般化的Web參考信息和人人都有的已不再是熱點(diǎn)的連接。連接到AltaVista和Yahoo可能就已足夠了，否則你的外部連接應(yīng)該是具有特殊意義和讀者還沒有遇到過的地方。

5.要是有以評(píng)論或讀者意見的形式取得的肯定性的反饋，可考慮把它包括在主頁之內(nèi)———也許在開頭的某個(gè)地方，或者作為到榮譽(yù)頁的一個(gè)連接。如果做得恰到好處，可以鼓勵(lì)新的訪問者并使他們放心相反，要是做得不合適，就會(huì)被認(rèn)為是自我吹噓，而真正的內(nèi)容反而處于次要地位。

6.忘掉已學(xué)會(huì)的在紙上寫作的大多數(shù)習(xí)慣?；谖淖?、面向紙張的寫作所面臨的任務(wù)是精心安排的敘述，在提供知識(shí)、愉悅心情或說服別人的過程當(dāng)中要能保持讀者的興趣;但是文字并不是大多數(shù)Web版面的主要組成部分———即便是頁面上的文字比其他元素多，也常常是其他組成部分(圖像、超媒體連接)被認(rèn)為比單純的文字更重要。

7.結(jié)構(gòu)至關(guān)重要。網(wǎng)頁可能會(huì)看起來是二維的，但不應(yīng)如此理解。印刷頁面的原有結(jié)構(gòu)在Web已不復(fù)存在;寫作者得著重于文件以可見的方式表現(xiàn)出來的結(jié)構(gòu)，因?yàn)樗赡芤丫哂懈⒚畹慕涣鞴δ堋?/p>

8.Web的讀者不會(huì)去讀每一個(gè)詞，他們的閱讀方式更近似于快速閱讀而不是象讀呆板的樹式文件那樣的逐行閱讀。通過計(jì)算機(jī)屏幕閱讀并不是件格外舒服的事情，因此讀者希望好能盡快得到結(jié)果。

9.在Web頁面創(chuàng)作中讀者實(shí)際上是一個(gè)配合者。除了要注意在任何類型的寫 中都要考慮的詞匯、語調(diào)和其他事項(xiàng)外，網(wǎng)頁作者還要意識(shí)和具體考慮到讀者的身體運(yùn)動(dòng)———按鼠標(biāo)鍵、滾動(dòng)頁面、寫作郵件———也是交流過程的一部分。

頁面設(shè)計(jì)

10.有了一個(gè)HTML編輯器和幾兆服務(wù)器空間并不能說馬上就可以設(shè)計(jì)網(wǎng)頁 了。在開始編寫文字、尋找圖像和進(jìn)行HTML標(biāo)記之前應(yīng)該先把基本的網(wǎng)頁結(jié)構(gòu) 組織號(hào)。如果沒什么要說的，就什么也不要說。要是開始的時(shí)候在腦子里沒有一 個(gè)相當(dāng)明確的結(jié)構(gòu)，那幾乎肯定會(huì)以一團(tuán)糟而告終。開始時(shí)謹(jǐn)慎一些，然后不停 學(xué)習(xí)，不停地改進(jìn)。卸載一些你喜歡的頁面，核對(duì)HTML源文件看它是怎樣寫 的:把它全部或部分粘貼到一個(gè)試驗(yàn)文件進(jìn)行檢驗(yàn)。整頁地拷貝別人的東西是剽 竊行為，但是向別人學(xué)習(xí)則是研究過程。

11.人們第一次進(jìn)入你的主頁時(shí)，他們通常不是在尋找值得閱讀的地方，他 們可能正在尋找可供選擇的東西，以超文本術(shù)語說即是可用鼠標(biāo)點(diǎn)取的詞句、圖 像、按鈕等等，接下來是閱讀文字，選定一個(gè)可選項(xiàng)，按鼠標(biāo)鍵，下頁出現(xiàn)后又 重復(fù)此過程。這里的技巧是確定閱讀時(shí)按鍵的適當(dāng)比率。提供的可選項(xiàng)要是太少， 訪問者會(huì)覺得沒意思，要是太多又會(huì)嚇倒別人。

12.要是頁面包含的內(nèi)容信息量大，在開始設(shè)計(jì)頁面之前就要先確定好讀者對(duì)象。對(duì)新手或新的訪問者來說用一種固定的文件結(jié)構(gòu)并在開始的時(shí)候給予說明 是有意義的。例如，關(guān)于內(nèi)容的說明表格或某種類似結(jié)構(gòu)。如果你要滿足知識(shí)或 經(jīng)驗(yàn)不在同一個(gè)層次的讀者，提供限制性的線索可以讓某些讀者跳過基本內(nèi)容直 達(dá)目標(biāo)。提供連接時(shí)要考慮到各個(gè)層次的讀者。

13.不要讓讀者不知所措。不必非要用聲音和圖像充斥網(wǎng)頁，也不要把文件 做得太長(zhǎng)以至于在裝載文件時(shí)讓讀者等得腳后跟發(fā)涼，因此使用圖像時(shí)要謹(jǐn)慎:大的圖像顯然會(huì)降低頁面建立的速度，但許多需要順序裝載的小圖像也會(huì)如此。

布局

14.別輕易讓文字居中和使用粗體或斜體字符。除了視感混亂之外，很多流 覽器不能很好地顯示斜體字，也不能補(bǔ)償由于字母傾斜引起的空白變化。

15.利用短的段落，加點(diǎn)列示，適當(dāng)?shù)恼麎K引用文字，用水平線分節(jié)，用影 象地圖指引主要連接，使你的頁面能吸引人和容易閱讀。

16.不要在每一頁使用風(fēng)格不同的圖標(biāo)。

17.不必在以頁面上填滿圖像來增加視覺趣味。盡量使用彩色圓點(diǎn)———它 們較小并能為列表項(xiàng)增加色彩活力(并能用于彩色列表)。彩色分隔條也能在不擾 亂帶寬的情況下增強(qiáng)圖形感。

18.對(duì)用作背景的GIF要謹(jǐn)慎。它們可以使一個(gè)頁面看起來很有趣，甚至很 專業(yè);但是裝飾背景很容易使文字變得不可辨讀。要把背景做得好，光有顏色對(duì) 比是不夠的。背景要么很亮(文字較暗)要么很暗(文字較亮)。如果背景含有圖像， 對(duì)比度要較低才不至于過于分散讀者的注意力。

19.在IMG行加ALT標(biāo)記。假設(shè)標(biāo)題圖像顯示為TheOffalEaters\‘Home Page， 你可以在號(hào)內(nèi)加上一個(gè)ALT標(biāo)記，ALT=\"TheOffalEaters\‘HomePage\"，直接 把它加SRC=offal.com.uk/images/gif/home-top.gif之后。這樣就會(huì)讓使 用基于文本的流覽器的讀者除了看到[IMAGE]以外還能看到別的一些東西，使用
圖形流覽器的讀者在圖像未能成功載入之時(shí)也會(huì)看到一些東西，而你也能讓自己 的HTML文件相當(dāng)整潔。

20.也可以在分隔條上使用ALT標(biāo)記，這樣就使得使用基于文本的流覽器的 讀者能看到一些更有趣的東西，而不只是一條直線。

21.不要把重要的內(nèi)容放到頁尾———有些讀者可能不會(huì)往下看那么遠(yuǎn)。

22.不要讓什么東西看起來象是一個(gè)按鈕卻不起按鈕的作用。

HTML格式

23.應(yīng)避免使用交叉標(biāo)記。不同的瀏覽器對(duì)交叉標(biāo)記的反映會(huì)不同。

24.使用交織GIF和Jpeg。因?yàn)榻豢棃D像是分級(jí)顯示出來的———首先以很 低的分辨率顯示，然后逐步提高分辨率，直至最后達(dá)到正常顯示———這種方式 有時(shí)候會(huì)使較大的圖像看起來好象裝載得快一些(實(shí)際上并非如此，但這是一種 有益的錯(cuò)覺)。這樣也便于讀者在圖像裝載的過程中看到它的模樣，如果他們不 喜歡或不想看的話就有機(jī)會(huì)中斷傳輸或轉(zhuǎn)向別的地方。

25.另一種增加可得帶寬的巧妙方法是在HTML底稿中使用Lowsrc命令。比 如有一張400×600像素的1600萬色掃描圖，所占空間約為35K。使用 PaintShopPro這一類的工具對(duì)原圖重新取樣，比如說高度為100像素(也許為了 達(dá)到你自己的要求你得進(jìn)行調(diào)整才能找到最合適的大小，但可以從高度除以4 開始)，PaintShopPro會(huì)自動(dòng)計(jì)算新畫面的寬度。保存新畫面，它的大小現(xiàn)在應(yīng) 為6K或更小。然后在HTML文件中可以這樣寫上: imgsrc=\"bigpic.jpg\"lowsrc=\"smallpic.jpg\"width=600height=400

Lowsrc命令指示瀏覽器在真正的畫面載入以前先裝載低分辨率的圖像，這樣就
讓讀者清楚將會(huì)出現(xiàn)什么樣的畫面。(為確保瀏覽器能即時(shí)以合適的大小顯示圖
像，高度和寬度很重要)。

26.當(dāng)然，可以用Lowsrc提取你想要的任何圖像。一條雙色的\"請(qǐng)等待下 傳\"的信息可能只占幾百字節(jié)，同時(shí)由于圖像是存在瀏覽器的緩存區(qū)，因此可用 \"請(qǐng)等待\"信息代替所有畫面。當(dāng)圖像平靜地消失于背景之中的時(shí)候，讀者可以悠閑地瀏覽你的網(wǎng)頁。

27.可以在一個(gè)HTML元素內(nèi)嵌入一個(gè)連接，如:

＜H1＞＜AHREF=\"Destina-tion.html\"＞Myheading＜/A＞＜/H1＞但不能反其道而行之，把一個(gè)標(biāo)題或其他HTML元素嵌入一個(gè)連接。下面這樣的結(jié)構(gòu)是正式 的HTML規(guī)定禁止的，并可能在大多數(shù)最新的瀏覽器下不見效果: ＜AHREF=\"Destination.html\"＞＜H1＞Myheading＜/H1＞＜/A＞

長(zhǎng)文件

28.當(dāng)頁面為單個(gè)長(zhǎng)文件時(shí)要小心。它的傳輸時(shí)間明顯要比較短的頁面的傳輸時(shí)間長(zhǎng)，即使通信速率為28.8Kbps的讀者也可能會(huì)失去耐心。閱讀大的文件 時(shí)頁面滾動(dòng)也很困難。大的文件和較慢的裝載速度可能會(huì)使人沮喪，再也不會(huì)返 回到你的網(wǎng)點(diǎn)。

29.如果你覺得文件大小很重要，不便改變，就要考慮讀者將會(huì)怎樣使用網(wǎng) 頁。努力確保讀者瀏覽長(zhǎng)文件時(shí)瀏覽器滾動(dòng)條小的移動(dòng)不會(huì)在頁面上產(chǎn)生大的跳 躍。作為一條經(jīng)驗(yàn)規(guī)則，按一次滾動(dòng)條頁面移動(dòng)的范圍要少于一頁，這樣就還看 得見上一個(gè)窗口的部分內(nèi)容。任何比這更大的移動(dòng)都會(huì)讓人迷失方向。

30.要不然就把一個(gè)長(zhǎng)文件分成幾個(gè)子文件，在主頁給予連接。不過要記住
子頁可能會(huì)成為死頁———有時(shí)候命中率要低于10%。做得聰明一點(diǎn)，給讀者一
個(gè)很好的理由裝入子頁或給他們一個(gè)很好的理由瀏覽它。

31.如果頁面很多，在主頁給出一個(gè)內(nèi)容列表或目錄顯然是個(gè)好辦法。不要 非得作成那種常規(guī)的、令人厭煩的、死板的樹形布局，把它做得有趣一些，讓讀 者有理由進(jìn)入連接，幫助他們了解他們可能看不出來的容。

32.要是你必須把所有的內(nèi)容都放在一個(gè)文件里面，使用一個(gè)內(nèi)容列表，從 表的項(xiàng)目可直接跳到各部分的開頭?；蛘咦龅酶?，提供一個(gè)獨(dú)立的文本文件用 于下傳———去掉所有的格式符———使下傳的時(shí)間減到最少。

連接

33.通常的順序文本寫作與在線文件寫作之間的一個(gè)主要區(qū)別是在線文件的 讀者可能在文件的任何一點(diǎn)進(jìn)入該文件。盡管你已做了一個(gè)漂亮的首頁作為入 口，其他人可能會(huì)對(duì)你的杰作內(nèi)的具體指針或子頁給出連接。向這些新的訪問者提供一些關(guān)于他們?cè)谑裁吹胤揭约盀槭裁丛谶@里的線索是有意義的。

34.從頭至尾都要使用導(dǎo)航圖標(biāo)，尤其是要用\"返回到首頁\"連接?？梢栽?每部分都做這樣做。比如在每頁的頂端(或底部)都有一小串圖標(biāo)，第一個(gè)回到首 頁，第二個(gè)回到章，第三個(gè)回到節(jié)。

35.在頁面上應(yīng)該有一些連接幫助訪問者來回跳轉(zhuǎn)?？偸且韵嗤母袷桨堰@ 些連接放到所有頁面上，這樣讀者就總能知道到哪兒去找到它們以及怎樣使用它
們。

36.一般來說應(yīng)該使用相對(duì)連接，因?yàn)?1)這樣容易把一組文件移到另一個(gè)地 方(相對(duì)路徑名仍然有效)，(2)輸入量較少。在同一頁的連接項(xiàng)當(dāng)然應(yīng)該使用相 對(duì)地址，因?yàn)槭褂媒^對(duì)地址后可能會(huì)每選擇一個(gè)連接都要把該頁重新裝載一次。

37.連接到不直接相關(guān)的文件時(shí)使用絕對(duì)路徑。這樣以后要是把源文件移到 另外的目錄下就不需更改連接了。

38.確?？蛇x擇的連接清楚直觀———用標(biāo)題或明顯相關(guān)的圖像來表明它有 什么內(nèi)容。特別要避免\"請(qǐng)按這里\"，任何要\"按這里\"的人都會(huì)慎重考慮，它 是不是正好就在\"這里\"，并且連接無誤。不要讓連接的名稱與連接的URL相同， 這樣會(huì)使讀者要作的工作增加。

39.Mailto連接中應(yīng)把e-mail地址作為連接名稱。例如，可能有一個(gè)人名和一個(gè)e-mail地址，人名連接到他的主頁，e-maill地址連接到mailto。新聞 組連接應(yīng)當(dāng)直接用組名。

40.核對(duì)href，不要在頁內(nèi)出現(xiàn)任何沒有出路的連接，也不要讓連接落掉。

通則

41.實(shí)際上，網(wǎng)頁要么處于建設(shè)之中要么就是死的———如果你不更新它并且它不是純粹的歷史資料，它馬上就會(huì)變舊。\"最后一次更新\"記錄是一個(gè)好 辦法。且不說別的，如果你的頁面變化太少，你很快就會(huì)在讀者評(píng)論中得到諷刺
意見。

42.鼓勵(lì)讀者通過填表或發(fā)郵件反饋意見。但要準(zhǔn)備處理隨之而來的事務(wù) ———要盡快地回e-mail，增加連接，修改輸入錯(cuò)誤等等。給通過e-mail進(jìn)行 評(píng)論的人回感謝信。

43.在頁內(nèi)告訴讀者如果他們?cè)谧约旱闹黜搩?nèi)設(shè)置一個(gè)指向你的連接你不會(huì) 介意，并表明你也同樣會(huì)設(shè)置一個(gè)指向他的主頁的連接。每個(gè)人都希望有人訪問 自己的網(wǎng)頁，而這種相互支持會(huì)鼓勵(lì)對(duì)見解類似的網(wǎng)點(diǎn)的訪問。

44.聯(lián)機(jī)時(shí)間是昂貴的，而訪問者的注意時(shí)間之短是眾所周知的。想辦法告 訴讀者下傳要用的時(shí)間———告訴他們要出現(xiàn)的圖像的大小或下傳一個(gè)文本文 件或二進(jìn)制文件要用多久的時(shí)間。為把聯(lián)機(jī)時(shí)間減到最少，指出你會(huì)給出FTP 地點(diǎn)或提供到其他頁的連接，讀者會(huì)欣賞你的這種做法。

45.利用Digital的優(yōu)秀檢索工具AltaVista找出誰已建立了指向你的Web 的連接。在高級(jí)檢索方式下，輸入

linkhttp://my.site.com/ANDNOTurl:http://my.site.com/

在簡(jiǎn)單查詢中也可同樣做到，輸入

+linkhttp://my.site.com/-url:http://my.site.com/

46.Web上的大多數(shù)寫作都相當(dāng)糟糕。由于多數(shù)網(wǎng)頁都是空話連篇，自我吹 噓，編寫粗糙，編輯審核也不存在，好的寫作就很突出了。

47.不要忘記為你的主頁加一個(gè)描述性的標(biāo)題，當(dāng)某個(gè)人把它保存在自己的熱點(diǎn)目錄后能知道這里是什么內(nèi)容。

設(shè)備獨(dú)立

48.HTML不包括文件顯示時(shí)用到的字體、段落形式及空白信息。這正是它的 意義所在，無論在什么平臺(tái)上，包括文字終端，你的文件都能成功地顯示出來。 由此產(chǎn)生出最低命令標(biāo)準(zhǔn)。因此要了解不同的瀏覽器用不同的空白和字體。

49.假設(shè)你的頁面要用某個(gè)特定的瀏覽器閱讀時(shí)要當(dāng)心。要是沒有鼠標(biāo)器， 讓別人\"按這里\"是不會(huì)有效的，如果你的讀者使用InternetExplorer或 SpryMosaic，Netscape2.0的插件就不會(huì)有效，除非你能保證讀者有Netscape 或InternetExplorer兼容的瀏覽器，否則重新調(diào)整過的圖像可能會(huì)以預(yù)想不到 的大小顯示出來，表格也會(huì)很難看(或根本看不見)。在少數(shù)瀏覽器上，你根本不
能看Jpeg圖像。

50.不會(huì)有很多讀者不能處理16位的圖像，但是要注意，如果用16位(64K 色)或24位(1670萬色)的調(diào)色板制作精巧的背景，你可能會(huì)發(fā)現(xiàn)使用較老的設(shè) 備的人只能跳過去。用8位圖看彩色背景時(shí)會(huì)降為可怕的圖形。帶視卡但RAM 少于2M的PC是不能觀看圖像的。

名稱欄目：如何設(shè)計(jì)好網(wǎng)站的主頁
網(wǎng)站網(wǎng)址：http://www.muchs.cn/news39/195189.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、自適應(yīng)網(wǎng)站、域名注冊(cè)、營(yíng)銷型網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站、電子商務(wù)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)