正文

網(wǎng)頁設計欣賞（汽車網(wǎng)頁設計欣賞）

發(fā)布時間：2023-03-12 16:31:54 稿源：創(chuàng)意嶺閱讀： 1165 問大家

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關于網(wǎng)頁設計欣賞的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。

創(chuàng)意嶺作為行業(yè)內(nèi)優(yōu)秀的企業(yè)，服務客戶遍布全球各地，相關業(yè)務請撥打電話：175-8598-2043，或添加微信：1454722008

本文目錄:

1、想找一些酷站
2、急求！！西歐，日韓，中國，各自的網(wǎng)頁美工設計特點
3、推薦幾個好的設計素材網(wǎng)站出來視覺中國，千圖網(wǎng)，昵圖網(wǎng)
4、網(wǎng)頁制作課程設計總結(jié)

網(wǎng)頁設計欣賞（汽車網(wǎng)頁設計欣賞）

一、想找一些酷站

這幾個網(wǎng)站望您喜歡:

http://www.37021.com/[37021酷站大全--(精選中國最酷的網(wǎng)址大全)]

http://cwd.52design.com/[酷站營--國內(nèi)國外酷站欣賞收藏,當前共收錄酷站15630個,新入會員共8168人 ]

http://web.2008php.com /[歐萊凱主題網(wǎng)--有韓國、日本、歐美的酷站]

http://www.bluestation.net/[Bluestation 設計酷站搜羅大全-- 為專業(yè)的酷站設計師提供靈感源泉]

http://www.yi2.net/[依兒酷站--網(wǎng)站設計欣賞,網(wǎng)頁設計,優(yōu)秀網(wǎng)站欣賞,個人網(wǎng)站欣賞等各類精品酷站欣賞,致力提高網(wǎng)頁設計師專業(yè)審美! ]

http://www.di3fang.cn/[比比發(fā) 酷站網(wǎng)址導航--非常實用的酷站]

http://www.kecola.com/index.asp[可酷啦--酷站欣賞|設計素材，精彩網(wǎng)站齊分享,國內(nèi)外大量精美網(wǎng)站分類瀏覽(酷站欣賞);圖庫,圖標,矢量圖,插畫,標志等大量素材欣賞下載,滿足您的設計需求.專業(yè)的設計與技術支持,為您提供網(wǎng)站設計與網(wǎng)絡]

二、急求?。∥鳉W，日韓，中國，各自的網(wǎng)頁美工設計特點

中國與歐美用戶在色彩感受、頁面布局、瀏覽習慣上同國人都有很大的區(qū)別。

歐美用戶不習慣艷麗、花哨的色彩和網(wǎng)頁設計風格，他們比較鐘情于簡潔、平淡而嚴謹?shù)娘L格，即使許多大型網(wǎng)站也是這種風格。

歐美網(wǎng)站在首頁頁面上通常不會放置太多內(nèi)容，也很少

歐美用戶在色彩感受、頁面布局、瀏覽習慣上同國人都有很大的區(qū)別。

歐美用戶不習慣艷麗、花哨的色彩和網(wǎng)頁設計風格，他們比較鐘情于簡潔、平淡而嚴謹?shù)娘L格，即使許多大型網(wǎng)站也是這種風格。

歐美網(wǎng)站在首頁頁面上通常不會放置太多內(nèi)容，也很少放置廣告，他們傾向于將首頁做成各類功能、板塊的引導界面，即使有內(nèi)容表現(xiàn)，也是比較簡潔的，不超過2屏，完全不像國內(nèi)網(wǎng)站喜歡堆積大量廣告和內(nèi)容。

國外傳統(tǒng)網(wǎng)站比較講究網(wǎng)站的實用性和便利性，他們會花很多時間去制作很多周到實用的細節(jié)，功能雖然大多平實但很有效。

國外網(wǎng)站對安全性的要求非常高，許多服務和功能都需要進行安全連接，而國內(nèi)只有交易、銀行等網(wǎng)站才會注意到.網(wǎng)站建設專家企創(chuàng)動力竭誠為您服務！

國外用戶很看重個人隱私，因此國外網(wǎng)站對個人信息和隱私也非常注意保護，除了隱私條款外，在細節(jié)上也需要加強隱私保護的說明和功能。

國外商業(yè)用戶對網(wǎng)站的信譽度很看重，如果你沒有詳細描述關于網(wǎng)站的介紹、提供足夠充足的范例和建立嚴謹而值得信賴的流程，那么你就很容易丟失用戶。

