網頁

構成網站的基本元素

網頁(Web page)用超文本標記語言HTML(hypertext markupl anguage)書寫的純文本文件,存放在與網際網路相連的計算機上,用統一資源定位符URL(uniform resource locator)進行標識和存取,通過瀏覽器進行閱讀。

網頁中的最基本元素是文字和圖片,另外還有動畫、聲音、視頻、程序等。網頁通過HTML語言規定的格式和標記方法進行描述,確定顯示對象的字體、顏色、大小、位置等修飾信息,瀏覽器對這些標記進行解釋並按規定的格式生成大家所看到的網頁畫面。

格式


網頁件式,擴展..,稱靜態網頁。隨技術展,式網頁件,態網頁,擴展、、、、。
網頁件包含,網頁式檔、式圖形、式照片、式歌曲、式視頻百件類型組。

分類


靜態頁

靜態網頁,容預確,存儲伺服器計算/伺服器。
特點:
● ● 製作速度快,成本低。
● ● 模板一旦確定下來,不容易修改,更新比較費時費事。
● ● 常用於製作一些固定板式的頁面。
● ● 通常用於文本和圖像組成,常用於子頁面的內容介紹。
● ● 對伺服器性能要求較低,但對存儲壓力相對較大。

動態頁

動態網頁,是取決於由用戶提供的參數,並根據存儲在資料庫中的網站上的數據中創建的頁面。
通俗地講,靜態頁是照片,每個人看都是一樣的,而動態頁則是鏡子,不同的人(不同的參數)看都不相同。

記錄功能


當人們每次上網時,都會在歷史記錄里留下記錄,並且被保存在瀏覽器的緩存文件夾里,刪除時只要右鍵刪除就可以了。

網頁遊戲


從08年開始,國內網頁遊戲開始不斷興起,網頁遊戲(Webgame)又稱Web遊戲,無端網游,簡稱頁游。網頁遊戲也是需要重視水平的,如音效的篩選、恰到好處的樂曲與音效搭配、以及良好的結構平台等等,有了這些元素,才能做出一個好的網頁遊戲,同時也會引來更多的瀏覽人數。網頁遊戲的出現讓中國進入了一個新的網路遊戲平台,也進入了一個頁游發展的競爭時代。

感知信息


● ● 文本:文本是網頁上最重要的信息載體和交流工具,網頁中的主要信息一般都以文本形式為主。
● ● 圖像:圖像元素在網頁中具有提供信息並展示直觀形象的作用。
靜態圖像:在頁面中可能是光柵圖形或矢量圖形。通常為GIF,JPEG或PNG;或矢量格式,如SVG或Flash。
動畫圖像:通常動畫為GIF和SVG。
三、Flash動畫:動畫在網頁中的作用是有效地吸引訪問者更多的注意。
四、聲音:聲音是多媒體和視頻網頁重要的組成部分。
五、視頻:視頻文件的採用是網頁效果更加精彩且富有動感。
六、表格:表格是在網頁中用來控制面業信息的布局方式。
七、導航欄:導航欄在網頁中是一組超鏈接,其連接的目的端是網頁中重要的頁面。
八、互動式表單:表單在網頁中通常用來聯繫資料庫並接受訪問用戶在瀏覽器端輸入的數據。利用伺服器的資料庫為客戶端與伺服器端提供更多的互動。

內部信息

● ● 註釋。如:
二、通過超鏈接鏈接到某文件(如DOC,習,SGML等)。
三、元數據與語義的元信息,字符集信息,文件類型描述(DTD),等等。
四、樣式信息:提供的項目的信息(如圖像大小屬性)和視覺規範,層疊樣式表(CSS)、文檔樣式的語義和規範語言(外語全稱:DocumentStyleSemanticsandSpecificationLanguage、外語縮寫:DSSSL)。
五、腳本,通常是爪哇腳本(JavaScript),提供交互性以及相關功能的補充(比如倒計時關閉窗口等)。
網頁還包含動態適應的信息元素,取決於某某渲染瀏覽器或最終用戶的位置。(通過使用IP地址跟蹤和/或“cookie”的信息)。從更一般/寬的角度來看,一些信息(分組)的元素,像一個導航欄,所有的網頁是統一的,像一個標準,比如“網頁模板系統”。

整體風格

