網(wǎng)頁制作_網(wǎng)頁版面布局設(shè)計(jì)課件.ppt

《網(wǎng)頁制作_網(wǎng)頁版面布局設(shè)計(jì)課件.ppt》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。

1、網(wǎng)頁版面布局設(shè)計(jì)信息技術(shù)學(xué)院鄭義網(wǎng)站內(nèi)容的規(guī)劃與腳本編寫目前，全世界的網(wǎng)站總數(shù)已經(jīng)超過了6000萬個(gè)，如何使自己的網(wǎng)站能夠在眾多的網(wǎng)站中脫穎而出，令人刮目相看，關(guān)鍵是提升網(wǎng)站的知名度和訪問率，而對網(wǎng)站內(nèi)容進(jìn)行詳細(xì)的規(guī)劃和注重網(wǎng)絡(luò)應(yīng)用則是提高網(wǎng)站訪問率的重要因素。從最新的網(wǎng)絡(luò)統(tǒng)計(jì)分析報(bào)告中得知，網(wǎng)站訪問率的78%來自于搜索引擎，而網(wǎng)站在搜索引擎中的排名與網(wǎng)站的內(nèi)容有很大的關(guān)系。網(wǎng)站內(nèi)容規(guī)劃是進(jìn)行網(wǎng)頁設(shè)計(jì)的第一步，寫好內(nèi)容腳本是十分關(guān)鍵的。下面我們分別對“.com”、“.net”、“.edu”、“.gov”為后綴的網(wǎng)站進(jìn)行分析，學(xué)會(huì)網(wǎng)站腳本的編寫。教育科研網(wǎng)站的規(guī)劃教育科研網(wǎng)站是指那些

2、針對特定的人群，圍繞特定的學(xué)習(xí)主題、教科研主題、學(xué)習(xí)素材類事物主題，完成特定信息的搜索和提供、組織與發(fā)布，或者提供互動(dòng)學(xué)習(xí)平臺(tái)的教育類網(wǎng)站，其最高層域名一般為“.edu”。教育科研網(wǎng)站的內(nèi)容主要是圍繞教學(xué)和科研來進(jìn)行的，突出教師和學(xué)生的地位，據(jù)此畫出具體的信息結(jié)構(gòu)圖。政府網(wǎng)站的規(guī)劃政府網(wǎng)站是指以政府機(jī)構(gòu)為主體構(gòu)建的網(wǎng)站，主要為政府稅收和政府公共服務(wù)提供網(wǎng)絡(luò)化的交流平臺(tái)，并且通過網(wǎng)絡(luò)增加政府與百姓交流的渠道，聽取百姓的心聲和意見，提高政府機(jī)關(guān)的辦事效率。其最高層域名一般為“.gov”。政府機(jī)關(guān)網(wǎng)站的內(nèi)容主要從省市概況、政府管理、政府監(jiān)督、便民服務(wù)等幾個(gè)方面來進(jìn)行設(shè)計(jì)，據(jù)此畫出具體的信

3、息結(jié)構(gòu)圖腳本。企業(yè)機(jī)構(gòu)網(wǎng)站的規(guī)劃企業(yè)機(jī)構(gòu)網(wǎng)站是指以企業(yè)單位為主體而構(gòu)建的網(wǎng)站，其目的是為了利用網(wǎng)絡(luò)宣傳企業(yè)形象，展示企業(yè)文化，推銷企業(yè)產(chǎn)品，拓寬企業(yè)的營銷渠道。其最高層域名一般為“.com”。企業(yè)機(jī)構(gòu)網(wǎng)站的內(nèi)容一般從企業(yè)介紹、產(chǎn)品展示、售后服務(wù)等方面來進(jìn)行設(shè)計(jì)，參照若干企業(yè)網(wǎng)站畫出企業(yè)網(wǎng)站的內(nèi)容結(jié)構(gòu)圖。服務(wù)機(jī)構(gòu)網(wǎng)站的規(guī)劃服務(wù)機(jī)構(gòu)網(wǎng)站是指以服務(wù)機(jī)構(gòu)為主體構(gòu)建的網(wǎng)站，包括商業(yè)服務(wù)機(jī)構(gòu)網(wǎng)站、金融服務(wù)機(jī)構(gòu)網(wǎng)站、郵政通信服務(wù)機(jī)構(gòu)網(wǎng)站、家政服務(wù)機(jī)構(gòu)網(wǎng)站、休閑娛樂服務(wù)機(jī)構(gòu)網(wǎng)站、行業(yè)機(jī)構(gòu)網(wǎng)站等。其最高層域名一般為“.net”，少數(shù)為“.com”。服務(wù)機(jī)構(gòu)網(wǎng)站的內(nèi)容主要從ISP因特網(wǎng)內(nèi)容接入服務(wù)、I

