導航:首頁 > 萬維百科 > 網頁大圖設計原則

網頁大圖設計原則

發布時間:2021-03-31 10:39:48

1、網頁設計最重要的原則是什麼,為什麼?

一、設計的任務

設計是一種審美活動,成功的設計作品一般都很藝術化。但藝術只是設計的手段,而並非設計的任務。設計的任務是要實現設計者的意圖,而並非創造美。
網頁設計的任務,是指設計者要表現的主題和要實現的功能。站點的性質不同,設計的任務也不同。從形式上,可以將站點分為以下三類。
第一類是資訊類站點,像新浪、網易、搜狐等門戶網站。這類站點將為訪問者提供大量的信息,而且訪問量較大。因此需注意頁面的分割、結構的合理、頁面的優化、界面的親和等問題。
第二類是資訊和形象相結合的網站,像一些較大的公司、國內的高校等。這類網站在設計上要求較高,既要保證資訊類網站的上述要求,同時又要突出企業、單位的形象。然而就現狀上來看,這類網站有粗製濫造的嫌疑。
第三類則是形象類網站,比如一些中小型的公司或單位。這類網站一般較小,有的則有幾頁,需要實現的功能也較為簡單,網頁設計的主要任務是突出企業形象。這類網站對設計者的美工水平要求較高。
當然,這只是從整體上來看,具體情況還要具體分析。不同的站點還要區別對待。別忘了最重要的一點,那就是客戶的要求,它也屬於設計的任務。
明確了設計的任務之後,接下來要想的就是如何完成這個任務了。

二、設計的實現

設計的實現可以分為兩個部分。第一部分為站點的規劃及草圖的繪制,這一部分可以在紙上完成。第二部分為網頁的製作,這一過程是在計算機上完成的。
設計首頁的第一步是設計版面布局。我們可以將網頁看作傳統的報刊雜志來編輯,這裡面有文字、圖像乃至動畫,我們要做的工作就是以最適合的方式將圖片和文字排放在頁面的不同位置。 除了要有一台配置不錯的計算機外,軟體也是必需的。不能簡單地說一個軟體的好壞,只要是設計者使用起來覺得方便而且能得心應手的,就可以稱為好軟體。當然,它應該能滿足設計者的要求。筆者常用的軟體是Macromedia的Dreamweaver、Fireworks、Flash以及Adobe的Photoshop、imageready,這些都是很不錯的軟體。 接下來我們要做的就是通過軟體的使用,將設計的藍圖變為現實,最終的集成一般是在Dreamweaver里完成的。雖然在草圖上,我們定出了頁面的大體輪廓,但是靈感一般都是在製作過程中產生的。設計作品一定要有創意,這是最基本的要求,沒有創意的設計是失敗的。在製作的過程中,我們會碰到許多問題,其中最敏感的莫過於頁面的顏色了。

三、色彩的運用

色彩是一種奇怪的東西,它是美麗而豐富的,它能喚起人類的心靈感知。一般來說,紅色是火的顏色,熱情、奔放;也是血的顏色,可以象徵生命。黃色是明度最高的顏色,顯得華麗、高貴、明快。綠色是大自然草木的顏色,意味著純自然和生長,象徵安寧和平與安全,如綠色食品。紫色是高貴的象徵,有莊重感。白色能給人以純潔與清白的感覺,表示和平與聖潔。
我們知道,顏色是光的折射產生的,紅、黃、藍是三原色,其它的色彩都可以用這三種色彩調和而成。換一種思路,我們可以用顏色的變化來表現光影效果,這無疑將使我們的作品更貼近現實。
色彩代表了不同的情感,有著不同的象徵含義。這些象徵含義是人們思想交流當中的一個復雜問題,它因人的年齡、地域、時代、民族、階層、經濟地區、工作能力、教育水平、風俗習慣、宗教信仰、生活環境、性別差異而有所不同。
單純的顏色並沒有實際的意義,和不同的顏色搭配,它所表現出來的效果也不同。比如綠色和金黃、淡白搭配,可以產生優雅,舒適的氣氛。藍色和白色混合,能體現柔順、淡雅、浪漫的氣氛。紅色和黃色、金色的搭配能渲染喜慶的氣氛。而金色和粟色的搭配則會給人帶來暖意。設計的任務不同,配色方案也隨之不同。考慮到網頁的適應性,應盡量使用網頁安全色。
但顏色的使用並沒有一定的法則,如果一定要用某個法則去套,效果只會適得其反。經驗上我們可先確定一種能表現主題的主體色,然後根據具體的需要,應用顏色的近似和對比來完成整個頁面的配色方案。整個頁面在視覺上應是一個整體,以達到和諧、悅目的視覺效果。