網站的整體風格及其創意設計是最難以學習的,難就難在沒有一個固定的模式可以參照和模仿。給一個主題,任何兩人都不可能設計出完全一樣的網站。
風格(style)是抽象的。是指站點的整體形象給瀏覽者的綜合感受。這個“整體形象”包括站點的CI(標誌、色彩、字體、標語)、版面布局、瀏覽方式、交互性、文字、語氣、內容價值、存在意義、站點榮譽等等諸多因素。舉個例子:人們覺得網易是平易近人的,迪斯尼是生動活潑的。IBM是專業嚴肅的,這些都是網站給人們留下的不同感受。
在這裡,一些參考經驗:
將的標誌,儘可能的放在每個頁面上最突出的位置。
突出的標準色彩。
總結一句能反映貴站精髓的宣傳標語!
相同類型的圖像採用相同效果,比如說標題字都採用陰影效果,那麼在網站中出現的所有標題字的陰影效果的設置應該是完全一致的!

色彩搭配

無論是平面設計,還是網頁設計,色彩永遠是最重要的一環。當人們距離顯示屏較遠的時候,人們看到的不是優美的版式或者是美麗的圖片,而是網頁的色彩。
關於色彩的原理有許多,在此人們不可能一一闡述,大家可以看看相關設計書籍,有利於系統地理解。在此人們僅僅想告訴大家一些網頁配色時的小技巧。
● ● 用一種色彩。這裡是指先選定一種色彩,然後調整透明度或者飽和度,這樣的頁面看起來色彩統一,有層次感。
● ● 用兩種色彩。先選定一種色彩,然後選擇它的對比色。
● ● 用一個色系。簡單的說就是用一個感覺的色彩,例如淡藍,淡黃,淡綠;或者土黃,土灰,土藍。
在網頁配色中,還要切記一些誤區:
● ● 不要將所有顏色都用到,盡量控制在三至五種色彩以內。
● ● 背景和前文的對比盡量要大(絕對不要用花紋繁複的圖案作背景),以便突出主要文字內容。

排版問題


● ● 字間距太擠或太寬。
● ● 行距太小或太大。
● ● 段距太少或太多。
● ● 每行字數太多或太少。

設計工具


一、Amaya(單位:萬維網聯盟)用於編輯HTML、CSS、數學標記語言、可縮放矢量圖形的工具
二、Dreamweaver(單位:奧多比)用於編輯HTML、ASP、JSP、PHP的輔助工具
三、Frontpage(單位:微軟)跟Dreamweaver一樣。
四、FLASH(單位:奧多比)網頁需要畫面流動(動畫)時的首選擇。
五、PhotoShop(單位:奧多比)圖象處理軟體,一般網頁都需要有圖片的相搭配,PhotoShop是款很強大的工具。
六、FireWorks(單位:奧多比)跟PhotoShop一樣都是圖象處理軟體,但FireWorks偏向與對網頁的處理。Fireworks主要用於製做動態圖片格式。
七、StylePix(單位:Hornil)跟PhotoShop一樣都是圖象處理軟體,可以處理光柵及矢量圖形。

可用性提升

權威研究結果表明:人們在線的閱讀習慣和平時的閱讀習慣是完全不一樣的。訪問者通常是在非常隨意的狀態下快速瀏覽一個網頁的,他們急於獲取真實的、實用的,並且是有價值的信息。如果他們不能及時地獲取所需信息,那麼,他們將離開這個網頁。
下面的3點方法將會給帶來幫助,它會讓為的訪問者提供所需信息,指出提升網頁可用性的方法。
一、精簡的文本描述
網頁內所寫的文章必須圍繞一個主題,這可以方便訪問者快速獲取主旨信息和中心思想。好好想想如何把文章改得精簡得體以便於訪問者閱讀。這裡舉例一個可行的辦法,盡量把一段文章在3-4行之內敘述完整,然後再另起一行寫下面一段。
二、便於快速瀏覽的文本
網路用戶一般不會在線精讀文本內容,他們通常是快速瀏覽。因此,應該盡量使用簡短、醒目的文本。舉個例子來說,可以通過超鏈接的形式將重要的信息從頁面中分離出來,這樣做會使得這段重要信息顯得非常醒目。將一個段落以重點列表的形式表示也是一種非常可行的方法。學會在重點片語前方加一個起強調作用的圓點。還有一點,學會在頁面中使用副標題,當用戶瀏覽網頁時,將重點挑選出來,並將它們寫在標題標籤內,“標題2”和“標題3”的效果最好,但是“標題1”標籤的效果也會相當不錯,這樣做會可以給整個頁面的信息分出層次,以幫助閱讀者在簡單地瀏覽頁面之後快速地獲取所需信息。
三、必須要客觀公正
這裡要提到的“客觀公正”指的是:在網頁上放上與該網頁內容相關的鏈接,讓訪問者做出自由的選擇:是繼續留在這個網頁上,還是去別的網頁上尋找信息。這對於網頁的所有者來說,並不是一件壞事。因為這可以為訪問者指明確切的方向。好好按照上面說的把這個網頁改進一下。相信,網頁的可用性一定會大大提升;同時,網頁的訪問者也會非常感激創作者,並且會很願意與創作者進行往來。

