• EN
香港:(852)3749 9734
廣州: (020) 3808 3267
[email protected]

新聞資料

如何設計好網站的主頁

  網站的主頁就像是人的一張臉,非常的重要。那麼我們應該如何設計好自己的網站呢。
  1.讓讀者有理由逗留。要把網頁作得趣味盎然,引人入勝。但首要的是要讓它有用處。這樣做的一個很簡單的辦法是提供相互參與———讓讀者做一些事情,如報名獲取定期發送的通訊,並用某種方式報答他們的參與,如每週抽獎或給予下載一些東西的機會。
  2.對訪問者來說最具價值的站點是那些立刻就能讓人明白哪些資訊可以獲取,怎樣獲取,以及可能還有怎樣讓讀者來更正他自己認為有錯誤的地方或加上他自己的內容。
  3.簽上自己的名字,並展示得到的榮譽———但不要在這裏弄上一個長長的簽名。少許的自我宣傳可能是中肯的,尤其是當你想讓自己的網頁具有個人特色時,但這可能會帶來困窘和妨礙實質內容。你所要作的只是連接到關於作者的那一頁,該頁也是棄權、版權聲明及類似說明的合適地方。
  4.不要包括一些一般化的Web參考資訊和人人都有的已不再是熱點的連接。連接到AltaVista和Yahoo可能就已足夠了,否則你的外部連接應該是具有特殊意義和讀者還沒有遇到過的地方。
  5.要是有以評論或讀者意見的形式取得的肯定性的回饋,可考慮把它包括在主頁之內———也許在開頭的某個地方,或者作為到榮譽頁的一個連接。如果做得恰到好處,可以鼓勵新的訪問者並使他們放心相反,要是做得不合適,就會被認為是自我吹噓,而真正的內容反而處於次要地位。
  6.忘掉已學會的在紙上寫作的大多數習慣。基於文字、面向紙張的寫作所面臨的任務是精心安排的敘述,在提供知識、愉悅心情或說服別人的過程當中要能保持讀者的興趣;但是文字並不是大多數Web版面的主要組成部分———即便是頁面上的文字比其他元素多,也常常是其他組成部分(圖像、超媒體連接)被認為比單純的文字更重要。
  7.結構至關重要。網頁可能會看起來是二維的,但不應如此理解。印刷頁面的原有結構在Web已不復存在;寫作者得著重於檔以可見的方式表現出來的結構,因為它可能已具有更微妙的交流功能。
  8.Web的讀者不會去讀每一個詞,他們的閱讀方式更近似於快速閱讀而不是象讀呆板的樹式檔那樣的逐行閱讀。通過電腦螢幕閱讀並不是件格外舒服的事情,因此讀者希望最好能儘快得到結果。
  9.在Web頁面創作中讀者實際上是一個配合者。除了要注意在任何類型的寫 中都要考慮的辭彙、語調和其他事項外,網頁作者還要意識和具體考慮到讀者的身體運動———按滑鼠鍵、滾動頁面、寫作郵件———也是交流過程的一部分。
  頁面設計
  10.有了一個HTML編輯器和幾兆伺服器空間並不能說馬上就可以設計網頁 了。在開始編寫文字、尋找圖像和進行HTML標記之前應該先把基本的網頁結構 組織號。如果沒什麼要說的,就什麼也不要說。要是開始的時候在腦子裏沒有一 個相當明確的結構,那幾乎肯定會以一團糟而告終。開始時謹慎一些,然後不停 學習,不停地改進。卸載一些你喜歡的頁面,核對HTML原始檔案看它是怎樣寫 的:把它全部或部分粘貼到一個試驗檔進行檢驗。整頁地拷貝別人的東西是剽 竊行為,但是向別人學習則是研究過程。
  11.人們第一次進入你的主頁時,他們通常不是在尋找值得閱讀的地方,他 們可能正在尋找可供選擇的東西,以超文本術語說即是可用滑鼠點取的詞句、圖 像、按鈕等等,接下來是閱讀文字,選定一個可選項,按滑鼠鍵,下頁出現後又 重複此過程。這裏的技巧是確定閱讀時按鍵的適當比率。提供的可選項要是太少, 訪問者會覺得沒意思,要是太多又會嚇倒別人。
  12.要是頁面包含的內容資訊量大,在開始設計頁面之前就要先確定好讀者對象。對新手或新的訪問者來說用一種固定的檔結構並在開始的時候給予說明 是有意義的。例如,關於內容的說明表格或某種類似結構。如果你要滿足知識或 經驗不在同一個層次的讀者,提供限制性的線索可以讓某些讀者跳過基本內容直 達目標。提供連接時要考慮到各個層次的讀者。
  13.不要讓讀者不知所措。不必非要用聲音和圖像充斥網頁,也不要把檔 做得太長以至於在裝載檔時讓讀者等得腳後跟發涼,因此使用圖像時要謹慎:大的圖像顯然會降低頁面建立的速度,但許多需要順序裝載的小圖像也會如此。
  佈局
  14.別輕易讓文字居中和使用粗體或斜體字元。除了視感混亂之外,很多流 覽器不能很好地顯示斜體字,也不能補償由於字母傾斜引起的空白變化。
  15.利用短的段落,加點列示,適當的整塊引用文字,用水平線分節,用影 象地圖指引主要連接,使你的頁面能吸引人和容易閱讀。
  16.不要在每一頁使用風格不同的圖示。
  17.不必在以頁面上填滿圖像來增加視覺趣味。儘量使用彩色圓點———它 們較小並能為列表項增加色彩活力(並能用於彩色列表)。彩色分隔條也能在不擾 亂帶寬的情況下增強圖形感。
  18.對用作背景的GIF要謹慎。它們可以使一個頁面看起來很有趣,甚至很 專業;但是裝飾背景很容易使文字變得不可辨讀。要把背景做得好,光有顏色對 比是不夠的。背景要麼很亮(文字較暗)要麼很暗(文字較亮)。如果背景含有圖像, 對比度要較低才不至於過於分散讀者的注意力。
  19.在IMG行加ALT標記。假設標題圖像顯示為TheOffalEaters\‘Home Page, 你可以在號內加上一個ALT標記,ALT=\"TheOffalEaters\‘HomePage\",直接 把它加SRC=offal.com.uk/images/gif/home-top.gif之後。這樣就會讓使 用基於文本的流覽器的讀者除了看到[IMAGE]以外還能看到別的一些東西,使用
  圖形流覽器的讀者在圖像未能成功載入之時也會看到一些東西,而你也能讓自己 的HTML檔相當整潔。
  20.也可以在分隔條上使用ALT標記,這樣就使得使用基於文本的流覽器的 讀者能看到一些更有趣的東西,而不只是一條直線。
  21.不要把重要的內容放到頁尾———有些讀者可能不會往下看那麼遠。
  22.不要讓什麼東西看起來像是一個按鈕卻不起按鈕的作用。
  HTML格式
  23.應避免使用交叉標記。不同的流覽器對交叉標記的反映會不同。
  24.使用交織GIF和Jpeg。因為交織圖像是分級顯示出來的———首先以很 低的解析度顯示,然後逐步提高解析度,直至最後達到正常顯示———這種方式 有時候會使較大的圖像看起來好象裝載得快一些(實際上並非如此,但這是一種 有益的錯覺)。這樣也便於讀者在圖像裝載的過程中看到它的模樣,如果他們不 喜歡或不想看的話就有機會中斷傳輸或轉向別的地方。
  25.另一種增加可得帶寬的巧妙方法是在HTML底稿中使用Lowsrc命令。比 如有一張400×600像素的1600萬色掃描圖,所占空間約為35K。使用 PaintShopPro這一類的工具對原圖重新取樣,比如說高度為100像素(也許為了 達到你自己的要求你得進行調整才能找到最合適的大小,但可以從高度除以4 開始),PaintShopPro會自動計算新畫面的寬度。保存新畫面,它的大小現在應 為6K或更小。然後在HTML檔中可以這樣寫上: imgsrc=\"bigpic.jpg\"lowsrc=\"smallpic.jpg\"width=600height=400
  Lowsrc命令指示流覽器在真正的畫面載入以前先裝載低解析度的圖像,這樣就
  讓讀者清楚將會出現什麼樣的畫面。(為確保流覽器能即時以合適的大小顯示圖
  像,高度和寬度很重要)。
  26.當然,可以用Lowsrc提取你想要的任何圖像。一條雙色的\"請等待下 傳\"的資訊可能只占幾百位元組,同時由於圖像是存在流覽器的緩存區,因此可用 \"請等待\"資訊代替所有畫面。當圖像平靜地消失於背景之中的時候,讀者可以悠閒地流覽你的網頁。
  27.可以在一個HTML元素內嵌入一個連接,如:
  Myheading
  但不能反其道而行之,把一個標題或其他HTML元素嵌入一個連接。下麵這樣的結構是正式 的HTML規定禁止的,並可能在大多數最新的流覽器下不見效果:
  Myheading
  長文件
  28.當頁面為單個長文件時要小心。它的傳輸時間明顯要比較短的頁面的傳輸時間長,即使通信速率為28.8Kbps的讀者也可能會失去耐心。閱讀大的檔 時頁面滾動也很困難。大的檔和較慢的裝載速度可能會使人沮喪,再也不會返 回到你的網點。
  29.如果你覺得檔大小很重要,不便改變,就要考慮讀者將會怎樣使用網 頁。努力確保讀者流覽長文件時流覽器滾動條小的移動不會在頁面上產生大的跳 躍。作為一條經驗規則,按一次滾動條頁面移動的範圍要少於一頁,這樣就還看 得見上一個窗口的部分內容。任何比這更大的移動都會讓人迷失方向。
  30.要不然就把一個長文件分成幾個子檔,在主頁給予連接。不過要記住
  子頁可能會成為死頁———有時候命中率要低於10%。做得聰明一點,給讀者一
  個很好的理由裝入子頁或給他們一個很好的理由流覽它。
  31.如果頁面很多,在主頁給出一個內容列表或目錄顯然是個好辦法。不要 非得作成那種常規的、令人厭煩的、死板的樹形佈局,把它做得有趣一些,讓讀 者有理由進入連接,幫助他們瞭解他們可能看不出來的容。
  32.要是你必須把所有的內容都放在一個檔裏面,使用一個內容列表,從 表的專案可直接跳到各部分的開頭。或者做得更好,提供一個獨立的文本檔用 於下傳———去掉所有的格式符———使下傳的時間減到最少。
  連接
  33.通常的順序文本寫作與線上檔寫作之間的一個主要區別是線上檔的 讀者可能在檔的任何一點進入該檔。儘管你已做了一個漂亮的首頁作為入 口,其他人可能會對你的傑作內的具體指針或子頁給出連接。向這些新的訪問者提供一些關於他們在什麼地方以及為什麼在這裏的線索是有意義的。
  34.從頭至尾都要使用導航圖示,尤其是要用\"返回到首頁\"連接。可以在 每部分都做這樣做。比如在每頁的頂端(或底部)都有一小串圖示,第一個回到首 頁,第二個回到章,第三個回到節。
  35.在頁面上應該有一些連接幫助訪問者來回跳轉。總是以相同的格式把這 些連接放到所有頁面上,這樣讀者就總能知道到哪兒去找到它們以及怎樣使用它
  們。
  36.一般來說應該使用相對連接,因為(1)這樣容易把一組檔移到另一個地 方(相對路徑名仍然有效),(2)輸入量較少。在同一頁的連接項當然應該使用相 對地址,因為使用絕對地址後可能會每選擇一個連接都要把該頁重新裝載一次。
  37.連接到不直接相關的檔時使用絕對路徑。這樣以後要是把原始檔案移到 另外的目錄下就不需更改連接了。
  38.確保可選擇的連接清楚直觀———用標題或明顯相關的圖像來表明它有 什麼內容。特別要避免\"請按這裏\",任何要\"按這裏\"的人都會慎重考慮,它 是不是正好就在\"這裏\",並且連接無誤。不要讓連接的名稱與連接的URL相同, 這樣會使讀者要作的工作增加。
  39.Mailto連接中應把e-mail地址作為連接名稱。例如,可能有一個人名和一個e-mail地址,人名連接到他的主頁,e-maill地址連接到mailto。新聞 組連接應當直接用組名。
  40.核對href,不要在頁內出現任何沒有出路的連接,也不要讓連接落掉。
  通則
  41.實際上,網頁要麼處於建設之中要麼就是死的———如果你不更新它並且它不是純粹的歷史資料,它馬上就會變舊。\"最後一次更新\"記錄是一個好 辦法。且不說別的,如果你的頁面變化太少,你很快就會在讀者評論中得到諷刺
  意見。
  42.鼓勵讀者通過填表或發郵件回饋意見。但要準備處理隨之而來的事務 ———要儘快地回e-mail,增加連接,修改輸入錯誤等等。給通過e-mail進行 評論的人回感謝信。
  43.在頁內告訴讀者如果他們在自己的主頁內設置一個指向你的連接你不會 介意,並表明你也同樣會設置一個指向他的主頁的連接。每個人都希望有人訪問 自己的網頁,而這種相互支持會鼓勵對見解類似的網點的訪問。
  44.聯機時間是昂貴的,而訪問者的注意時間之短是眾所周知的。想辦法告 訴讀者下傳要用的時間———告訴他們要出現的圖像的大小或下傳一個文本文 件或二進位檔要用多久的時間。為把聯機時間減到最少,指出你會給出FTP 地點或提供到其他頁的連接,讀者會欣賞你的這種做法。
  45.利用Digital的優秀檢索工具AltaVista找出誰已建立了指向你的Web 的連接。在高級檢索方式下,輸入
  linkhttp://my.site.com/ANDNOTurl:http://my.site.com/
  在簡單查詢中也可同樣做到,輸入
  +linkhttp://my.site.com/-url:http://my.site.com/
  46.Web上的大多數寫作都相當糟糕。由於多數網頁都是空話連篇,自我吹 噓,編寫粗糙,編輯審核也不存在,好的寫作就很突出了。
  47.不要忘記為你的主頁加一個描述性的標題,當某個人把它保存在自己的熱點目錄後能知道這裏是什麼內容。
  設備獨立
  48.HTML不包括檔顯示時用到的字體、段落形式及空白資訊。這正是它的 意義所在,無論在什麼平臺上,包括文字終端,你的檔都能成功地顯示出來。 由此產生出最低命令標準。因此要瞭解不同的流覽器用不同的空白和字體。
  49.假設你的頁面要用某個特定的流覽器閱讀時要當心。要是沒有滑鼠器, 讓別人\"按這裏\"是不會有效的,如果你的讀者使用InternetExplorer或 SpryMosaic,Netscape2.0的插件就不會有效,除非你能保證讀者有Netscape 或InternetExplorer相容的流覽器,否則重新調整過的圖像可能會以預想不到 的大小顯示出來,表格也會很難看(或根本看不見)。在少數流覽器上,你根本不
  能看Jpeg圖像。
  50.不會有很多讀者不能處理16位的圖像,但是要注意,如果用16位(64K 色)或24位(1670萬色)的調色板製作精巧的背景,你可能會發現使用較老的設 備的人只能跳過去。用8位圖看彩色背景時會降為可怕的圖形。帶視卡但RAM 少於2M的PC是不能觀看圖像的。