四、造型的組合

在網頁設計中,我們主要通過視覺傳達來表現主題。在視覺傳達中,造型是很重要的一個元素。拋去是圖還是文字的問題,畫面上的所有元素可以統一作為畫面的基本構成要素點、線、面來進行處理。在一幅成功的作品裡,是需要點、線、面的共同組合與搭配來構造整個頁面的。
通常我們可以使用的組合手法有秩序、比例、均衡、對稱、連續、間隔、重疊、反復、交*、節奏、韻律、歸納、變異、特寫、反射等等,它們都有各自的特點。在設計中應根據具體情況,選擇最適合的表現手法,這樣有利於主題的表現。
通過點、線、面的組合,可以突出頁面上的重要元素,突出設計的主題,增強美感,讓觀者在感受美的過程中領會設計的主題,從而實現設計的任務。
造型的巧妙運用不僅能帶來極大的美感,而且能較好地突出企業形象,而且能將網頁上的各種元素有機的組織起來,它甚至還可以引導觀者的視線。

五、設計的原則

設計是有原則的,無論使用何種手法對畫面中的元素進行組合,都一定要遵循五個大的原則:統一、連貫、分割、對比及和諧。
統一,是指設計作品的整體性,一致性。設計作品的整體效果是至關重要的,在設計中切勿將各組成部分孤立分散,那樣會使畫面呈現出一種枝蔓紛雜的凌亂效果。
連貫,是指要注意頁面的相互關系。設計中應利用各組成部分在內容上的內在聯系和表現形式上的相互呼應,並注意整個頁面設計風格的一致性,實現視覺上和心理上的連貫,使整個頁面設計的各個部分極為融洽,猶如一氣呵成。
分割,是指將頁面分成若干小塊,小塊之間有視覺上的不同,這樣可以使觀者一目瞭然。在信息量很多時為使觀者能夠看清楚,就要注意到將畫面進行有效的分割。分割不僅是表現形式的需要。換個角度來講,分割也可以被視為對於頁面內容的一種分類歸納。
對比就是通過矛盾和沖突,使設計更加富有生氣。對比手法很多,例如:多與少、曲與直、強與弱、長與短、粗與細、疏與密、虛與實、主與次、黑與白、動與靜、美與丑、聚與散等等。在使用對比的時候應慎重,對比過強容易破壞美感,影響統一。
和諧是指整個頁面符合美的法則,渾然一體。如果一件設計作品僅僅是色彩、形狀、線條等的隨意混合,那麼作品將不但沒有「生命感」,而且也根本無法實現視覺設計的傳達功能。和諧不僅要看結構形式,而且要看作品所形成的視覺效果能否與人的視覺感受形成一種溝通,產生心靈的共鳴。這是設計能否成功的關鍵。

六、網頁的優化

在網頁設計中,網頁的優化是較為重要的一個環節。它的成功與否會影響頁面的瀏覽速度和頁面的適應性,影響觀者對網站的印象。
在資訊類網站中,文字是頁面中最大的構成元素,因此字體的優化顯得尤為重要。使用css樣式表指定文字的樣式是必要的,通常我們將字體指定為宋體,大小指定為12px,顏色要視背景色而定,原則上以能看清且與整個頁面搭配和諧為准。在白色的背景上,我們一般使用黑色,這樣不易產生視覺疲勞,能保證瀏覽者較長時間地瀏覽網頁。
圖片是網頁中的重要元素。圖片的優化可以在保證瀏覽質量的前提下將其size降至最低,這樣可以成倍地提高網頁的下載速度。利用Photoshop6或Fireworks4可以將圖片切成小塊,分別進行優化。輸出的格式可以為gif或jpeg,要視具體情況而定。一般我們把有較為復雜顏色變化的小塊優化為jpeg,而把那種只有單純色塊的卡通畫式的小塊優化為gif,這是由這兩種格式的特點決定的。
表格(table)是頁面中的重要元素,是頁面排版的主要手段。我們可以設定表格的寬度、高度、邊框、背景色、對齊方式等參數。很多時候,我們將表格的邊框設為0,以此來定位頁面中的元素,或者籍此確定頁面中各元素的相對位置。我們知道:瀏覽器在讀取網頁html原代碼時,是讀完整個table才將它顯示出來的。如果一個大表格中含有多個子表格,必須等大表格讀完,才能將子表格一起顯示出來。我們在訪問一些站點時,等待多時無結果,按"停止"按鈕卻一下顯示出頁面就是這個原因。因此,我們在設計頁面表格的時候,應該盡量避免將所有元素嵌套在一個表格里,而且表格嵌套層次盡量要少。在使用Dreamweaver製作網頁時,會自動在每一個td內添加一個空字元「 」。如果單元格內沒有填充其它元素,這個空字元會保留,在指定td的寬度或高度後,可以在源代碼內將其刪去。
網頁的適應性是很重要的,在不同的系統上,不同的解析度下,不同的瀏覽器上,我們將會看到不同的結果,因此設計時要統籌考慮。一般我們在800*600下製作網頁,最佳瀏覽效果也是在800*600解析度下,在其它情況下只要保證基本一致,不出現較大問題即可。
說了這么多,只是希望能對做「網頁設計」的人有所幫助,希望他們在做網頁的時候能夠從整體著眼,無愧於「設計」這兩個字。
★建設自己的網站較好的步驟☆

