圖像處理技術(shù)在網(wǎng)頁(yè)制作中的應(yīng)用分析

羅菁晶++韓寶安

摘 要：隨著社會(huì)經(jīng)濟(jì)的高速發(fā)展，網(wǎng)絡(luò)科技也得到了長(zhǎng)足的發(fā)展，現(xiàn)如今無(wú)論是教育領(lǐng)域，還是經(jīng)濟(jì)領(lǐng)域都離不開(kāi)網(wǎng)站的支持，因此網(wǎng)頁(yè)制作技術(shù)也得到了廣泛關(guān)注，而圖像處理技術(shù)就是其中的重要應(yīng)用技術(shù)之一。文章基于圖像處理技術(shù)的概念及應(yīng)用優(yōu)勢(shì)，對(duì)其在網(wǎng)頁(yè)制作中的應(yīng)用進(jìn)行了深入分析，以供參考借鑒。

關(guān)鍵詞：圖像處理技術(shù)；網(wǎng)頁(yè)制作；技術(shù)應(yīng)用

網(wǎng)頁(yè)制作技術(shù)主要由圖像處理技術(shù)和編程技術(shù)構(gòu)成，這兩種技術(shù)相互配合共同為網(wǎng)頁(yè)提供了強(qiáng)大的技術(shù)支持，但隨著人們審美水平的不斷提高，對(duì)網(wǎng)頁(yè)的整體美感也提出了更高的要求。因此，網(wǎng)頁(yè)設(shè)計(jì)者應(yīng)提高對(duì)圖像處理技術(shù)的重視程度，提升網(wǎng)頁(yè)設(shè)計(jì)的協(xié)調(diào)性和美感度，從而更好地滿足大眾的網(wǎng)頁(yè)瀏覽需求。

1 圖像處理技術(shù)的概念及應(yīng)用優(yōu)勢(shì)

1.1 概念

圖像處理技術(shù)指的是通過(guò)應(yīng)用專業(yè)的圖像處理軟件或手段優(yōu)化圖像信息，以滿足用戶的實(shí)際需求，在圖像處理過(guò)程中，網(wǎng)頁(yè)制作者所要考慮的因素很多，主要包括有圖層、色彩以及格式等，其后根據(jù)實(shí)際的要求對(duì)圖片進(jìn)行壓縮、分割、疊片或編碼處理，最大限度地改善圖像質(zhì)量，以達(dá)到預(yù)期的網(wǎng)站圖片要求[1]。

圖像處理技術(shù)主要是基于專業(yè)的圖像處理軟件，其中以PhotoShop（簡(jiǎn)稱為PS）和CoreIDRAM為代表。通過(guò)運(yùn)用圖像處理軟件，以滿足當(dāng)前網(wǎng)站用戶的視覺(jué)需求和情感需要，使用戶能在最短時(shí)間內(nèi)獲取自己所需的信息。根據(jù)相關(guān)資料顯示，現(xiàn)今人們?cè)谶M(jìn)行網(wǎng)站瀏覽時(shí)，更愿意選擇版式合理且圖文并茂的網(wǎng)頁(yè)，而且網(wǎng)頁(yè)的圖像質(zhì)量越好，人們?cè)谠摼W(wǎng)頁(yè)的停留時(shí)間也就越長(zhǎng)。由此可見(jiàn)，合理應(yīng)用圖像處理技術(shù)，對(duì)于提升網(wǎng)站設(shè)計(jì)感和增大網(wǎng)站瀏覽量都具有十分積極的作用。

1.2 應(yīng)用優(yōu)勢(shì)

圖像處理技術(shù)具有十分強(qiáng)大的功能，在網(wǎng)頁(yè)制作中的應(yīng)用優(yōu)勢(shì)主要表現(xiàn)在以下幾個(gè)方面：（1）調(diào)整網(wǎng)頁(yè)的整體布局規(guī)劃，并對(duì)其中的圖片進(jìn)行優(yōu)化處理，提升網(wǎng)頁(yè)的制作水平，并利用高質(zhì)量的圖像提高網(wǎng)站的吸引力，增大網(wǎng)頁(yè)的訪問(wèn)瀏覽量；（2）通過(guò)圖像處理技術(shù)處理后的圖片能最大限度地滿足網(wǎng)站的運(yùn)行要求，極大地避免了因圖像質(zhì)量不規(guī)范而對(duì)網(wǎng)站運(yùn)行造成阻礙現(xiàn)象的出現(xiàn)，以此來(lái)保證網(wǎng)絡(luò)運(yùn)行的穩(wěn)定性；（3）提高了圖片下載速度，當(dāng)用戶在瀏覽圖片時(shí)，只有高質(zhì)量的圖片才能保證網(wǎng)頁(yè)運(yùn)行暢通，從而不僅可以快速下載圖片以滿足用戶的訪問(wèn)要求，也大大提升了用戶的操作體驗(yàn)，為網(wǎng)站奠定良好的用戶基礎(chǔ)。

