最簡(jiǎn)易的多媒體網(wǎng)頁(yè)設(shè)計(jì)

最簡(jiǎn)易的多媒體網(wǎng)頁(yè)設(shè)計(jì)多媒體網(wǎng)頁(yè)設(shè)計(jì)

WorldWideWeb的構(gòu)成HTTP協(xié)議就是超文本傳輸協(xié)議（HypertextTransferProtocol）HTML語(yǔ)言就是超文本標(biāo)記語(yǔ)言（HypertextMarkupLanguage）網(wǎng)頁(yè)和站點(diǎn)的區(qū)別一個(gè)單獨(dú)的“*.htm”文件叫做網(wǎng)頁(yè)，而一個(gè)單位，甚至一個(gè)個(gè)人的信息都需要幾個(gè)，十幾個(gè)，幾十個(gè)甚至更多的超文本文件構(gòu)成，這就構(gòu)成了站點(diǎn)建設(shè)一個(gè)站點(diǎn)，需要從一開(kāi)始就明確站點(diǎn)的目標(biāo)，規(guī)劃站點(diǎn)的主要構(gòu)成部分及各部分的功能和風(fēng)格，接下來(lái)是具體各個(gè)部分的制作，最重要的是對(duì)完成的站點(diǎn)進(jìn)行維護(hù)和排錯(cuò)以及更新.因此建設(shè)一個(gè)站點(diǎn)比制作一個(gè)網(wǎng)頁(yè)需要更加專(zhuān)業(yè)的知識(shí)網(wǎng)站制作流程收集信息3周設(shè)計(jì)草案3-4天制作設(shè)計(jì)手冊(cè)

網(wǎng)站結(jié)構(gòu)

頁(yè)面結(jié)構(gòu)

色彩

預(yù)算制作頁(yè)面1周調(diào)試2周發(fā)布跟蹤半年2周網(wǎng)頁(yè)的分類(lèi)普通網(wǎng)頁(yè)動(dòng)畫(huà)網(wǎng)頁(yè)表單網(wǎng)頁(yè)帶語(yǔ)音上傳的BBS網(wǎng)頁(yè)有程序運(yùn)算功能的網(wǎng)頁(yè)以下介紹一些當(dāng)前熱門(mén)的多媒體網(wǎng)站制作技術(shù)。

MIDI音樂(lè)：是多媒體音樂(lè)最早的技術(shù)，文件大小平均在10KB～20KB。在線(xiàn)游戲與動(dòng)畫(huà)的制作DIRECTOR在線(xiàn)教學(xué)制作AUTHORWAREFASH動(dòng)畫(huà)，基于矢量圖形可交互的動(dòng)畫(huà)WAV音頻文件：也是多媒體最早的技術(shù)，缺點(diǎn)是文件通常在100KB以上，不過(guò)也有一些轉(zhuǎn)換技巧可以將WAV文件轉(zhuǎn)換為其他格式的文件，從而減小文件的大小。QuickTime電影文件：此格式以″.mov″為擴(kuò)展名，最早由美國(guó)蘋(píng)果電腦開(kāi)發(fā)。MPEG電影文件：以″.mpg″為擴(kuò)展名，是美國(guó)電腦廠商開(kāi)發(fā)的電影文件壓縮技術(shù)。AVI電影文件：Microsoft開(kāi)發(fā)的動(dòng)畫(huà)文件，擴(kuò)展名為″.avi″。以上三種電影文件格式缺點(diǎn)是文件較大，通常在100KB～500KB以上。GIF動(dòng)畫(huà)：是多媒體網(wǎng)頁(yè)動(dòng)畫(huà)最早最簡(jiǎn)單的制作技巧，文件大小在20KB～50KB左右。JAVA動(dòng)畫(huà)制作：用JAVA小應(yīng)用程序（Applet）可制作有動(dòng)畫(huà)效果的圖形或網(wǎng)頁(yè)。ActiveXControl：Microsoft所開(kāi)發(fā)的技術(shù)，能使網(wǎng)頁(yè)具有特殊的功能或動(dòng)畫(huà)效果。VBScript:Microsoft開(kāi)發(fā)，基本而言是屬于VisualBasic程序語(yǔ)言的一部分。VRML3D動(dòng)畫(huà)：也是當(dāng)前最新開(kāi)發(fā)出來(lái)的立體動(dòng)畫(huà)技術(shù)，如果你的瀏覽器安裝了VRML文件播放程序，可直接下載VRML文件在瀏覽器內(nèi)查看。HTML語(yǔ)言介紹HTML語(yǔ)言介紹要查看網(wǎng)頁(yè)內(nèi)容，必須使用網(wǎng)頁(yè)瀏覽器，瀏覽器的主要作用就是解釋超文本文件中的語(yǔ)言，將單調(diào)乏味的文字顯示為豐富多彩的內(nèi)容。目前最為流行的瀏覽器有MicrosoftInternetExplorer以及NetscapeCommunicator，我們建議您使用MicrosoftInternetExplorer，它性能優(yōu)秀，不僅有中文版本，而且還是的，其最新版本為5.0。同其他語(yǔ)言（例如C）編譯產(chǎn)生執(zhí)行文件的機(jī)制不同，利用HTML編寫(xiě)的網(wǎng)頁(yè)是解釋型的，也就是說(shuō)，網(wǎng)頁(yè)的效果是用瀏覽器打開(kāi)網(wǎng)頁(yè)時(shí)動(dòng)態(tài)生成，而不是事先存儲(chǔ)于網(wǎng)頁(yè)中的。當(dāng)用瀏覽器打開(kāi)網(wǎng)頁(yè)時(shí)，瀏覽器讀取網(wǎng)頁(yè)中HTML的代碼，分析其語(yǔ)法結(jié)構(gòu)，然后根據(jù)解釋的結(jié)果顯示網(wǎng)頁(yè)內(nèi)容，正是因?yàn)槿绱?，網(wǎng)頁(yè)顯示的速度同網(wǎng)頁(yè)代碼的質(zhì)量有很大的關(guān)系，保持精簡(jiǎn)和高效的HTML源代碼是非常重要的。