設計師速成

循序漸進學知識
先學一學HTML,找本自己能看懂的教材。瀏覽為主,然後學CSS,進而再了解一下JavaScript。
然後就可以用記事本嘗試寫幾個網頁,記住這時千萬不要用那些可視化工具,比如Amaya、FrontPage、Dreamweaver(那些以後再學)。
有一個提高自己“寫網頁”的捷徑,就是上各大網站,模仿他們的寫法,不斷規範自己的代碼。
接下來學一下Fireworks。學Fireworks主要是學圖片處理,還有切圖。

使用腳本


ASP全名ActiveServerPages(活性伺服器頁面),是一個WEB伺服器端的開發環境。利用它可以產生和執行動態的、互動的、高性能的WEB服務應用程序。ASP採用腳本語言VBScript(Javascript)作為自己的開發語言。
PHP是一種跨平台的伺服器端的嵌入式腳本語言。它大量地借用C,Java和Perl語言的語法,並耦合PHP自己的特性,使WEB開發者能夠快速地寫出動態產生頁面。
JSP是Sun公司推出的新一代網站開發語言,Sun公司藉助自己在Java上的不凡造詣,將Java從Java應用程序和JavaApplet(爪哇小程序)之外,又有新的碩果,就是JSP(爪哇伺服器頁面)。JSP可以在Serverlet和JavaBean的支持下,完成功能強大的站點程序。
WebDNA是一個伺服器端的腳本,解釋型的語言且帶一個嵌入式資料庫系統,專門設計用於萬維網發布的一個免費的(FastCGI的版本)。基於標籤與上下文。
.NET是MicrosoftXMLWebservices平台。XMLWebservices允許應用程序通過Internet進行通訊和共享數據,而不管所採用的是哪種操作系統、設備或編程語言。Microsoft.NET平台提供創建XMLWebservices並將這些服務集成在一起之所需。對個人用戶的好處是無縫的、吸引人的體驗。

設計原則


關於網站

所謂網站(Website),就是指在網際網路(網際網路)上,根據一定的規則,使用HTML等工具製作的用於展示特定內容的相關網頁的集合。簡單地說,網站是一種通訊工具,就像布告欄一樣,人們可以通過網站來發布自己想要公開的資訊(信息),或者利用網站來提供相關的網路服務(網路服務)。人們可以通過網頁瀏覽器來訪問網站,獲取自己需要的資訊(信息)或者享受網路服務。
在眼前,出現在顯示器上的這個“東西”,就是一個網頁。網頁實際是一個文件,它存放在世界某個角落的的某一台計算機中,而這台計算機必須是與網際網路相連的。網頁經由網址(URL)來識別與存取,當人們在瀏覽器輸入網址后,經過一段複雜而又快速的程序。網頁文件會被傳送到的計算機,然後再通過瀏覽器解釋網頁的內容,再展示到的眼前。

站點主頁成分

Web站點主頁應具備的基本成分包括:
頁頭:準確無誤地標識的站點和企業標誌;
Email地址:用來接收用戶垂詢;
聯繫信息:如普通郵件地址或電話;
版權信息:聲明版權所有者等。
充分利用已有信息,如客戶手冊、公共關係文檔、技術手冊和資料庫等。

要素