2 網(wǎng)頁(yè)制作中的構(gòu)圖設(shè)計(jì)分析

在網(wǎng)頁(yè)制作環(huán)節(jié)，構(gòu)圖設(shè)計(jì)是其中最為關(guān)鍵的環(huán)節(jié)之一，其需根據(jù)網(wǎng)頁(yè)的風(fēng)格、類型以及主要用戶群體等因素來(lái)決定，通過(guò)構(gòu)圖設(shè)計(jì)能有效實(shí)現(xiàn)欄目設(shè)置的準(zhǔn)確性和合理性，充分展現(xiàn)網(wǎng)頁(yè)內(nèi)容，以達(dá)到凸顯網(wǎng)站主題的設(shè)計(jì)目的。目前，網(wǎng)頁(yè)構(gòu)圖大致分為3種類型，分別是水平式、垂直式以及中心式。首先，水平式，即網(wǎng)頁(yè)各元素依照水平方向進(jìn)行排列，該種構(gòu)圖方式所呈現(xiàn)出來(lái)的感覺(jué)較為莊重，極大符合了大眾的審美需求，水平式構(gòu)圖一般應(yīng)用于政府、學(xué)校或者企業(yè)等網(wǎng)站的設(shè)計(jì)中，在設(shè)計(jì)過(guò)程中應(yīng)注意合理運(yùn)用色彩，以避免網(wǎng)頁(yè)過(guò)于單調(diào)；其次，垂直式，即網(wǎng)頁(yè)各元素依照垂直方向進(jìn)行排列，該種構(gòu)圖方式不僅滿足了人們的視覺(jué)要求，也能使網(wǎng)頁(yè)的布局規(guī)劃更有次序，一般應(yīng)用于廣告設(shè)計(jì)中；最后，中心式，即將網(wǎng)站的重點(diǎn)元素集中于網(wǎng)站的中心位置，以達(dá)到凸顯重點(diǎn)的目的，同時(shí)也能使網(wǎng)頁(yè)具有更強(qiáng)的視覺(jué)沖擊效果。

此外，在網(wǎng)頁(yè)的構(gòu)圖設(shè)計(jì)中，也應(yīng)注重色彩的搭配。雖然色彩本身并不具備感情色彩，但是由于人的主觀印象為其賦予了感情色彩，因而不同的色彩搭配就會(huì)引發(fā)人們不同的情感變化。在色彩搭配過(guò)程中，設(shè)計(jì)者應(yīng)根據(jù)實(shí)際的設(shè)計(jì)要求和空間安排來(lái)進(jìn)行選擇和搭配。一般情況下，一個(gè)網(wǎng)頁(yè)所應(yīng)用的標(biāo)準(zhǔn)色彩不應(yīng)超過(guò)3種之上，這是因?yàn)闃?biāo)準(zhǔn)色彩所代表的是這個(gè)網(wǎng)站的外在形象和內(nèi)在涵養(yǎng)，因而需要進(jìn)行科學(xué)合理的協(xié)調(diào)和統(tǒng)一，而其他的色彩只為了起到點(diǎn)綴裝飾作用，因此，在進(jìn)行網(wǎng)站的色彩搭配時(shí)，網(wǎng)站制作者應(yīng)依據(jù)網(wǎng)頁(yè)最終所要呈現(xiàn)的主題、內(nèi)容以及效果進(jìn)行搭配，在確定網(wǎng)站主色調(diào)之后，制作者應(yīng)在色相環(huán)中進(jìn)行對(duì)比色、相似色以及補(bǔ)色等的搭配，這是因?yàn)榫W(wǎng)頁(yè)中的色差越小，則呈現(xiàn)效果就會(huì)更好，整體色彩搭配也會(huì)越和諧。所以，在進(jìn)行網(wǎng)頁(yè)調(diào)色時(shí)，網(wǎng)站制作者應(yīng)首先確定網(wǎng)頁(yè)的主打色調(diào)，其后通過(guò)調(diào)整透明度的設(shè)置，以此來(lái)協(xié)調(diào)統(tǒng)一頁(yè)面中的色彩，同時(shí)也應(yīng)注意借助輔助色彩，以達(dá)到渲染氣氛的作用，最后可增添點(diǎn)睛色彩，以讓頁(yè)面的色差更為鮮明。