4、CP因特網(wǎng)內(nèi)容提供服務(wù)、ASP因特網(wǎng)內(nèi)容應(yīng)用服務(wù)這三個(gè)方面來進(jìn)行設(shè)計(jì)，據(jù)此畫出具體的信息結(jié)構(gòu)圖腳本。網(wǎng)頁版面布局設(shè)計(jì)版面指的是從瀏覽器看到的完整的一個(gè)頁面（可以包含框架和層）。由于不同的瀏覽者所擁有的顯示器的分辨率不一致，所以在設(shè)計(jì)網(wǎng)頁的時(shí)候要考慮到瀏覽者的實(shí)際情況。目前常見的網(wǎng)頁所采用的分辨率有：640*480像素、800*600像素、1024*768像素等。網(wǎng)頁布局以最適合瀏覽的方式將圖片和文字?jǐn)[放在頁面的不同位置。網(wǎng)頁布局的基本原理是共通的，只要領(lǐng)會(huì)要點(diǎn)，就能夠舉一反三。創(chuàng)作階段——打草稿新建的頁面就像一張白紙，沒有任何表格、框架和約定俗成的東西，我們可以任意發(fā)揮自己的想象力

5、，把想到的“景象”畫上去（建議用一張白紙和一支鉛筆，當(dāng)然用圖像處理軟件FireworksMX等也可以）。這屬于創(chuàng)作階段，不講究細(xì)膩工整，不必考慮細(xì)節(jié)功能，只以粗略的線條勾畫出創(chuàng)意的輪廓即可。盡可能多畫幾張，最后選定一個(gè)滿意的作為繼續(xù)創(chuàng)作的腳本。布局的草稿粗略布局在草稿的基礎(chǔ)上將確定需要放置的功能模塊安排到頁面上。遵循突出重點(diǎn)、平衡諧調(diào)的原則，將網(wǎng)站標(biāo)志、主菜單等最重要的模塊放在最顯眼、最突出的位置上，然后再考慮次要模塊的排放。一般情況下，將網(wǎng)站的LOGO、導(dǎo)航條等元素放在屏幕左邊顯眼的位置上，訪問者在瀏覽網(wǎng)頁時(shí)可以對網(wǎng)站內(nèi)容一目了然?！靶腔鹁W(wǎng)”首頁的粗略布局圖最終定案將粗略布局精細(xì)

6、化，具體化。憑借智慧和經(jīng)驗(yàn)，多方聯(lián)想，才能做出具有創(chuàng)意的布局?！靶腔鹁W(wǎng)”首頁的最終定案圖網(wǎng)頁版面布局的原則（1）正常平衡––––亦稱“勻稱”，多指左右、上下對照形式，主要強(qiáng)調(diào)秩序，能達(dá)到安定誠實(shí)、信賴的效果。（2）異常平衡––––即非對照形式，但也要平衡和韻律，當(dāng)然都是不均整的，此種布局能達(dá)到強(qiáng)調(diào)性、不安性、高注目性的效果。網(wǎng)頁版面布局的原則（3）對比––––所謂對比，不僅利用色彩、色調(diào)等技巧來進(jìn)行表現(xiàn)，在內(nèi)容上也可涉及古與今、新與舊、貧與富等對比。（4）凝視––––所謂凝視是利用頁面中人物視線，使瀏覽者仿照跟隨的心理，以達(dá)到注視頁面的效果，一般多用明星凝視狀。網(wǎng)頁版面布局的原則（

7、5）空白––––空白有兩種作用，一方面對其他網(wǎng)站表示突出卓越，另一方面也表示網(wǎng)頁品位的優(yōu)越感，這種表現(xiàn)方法對體現(xiàn)網(wǎng)頁的格調(diào)十分有效。（6）盡量用圖片解說––––此方法對不能用語言說服、或用語言無法表達(dá)的情感，特別有效。圖片解說的內(nèi)容，可以傳達(dá)給瀏覽者更多的信息。網(wǎng)頁版面布局的樣式就像傳統(tǒng)的報(bào)刊雜志一樣，我們可以將頁面看作一張報(bào)紙或一本雜志中的一頁來進(jìn)行排版布局。設(shè)計(jì)版面時(shí)要把文字、圖片、空白當(dāng)作一個(gè)整體來看待，采用平面分割的方式，調(diào)動(dòng)全部面積來構(gòu)建這個(gè)版面。下面我們來