國內(nèi)外網(wǎng)站之間的差異估計同各自的文化教育、甚至語言文字等因素相關。通常我們所說的國外網(wǎng)站是指歐美網(wǎng)站，而以上所描述的也主要是針對歐美用戶而言，其他國家例如韓國又會是另外一種國內(nèi)網(wǎng)頁設計師經(jīng)常借鑒的風格，但這種風格絕對不適宜建立英文網(wǎng)站。網(wǎng)站建設專家企創(chuàng)動力竭誠為您服務！

再補充一點，就是中國人做的英文網(wǎng)站需要注意英文使用習慣，許多你覺得翻譯非常到位的語句其實在國外看來是非常好笑也很難理解的，就像阿里巴巴這樣的知名網(wǎng)站也有不少英文是令老外比較難接受的，所以如果你做英文網(wǎng)站，完成之后最好讓國外朋友幫你看看，否則別人會對你的網(wǎng)站印象會大打折扣。

放置廣告，他們傾向于將首頁做成各類功能、板塊的引導界面，即使有內(nèi)容表現(xiàn)，也是比較簡潔的，不超過2屏，完全不像國內(nèi)網(wǎng)站喜歡堆積大量廣告和內(nèi)容。

國外傳統(tǒng)網(wǎng)站比較講究網(wǎng)站的實用性和便利性，他們會花很多時間去制作很多周到實用的細節(jié)，功能雖然大多平實但很有效。

國外網(wǎng)站對安全性的要求非常高，許多服務和功能都需要進行安全連接，而國內(nèi)只有交易、銀行等網(wǎng)站才會注意到。網(wǎng)站建設專家企創(chuàng)動力竭誠為您服務！

國外用戶很看重個人隱私，因此國外網(wǎng)站對個人信息和隱私也非常注意保護，除了隱私條款外，在細節(jié)上也需要加強隱私保護的說明和功能。

國內(nèi)外網(wǎng)站之間的差異估計同各自的文化教育、甚至語言文字等因素相關。通常我們所說的國外網(wǎng)站是指歐美網(wǎng)站，而以上所描述的也主要是針對歐美用戶而言，其他國家例如韓國又會是另外一種國內(nèi)網(wǎng)頁設計師經(jīng)常借鑒的風格，但這種風格絕對不適宜建立英文網(wǎng)站。上海網(wǎng)站建設專家企創(chuàng)動力竭誠為您服務！

韓國網(wǎng)站的設計大都色彩鮮亮，大面積使用圖片，且Flash動畫居多，所以導致打開網(wǎng)站速度非常的慢。這種風格，目前來講還不太適合中國的國情，中國網(wǎng)速慢——大唐視覺：網(wǎng)站建設公司，給你專業(yè)的體貼的提醒。

一、頁面結(jié)構(gòu)

韓國網(wǎng)站的頁面結(jié)構(gòu)相對來說比較簡單，可以說幾乎是統(tǒng)一的風格，頂部的左邊是網(wǎng)站的logo，右邊就是它的導航欄，和國內(nèi)網(wǎng)站不一樣的地方它甚少采用下拉菜單的樣式，而是把各級欄目的下級內(nèi)容放在導航欄的下面。然后下面是個大大的Flash條，再往下就是各個小欄目的主要內(nèi)容：

二、色彩運用

韓國設計師很多都是科班出生，對色彩的運用非常得當，在我們看來有些非常難看的顏色到了他們的手里很輕易的就搭配出一種很另類或和諧的美感，給人的感覺要么淡雅迷人，要么另類大膽，讓人覺得欣賞他們的網(wǎng)站是一個非常愉悅的過程。在我看來，韓國的設計師真是深得Windows xp的設計精髓，漸變色以及透明水晶效果用得非常恰當，而不像很多網(wǎng)站動不動就濫用仿蘋果按鈕，和整體風格不協(xié)調(diào)，看起來顯得很突兀。韓國網(wǎng)站的各個欄目一般都比較喜歡采用不同的色調(diào)來表達不同欄目的主題，灰色是他們最愛用的顏色，因為灰色比較中庸，能和任何色彩搭配，大大的改變色彩的韻味，使對比更強烈，正文文字也大都采用灰色。而局部則喜歡用色彩絢麗的色條或色塊來區(qū)分不同的欄目。

下面這兩個網(wǎng)站運用漸變色很出色，圖3一看顏色就知道是個女性的時尚站點，它把幾個欄目做成晶瑩剔透的泡泡球放在頂部的大Flash條里，非常醒目。整個站點顯得異常優(yōu)雅迷人。

三、Flash動畫及圖片的運用