3 圖像處理技術(shù)在網(wǎng)頁(yè)制作中的應(yīng)用

重點(diǎn)以PS技術(shù)為例，對(duì)其在網(wǎng)頁(yè)制作中的應(yīng)用進(jìn)行深入分析，主要包括網(wǎng)頁(yè)的布局規(guī)劃、動(dòng)畫設(shè)計(jì)以及特效設(shè)計(jì)這3個(gè)方面，以此來(lái)顯示PS技術(shù)在網(wǎng)站圖像處理上的重要作用。

3.1 網(wǎng)頁(yè)布局規(guī)劃

布局規(guī)劃在網(wǎng)頁(yè)的整體制作中起到的是安排和調(diào)節(jié)作用，可以說(shuō)，布局規(guī)劃的合理性直接決定了網(wǎng)站整體協(xié)調(diào)性和設(shè)計(jì)感的呈現(xiàn)，因此在進(jìn)行網(wǎng)頁(yè)布局規(guī)劃時(shí)，必須滿足標(biāo)準(zhǔn)性和規(guī)范性的要求，只有這樣才能有效提高網(wǎng)站的瀏覽量；在進(jìn)行網(wǎng)頁(yè)的布局規(guī)劃時(shí)，網(wǎng)站制作者應(yīng)首先提前與客戶進(jìn)行有效的溝通與交流，了解他們的實(shí)際需求，其后利用PS圖像處理技術(shù)架構(gòu)網(wǎng)頁(yè)的整體布局，以避免出現(xiàn)因規(guī)劃不合理或不符合客戶要求而使得后期需反復(fù)修改的情況出現(xiàn)。例如，在網(wǎng)站規(guī)劃時(shí)期，客戶首先向網(wǎng)站制作者說(shuō)明自身較為偏向的網(wǎng)站制作風(fēng)格，并為制作者指明大致的規(guī)劃方向，同時(shí)也可提出個(gè)人的設(shè)計(jì)要求，其后，針對(duì)客戶所提出的相關(guān)要求，網(wǎng)站制作者利用PS圖像處理技術(shù)構(gòu)建出網(wǎng)站布局的基本框架并及時(shí)反饋給客戶，然后客戶針對(duì)布局設(shè)計(jì)提出自己的修改建議，接著，網(wǎng)站制作者依據(jù)客戶的修改意見(jiàn)，利用預(yù)先保存的PSD文件進(jìn)行網(wǎng)頁(yè)布局的調(diào)整，幾次反復(fù)之后，網(wǎng)站制作者與客戶達(dá)成意見(jiàn)統(tǒng)一，最后，網(wǎng)站制作者將經(jīng)過(guò)多次PS圖像處理技術(shù)修改后的網(wǎng)站布局投入制作環(huán)節(jié)。通過(guò)應(yīng)用PS圖像處理技術(shù)，可有效提高網(wǎng)頁(yè)布局和修改的質(zhì)量和效率，避免出現(xiàn)返工現(xiàn)象，從而保證了網(wǎng)頁(yè)的優(yōu)化設(shè)計(jì)。

3.2 網(wǎng)頁(yè)動(dòng)畫設(shè)計(jì)