必須注意的是:建立自己的網站是一件浩大的工程,一般比較麻煩。所以應當按照一定的步驟一步步來。

我覺得建站可以按照以下步驟進行:
1、先在本地設一個文件夾,作為網站存儲的地方。名字最好取「My Sites」。
2、在網站文件夾裡面建立一些文件夾,包括「images」等(存儲圖片、文件等),並且按照網頁內容,再建立幾個文件夾。(也可以把存儲圖片、文件的文件夾在每個內容文件夾裡面各搞一些)
3、打開你的網頁編輯程序(例如FP、Dreamwear等),新建網頁,保存為「index」(主頁),重復以上步驟,在網站文件夾裡面建立「search」(查找)、「map」(站點地圖)、「index02」(網站簡介等)。
4、按照上面步驟,再在網站分類文件夾裡面建立許多網頁(接著還要把內容輸入網頁)
5、已經做到了這么多,我們該准備內容了吧。在硬碟上面再建立一個文件夾「File」,把准備好的文檔、圖片、程式、文件和網頁特效等放進去。(可以加入一些動態網頁)
6、慢慢把這些文件一個不漏的放進網頁裡面(要掌握技巧)
7、把網站充實了,就差不多了。這時應該申請一個域名(免費空間、附費都可以)。並且把自己的網站放入搜索引擎,而且在各種留言版上面宣傳。
8、把網站上傳至空間裡面,刪了准備文件,就OK了!

不過也可以這樣使用FP建站:

1、在FP裡面選擇新建站點。
2、然後在【導航】裡面設置網頁名稱以及標題。
3、准備好文檔、圖片、程式、文件和網頁特效等,把它們都充實進網站裡面。
4、申請一個域名(免費空間、附費都可以)。並且把自己的網站放入搜索引擎,而且在各種留言版上面宣傳。
5、把網站上傳至空間裡面,刪了准備文件。完畢。

如果使用Dreamwear來建站,那就更加高級啦!Dreamwear的功能很強大,安裝了它的朋友們可以研究研究。

網站設計中,純粹HTML格式的網頁通常被稱為「靜態網頁」,早期的網站一般都是由靜態網頁製作的。靜態網頁的網址形式通常為:www.example.com/eg/eg.htm,也就是以.htm、.html、.shtml、.xml等為後後綴的。在HTML格式的網頁上,也可以出現各種動態的效果,如.GIF格式的動畫、FLASH、滾動字母等,這些「動態效果」只是視覺上的,與下面將要介紹的動態網頁是不同的概念。

在《網路營銷基礎與實踐》第二版第3章「網路營銷導向的企業網站建設」中,提出了採用靜態網頁對搜索引擎的影響,書中對於靜態網頁本身的介紹比較少,尤其對於靜態網頁的特點沒有做專門的介紹。 網路營銷教學網站(www.wm23.com)將靜態網頁的特點簡要歸納如下:

