- Div+CSS3.0網頁布局案例精粹(升級版)
- 張曉景
- 2186字
- 2020-03-02 16:09:18
1.4 如何設計網頁
網頁設計的方向取決于設計的任務目標。網頁設計中最重要的并不是對軟件的應用,而是設計者對網頁設計的理解及其設計制作的水平,以及設計者的審美能力及其對頁面的把握。
1.4.1 網頁設計的基本原則
建立網站的目的是為瀏覽者提供所需的信息,這樣瀏覽者才會愿意光顧,網站才有真實的意義,以下是網頁設計的幾條基本原則。
1.明確主題
一個優秀的網站要有一個明確的主題,整個網站設計要圍繞這個主題進行,也就是說,在網頁設計之前要明確制作這個網站目的,所有頁面都圍繞這個目的來制作。
2.重視首頁
首頁設計得如何是整個網站成功與否的關鍵,因為首頁可以反映出網站給人的整體感覺。首頁設計效果的好壞決定了網站能否吸引訪問者。首頁最好設計得簡潔、清楚,如設計人性化的類別選項,以便讓訪問者快速找到自己想要找的東西。
3.內容分類
網站內容的分類也十分重要,可以按主題分類、按性質分類、按組織結構分類,或者按人們的思考方式分類等。不論是哪一種分類方法,都要讓訪問者很容易就能找到目標內容。
4.互動性
互動性是互聯網的特色之一。好的網站首頁必須與訪問者有良好的互動關系,包括整個設計的呈現、使用界面引導等,都應遵循互動性原則,讓訪問者感覺他的每一步操作都確實得到了恰當的回應。
5.圖像應用技巧
圖像是網站中的特色之一,它具備醒目、吸引人及傳達信息的功能,好的圖像應用可以給網頁增色,不恰當的圖像應用則會適得其反。應用圖像時一定要注意圖像下載時間的問題。
在圖像應用上,盡可能采用一般瀏覽器均支持的壓縮格式,如果需要放置大型圖像的文件,最好將圖像文件與網頁分隔開,在頁面中先顯示一個具備鏈接的縮小圖像或者說明文字,然后加上該圖像的大小說明,如此不但可以加快網頁的傳輸速度,而且可以讓瀏覽者判斷是否繼續打開放大后的圖片。
6.避免濫用技術
技術是讓人著迷的東西,許多網頁設計者喜歡使用各種各樣的網頁設計技術。好的技術應用到頁面上會使頁面更生動,給訪問者一種全新的感覺;但不恰當的技術應用到頁面上則會起到相反的效果,從而讓訪問者失去對網頁的興趣。
7.及時更新和維護
訪問者希望看到新鮮的東西,基本沒有人會對過時的信息感興趣,因此網站的信息一定要注意及時性,時刻保持新鮮感是很重要的。
1.4.2 網頁設計成功的要素
設計一個網頁,要注意以下幾個基本因素,這些因素對網頁設計的成功與否有著重要影響。
1.整體布局
網頁設計作為一種視覺語言,特別講究編排和布局,一般來說,好的網站應該干凈整潔、條理清楚、布局清晰,過多的閃爍、色彩、圖片等只能會讓訪問者無所適從。
2.信息
無論是商業站點還是個人主頁,都必須提供有一定價值的內容才能吸引訪問者,這些有價值的內容可以是信息、娛樂、對一些問題的解答、提供志趣相投者聯絡的機會、鏈接到相關的網頁等。
3.下載速度
頁面的下載速度是網站吸引訪問者的關鍵因素,如果不能在短時間內打開一個網頁,一般人就會失去耐心。所以至少應該確保頁面下載的速度盡可能快,而圖像是影響頁面下載速度的重要因素,所以圖像應該盡量小一些,這樣才可以加快頁面的下載速度。
4.圖像和版面設計
圖像和版面設計關系到瀏覽者對網站首頁的第一印象,圖像應集中反映網站所要傳達的主要信息內容。
5.文字的可讀性
能夠提高文字可讀性的主要因素是選擇的字體,通用的字體(如Arial、Times New Roman、Garamond、Courier等)最易閱讀,特殊字體用于標題效果較好,但是不適合正文。
文字的顏色也很重要,不同的瀏覽器有不同的顯示效果,有些針對某個瀏覽器設置好的字體顏色在其他瀏覽器上可能就無法顯示。
6.多媒體功能的運用
頁面可以巧妙地運用三維動畫、GIF動畫和視頻等來表現,以吸引瀏覽者的注意力。但由于網絡帶寬的限制,在使用多媒體的形式表現網頁中的內容時,需要考慮客戶端的傳輸速度。
7.導向清晰
導航設計使用超文本鏈接或圖片鏈接,可以使瀏覽者能夠在網站上自由地前進或后退,而不用使用瀏覽器上的前進或后退按鈕。
由于人們習慣于從左到右、從上到下閱讀,所以主要的導航條應放置在頁面左邊,對于較長的頁面來說,在最底部設置一個簡單導航也很有必要。確定了一種滿意的模式之后,最好將這種模式應用到同一個網站的每個頁面中,這樣更方便瀏覽者使用。
在制作網站的時候一定要細心,不要因為對某些步驟的疏忽而影響網站的整體效果。
1.4.3 網頁設計風格及色彩搭配
在一個網站中,除了要有由基本元素構成網站內容,還要對網站風格進行設計及對網站頁面進行合理的色彩搭配。
1.確定網站的整體風格
風格是抽象的,是指站點的整體形象給瀏覽者的綜合感受。這個整體形象包括站點的CI(標志、色彩、字體、標語)、版面布局、瀏覽方式、交互性、文字、語氣、內容價值、存在意義、站點榮譽等諸多因素。
2.網頁色彩的搭配
無論是在平面設計中,還是在網頁設計中,色彩搭配永遠是最重要的一環。當距離顯示屏較遠的時候,人們看到的不是優美的版式或美麗的圖片,而是網頁的色彩。
(1)單色搭配:使用一種色彩,即先選定一種顏色,然后調整透明度或飽和度。這樣可以使頁面看起來顏色統一,有層次感。
(2)對比搭配:使用兩種色彩,即先選定一種顏色,然后選擇它的對比色。
(3)同色搭配:使用同色系的色彩,如天藍、海藍、深藍,或者橘黃、褐色、土黃。
提示:
在網頁配色中,還要注意:
不要將所有顏色都用到,盡量控制在3~5種色彩。
背景和文字的顏色對比要盡量明顯(絕對不要用花紋繁復的圖案作背景),以便突出主要文字內容。
- 短視頻創作(微課版)
- 在你身邊,為你設計:騰訊的用戶體驗設計之道(第二版)
- 影視特效鏡頭跟蹤技術精粹(第2版)
- Photoshop CS6中文版完全學習手冊
- AI設計:Midjourney繪畫設計教程
- Premiere Pro 2021從入門到精通
- ADOBE PREMIERE PRO CS6標準培訓教材
- 我的第一本Photoshop CS5圖像處理書
- 數字圖像處理與分析基礎:MATLAB和VC++實現
- 短視頻編導全能手:選題策劃+腳本文案+拍攝剪輯+包裝運營
- 創意的Photoshop CS6設計之路
- AutoCAD完全學習手冊(2012中文版)
- 3ds Max 2014火星課堂
- 平面設計基礎與應用教程(Photoshop CS5+CorelDRAW X5)
- 剪映高手5項核心修煉:蒙版+關鍵幀+摳圖+自定義變速+高難度卡點