韓國的寬帶普及率很高，所以設計師設計起頁面來完全毫無顧忌，大量的圖片、flash得到很好的運用，網(wǎng)站里的圖片動不動就是40、50K的大圖，網(wǎng)頁圖片多的頁面大小通常都是幾百K，這在我們國內(nèi)是根本不敢想像的。韓國的flash banner大都以橫幅廣告條出現(xiàn)在頁面的導航欄下面，采用的都是精美的圖片或者是手繪風格的矢量插圖。國內(nèi)很多網(wǎng)站也采用大幅的flash廣告條，但是通常都是著眼于如何去表現(xiàn)flash動畫的酷、炫的感覺，使得瀏覽者過于關注flash而忽視了頁面的其他內(nèi)容。而韓國的flash則更好的服務于網(wǎng)站的主題，和整個頁面搭配起來看得很舒服而不搶眼，他們的關鍵就在于整個flash不是全部變化，而只是局部在動，以及文字和背景的巧妙配合。韓國網(wǎng)頁設計師的手繪能力很強，頁面中大量采用手繪的矢量圖片，使得整個網(wǎng)站顯得精致而與眾不同。

圖5是個很養(yǎng)眼的網(wǎng)站，顏色采用類似色調(diào)搭配，看起來很舒服。最欣賞的就是flash的右邊的樹葉，有幾片葉子在輕輕飄動，左邊的圖片淡淡地消失、出現(xiàn)，文字緩緩出現(xiàn)，真的是非常有意境，整個網(wǎng)站看起來生機盎然。

最近在雜志界開始吹起了復古風，六、七十年代的手繪插圖又開始流行，雜志書籍中大量使用矢量時尚插圖取代以前的照片，這股流行勢力很快也蔓延到了網(wǎng)絡上，韓國網(wǎng)站緊隨其后，在時尚站點和兒童站點中大量運用手繪的插圖，如圖6 、圖7所示。

四、文字排版

網(wǎng)站的內(nèi)容排版因為要考慮到可讀性，很多欄目的文字編排都比較簡單，利于閱讀，而在一些內(nèi)容較少的頁面如網(wǎng)站的廣告或宣傳頁上排版則富于變化，更類似于雜志內(nèi)頁的排版，我懷疑很多韓國網(wǎng)頁設計師都是從平面設計師轉(zhuǎn)行過來的。

五、頁面的立體感及細節(jié)處理

韓國網(wǎng)站還有個令人稱道的地方就是它的網(wǎng)站看起來很有層次感，而這個層次感不是靠作幾個立體字來體現(xiàn)的，其實靠的也不過是添加簡單的圖片或文字陰影效果和巧妙的利用構(gòu)圖來形成視覺上的差異，但就是這種設計上的不拘泥于形式使網(wǎng)站的立體效果呼之欲出。我最佩服的是韓國設計師做事的認真態(tài)度，他們的每一個按鈕、圖片的處理都及其講究，其實一些細微的部分不仔細看還不一定容易發(fā)現(xiàn)，但是如果少了這些細節(jié)的地方，整個網(wǎng)站的整體形象就要大打折扣了。

先說這個“長”，中國網(wǎng)站的頁面真是長啊，以至于我坐在電腦前瀏覽的時候經(jīng)常會想，這個頁面的最低端會不會已經(jīng)搭拉到我的腳面上了。我們的萬里長城是第幾大奇跡來著？反正中國的網(wǎng)站應該緊排在她后面。

我們的大型門戶網(wǎng)站恐怕應該是長頁面的領軍者吧?，F(xiàn)在能生存下來的大型門戶各個實力不凡，又紛紛上市，其他網(wǎng)站能與他們頁面相似應該也能說明實力相似吧，這幾家大型門戶已經(jīng)給用戶形成了“長則是好”的印象，于是眾多網(wǎng)站都紛紛“長”起來了。無論是綜合性網(wǎng)站還是專業(yè)性網(wǎng)站，只要有內(nèi)容，就能做多長就做多長，沒有內(nèi)容，抄襲別人內(nèi)容也要做長，以至于不少實力有限的網(wǎng)站只是首頁很長，到了欄目頁面（二級頁面）就簡陋的可憐了。

長的基礎就是要內(nèi)容要多，這些眾多的長網(wǎng)站在組織內(nèi)容的思路上基本是一致的，就是把二級頁面的內(nèi)容摘要的放在首頁上。首頁分成若干個相應的通欄的大塊兒（這樣可以逐個部分的下載頁面，易于顯示），再在每兩塊之間加一條廣告，最后再在頁面的最上面加一個更綜合的區(qū)域，所謂的重中之重，這樣以來頁面想短都短不了。

按照Jakob Nielsen的說法：網(wǎng)站首頁的長度不應該超過4屏。當然這個準則也未必就那么準確，但是至少應該承認頁面不是越長越好的。