(1)靜態網頁每個網頁都有一個固定的URL,且網頁URL以.htm、.html、.shtml等常見形式為後綴,而不含有「?」;
(2)網頁內容一經發布到網站伺服器上,無論是否有用戶訪問,每個靜態網頁的內容都是保存在網站伺服器上的,也就是說,靜態網頁是實實在在保存在伺服器上的文件,每個網頁都是一個獨立的文件;
(3)靜態網頁的內容相對穩定,因此容易被搜索引擎檢索;
(4)靜態網頁沒有資料庫的支持,在網站製作和維護方面工作量較大,因此當網站信息量很大時完全依靠靜態網頁製作方式比較困難;
(5)靜態網頁的交互性交叉,在功能方面有較大的限制。

2、網頁設計的基本原則有哪些

<

3、網頁界面設計遵循的原則有哪些

網頁欄目是指網站建設的主要板塊內容,一般指網站導航欄目、二級欄目、三級欄目等等,主要是為了方便用戶快速找到自己想了解的東西,增強用戶體驗。

4、網頁設計的設計原則有哪些?

一、色彩 這個對有平面、美術基本的朋友都比較簡單



在設計中色彩是很重要的。一般來說,紅色是火的顏色,熱情、奔放;也是血的顏色,可以象徵生命。黃色是明度最高的顏色,顯得華麗、高貴、明快。綠色 是大自然草木的顏色,意味著純自然和生長,象徵安寧和平與安全,如綠色食品。紫色是高貴的象徵,有莊重感。白色能給人以純潔與清白的感覺,表示和平與聖潔。



二、造型



畫面上的所有元素可以統一作為畫面的基本構成要素點、線、面來進行處理。在一幅成功的作品裡,是需要點、線、面的共同組合與搭配來構造整個頁面的。



通常我們可以使用的組合手法有秩序、比例、均衡、對稱、連續、間隔、重疊、反復、節奏、韻律、歸納、變異、特寫、反射等等,它們都有各自的特點。在設計中應根據具體情況,選擇最適合的表現手法,這樣有利於主題的表現。



三、設計原則



設計是有原則的,無論使用何種手法對畫面中的元素進行組合,都一定要遵循五個大的原則:統一、連貫、分割、對比及和諧。



關於網頁設計的設計原則有哪些,青藤小編就和您分享到這里了。如果您對頁面排版、網站設計、圖形處理等有濃厚的興趣,希望這篇文章可以對您有所幫助。如果您還想了解更多關於平面設計的素材及技巧等內容,可以點擊本站的其他文章進行學習。


以上是小編為大家分享的關於網頁設計的設計原則有哪些?的相關內容,更多信息可以關注環球青藤分享更多干貨

5、網頁設計應遵循什麼原則

1、明確內容:一個網頁在設計的時候首先應該考慮網站的內容,包括網站功能和用戶需求,整個設計都應該圍繞這些方面來進行。不了解網頁用戶的需求,設計出的網路文檔幾乎毫無意義,如要設計一個網上電子交易系統,就沒有必要羅列一些文學藝術等內容,否則只會引起用戶的反感。
2、色彩和諧統一:網頁設計要達到傳達信息和審美兩個目的,悅人的網頁配色可以使瀏覽者過目不忘。網頁色彩設計應該遵循"總體協調,局部對比"的原則。
3、定期更新:除了及時更新內容之外,還需要每隔一定時間對版面、色彩等進行改進,讓瀏覽者對網站保持一種新鮮感,否則就會失去大量的瀏覽者。
4、平台的兼容性:最好在不同的瀏覽器和解析度下進行測試,基本原則是確保在IE 5以上的版本中都有較好效果,在1024×768和800×600的解析度下都能正常顯示。此外,還需要在網頁上盡量少使用Java和ActiveX編寫的代碼,因為並不是每一種瀏覽器都能很好地支持它們。
5、打開速度要快:相信大家都遇到過這樣的情況,好不容易從搜索引擎中找到了感興趣的鏈接,卻最終因遲遲打不開而放棄。根據統計,一般人從選擇要看的頁面算起,經過Internet的下載到下載完畢,可以忍受的時間大約只有30秒。我校數字媒體學院專家認為網頁打開速度除了跟伺服器性能和帶寬容量有關之外,更多的是與網頁文件大小和代碼優劣等有直接關系。
6、導航明朗:導航的項目不宜過多,一般用5~9個鏈接比較合適,可只列出幾個主要頁面。如果信息量比較大,確實需要建立很多導航鏈接時,則盡量採用分級目錄的方式列出,或者建立搜索的表單,讓瀏覽者通過輸入關鍵字即可進行檢索。