在網(wǎng)頁(yè)制作中，動(dòng)畫設(shè)計(jì)是一項(xiàng)較為特殊的設(shè)計(jì)需求，即客戶要求網(wǎng)站制作者將一些視頻資料放置于網(wǎng)頁(yè)之上，但由于客戶所提供的原始視頻往往不能適應(yīng)網(wǎng)頁(yè)的規(guī)劃要求，因此，制作者必須利用PS圖像處理技術(shù)對(duì)其進(jìn)行加工處理，以此來(lái)改善視頻質(zhì)量，實(shí)現(xiàn)其與網(wǎng)站的兼容。例如，客戶為了增加網(wǎng)站的動(dòng)態(tài)效果，向網(wǎng)站制作者提供了相關(guān)的制作圖片材料，要求制作者利用這些素材制作相關(guān)主題的Flash動(dòng)畫并插入網(wǎng)站之中，但由于客戶所提供的原始素材在尺寸、色彩度以及分辨率等方面都存在著較大差異，因此，網(wǎng)站制作者就必須利用PS圖像處理技術(shù)對(duì)圖片進(jìn)行加工處理，使其在尺寸和格式上實(shí)現(xiàn)統(tǒng)一，以此來(lái)滿足Flash軟件的制作要求。借助PS圖像處理技術(shù)處理后的圖片，在后期進(jìn)行Flash動(dòng)畫或視頻制作時(shí)都能有效降低操作難度，以提高網(wǎng)頁(yè)動(dòng)畫設(shè)計(jì)的效率。一般情況下，想要保證視頻制作的質(zhì)量，所采用的圖片格式應(yīng)為jpg，gif或者bmp，而圖片格式轉(zhuǎn)換環(huán)節(jié)同樣需要借助于PS圖像處理技術(shù)，以此來(lái)保證網(wǎng)站視頻的質(zhì)量。

3.3 網(wǎng)頁(yè)特效設(shè)計(jì)

目前，網(wǎng)站制作者一般應(yīng)用Dreamweaver（簡(jiǎn)稱DW）軟件進(jìn)行網(wǎng)頁(yè)制作，但該軟件并不是專業(yè)的圖像處理軟件，因此，其只能對(duì)圖片素材進(jìn)行初步的處理，而更為精密的處理還是需要借助PS圖像處理技術(shù)，同時(shí)PS圖像處理技術(shù)在DW的特效設(shè)計(jì)上也具有較為明顯的應(yīng)用優(yōu)勢(shì)，對(duì)于網(wǎng)頁(yè)功能的完善具有積極的作用。由于部分網(wǎng)站要求在Logo或標(biāo)題標(biāo)語(yǔ)處添加特效，而不管是文字效果，還是圖像效果，都需借助于PS圖像處理技術(shù)來(lái)進(jìn)行合成處理，在完成格式轉(zhuǎn)化后應(yīng)用到實(shí)際的網(wǎng)站設(shè)計(jì)中。例如，某一網(wǎng)站的Head處需插入帶有特效效果的廣告標(biāo)語(yǔ)，但由于DW軟件無(wú)法進(jìn)行字體選用操作，因此應(yīng)用PS圖像處理技術(shù)進(jìn)行字體選定以及特效添加處理，并對(duì)色彩進(jìn)行搭配，以保證字體特效與廣告標(biāo)語(yǔ)之間達(dá)成平衡效果，避免出現(xiàn)分層缺陷問(wèn)題[2]。另外，PS圖像處理技術(shù)也可進(jìn)行多種網(wǎng)頁(yè)特效設(shè)計(jì)，如網(wǎng)頁(yè)主色調(diào)更換、背景選擇以及皮膚更新等。

4 結(jié)語(yǔ)

總而言之，圖像處理技術(shù)的應(yīng)用能有效提升網(wǎng)頁(yè)設(shè)計(jì)和制作的質(zhì)量和效率，通過(guò)進(jìn)一步優(yōu)化網(wǎng)頁(yè)圖像，既能進(jìn)一步提升網(wǎng)站運(yùn)行的穩(wěn)定性，避免出現(xiàn)因圖像不合格而造成的網(wǎng)絡(luò)通道受阻問(wèn)題的出現(xiàn)，也能大幅提升網(wǎng)站整體的設(shè)計(jì)感和藝術(shù)性，以有效吸引眾多瀏覽者并大大增強(qiáng)用戶的忠誠(chéng)度，從而提升網(wǎng)站的知名度。

[參考文獻(xiàn)]

[1]陳愛(ài)霞.淺談圖像處理技術(shù)在網(wǎng)頁(yè)制作中的應(yīng)用[J].電腦迷，2017（12）：83.

[2]吳曉文.Photoshop在計(jì)算機(jī)圖形圖像處理中的應(yīng)用[J].電腦知識(shí)與技術(shù)，2017（5）：166-167.