第二，說說“閃”。就是網(wǎng)頁上能動的東西―――動畫。主要是Gif動畫，flash動畫，腳本語言實現(xiàn)的圖片交替效果，還有就是彈出窗口。動畫對網(wǎng)頁表現(xiàn)本應該是個很好的補充，但是現(xiàn)在的實際效果是對網(wǎng)頁的干擾，因為動畫從一開始就扮演著廣告的角色。雖然將各種形式的動畫應用于網(wǎng)站在國外的網(wǎng)站上也常見，但是中國網(wǎng)站上的動畫實在是太多了。恐怕也是因為中國網(wǎng)站頁面長吧，能放動畫的空間自然也就大了。整個頁面到處都在不停的閃?？茖W家已經(jīng)證實，在月球上是看不到萬里長城的，但是我想，應該是可以看到中國網(wǎng)頁的，它們不僅長，而且還在不停的閃爍。

這些動畫通常是廣告，網(wǎng)站要生存，要有經(jīng)濟效益，這是可以理解的，但卻不可接受，尤其是太多的時候。最不可接受的是一些網(wǎng)站會把自己的欄目名稱，網(wǎng)站logo之類的很重要的內(nèi)容也做成動畫，以為這樣可以更醒目，要知道，絕大多數(shù)用戶是經(jīng)驗豐富的，他們看到動畫閃來閃去就會認為那是廣告的，盡管你不是，那也活該，誰讓你亂閃來著。

雖然彈出窗口里的內(nèi)容不一定是動畫，但是它“噌”的一下彈出來，著實是夠“動”的，就動畫的效果而言，絕對是最具視覺沖擊力的。還好，現(xiàn)在有越來越多的雷鋒式的好公司提供了能屏蔽彈出窗口的工具。

腳本語言實現(xiàn)的圖片交替效果目前主要是用在網(wǎng)站頭條的圖片報道上，雖然是動，分散用戶的注意力，好在這種方式還是為了給用戶提供盡可能多的信息，應該值得肯定，也應該是動畫應用于網(wǎng)絡的發(fā)展方向，只是不知道什么時候，哪位設計師靈感突現(xiàn)，把廣告也偽裝成這種樣子，應該能在一片罵聲中為公司贏得不少經(jīng)濟效益。

Gif動畫是種傳統(tǒng)的動畫形式了，不過在flash動畫面前，它的生存空間越來越小了，與flash動畫相比恐怕Gif動畫唯一的優(yōu)勢就是在用戶將網(wǎng)頁“另存為…”后，Gif動畫還能顯示，而flash就不行了。雖然Gif已是人老珠黃了，但是還是要批判，因為它通常是廣告。

Flash動畫無疑是網(wǎng)頁動畫的主力了，文件小，效果好，一個白方塊在黑背景上隔幀出現(xiàn)，連續(xù)幾次，只要尺寸稍大就足以造成用戶暫時性失明。實際上，flash基于其強大的交互性應當能為提高用戶界面的性能提供巨大幫助，但是如前面所說，它更被廣告商所看好。更不幸的是越來越多“閃客”在為這項事業(yè)服務，原本代表特例獨行、自由創(chuàng)造精神的人走向了相反的方向。這有點兒象政府將反政府武裝招安后讓他們穿著原來的軍裝去給政府機關當保安。

第三是“擠”。我們的網(wǎng)站看上去滿滿當當?shù)?，比公共汽車還擠。每天早上都是擠公共汽車，然后擠地鐵，擠電梯，擠著打卡，好容易坐下了，打開電腦就不要再那么擠了，大家站開點兒吧，網(wǎng)頁上有的是地兒。

與英文相比，中文本身就顯得比較復雜，對于有鏈接的文字中國網(wǎng)站又往往更傾向于傳統(tǒng)的隨時保持下劃線的方式，再加上小的幾乎不存在的行間距（顯然，這里夸張了，至少還要有劃下劃線的地兒），使得頁面看上去分外豐滿，如同我小時候習慣了在田字格本上寫字后，初次改用行距很小的單線格本寫字所展現(xiàn)出的風采。

即便是體檢用的視力表也沒有把行距安排的如此之小，那可是專門給我們眼睛找麻煩的工具啊，我們的網(wǎng)站無一不是把用戶放在第一位的（至少自稱是這樣的），為什么不能把行距拉大些呢？

經(jīng)?？梢钥吹侥尘W(wǎng)站為了突出重點內(nèi)容而使用14pt的字號，然而卻不加大該內(nèi)容與其他內(nèi)容的距離，這樣只能使頁面看上去更擁擠。這種做法倒是與老板（個別的，個別的，如果您是老板，那這里所說的一定不包括您）的做法頗為相似：只增加工作，不加薪。也許是設計師在用這種擁擠的樣式向老板示威吧。

