網站製作之網頁技巧_VML相關

來源:互聯網
上載者:User
相信眾位網友在網上盡情衝浪時,一定會看到不少設計獨特、創意新穎、頁面誘人的個人網頁,遇到這些網頁你也一定會駐足停留、仔細欣賞一番,同時腦海中大概也會有一絲想要製作一個屬於自己的個人首頁的念頭。如果你確實有這個想法,那就請你繼續看完下面的內容,下面提供的網頁設計技巧一定會使你大飽眼福,並讓你在以後設計自己的首頁過程中遊刃有餘。好了,說了這麼多,還是讓我們直接切入正題,和大家一起看看筆者今天帶來了哪些網頁製作技巧吧:

1、設計前要有籌劃

設計首頁也許並不是很困難。但這一工作與編製傳統的宣傳品一樣,都需要我們謹慎處理和籌劃。換言之,我們必須首先確定自己需要傳達的主要資訊,然後細意斟酌、把所有意念合情合理地組織起來;之後是設計一個頁面式樣,試用於有代表性的使用者,接著重複修訂,務求盡善盡美。

2、選擇內容要有新鮮感

全球資訊網上不斷有新事物出現、每天都有新花樣。如果你的首頁從不改變,使用者很快會厭倦。因此網頁內容的選擇要不落俗套,要重點突出一個“新”字,這個原則要求我們在設計網站內容時不能照抄別人的內容,要結合自身的實際情況創作出一個獨一無二的網站。放眼望去,網上的許多個人首頁簡直就是"雜貨店",內容包羅永珍,題材千篇一律,人人都是"軟體下載",個個都有"網路導航",從頭到尾找不出一絲“鮮”意。所以,我們在設計網頁時,要把功夫下在選材上。選材要盡量做到“少”而“精”,又必須突出“新”,如能堅持天天更新的話,我相信這樣的網頁一定會受到大家的歡迎。

3、內容相對實用性大

一個網頁儘管設計得趣味盎然,引人入勝,但這不是吸引使用者最好的理由。要想最大限度地留住使用者首要的是要讓它有用處。這樣做的一個很簡單的辦法是提供相互參與--讓讀者做一些事情,如報名擷取定期發送的通訊,並用某種方式報答他們的參與,如每周抽獎或給予下載一些東西的機會。

4、網頁命名要簡潔

由於一個網站不可能就是由一個網頁組成,它有許多子頁面,為了能使這些頁面有效地被串連起來,使用者最後能給這些頁面起一些有代表性的而且簡潔易記的網頁名稱。這樣既會有助於你以後方便管理網頁,在向搜尋引擎提交你的網頁時更容易被別人索引到。在給網頁命名時,最好使用自己常用的或符合頁面內容的小寫英文字母,這直接關係到頁面上的串連。

5、確保頁面的導覽性好

首頁的其中一個很重要的功能就是作為導航工具,指引使用者查閱你儲存在網址或其他地點的資訊。因此在設計首頁時,應盡量使導覽過程變得很輕鬆。基於清晰明確和速度的考慮,首頁上的超級聯結內容應只限於幾個進階的類別,例如公司、產品、服務等等。一般一個A4頁面大小的網頁用六至八個超級聯結比較合適。此外,你還要保證超級聯結的層數不能太多,超過4層以上的聯結資訊將會使人感到厭煩。因此,你必須在廣度和深度之間求取平衡。如果你的網址上有太多資訊,你可能要製作較長的頁面或使用更多聯結層數,甚至可能要建立多個首頁、使每個首頁載有不同的資訊。如果能夠讓使用者在首頁上以關鍵字或詞語尋找所需的資訊,肯定受使用者歡迎。

6、善用表格來布局

不要把一個網站的內容象作報告似的一二三四地羅列出來,要注意多用表格把網站內容的層次性和空間性反白出來,使人一眼就能看出你的網站重點突出,結構分明。

7、合理設計視覺效果

不必在以頁面上填滿映像來增加視覺趣味。盡量使用彩色圓點--它們較小並能為清單項目增加色彩活力(並能用於彩色列表)。彩色分隔條也能在不擾亂頻寬的情況下增強圖形感。另外網頁設計好後,一定要在不同類型的瀏覽器和不同解析度的情況下測試首頁,例如許多瀏覽器使用640×480的解析度,儘管在800×600高解析度下一些Web頁面看上去很具吸引力,但在640×480的模式下可能會黯然失色。作一點小小的努力,設計一個在不同解析度和不同類型的瀏覽器下都能正常顯示的網頁。

8、排版時要注意細節

別輕易讓文字置中和使用粗體或斜體字元。除了視感混亂之外,很多流覽器不能很好地顯示斜體字,也不能補償由於字母傾斜引起的空白變化。利用短的段落,加點列示,適當的整區塊引述文字,用水平線分節,用影象地圖指引主要串連,使你的頁面能吸引人和容易閱讀。另外筆者提醒大家注意的是,不要把重要的內容排版放到網頁的結尾,因為讀者的視線可能停留在首頁上面較多一點,或者有些讀者沒有耐心往下看那麼遠。

9、善用GIF和JPG格式的圖象

使用者在網上四處遨遊,你必須設法吸引和維護他們對你的首頁的注意力。全球資訊網的其中一個最重大資源是其多媒體能力,所以我們無論如何要善加利用。首頁上最好有醒目的映像、新穎的畫面、美觀的字款,使其別具特色,令人過目不忘。映像的內容應有一定的實際作用,切忌虛飾浮誇。目前網際網路上大多數使用GIF和Jpeg互動格式的圖象,因為互動格式的映像是分級顯示出來的--首先以很低的解析度顯示,然後逐步提高解析度,直至最後達到正常顯示--這種方式有時候會使較大的映像看起來好象裝載得快一些,實際上並非如此,但這是一種有益的錯覺。這樣也便於讀者在映像裝載的過程中看到它的模樣,如果他們不喜歡或不想看的話就有機會中斷傳輸或轉向別的地方。