6、優秀網頁設計的原則是什麼?

一、優秀網頁設計的原則——統一


團結是組成,意義是組織的意義。


好的網頁設計的原則不是元素的任意組合,而是必須把整體放在第一位。每一個細節都是為了給整體增添光彩。我們的大腦總是在尋找相似的視覺元素。當我們理解了這些因素,我們看到的是有凝聚力的設計,而不是混亂無序的設計。


統一的方法:相似性,可重復性和連續性。


變化中的統一:例如,形式可以重復,但大小不同;顏色可以重復,但深度不同。變化中的重復強調統一和變化。


二、優秀網頁設計的原則——焦點和焦點


沒有受眾的關注,任何信息、藝術價值和審美價值都會失去意義。設計師如何吸引觀眾的注意力?創建一個引人注目的工作,強度和焦點是非常有用的用戶界面設計。


具體方法如下:


1. 大多數元素是暗的。明亮的形狀打破了畫面的焦點。


2. 大多數元素是安靜和柔和的,強烈的對比被稱為焦點。


3.在一系列扭曲表現主義的作品中,有一幅不同風格的寫實肖像。


4. 文字或符號被稱為焦點。


5. 大部分的元素是黑色和白色,和彩色元素稱為焦點。


隔離產生焦點:隔離也是一種對比,一種空間位置的對比,而不是形式的對比。


但即使強調統一,我們也要注意統一,更重要的是要利用相互關聯的元素來創造和諧的格局,而不是一味強調破壞統一。


三、優秀網頁設計的原則——大小和規模


在優秀網頁設計的原則中,大小和規模都是事物的大小,一個是相對的,另一個是絕對的。單位中每個元素的大小稱為比例。描述一種“不成比例”的視覺效果往往令人震驚和不安,但這種效果可能正是藝術家想要的。


四、優秀網頁設計的原則——平衡


平衡被假定為屏幕的中軸,給人一種永恆的力量和穩定的感覺,而不管兩邊的視覺重量。與此同時,這種不平衡可以用來有意地創造讓觀眾感到不舒服或不舒服的畫面。(不只是左和右,也有上下)。


當元素的視覺權重不同時,存在不平衡對稱:


1. 色彩與色調平衡


通過紋理和圖案達到平衡


3.通過位置和視線(隨機放置並連接到視線)


有左,右,上,下,輻射和晶體平衡。


五、優秀網頁設計的原則——節奏


設計師創造出好的網頁設計原則,使之與其他感官記憶和聯想產生共鳴。當視覺體驗與其他感官產生共鳴時,這被稱為動覺轉移。


連續節奏:交替節奏。例如季節的變化,晝夜的變化,潮汐的漲落,甚至行星的運動,都反映著內在的節奏規律。它具有相同的元素組成,並按照一定的規則重復,呈現出連續的圖案。


漸變節奏:物體的顏色和紋理發生變化,但它們是由大小漸變引起的。漸變改變了物體的水平和垂直線條,創建了一個從大到小的規則漸變。


以上就是優秀網頁設計的原則的全部內容了,這些概念對於使您的ui設計作品變得更加出色起著至關重要作用。如果您對此類項目有興趣,可以關注我們ui設計的其他內容,如果想知道更多ui設計的相關知識及技巧等,可以點擊本站的其他文章進行學習。

7、網頁的設計原則