第四是“花”，中國網(wǎng)站的色彩之絢爛，幾乎無以復加。前面分析了首頁的構(gòu)成方式―――將各個欄目摘要排放在首頁上，通常每一個欄目會有一種主色調(diào)，這樣一來，首頁上的色彩自然就很豐富了。

當然，分欄目確定主色調(diào)的設計方式本身并沒有錯誤，也不足以搞“花”頁面，然而實際情況卻更復雜，以文字為例，未點擊的鏈接文字有黑色和藍色，重點的文字會用紅色（重點通常還很多），點擊后的文字鏈接是紫色，無鏈接且不重要的文字是灰色，此外為了突出某一個重點內(nèi)容會添加一個醒目的背景色或文字顏色。網(wǎng)頁設計師為了表明自己工作用心，會給每一個子欄目的標題部分設計一個很具有特色的背景，這些文字再與數(shù)不勝數(shù)的圖片、動畫交相輝映，使得用戶可以在一個頁面上將電腦可以顯示的全部色彩盡收眼底。網(wǎng)頁設計師實際上根本不需要絞盡腦汁為頁面設定主色調(diào)了，所有的頁面色調(diào)都已經(jīng)設定好了―――彩色。

為什么中國網(wǎng)站會設計成這個樣子呢？

造成“長，閃，擠，花”問題的實質(zhì)是一個“多”字。中國網(wǎng)站首頁上內(nèi)容多，重點多，欄目多，圖片多，廣告多，該多的多，不該多的也多，要多多，有多多。

“多”是中國網(wǎng)站的特點，更是中國社會的現(xiàn)實狀況。無論是超級市場里還是購物中心里，到處是商品，到處是人潮，即使是象書店，美術館這樣的場所也是相似的場面，人們相信人多的商場里的商品會更好，人多的書店里的書會更全，人多的美術展會更有水平，賣家只能盡可能的展現(xiàn)自己的產(chǎn)品，從而證明自己的實力，而其他更高級的要求，諸如：環(huán)境，風格，品味，服務……都要為展示產(chǎn)品讓路了。

在目前的中國，無論是物質(zhì)產(chǎn)品還是精神產(chǎn)品，廣大受眾的需求都遠遠沒有得到滿足，所以大家都希望能看到更多產(chǎn)品，這樣就形成了“多則好”消費心理（瀏覽網(wǎng)站的消費形式顯得更間接），網(wǎng)頁設計師在應聘時經(jīng)常會被問到：你是否能勝任“大型”網(wǎng)站的設計，即“能不能把頁面做的很長?！?

中國網(wǎng)頁內(nèi)容多，給人忙亂的感受，正象我們自己經(jīng)常會向別人抱怨自己忙的要死，以此來表示我們自己的價值。

引用Donald Norman 在《emotional design》一書中的理論，設計可以分為三種層次：本能水平的設計、行為水平的設計、反思水平的設計。本能水平的設計是滿足人類本能審美需求的設計，也就是漂亮、美觀的設計；行為水平的設計是注重效用的設計，注重功能、易用性、可用性；反思水平的設計注重信息、文化的作用，一件產(chǎn)品被設計的很獨特、出眾、引人矚目，用戶會因為始終這個產(chǎn)品而產(chǎn)生樂趣，產(chǎn)生滿足感。

根據(jù)這個理論，中國網(wǎng)站的設計普遍達沒能實現(xiàn)本能水平的設計，雖然網(wǎng)站的boss、設計師本人都希望把網(wǎng)站設計的很漂亮，吸引用戶的眼球。行為水平的設計逐漸被重視了，不過目前基本上還是停留在不高的水平上。上面說到的中國網(wǎng)站的種種問題實際上正式在反思水平上的設計，一種變相的反思水平設計。

“多”這種看似缺陷的現(xiàn)象，實際上正式給用戶一個好的反思―――“這個網(wǎng)站的內(nèi)容豐富，在這里我能得到想要的東西?！北M管很多用戶并不會真的關注首頁上的內(nèi)容。

正是這種反思吸引著用戶，保證著網(wǎng)站的訪問量。

造成上述網(wǎng)站首頁設計問題的罪魁并不是設計師沒水平或者用戶沒品味，而是產(chǎn)品不夠，這表面上的“多”其實是由于“少”造成的。用戶對網(wǎng)絡內(nèi)容的需求引導著網(wǎng)站的設計，策劃人員有意無意的在迎合著這樣的需求。