網(wǎng)頁(yè)色彩的搭配

無(wú)論是平面設(shè)計(jì)，還是網(wǎng)頁(yè)設(shè)計(jì)，色彩永遠(yuǎn)是最重要的一環(huán)。當(dāng)我們距離顯示屏較遠(yuǎn)的時(shí)候，我們看到的不是優(yōu)美的版式或者是美麗的圖片，而是網(wǎng)頁(yè)的色彩。

關(guān)于色彩的原理有許多，在此我們不可能一一闡述，大家可以看看相關(guān)設(shè)計(jì)書(shū)籍，有利于系統(tǒng)地理解。在此我們僅僅想告訴大家一些網(wǎng)頁(yè)配色時(shí)的小技巧。

1．用一種色彩。這里是指先選定一種色彩，然后調(diào)整透明度或者飽和度，(說(shuō)得通俗些就是將色彩變淡或則加深)，產(chǎn)生新的色彩，用于網(wǎng)頁(yè)。這樣的頁(yè)面看起來(lái)色彩統(tǒng)一，有層次感。

2．用兩種色彩。先選定一種色彩，然后選擇它的對(duì)比色。

3．用一個(gè)色系。簡(jiǎn)單的說(shuō)就是用一個(gè)感覺(jué)的色彩，例如淡藍(lán)，淡黃，淡綠；或者土黃，土灰，土藍(lán)。

在網(wǎng)頁(yè)配色中，還要切記一些誤區(qū)：

1．不要將所有顏色都用到，盡量控制在三種色彩以?xún)?nèi)。

2．背景和前文的對(duì)比盡量要大，(絕對(duì)不要用花紋繁復(fù)的圖案作背景)，以便突出主要文字內(nèi)容。色彩的運(yùn)用在網(wǎng)頁(yè)中的作用真是太重要了，有些網(wǎng)頁(yè)看上去十分典雅、有品位，令人

賞心悅目，但是頁(yè)面結(jié)構(gòu)卻很簡(jiǎn)單、圖象也不復(fù)雜，這主要是色彩運(yùn)用得當(dāng)，因此我特地

將本來(lái)屬于圖象制作內(nèi)的色彩作為一個(gè)獨(dú)立攔目來(lái)介紹。

1、色彩基本概念

自然界中的顏色可以分為非彩色和彩色兩大類(lèi)。非彩色指黑色、白色和各種深淺不一

的灰色，而其他所有顏色均屬于彩色。任何一種彩色具有三個(gè)屬性：

(1)色相(Hue)：

也叫色澤，是顏色的基本特征，反映顏色的基本面貌。

(2)飽和度(Saturation)：

也叫純度，指顏色的純潔程度。

(3)明度(Brightness或Lightness或Luminousity)：

也叫亮度，體現(xiàn)顏色的深淺。

非彩色只有明度特征，沒(méi)有色相和飽和度的區(qū)別。

2、色彩的三原色

電腦屏幕的色彩是由RGB（紅、綠、藍(lán)）三種色光所合成的，而我們可通過(guò)調(diào)整這三

個(gè)基色就可以調(diào)校出其它的顏色，在許多圖像處理軟件里，都有提供色彩調(diào)配功能，你可