設計一個網站,應該考慮下列九條基本因素,這些因素對網站的成功與否有著重要影響。
1.整體布局
網站主頁就好像是宣傳欄或者店面——對訪問者產生第一印象,都希望盡量給人留下好的印象,不是嗎?
一般來說,好的網站應該給人有這樣的感覺:
乾淨整潔
條理清楚
專業水準
引人入勝
網頁應該力求抓住而不是淹沒瀏覽者的注意力,過多的閃爍、色彩、下拉菜單框、圖片等會讓訪問者無所適從——離開是最好的選擇。就像一些商店,播放震耳欲聾的發燒音樂,要做的唯一決定就是離開那裡,越快越好。
2.信息
無論商業站點還是個人主頁,必須給人們提供有一定價值的內容才能留住訪問者。因為人類總是惟利是圖,第一個問題總是:“對人有什麼用處?”
所以必須提供某些有價值的東西,當然並不是說必須提供某些免費的物品——免費書籍、免費入場券、免費度假等,這些“有價值的東西”可以是:
信息;
娛樂;
勸告;
對一些問題的幫助;
提供志趣相投者聯絡的機會;
鏈接到有用的網頁,等等。
如果經營的是企業網站,需要提供關於產品或服務的信息:
容易理解;
容易查詢;
容易訂貨。
3.速度
人們都知道,頁面下載速度是網站留住訪問者的關鍵因素。如果20—30秒還不能打開一個網頁,一般人就會沒有耐心。至少應該確保主頁速度儘可能快,最好不要用大的圖片。
應該時時提醒自己,網站首頁就像一個廣告牌。當開車經過一個廣告牌時,沒有時間閱讀上面的詳細說明,也不可能讚賞其複雜的圖案,廣告標誌從眼前一閃而過,必須在一瞬間給人留下印象。
網上訪問者也是“一閃而過”,保證的首頁簡單而快速。網上有許多關於如何增加速度的文章——檢查下載速度,放棄一切顯著減慢主頁速度的資料。
4.圖形和版面設計
圖形和版面設計關係到對主頁的第一印象,圖象應集中反映主頁所期望傳達的主要信息。
如果有系列商業站點,不必讓過分顯眼的動畫出現在首頁——但如果的網站是遊戲站點,動畫將是必不可少的一部分內容。
圖片是影響網頁下載速度的重要原因,根據經驗。把每頁全部內容控制在30K左右可以保證比較理想的下載時間,圖象在6—8K之間為宜,每增加2K會延長1秒鐘的下載時間。
顏色也是影響網頁的重要因素,不同的顏色對人的感覺有不同的影響,例如:
紅色和橙色使人興奮並使得心跳加速;
黃色使人聯想到陽光,是一種快活的顏色;
考慮到希望對瀏覽者產生什麼影響,請為網頁選擇合適的顏色。
閱讀西方格式文本時,眼睛從左上方開始。逐行瀏覽到達右下方,插入圖象時不要忘記這種特性。任何具有方向性的圖片應該放置在網頁中對眼睛最重要的地方,如果在左上角放置一幅小鳥的圖片,鳥嘴應該放在把瀏覽者目光引向頁面中部的地方,而不是把視線引走。
這種思路可以用於所有圖片:
面部應該“看”網頁的中部;
汽車的“停靠”面向網頁中部;
道路、領帶等等圖片的放置都應該在有助於吸引目光從左向右、從上向下移動。
一般總是把網站導航條放置在頁面左邊,也是出於這種考慮——不斷地出現在瀏覽者的視野之中。
5.文字的可讀性
人們仍然用廣告牌的比喻來說明,文字要在廣告牌上突出,周圍應該留有足夠的空間。也許曾到過一些網站,要麼擁擠不堪的文字覺得好像只有把腦袋鑽進去才能閱讀,要麼深色的背景給人的感覺好象處於非常狹窄的空間里,而且讓人的心情感覺很壓抑。某些背景色的令人閱讀困難;紫色、橙色和紅色讓人眼花繚亂。
文字的顏色也很重要,不同的瀏覽器有不同的顯示效果,有些在的瀏覽器上很漂亮的顏色在其他瀏覽器上可能無法顯示。
參考報紙的編排方式,為方便或快速閱讀將的內容分欄設計,甚至兩欄也要比一滿頁的視覺效果要好。
另一種能夠提高文字可讀性的因素是所選擇的字體,通用的字體(Arial,TimesNewRoman,GaramondandCourier)最易閱讀,特殊字體用於標題效果較好,但是不適合正文(試想瀏覽整頁的Gothic,Script,Westminster,orCloister會是怎樣的感受)。因為閱讀費力,的眼睛很快就會疲勞,不得不轉移到其他頁面。
6.網頁標題的可讀性
必須盡量使的網頁易於閱讀,除了分欄之外(將頁面縱向分割),也需要利用標題和副標題將文檔分段。
為所有標題和副標題設置同一字體,並將標題字體加大一號,所有標題和副標題都採用粗體,這樣便於識別標題(字體加大加粗)和副標題(粗體,與正文字體大小相同),使瀏覽者一眼就可以看到要點,以便找出並繼續閱讀有興趣的內容。標題的重要性可見一斑,要認真寫好每個標題!
也可以將整句採用粗體或用不同的顏色突出某些內容,不過不要用難以閱讀的顏色。
7.導航
由於人們習慣於從左到右、從上到下閱讀,所以主要的導航條應放置在頁面左邊,對於較長頁面來說,在最底部設置一個簡單導航也很有必要(只要兩項就夠了:主頁|頁面頂部)。
確定一種滿意的模式之後,最好將這種模式應用到同一網站的每個頁面,這樣,瀏覽者就知道如何尋找信息。
8.保護個人信息聲明和客戶推薦信
對於商業網站來講,最重要的事情之一是確保潛在客戶的信心,應該明確地告訴人們,如何對其興趣、愛好,尤其個人隱私保密,很有必要專門用一個頁面詳細陳述的保護個人信息聲明,包括對訪問者的email地址保密、如何接受定單、如何匯總信息、匯總這些信息的目的、誰可以看到這些信息等基本內容。
訪問者也想知道的產品或服務現有客戶的反映,所以如果能引用與關係融洽的客戶對的積極評價,對的可信度將很有幫助。
不要害怕向顧客索取推薦信——人們都願意自己的意見有價值。
可以把客戶的推薦信另設計為一個網頁,作為對客戶提供推薦信的回報,在這裡鏈接到客戶的網站——這也是一種“雙贏”。
9.詞語
一個網站如果只有漂亮的外觀而詞語錯誤連篇、語法混亂,同樣是失敗的,對於網站所有者和負責人將產生很壞的影響,人們會用許多貶義詞來評價:粗心大意、懶惰、外行、沒水平等等。
願意把自己辛苦掙來的錢花在一個連自己的網站都馬馬虎虎的人嗎?
可以按照上述步驟改進的網站製作技巧;
可以請人對的工作進行校對、編輯;
也可以請人為製作網頁;
總之,上述步驟在很多方面對會有所幫助,不要因為對某些步驟的疏忽而影響的網站的整體效果。