要改變中國網(wǎng)頁設計單靠高水平的設計師是不夠的，中國網(wǎng)頁設計水平的提高是伴隨著社會發(fā)展在進步的。

三、推薦幾個好的設計素材網(wǎng)站出來視覺中國，千圖網(wǎng)，昵圖網(wǎng)

先推薦一些我平時用的網(wǎng)站，后面還有一些國內(nèi)外出名的網(wǎng)站。

題主可以慢慢選

花瓣網(wǎng)，真心好用

設計怎么能缺了字體

這個網(wǎng)站也挺不錯

還有這個

以上是我常用到的網(wǎng)站

再推薦一些國內(nèi)外的網(wǎng)站給題主你去選擇

國內(nèi)設計/素材站

http://www.zcool.com.cn/ 站酷

http://www.68design.net/ 設計師聯(lián)盟

http://www.sucaitianxia.com/ 素材天下

http://www.52design.com 我愛設計網(wǎng)

http://www.chinavisual.com/視覺中國

http://down.chinavisual.com/ 下吧素材網(wǎng)

http://sc.chinaz.com/psd/ 站長素材

http://www.tooopen.com/psd/ 素材公社

http://www.sccnn.com/ 素材中國

http://www.cyzg.com/ 創(chuàng)意中國

http://www.sharelogo.cn/ 標志設計

UI設計網(wǎng)址

http://www.chinaui.com/ 優(yōu)艾網(wǎng)

http://www.uiimg.com/ UI圖-UI設計網(wǎng)

http://www.uisheji.com/ UI設計網(wǎng)

http://www.uimaker.com/ UI制造

http://www.worldui.com/ UI設計網(wǎng)

http://fanggeben.com/ 方格本

http://www.cnpsd.net/mobile/ 手機界面

國外設計/素材站

http://www.deviantart.com/ 藝術與應用

http://www.webinspeer.com/酷站欣賞

http://coolhomepages.com/最好的網(wǎng)頁設計酷站欣賞

http://www.bestcssdesign.com/ 最佳的網(wǎng)頁設計

http://subtlepatterns.com/ 背景紋理素材

http://logopond.com/ LOGO設計

http://thedesigninspiration.com/設計靈感

http://reeoo.com/ 酷站欣賞

http://www.tungtt.com/ 酷站欣賞

http://www.iicns.com/ IOS應用圖標

四、網(wǎng)頁制作課程設計總結(jié)

網(wǎng)頁制作課程設計總結(jié)

1.設計目的

闡述該網(wǎng)站的設計意圖和創(chuàng)意，簡單介紹網(wǎng)站。

2.設計思想

闡述網(wǎng)站的整體設計思想，包括：

2.1網(wǎng)站整體結(jié)構(gòu)規(guī)劃思想

要求闡述網(wǎng)站整體結(jié)構(gòu)的選擇、設計的思想，繪制網(wǎng)站結(jié)構(gòu)草圖。

2.2 主頁設計思想

要求對主頁的布局思路進行闡述和分析。

2.3子頁的設計思想

要求對子頁的設計以及網(wǎng)頁對象的選取思路進行闡述和分析。

3網(wǎng)頁詳細設計分析

要求選取一張網(wǎng)頁，對網(wǎng)頁的設計實現(xiàn)過程進行闡述和分析，詳細說明制作該網(wǎng)頁的步驟，所使用的網(wǎng)頁對象以及該網(wǎng)頁對象的操作方法。

4結(jié)論

對整個設計報告做歸納性總結(jié)，并分析設計過程中的困難及如何解決的，最后提出展望。

一、設計目的

本課程的設計目的是通過實踐使同學們經(jīng)歷Dreamweaver 8開發(fā)的全過程和受到一次綜合訓練，以便能較全面地理解、掌握和綜合運用所學的知識。結(jié)合具體的開發(fā)案例，理解并初步掌握運用Dreamweaver 8可視化開發(fā)工具進行網(wǎng)頁開發(fā)的方法;了解網(wǎng)頁設計制作過程。通過設計達到掌握網(wǎng)頁設計、制作的技巧。了解和熟悉網(wǎng)頁設計的基礎知識和實現(xiàn)技巧。根據(jù)題目的要求，給出網(wǎng)頁設計方案，可以按要求，利用合適圖文素材設計制作符合要求的網(wǎng)頁設計作品。熟練掌握Photoshop 8、Dreamweaver 8等軟件的的操作和應用。增強動手實踐能力，進一步加強自身綜合素質(zhì)。我本次主要是設計的一“新加坡之旅”為主題的網(wǎng)頁，針對新加坡的美麗風景做了介紹。

二、設計思想