輸入三基色的數(shù)值來(lái)調(diào)配顏色，也可直接根據(jù)軟件提供的調(diào)色板來(lái)選擇顏色。

3、電腦影像的色彩

電腦影像的色彩是經(jīng)由位元（BIT）的計(jì)算和組合而來(lái)，單純的黑白圖像是最簡(jiǎn)單的

色彩結(jié)構(gòu)，在電腦上用到１位元的資料，雖說(shuō)只有黑色和白色，但仍能透過(guò)疏密的矩陣排

列，將黑與白組合成近似視覺(jué)上的灰色調(diào)階。

灰階（Grayscale）的影像共有256個(gè)階調(diào)，看起來(lái)類(lèi)似傳統(tǒng)的黑白照片；除黑、白二

色之外，尚有254種深淺的灰色，電腦必須以8位元的資料，顯示這256種階調(diào)。

全彩（Fullcolor）是指RGB三色光所能顯示的所有顏色，每一色光以8位元表示，各有

256種階調(diào)，三色光交互增減，就能顯示24BIT的1677萬(wàn)色（256*256*256=16,777，2

16），這個(gè)數(shù)值就是電腦所能表示的最高色彩，也就是通稱(chēng)的RGBTureColor。

8位元色是指具有256種階調(diào)，或256種色彩的影像，而我們?cè)诔３Ｒ?jiàn)到GIF格式的圖

象文件就是帶有256種色彩的圖象文件。若要把24位元的全彩圖片轉(zhuǎn)成256色的8位元，通

常必須經(jīng)過(guò)索引的步驟（Indexed），也就是在原本24位元的1677萬(wàn)色中，先建立顏色分

布表（histogram），然后再找出最常用的256種顏色，定義出新的調(diào)色盤(pán)，最后再以新色

盤(pán)的256色取代原圖。

每一位元色包含多少種顏色：

1位2種顏色

2位4種顏色

4位16種顏色

8位256種顏色

16位65536種顏色

24位1677萬(wàn)種顏色

32位1677萬(wàn)種顏色和256級(jí)灰度值

36位687億種顏色和4096級(jí)灰度值

通常所稱(chēng)的標(biāo)準(zhǔn)VGA顯示模式是8位顯示模式，即在該模式下能顯示256種顏色；而

高彩色（HiColor）顯示是16位顯示模式，能顯示65536種顏色，也稱(chēng)64K色；還有一

種真彩色（TrueColor）顯示模式是24位顯示模式，能顯示1677萬(wàn)種顏色，也稱(chēng)16M色

，這是現(xiàn)在一般PC機(jī)所能達(dá)到的最高顏色顯示模式，在該模式下看到的真彩色圖象的

色彩已和高清晰度照片沒(méi)什么差別了。

在圖形制作片中我們已提到過(guò)色彩在頁(yè)面中的重要性，在頁(yè)面中盡量使用看上去比較

淡雅、簡(jiǎn)潔的色彩；比如背景盡量少用灰暗、深沉的色彩（除非特殊需要），并且根

頁(yè)面的主題來(lái)選擇主色調(diào)，可能有一些不搞美術(shù)的朋友不知道色彩代表的含義，請(qǐng)參

閱下表：

紅色：代表熱情、奔放、喜悅、慶典

黑色：代表嚴(yán)肅、夜晚、沉著；

黃色：代表高貴、富有

白色：代表純潔、簡(jiǎn)單

藍(lán)色：代表天空、清爽

綠色：代表植物、生命、生機(jī)

灰色：代表陰暗、消極

紫色：代表浪漫、愛(ài)情

棕色：代表土地

上面舉出的是幾種主要色彩的含義，希望對(duì)你有所幫助。常見(jiàn)的web圖像類(lèi)型

JPG/JPEG有損壓縮算法文件較小支持24位真彩色(16777216),在特別重視色彩的情況下使用.GIF無(wú)損壓縮算法只支持8位彩色(256)適合用于卡通或?qū)︻伾珨?shù)目要求不高的圖像.在網(wǎng)絡(luò)上流行是它支持動(dòng)畫(huà);支持透明,有版本之分,GIF87A,GIF89A.只有后者支持動(dòng)畫(huà)和透明.PNG非常靈活的圖像格式采用類(lèi)似GIF的無(wú)損壓縮算法也支持JPG有損壓縮算法支持多種顏色數(shù)目(8-16-24-32)只有較高版本的瀏覽器支持(IE4.0Netscape4.0)以上支持。（實(shí)例操作圖像格式的轉(zhuǎn)換）常見(jiàn)標(biāo)志廣告尺寸468*60完全標(biāo)志392*72垂直導(dǎo)航條234*60一半標(biāo)志125*125方形按鈕88*31微型按鈕120*90按鈕120*60按鈕120*240