原則

1.明確內容
如果想成為一個網站設計者,並正想建一個網站的話,首先應該考慮網站的內容,包括網站功能和的用戶需要什麼。的整個設計都應該圍繞這些方面來進行。
2.抓住用戶
如果用戶不能夠迅速地進入的網站,或操作不便捷,網站設計就是失敗的。不要讓用戶失望而轉向的對手的網站。
3.優化內容
內容是核心。大約在兩年以前,企業網站就像一本廣告冊子,更槽糕的是,網站使用了大量的圖片,似乎要幾個世紀才能下載完。比如某網站在設計的某些方面是成功的,但是內容太貪乏,並且要花很長時間才能找到所要的東西,因此不能算是一個成功的網站。
4.快速下載
沒有什麼比要花很長時間下載頁面更槽糕的了。作為一條經驗,一個標準的網頁應不大於60K,通過56K數據機載入花30秒的時間。有的設計者說網頁載入應在15秒內。
5.網站升級
時刻注意網站的運行狀況。性能很好的主機隨著訪問人數的增加,可能會運行緩慢。但是,如果不想失去訪問者的話,一定要仔細計劃好的升級計劃。
6.堅持基本原則
即使不懂HTML語言,只需購買一個有版權的所見即所得的網頁設計工具,如AdobePageMill或MicrosoftFrontPageExpress或Amaya,當然則是Dreamweaver啦,就可以創建一個看起來很合理的網站。但是,在設計時,這些軟體包雖然不需要HTML,卻使網站速度下降。為了成功地設計網站,必須理解HTML是如何工作的。大多數的網站設計者建議網路新手應從有關HTML的書中去尋找答案,用Notepad製作網頁。
7.學習HTML
用HTML設計網站,可以控制設計的整個過程。但是,如果僅僅是網站設計的新手,應該尋找一個允許修改HTML的軟體包。HomeSite4是一個很好的Web設計工具。在設計過程中,HomeSite4能幫助學習HTML。它還允許切換到所見即所得的模式,以便在把網站發送到Web之前,預覽的網站。
8.用筆畫一個網站的框架
聖人云:筆比劍更強大。在用計算機之前,用筆畫一個網站的框架,顯示出所有網頁的相互關係。計劃好的用戶如何以最少的時間瀏覽的網站。
9.“在計算機上永遠也找不到好的方案”。——專家忠告
10.網站地圖
許多設計者把他們的網站地圖放在網站上,這種做法,卻是弊大於利。絕大部分的訪問者上網是尋找一些特別的信息,他們對於的網站是如何工作的,並沒有興趣。如果覺得的網站需要地圖,那很可能是需要改進的導航和工具條。
11.“睜大的眼睛,留意所有的事情。對最不相關的東西的觀察可以得到最好的靈感。觀察一個站點的結構和設計。理解站點結構的關鍵元素,確保的設計是圍繞站點瀏覽進行的。”—專家忠告
12.點擊規則
聽說過3次點擊規則嗎?對於小型網站,在的主頁上,沒有任何一條信息,需要點擊次數超過3次的。對於大型網站,使用導航和工具條來改善操作。
13.特殊字體的應用
雖然可以在的HTML中使用特殊的字體,但是,不可能預測的訪問者在他們的計算機上將看到什麼。在的計算機里看起來相當好的頁面,在另一個不同的平台上看起來可能非常糟糕。一些網站設計員喜歡使用來定義特性,這雖然允許使用特殊的字體。但是仍需要一些變通的方法,以免所選擇的字體在訪問者的計算機上不能顯示。級聯風格表CSS有助於解決這些問題,但是只有最新版的瀏覽器才支持CSS。
14.“使用切合實際的簡便的命名規則。”—專家忠告
15.檢查錯別字
好的拼寫是人們一生中重要的技能。但是遺憾的是,許多設計者都缺少這種技能。確保拼寫正確,並且格外注意平常容易誤寫的錯別字。
16.避免長文本頁面
在一個站點上有許多只有文本的頁面,是令人乏味的,且也浪費Web的潛力。如果有大量的基於文本的文檔,應當以AdobeAcrobat格式的文件形式來放置,以便的訪問者能離線閱讀。
17.不要使用卷滾條
人們厭惡在網上使用卷滾條。某站是一個典型的設計很差的網站。它基於一個浮動的架構,為了閱讀所有的文本,瀏覽者不得不使用卷滾條。
18.專家最喜愛的Web設計工具
(3).AdobeIllustrator
(4).AdobeImageRead
(5).MacromediaDreamweaver
(6).MacromediaFireworks
(7).AllaireHomesites
(8).MicrosoftNotepad
(9).MacromediaDirector
(10).Lightwave
(11).MacromediaFreehand
其它:AdobeAcrobatExchange,AllaireColdFusion,BBEdit,HTMLValidator等。
19.網站介紹
應當有一個很清晰的網站介紹,告訴訪問者的網站能夠提供些什麼。以便訪問者能找到想要的東西,但是,許多設計者都沒有這樣做。有效的導航條和搜索工具使人們很容易找到有用的信息,這對訪問者很重要。告訴訪問者所提供的正是他們想要的信息。
20.“網站一旦發布,網站設計的優點和缺陷全都公佈於世。沒有什麼方法使能夠比從自己的錯誤、傾聽其他人的建議和用戶反饋意見中學到更多的東西。”—專家忠告
21.閃爍讓人頭痛
通過使用標識可以吸引訪問者對的主頁特殊部分的注意,但這也讓的訪問者頭痛。如果想使訪問者再次光顧的網站,就少用此方法。
22.背景顏色
背景顏色也會產生一些問題,可能會使網頁難於閱讀。應當堅持使用白色的背景和黑色的文本,另外還應當堅持使用通用字體。
23.向前和向後按鈕
應當避免強迫用戶使用向前和向後按鈕。的設計應當使用戶能夠很快地找到他們所要的東西。絕大多數好的站點在每一頁同樣的位置上都有相同的導航條,使瀏覽者能夠從每一頁上訪問網站的任何部分。
24.專家忠告:“堅持的信念。嚴格遵守各種規則。避免想當然。絕不停止學習。”
25.點擊記數器
不要輕易考慮在的網站上放置一個醒目的點擊記數器。設計網站是為了給訪問者提供服務,而不是推銷自己認為重要的東西。大多數瀏覽者認為計數器毫無意義,它們很容易被做假,瀏覽者也不想看廣告。如果顯示的網站是多麼受歡迎,最好提供一個鏈接,顯示訪問日誌。
26.不要用框架
與記數器一樣,框架在網頁上越來越流行。在大多數網站上,在屏幕的左邊有一個框架。但是設計者立刻就發現,在使用框架時產生了許多的問題。使用框架時如果沒有17英寸的顯示屏幾乎不可能顯示整個網站。框架也使得網站內個人主頁不能夠成為書籤。也許更重要的是,搜索引擎常常被框架混淆,從而不能列出的網站。
27.去掉圖像
在瀏覽器中即使去掉了圖像功能,也要保證訪問者能夠在的網站上獲得滿意的效果。對於那些使用ISDN連接並且關掉了圖像功能的訪問者,還能獲得好的網頁載入性能。可以通過在網頁底部提供另外的鏈接和使用替代文字,而不是圖像來滿足訪問者的需要。
28.重複使用圖像
一些網站由於使用大量不重複的圖像而錯過了使用更好的技巧的機會。在創建商標時,在網頁上多次使用同樣的圖像是一個好的方法,並且一旦它們被裝入,以後重新載入就會很快。
29.避免使用過大的圖像
不要使用橫跨整個屏幕的圖像。避免訪問者向右滾動屏幕。佔75%的屏幕寬度是一個好的建議。
30.專家忠告:“避免使用炫耀的技巧。”
31.選擇使用Flash動畫
許多使用比較慢的計算機的訪問者發現動畫圖標很容易耗盡系統資源,使網站的操作變得很困難,因此,應該給用戶一個跳過使用Flash動畫的選擇。
32.盡量少使用Flash插件
雖然許多Web設計者認為Flash功能很強大,並且Netscape5.0將支持Flash,在使用時不必再下載任何插件。但是,最好還是取消使用Flash做各介面的想法。
33.讓用戶先預覽小圖像
如果不得不放置大的圖像在網站上,就最好使用Thumbnails軟體,把圖像的縮小版本的預覽效果顯示出來,這樣用戶就不必浪費金錢和時間去下載他們根本不想看的大圖像。
34.動畫與內容應有機結合
確保動畫和內容有關聯。它們應和網頁渾然一體,而不是乾巴巴的。動畫並不只是MacromediaDirector等製作的東西的簡單堆積。
35.慎用聲音
聲音的運用也應得到警惕。內聯聲音是網頁設計者的另一個禁地。因為過多地使用聲音會使下載速度很慢,同時並沒有帶給瀏覽者多少好處。首次聽到滑鼠發出聲音可能會很有趣,但是多次以後肯定會很煩人。使用聲音前,應該仔細考慮聲音將會給帶來什麼。
36.少用Java和AxtiveX
在網頁上應盡量少使用Java和AxtiveX。因為並不是每一種瀏覽器都需要使用它,只有那些Netscape和Explorer的早期版本的使用者才需要它。另外Mac在處理Java時也存在問題,過分地使用Java,會使Mac崩潰。
37.設計成功的網站
藍色理想
七色鳥
ChinaUI
5D多媒體
38.慎用插件
在Web設計中,如果依賴於一些特別的插件,會減少網站的吸引力。如果訪問者沒有所要求的插件,將不得不到其它站點去下載,這樣訪問者有可能就不會返回了。
39.使用著名的插件
如果網站上有聲音或視頻,要保證使用者通過使用某個知名的插件,能夠聽到或看到。許多站點使用QuickTime、RealPlay和Shockwave插件。因為,許多訪問者並不願意浪費很多時間和金錢去下載可能僅使用一次的插件。
40.使用先進技術
跟上新的技術。Web技術的進步絕不會停止,所以應花一些時間來研究新產品和開發技術。
41.自己創建圖像和聲音
使用自己創建的或從某個商業網站上下載的圖像和聲音。在製作商業網站時,應該花足夠的資金來創建圖形,以增強公司的宣傳。
42.專家忠告—“無論是遊戲、圖像、動畫還是電影,想想喜歡的設計是怎樣的,這將激發的創作靈感,使創作出新的和更好的網站。”
43.平台的兼容性
要為用戶著想,必須最少在一台PC和一台Mac機上測試的網站,看看兼容性如何。
44.用軟體分析工具找錯
使用軟體分析工具檢查HTML。軟體分析工具DoctorHTML能夠幫助檢查HTML中的任何問題。如果有許多網頁需要檢查,可選用軟體分析工具。
45.避免錯誤鏈接
網站中可能與其它一些有用的站點作了鏈接。但是,如果在的網頁上有鏈接,一定要經常檢查它們,保證鏈接有效。鏈接的網站可能很多,但不要鏈接到與的內容無關的網站上。
46.給觀眾成熟的東西
如果網站沒有完成,就不要發送到Web上。所有好的網站都是在幕後完成之後再發布的。
47.在搜索引擎上登記網站
任何一個人發現的網站的機會都很少,除非把的網站在主要的搜索引擎上進行登記。
48.設計一個留言板
瀏覽者願意把時間花在好的網站上,所以最好有一個留言本,這能激勵訪問者再次回到的網站,還有助於擴充網站內容。
49.測試網站
在的網站正式發布之前,必須進行有用的測試。在設計網站時要使用最新的軟體,但是不要忘了人們並不會使用最新的瀏覽器,所以要照顧到以前的瀏覽器。在上載網站時還要測試所有的鏈接和導航工具條。
50.專家忠告:“盡所能反覆測試所設計的網站,直到不能發現新的東西為止。”
51.演示即將發布的網站
在網站正式運行之前,讓人演示它。演示中人們會告訴所設計的網站是否容易使用。
52.動畫點綴
網頁上的動畫最多只用一個
53.專家忠告—“傾斜的按鈕看起來不會太好,最好不要使用。”
54.內容組織
在開始創建新的網頁前,仔細考慮網站內容的組織。決定好想讓訪問者瀏覽的內容,然後設計導航系統。
55.“空白萬歲”
注意留空白。不要用圖像、文本和不必要的動畫GIFs來充斥網頁,即使有足夠的空間,在設計時也應該避免使用。
56.利用空白去吸引注意力。
為了吸引眼球,Web設計者使用各種方法,比如:閃爍、旋轉等,但是利用空白會吸引更多的注意力。”—專家忠告
57.圖像壓縮
為了保持小的圖像,可以使用類似GIF嚮導的程序,它能自動對圖像進行壓縮。先聲明圖像的大小,在圖像顯示之前最好能詳細說明圖像大小屬性,可以在IMG標籤中保存這個屬性。這可以使網頁顯得很流暢,因為瀏覽器可以在圖像被下載之前在屏幕上顯示整個網頁。
58.設計一個失敗的網站,從中找出原因,提高自己的鑒別能力。
59.用戶註冊
如果能知道誰瀏覽了網站以及是怎樣瀏覽網站的,那麼就能得到大量有用的信息。但是,要求訪問者在瀏覽網站之前進行註冊。這樣做是要冒風險的,因為這將趕走一批不願意註冊的人。獲得信息的另一種方法是進行有獎競猜或金錢獎勵,讓用戶能主動填一些信息反饋表。
60.使網站具有交互功能
在網站上提供一些回答問題的工具,使得訪問者能從網站上獲得交互的信息。
61.圖片更新
儘可能經常更換網站上的圖片,人們更願意點擊的是圖片而不是文本。
62.在網站上提供遊戲
遊戲是很好的交互工具,它是使訪問者能再次光顧網站的好方法。
63.挑選工具軟體
仔細選擇Web設計工具。保證使用自己最想要的、自己感覺最好的軟體。
64.使用最新版本的軟體
盡量使用Web設計軟體的最新版本,還應當能被授權進行免費或便宜的升級。

類型

1、電子商務類網站
電子商務類網站分為B2B(商家對商家)和B2C(商家對個人)兩種,這種是以網上銷售為主要盈利手段的網站。
2、主題性網站
這種主題性網站是主要提供有共同的興趣愛好的人一起去分享和觀看的網站。
3、個人性網站
這種網站主要是突出自己鮮明的個性的網站,比如個人微博、博客、論壇等等。

布局

1.圖片與文字的協調性
一個完美的網頁布局會給人一種和平舒暢的心情,它不僅僅是表現在文字的表達程度,更多的表現在圖片與文字的協調性。
2.視覺上的對比性
通過不同的色彩、不同的圖形進行對比,在視覺上形成視覺的衝擊,同時在圖形也要形成對比,只有這樣才能讓人們過目不忘。
3.有松有馳
網頁製作上也要講究有松有馳,不要整個網頁都是一種樣式,要適當進行留白,運用空格或是改變字體之間的間距,從而達到不一樣的變化效果。