利用Dreamweaver8.0制作一個關于“新加坡之旅”的網(wǎng)站，利用表格、行為、層和鏈接等網(wǎng)頁設計技術設計頁面。

本網(wǎng)站以新加坡旅游為素材，主要講解了與新加坡景點相關的內(nèi)容。首頁設風景介紹和風景欣賞兩個欄目。景點介紹設7個欄目，風景欣賞只含一個頁面。

三、網(wǎng)頁詳細設計分析

(一)建立布局

在這次的網(wǎng)頁設計中用到大量的布局，所以怎么樣建立布局是關鍵。Dreamweaver 8是大多數(shù)人設計網(wǎng)頁的稱手兵器，也是眾多入門者的捷徑。特別是其在布局方面的出色表現(xiàn)，更受青睞。大家都知道，沒有表格的幫助，很難組織出一個協(xié)調(diào)合理的頁面。

1.點擊“ALT+F6”鍵，進入布局模式，插入布局表格。建立一個大概的布局。

2.使用背景圖片：選中該項，按瀏覽可以插入一幅準備好的圖片作為表格的背景，因為圖片是以平鋪的形式作為表格背景，所以表格大小和圖片尺寸都要控制好。

(二)網(wǎng)頁中的圖像

圖像傳輸是WWW的真正魅力所在，它與文字相比具有顯著的優(yōu)點：一是直觀，人眼觀看圖像時接受信息的速度遠遠超過觀看文字時接受信息的速度;二是能更清楚地表達細節(jié)內(nèi)容。正是由于這些優(yōu)點，所以在進行網(wǎng)頁設計時圖像很受歡迎。如果網(wǎng)頁做得像一幅風景畫，瀏覽者一定會流連忘返(如果圖片很大，效果會適得其反)。圖像文件的格式有幾十種，如GIF、JPEG、BMP、EPS、PCX、PNG、FAS、TGA、TIFF、WMF等，現(xiàn)在Internet Explorer和Netscape支持的、最常用的圖像格式是GIF、JPEG和BMP。

(1)在網(wǎng)頁中插入圖像

利用Dreamweaver 8可以方便地在網(wǎng)頁中插入圖像，還可以設置圖像邊框、大小、和位置，并且可以直接對圖像進行編輯。在網(wǎng)頁中加入圖像的操作非常簡單：

1.新建一個空白網(wǎng)頁，把光標定位在網(wǎng)頁的開始位置。

2.打開“工具”菜單，選擇“圖片”菜單項，在子菜單中選擇“來自文件”菜單項，或者單擊工具欄中的圖片工具圖標，彈出一個“圖片”對話框。

3.在此對話框中單擊“瀏覽”按鈕，出現(xiàn)一個“選擇文件”對話框。

4.在“選擇文件”對話框的文件列表中選擇某個圖像文件，然后單擊“確定”按鈕，或直接雙擊該圖像文件，該圖像即被加入到網(wǎng)頁中。在網(wǎng)頁中插入圖像后我們就可以對圖像的各種屬性進行設置了。

(2)圖像的各種屬性設置

1.選中所插入的圖片，單擊鼠標右鍵，彈出一個快捷菜單，在菜單中選擇“圖片屬性”菜單項，出現(xiàn)一個“圖片屬性”對話框.

2.打開“外觀”選項卡。

(1)設定圖像邊框粗細：在“外觀”選項卡的“布局”欄里可以根據(jù)需要定義圖像的邊框，也可以定義邊框值為“0”，即無邊框。

(2)設置圖像環(huán)繞方式：一般情況下一幅圖像只能與一行文字處在同一高度，但有時需要將圖像和文字分開，且兩者互不影響。比如在網(wǎng)頁左邊插入一幅圖像，要求右邊的文字就像沒有圖像時可以多行輸入，這就要通過設置圖像的環(huán)繞方式來實現(xiàn)。在網(wǎng)頁中圖像的環(huán)繞方式有兩種：

①左環(huán)繞：圖像在左邊，文本在圖像的右邊進行環(huán)繞。

②右環(huán)繞：圖像在右邊，文本在圖像的左邊進行環(huán)繞。

在“外觀”選項卡的“布局”欄中打開“對齊方式”下拉列表框，選擇“左”選項，并單擊“確定”按鈕，圖像就被設置為左環(huán)繞方式，同樣，如果選“右”，圖像就被設置為右環(huán)繞方式。

(3)編輯圖像大?。涸贒reamweaver 8中，當在網(wǎng)頁中加入一幅圖像后，圖像大小默認設置為其原來的大小，如果加入的圖像太大或太小，或有其他特別需要，就得調(diào)整圖像的大小。調(diào)整圖像大小非常簡單靈活，只要你選中加入的圖像，用鼠標左鍵拖動圖像邊框，可任意調(diào)整圖像的寬度和高度直到達到你滿意的尺寸。