10、為圖片添加文字說明

給每幅圖形加上文字的說明,在出現之前就可以看到相關內容,尤其是導覽按鈕和大圖片更應如此。這樣一來,當網路速度很慢不能把圖象下載下來時或者使用者在使用文本類型的瀏覽器時,照樣能閱讀網頁的內容,以後使用者在訪問你的網站時總有一種親切感覺,認為你心細,比較善解人意,時時刻刻為他人著想,相信你的好心會有好報的。

11、多使用圖象縮微圖

比如說有一張800×600像素的1600萬色掃描圖,所佔空間約為50K。使用PhotoShop這一類的圖象編輯工具對原圖進行重新取樣,比如說高度為100像素(為確保瀏覽器能即時以合適的大小顯示映像,高度和寬度很重要。也許為了達到你自己的要求你得進行調整才能找到最合適的大小,但可以從高度除以4~6開始),PhotoShop會自動計算新圖象的寬度。儲存新圖象,它的大小現在應為8K或更小。然後在源檔案中添加這樣一段HTML代碼: ,那麼瀏覽器在解釋執行Lowsrc命令時,將要求瀏覽器在真正的畫面載入以前先裝載低解析度的映像,這樣就會讓訪問者清楚將會出現什麼樣的圖片。

12、不宜使用太多的動畫

大家都喜歡用GIF動畫來裝飾網頁,它的確很吸引人,但我們在選擇時,是否能確定必須用GIF動畫,如果答否,那麼就選擇靜止的圖片,因為它的容量要小得多。同樣的尺寸的LOGO,GIF動畫的容量有5K,而靜止LOGO的只有3K。雖然只有2K之差,但多起來,就會影響下載的速度,所以,如果有些不是必須的,就選擇最小的。

13、閃爍文字不要多用

有的設計者想通過閃爍的文字來引起訪問者的注意是可以被人理解的,但一個頁面中最多不能有三處閃爍文字,太多了給使用者一種眼花繚亂的感覺,反而會影響使用者去訪問該網站的其他內容,正所謂“物極必反”也。

14、頁面長度要適中

當一個頁面很長時就應該要注意了,因為它的傳輸時間明顯要比較短的頁面的傳輸時間長,太長的頁面傳輸會使訪問者在等待中失去耐心。而且為了閱讀這些長文本,訪問者不得不使用卷滾條,從而也浪費了使用者在網上衝浪的時間。如果你有大量的基於文本的文檔,應當以AdobeAcrobat格式的檔案形式來放置,以便你的訪問者能離線閱讀,從而節省寶貴的時間。

15、Java程式少用為宜

不要使用大幅面的Java程式,能夠用javascript替代效果的則盡量不要使用java.因為目前來講java的運行速度實在慢的讓人無法忍受,往往使瀏覽者沒有耐心等頁面全部顯示出來,這樣你的精心設計便毫無效果啦。

16、整個頁面風格要一致

你網頁上所有的映像、文字,包括像背景顏色、區分線、字型、標題、註腳什麼的,要統一風格,貫穿全站。這樣子讀者看起來舒服、順暢,會對你的網站留下一個“很專業”的印象。

17、記數器能不用最好不用

由於計數器也是由程式設計成的,顯示計數器的過程其實就是在執行一個程式的過程,它需要佔用使用者寶貴的上網時間,況且大多數瀏覽者認為計數器毫無意義,它們很容易被做假,瀏覽者也不想看廣告。因此筆者建議不要輕易考慮在你的網站上放置一個醒目的點擊記數器。你設計網站是為了給訪問者提供服務,而不是推銷你自己認為重要的東西。如果你顯示你的網站是多麼受歡迎,你最好提供一個連結,顯示訪問日誌。

18、每個頁面都要有導航標誌

所有頁面從頭至尾都要使用導航標誌,尤其是要用“返回到首頁”串連。可以在每個頁面都這樣做。比如在每頁的頂端(或底部)都有一小串表徵圖,第一個回到首頁,第二個回到章,第三個回到節。如果是映像導覽按鈕,那麼要有清晰的標識,讓人看得明白,千萬別只顧視覺效果的熱鬧,而讓人家不知東西南北;而文本導航的連結顏色最好用約定俗成的:未訪問的,藍色;點擊過的,紫色或栗色。總之,文本連結一定要和頁面的其他文字有所區分,給讀者一個清楚明白的導向。

19、盡量使用相對超級串連

在製作圖象或文本超級串連時,儘可能地使用相對超級串連,這是因為這樣做網頁的可移植性比較強,例如把一組源檔案移到另一個地方時,相對路徑名仍然有效,而不需要重新修改串連的目標地址;另外使用相對超級串連時輸入量也較少,在同一頁的串連項當然應該使用相對位址,因為使用絕對位址後可能會每選擇一個串連都要把該頁重新裝載一次。如果是串連到不直接相關的檔案時,使用絕對路徑比較好,這樣以後要是把源檔案移到另外的目錄下就不需更改串連了。

20、保證超級串連直觀有效

頁面中的超級串連應當使使用者能夠很快地找到他們所要的東西。絕大多數好的網站在每一頁同樣的位置上都有相同的導航條,使瀏覽者能夠很直觀地從每一頁上訪問網站的任何部分。

另外特別要避免“請按這裡”,任何要“按這裡”的人都會謹慎考慮,它是不是正好就在“這裡”,並且串連無誤。不要讓串連的名稱與串連的URL不同,這樣會使讀者白白地浪費時間。

  • 相關文章

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.