所謂網站(Website),就是指在網際網路(網際網路)上,根據一定的規則,使用HTML等工具製作的用於展示特定內容的相關網頁的集合。簡單地說,網站是一種通訊工具,就像布告欄一樣,人們可以通過網站來發布自己想要公開的資訊(信息),或者利用網站來提供相關的網路服務(網路服務)。人們可以通過網頁瀏覽器來訪問網站,獲取自己需要的資訊(信息)或者享受網路服務。
在你眼前,出現在顯示器上的這個「東西」,就是一個網頁。網頁實際是一個文件,它存放在世界某個角落的的某一台計算機中,而這台計算機必須是與互聯網相連的。網頁經由網址(URL)來識別與存取,當我們在瀏覽器輸入網址後,經過一段復雜而又快速的程序。網頁文件會被傳送到你的計算機,然後再通過瀏覽器解釋網頁的內容,再展示到你的眼前。 Web站點主頁應具備的基本成分包括:
頁頭:准確無誤地標識你的站點和企業標志;
Email地址:用來接收用戶垂詢;
聯系信息:如普通郵件地址或電話;
版權信息:聲明版權所有者等。
充分利用已有信息,如客戶手冊.公共關系文檔.技術手冊和資料庫等。 設計一個網站,應該考慮下列九條基本因素,這些因素對網站的成功與否有著重要影響。
1. 整體布局
網站主頁就好像是宣傳欄或者店面——對訪問者產生第一印象,都希望盡量給人留下好的印象,不是嗎?
一般來說,好的網站應該給人有這樣的感覺:
干凈整潔;
條理清楚;
專業水準;
引人入勝。
網頁應該力求抓住而不是淹沒瀏覽者的注意力,過多的閃爍、色彩、下拉菜單框、圖片等會讓訪問者無所適從——離開是最好的選擇。就像一些商店,播放震耳欲聾的發燒音樂,你要做的唯一決定就是離開那裡,越快越好。
2. 信息
無論商業站點還是個人主頁,你必須給人們提供有一定價值的內容才能留住訪問者。因為我們人類總是惟利是圖,第一個問題總是:「對我有什麼用處?」
所以你必須提供某些有價值的東西,當然並不是說必須提供某些免費的物品——免費書籍、免費入場券、免費度假等,這些「有價值的東西」可以是:
信息;
娛樂;
勸告;
對一些問題的幫助;
提供志趣相投者聯絡的機會;
鏈接到有用的網頁,等等。
如果你經營的是企業網站,需要提供關於產品或服務的信息:
容易理解;
容易查詢;
容易訂貨。
3. 速度
我們都知道,頁面下載速度是網站留住訪問者的關鍵因素。如果20—30秒還不能打開一個網頁,一般人就會沒有耐心。至少應該確保主頁速度盡可能快,最好不要用大的圖片。
應該時時提醒自己,網站首頁就像一個廣告牌。當開車經過一個廣告牌時,沒有時間閱讀上面的詳細說明,也不可能贊賞其復雜的圖案,廣告標志從眼前一閃而過,必須在一瞬間給人留下印象。
網上訪問者也是「一閃而過」,保證你的首頁簡單而快速。網上有許多關於如何增加速度的文章——檢查下載速度,放棄一切顯著減慢主頁速度的資料。
4. 圖形和版面設計
圖形和版面設計關繫到對主頁的第一印象,圖象應集中反映主頁所期望傳達的主要信息。
如果有系列商業站點,你不必讓過分顯眼的動畫出現在首頁——但如果你的網站是游戲站點,動畫將是必不可少的一部分內容。
圖片是影響網頁下載速度的重要原因,根據經驗。把每頁全部內容控制在30K左右可以保證比較理想的下載時間,圖象在6—8K之間為宜,每增加2K會延長1秒鍾的下載時間。
顏色也是影響網頁的重要因素,不同的顏色對人的感覺有不同的影響,例如:
紅色和橙色使人興奮並使得心跳加速;
黃色使人聯想到陽光,是一種快活的顏色;
考慮到你希望對瀏覽者產生什麼影響,請為網頁選擇合適的顏色。
閱讀西方格式文本時,眼睛從左上方開始。逐行瀏覽到達右下方,插入圖象時不要忘記這種特性。任何具有方向性的圖片應該放置在網頁中對眼睛最重要的地方,如果在左上角放置一幅小鳥的圖片,鳥嘴應該放在把瀏覽者目光引向頁面中部的地方,而不是把視線引走。
這種思路可以用於所有圖片:
面部應該「看」網頁的中部;
汽車的「停靠」面向網頁中部;
道路、領帶等等圖片的放置都應該在有助於吸引目光從左向右、從上向下移動。
一般總是把網站導航條放置在頁面左邊,也是出於這種考慮——不斷地出現在瀏覽者的視野之中。
5. 文字的可讀性
我們仍然用廣告牌的比喻來說明,文字要在廣告牌上突出,周圍應該留有足夠的空間。也許你曾到過一些網站,要麼擁擠不堪的文字覺得好像只有把腦袋鑽進去才能閱讀,要麼深色的背景給人的感覺好象處於非常狹窄的空間里,而且讓人的心情感覺很壓抑。某些背景色的令人閱讀困難;紫色、橙色和紅色讓人眼花繚亂。
文字的顏色也很重要,不同的瀏覽器有不同的顯示效果,有些在你的瀏覽器上很漂亮的顏色在其他瀏覽器上可能無法顯示。
參考報紙的編排方式,為方便或快速閱讀將你的內容分欄設計,甚至兩欄也要比一滿頁的視覺效果要好。
另一種能夠提高文字可讀性的因素是你所選擇的字體,通用的字體(Arial, Times New Roman, Garamond and Courier)最易閱讀,特殊字體用於標題效果較好,但是不適合正文(試想瀏覽整頁的 Gothic, Script, Westminster, or Cloister會是怎樣的感受)。因為閱讀費力,你的眼睛很快就會疲勞,不得不轉移到其他頁面。
明白我的意思了嗎?
6. 網頁標題的可讀性
必須盡量使你的網頁易於閱讀,除了分欄之外(將頁面縱向分割),也需要利用標題和副標題將文檔分段。
為所有標題和副標題設置同一字體,並將標題字體加大一號,所有標題和副標題都採用粗體,這樣便於識別標題(字體加大加粗)和副標題(粗體,與正文字體大小相同),使瀏覽者一眼就可以看到要點,以便找出並繼續閱讀有興趣的內容。標題的重要性可見一斑,要認真寫好每個標題!
也可以將整句採用粗體或用不同的顏色突出某些內容,不過不要用難以閱讀的顏色。
7. 導航
由於人們習慣於從左到右、從上到下閱讀,所以主要的導航條應放置在頁面左邊,對於較長頁面來說,在最底部設置一個簡單導航也很有必要(只要兩項就夠了:主頁|頁面頂部)。
確定一種你滿意的模式之後,最好將這種模式應用到同一網站的每個頁面,這樣,瀏覽者就知道如何尋找信息。
8. 保護個人信息聲明和客戶推薦信
對於商業網站來講,最重要的事情之一是確保潛在客戶的信心,你應該明確地告訴人們,如何對其興趣、愛好,尤其個人隱私保密,很有必要專門用一個頁面詳細陳述你的保護個人信息聲明,包括對訪問者的email地址保密、如何接受定單、如何匯總信息、匯總這些信息的目的、誰可以看到這些信息等基本內容。
訪問者也想知道你的產品或服務現有客戶的反映,所以如果能引用與你關系融洽的客戶對你的積極評價,對你的可信度將很有幫助。
不要害怕向顧客索取推薦信——人們都願意自己的意見有價值。
你可以把客戶的推薦信另設計為一個網頁,作為對客戶提供推薦信的回報,在這里鏈接到客戶的網站——這也是一種「雙贏」。
9. 詞語
一個網站如果只有漂亮的外觀而詞語錯誤連篇、語法混亂,同樣是失敗的,對於網站所有者和負責人將產生很壞的影響,人們會用許多貶義詞來評價你:粗心大意、懶惰、外行、沒水平等等。
你願意把自己辛苦掙來的錢花在一個連自己的網站都馬馬虎虎的人嗎?
你可以按照上述步驟改進你的網站製作技巧;
你可以請人對你的工作進行校對、編輯;
你也可以請人為你製作網頁;
總之,上述步驟在很多方面對你會有所幫助,不要因為對某些步驟的疏忽而影響你的網站的整體效果。 1. 明確內容
如果你想成為一個網站設計者,並正想建一個網站的話,首先應該考慮網站的內容,包括網站功能和你的用戶需要什麼。你的整個設計都應該圍繞這些方面來進行。
2. 抓住用戶
如果用戶不能夠迅速地進入你的網站,或操作不便捷,網站設計就是失敗的。不要讓用戶失望而轉向你的對手的網站。
3. 優化內容
內容是核心。大約在兩年以前,企業網站就像一本廣告冊子,更槽糕的是,網站使用了大量的圖片,似乎要幾個世紀才能下載完。比如某網站在設計的某些方面是成功的,但是內容太貪乏,並且要花很長時間才能找到所要的東西,因此不能算是一個成功的網站。
4.快速下載
沒有什麼比要花很長時間下載頁面更槽糕的了。作為一條經驗,一個標準的網頁應不大於60K,通過56K數據機載入花30秒的時間。有的設計者說網頁載入應在15秒內。
5. 網站升級
時刻注意網站的運行狀況。性能很好的主機隨著訪問人數的增加,可能會運行緩慢。但是,如果你不想失去訪問者的話,一定要仔細計劃好你的升級計劃。
6. 堅持基本原則
即使你不懂HTML語言,你只需購買一個有版權的所見即所得的網頁設計工具,如Adobe PageMill 或 Microsoft FrontPage Express 或 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的潛力。如果你有大量的基於文本的文檔,應當以Adobe Acrobat格式的文件形式來放置,以便你的訪問者能離線閱讀。
17. 不要使用卷滾條
人們厭惡在網上使用卷滾條。某站是一個典型的設計很差的網站。它基於一個浮動的架構,為了閱讀所有的文本,瀏覽者不得不使用卷滾條。
18. 專家最喜愛的Web設計工具
(1). Adobe Photoshop
(2). Macromedia Flash
(3).Adobe Illustrator
(4). Adobe ImageRead
(5). Macromedia Dreamweaver
(6). Macromedia Fireworks
(7). Allaire Homesites
(8). Microsoft Notepad
(9). Macromedia Director
(10). Lightwave
(11). Macromedia Freehand
其它:Adobe Acrobat Exchange,Allaire ColdFusion,BBEdit,HTML Validator等。
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. 動畫與內容應有機結合
確保動畫和內容有關聯。它們應和網頁渾然一體,而不是乾巴巴的。動畫並不只是Macromedia Director等製作的東西的簡單堆積。
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。軟體分析工具Doctor HTML能夠幫助檢查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. 圖片與文字的協調性一個完美的網頁布局會給人一種和平舒暢的心情,它不僅僅是表現在文字的表達程度,更多的表現在圖片與文字的協調性。2. 視覺上的對比性通過不同的色彩、不同的圖形進行對比,在視覺上形成視覺的沖擊,同時在圖形也要形成對比,只有這樣才能讓人們過目不忘。3. 有松有馳網頁製作上也要講究有松有馳,不要整個網頁都是一種樣式,要適當進行留白,運用空格或是改變字體之間的間距,從而達到不一樣的變化效果。