(4)設置圖像縮放比例：網(wǎng)頁設計的一個重要原則就是網(wǎng)頁的.兼容性，對于不同的瀏覽器或者不同的分辨率，不管是800×600的窗口，還是1024×768的窗口，網(wǎng)頁都要能正常的顯示。設置圖像縮放比例就是將圖像設置為大小可以按比例變化，與瀏覽器的大小成一固定比例，這樣在不同大小的瀏覽器窗口里圖像都能正常的顯示外觀。設置圖像縮放比例的步驟如下：

1.選中網(wǎng)頁中的圖像，單擊鼠標右鍵，在彈出的快捷菜單里，選擇“圖像屬性”菜單項，彈出一個“圖像屬性”對話框.

2.在“大小”欄中選中“指定大小”復選框，同時選中“寬度”和“高度”下面的“百分比”單選按鈕，然后在“寬度”和“高度”欄里輸入想顯示的比例，單擊“確定”完成設置。外還可以在“外觀”選項卡的“水平間距”和“垂直間距”欄里進行設置，水平間距是指圖像與周圍元素在水平方向的間距，以象素為單位;垂直間距指圖像與周圍元素在垂直方向的間距。

(3)怎樣編輯網(wǎng)頁中的圖像

在Dreamweaver 8中，可以使用“圖片”工具欄中的各種工具對網(wǎng)頁中的圖像進行編輯，編輯功能主要有：圖像旋轉(zhuǎn)和翻轉(zhuǎn)、剪裁、圖像淡化、凹凸效果等等。

另外，為了使圖片更符合要求，我們還在photoshop8中隊所用的圖片進行了處理，使得圖片看起來更加精細美觀，符合我們的主題要求。

(4)使用背景圖像

使用背景圖像與使用背景色不同，使用背景色只將網(wǎng)頁的背景用某種顏色填充，而使用背景圖像則是將網(wǎng)頁的背景用圖像平鋪。這樣做可以使制作的網(wǎng)頁更美觀好看。網(wǎng)頁中使用背景圖像的具體步驟如下：

1.新建一個空白網(wǎng)頁。

2.單擊鼠標右鍵，彈出的快捷菜單里選“網(wǎng)頁屬性”，彈出“網(wǎng)頁屬性”對話框.

3.開“背景”選項卡。

4.在“背景”選項卡的“格式”欄中選中“背景圖片”復選框，然后單擊下面的“瀏覽”按鈕，出現(xiàn)一個“選擇背景圖片”對話框。

5.在“選擇背景圖像”對話框中單擊“瀏覽文件”按鈕，出現(xiàn)一個“選擇文件”對話框。

6.在“選擇文件”對話框的文件列表中選擇圖像文件，單擊“確定”按鈕。

這樣，所選圖片將作為整個網(wǎng)頁的背景，如果在第4步時同時選中“水印”復選框，背景圖片將顯示為特殊的水印效果，當網(wǎng)頁滾動時，背景不動，只有網(wǎng)頁內(nèi)容滾動，產(chǎn)生一種透明層的效果，非常吸引人。

(5)插入flash動畫

關于 Flash 視頻使用 Dreamweaver 中的“插入 Flash 視頻”命令，可將 Flash 視頻內(nèi)容插入 Web 頁面，而無需使用 Flash 創(chuàng)作工具。該命令可以插入 Flash 組件;當您在瀏覽器中查看它時，它顯示所選擇的 Flash 視頻內(nèi)容以及一組播放控件。

(6)設置鼠標經(jīng)過圖片，進行圖片交互

再插入圖片的下拉菜單中有一項是“鼠標經(jīng)過”，點擊這一項，會彈出一個對話框，在對話框中可以設置鼠標經(jīng)過前的圖片和經(jīng)過時的圖片，選擇“確定”即可。

(7)設置鏈接

選中圖片或者文字，在下面的鏈接屬性中輸入所要連接到的地址，同時，下方的目標屬性被激活，輸入blank設置成在新窗口中打開網(wǎng)頁。我們設置了鏈接本站點的網(wǎng)頁頁面，同時也連接了外網(wǎng)，使得大家訪問頁面時能夠查詢更多詳細的信息，方便用戶查詢。

;

以上就是關于網(wǎng)頁設計欣賞相關問題的回答。希望能幫到你，如有更多相關問題，您也可以聯(lián)系我們的客服進行咨詢，客服也會為您講解更多精彩的知識和內(nèi)容。