8、網頁版面布局設計的原則是什麼?

一個好的網站必須要體現在整體的策劃、設計、布局、網站的定位、色彩搭配,最重要的是網站頁面的小細節處理。整體感覺是否符合行業的需求、符合公司的文化。有許多企業都會說我要做一個大氣的網站、實際上從專業的角度來講應該要做一個最適合你的網站,你搞機械銷售的不可能去像廣告設計公司的搞得很花哨的的,現在網站都講究簡潔,適用,用戶體驗好。網站設計中結構布局就顯得尤為重要,需要注意的以下方面:

網站的框架要簡約明了,主題思想明確,導航要設計合理,核心信息放在網站的左上側,這個地方搜索引擎爬蟲程序最感興趣先行抓取,客戶也最感興趣這里。製作網站框架要清晰,布局要合理,拒絕雜亂的代碼,拒絕大量的js腳本和flash動畫,這樣會影響網站的訪問速度,欄目設置要清晰易見,讓用戶瀏覽起來簡潔舒服。一個網站一處滾動就已經OK了。網頁布局應該遵循一個原則,即「先上後下,先左後右」原則。由於搜索引擎在執行搜索的時候,其搜索的順序跟我們瀏覽頁面的順序是一樣的,即前面說的原則。遵循這個原則有助於搜索引擎蜘蛛抓取頁面快速收錄。

由於搜索引擎爬蟲程序是直接識別頁面代碼來得到信息的。這樣製作網站的目的也就是為了讓網頁蜘蛛能夠毫不吃力地順利爬行完網頁。當然沒什麼好辦法控制搜索引擎,但有辦法改變頁面。製作網站過程中,標簽的使用也是很有講究的,通常要把握下面幾個原則:保持良好的層次框架,近似h1h2h3等標簽都應依照標簽本身的用處來使用,比方:h1標簽表示網頁主標題,且在一個網頁中只能使用一次。在部分權重較高的標簽中,合理的融入關鍵詞,如h1、strong等標簽。

css命名規則符合一定標准規范,較長名稱選擇駝峰式命名規則,如.tophead。代碼盡量做到簡潔,禁止使用代碼生成工具製作網頁。代碼在實現基本的框架、樣式、和行為分離的基礎上,還要做到可用、精簡、有序而且符合seo代碼標准規范。網站js結構選擇jquery,全部腳本盡量封裝到一個包內。網站flash調用代碼盡量要確保瀏覽器兼容性,這些結構問題都要在製作中要先行規劃。

與網頁大圖設計原則相關的知識