網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)應(yīng)用分析

徐勤芬

摘要：計(jì)算機(jī)圖像處理技術(shù)具有顯著的技術(shù)應(yīng)用優(yōu)勢(shì)，在網(wǎng)頁設(shè)計(jì)中得到了日漸廣泛的應(yīng)用。在網(wǎng)頁設(shè)計(jì)中，對(duì)計(jì)算機(jī)圖像處理技術(shù)進(jìn)行巧妙應(yīng)用，能增強(qiáng)網(wǎng)頁的美感和藝術(shù)效果。對(duì)此，網(wǎng)頁設(shè)計(jì)人員應(yīng)熟練掌握計(jì)算機(jī)圖像處理技術(shù)，加強(qiáng)該技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用。本文簡述了計(jì)算機(jī)圖像處理技術(shù)的內(nèi)容，淺析了計(jì)算機(jī)圖像處理技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用，以期為網(wǎng)頁設(shè)計(jì)提供參考借鑒。

關(guān)鍵詞：網(wǎng)頁設(shè)計(jì);計(jì)算機(jī)圖像處理;應(yīng)用

中圖分類號(hào)：TP393? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2022）21-0082-02

開放科學(xué)（資源服務(wù)）標(biāo)識(shí)碼（OSID）：

計(jì)算機(jī)圖像處理技術(shù)，能契合網(wǎng)頁設(shè)計(jì)的具體需求，對(duì)網(wǎng)頁圖片進(jìn)行處理。通過計(jì)算機(jī)圖像處理技術(shù)對(duì)網(wǎng)頁所含的圖片顏色進(jìn)行調(diào)整，能形成更為良好的視覺傳輸效果。同時(shí)，在網(wǎng)頁設(shè)計(jì)中，對(duì)計(jì)算機(jī)圖像處理技術(shù)進(jìn)行應(yīng)用，需綜合考慮網(wǎng)頁設(shè)置、圖像尺寸和文字排版，能實(shí)現(xiàn)對(duì)網(wǎng)頁結(jié)構(gòu)的合理規(guī)劃，并增強(qiáng)網(wǎng)頁美感，提高網(wǎng)頁瀏覽量。另外，在網(wǎng)頁設(shè)計(jì)中，通過計(jì)算機(jī)圖像處理技術(shù)對(duì)圖像進(jìn)行科學(xué)設(shè)置，并調(diào)整其大小顏色，能增強(qiáng)網(wǎng)頁的視覺沖擊感，并增強(qiáng)瀏覽者對(duì)網(wǎng)頁的閱讀體驗(yàn)。對(duì)此，網(wǎng)頁設(shè)計(jì)人員要深刻認(rèn)識(shí)計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用優(yōu)勢(shì)，加強(qiáng)計(jì)算機(jī)圖像處理技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用。

1計(jì)算機(jī)圖像處理技術(shù)概述

1.1去噪處理技術(shù)

對(duì)圖像進(jìn)行制作，經(jīng)常涉及“量化噪點(diǎn)”以及“高斯噪點(diǎn)”等現(xiàn)象。此類現(xiàn)象與輸入原信號(hào)相應(yīng)的圖像之間的關(guān)聯(lián)較小，因受到內(nèi)部器件產(chǎn)生的影響，加上軟件量化實(shí)際處理程度較低，影響其成像質(zhì)量，削弱其觀賞舒適度，難以充分體現(xiàn)圖片具備的價(jià)值。對(duì)此，可通過“中值濾波”“均值濾波”等技術(shù)方式實(shí)施有效的去噪操作，將圖片包含的像素信號(hào)根據(jù)灰度值進(jìn)行排列，對(duì)噪點(diǎn)強(qiáng)度或者中間值實(shí)施數(shù)值化分析，并將一定的中間值或模糊值插入其中，實(shí)現(xiàn)有效降噪[1]。

1.2增強(qiáng)處理技術(shù)

該技術(shù)重點(diǎn)是突出重點(diǎn)，并對(duì)瑕疵進(jìn)行淡化處理。運(yùn)用該技術(shù)，對(duì)圖像進(jìn)行處理，主要是對(duì)圖像進(jìn)行變換、剪切、銳化，還能添加濾鏡[2]。利用相關(guān)軟件對(duì)圖像進(jìn)行處理，增強(qiáng)其特性。常用的處理技術(shù)，是對(duì)圖像色彩以及圖像清晰度進(jìn)行調(diào)整。對(duì)相關(guān)偽色進(jìn)行處理，將黑白圖片轉(zhuǎn)換為彩色圖片。通過邊緣銳化，并結(jié)合濾波處理與差分運(yùn)算，使圖片結(jié)合位深度更為清晰和尖銳。增強(qiáng)處理技術(shù)能與視覺效應(yīng)和光學(xué)效應(yīng)相結(jié)合，為普通圖片增添光彩。

1.3壓縮處理技術(shù)

壓縮處理技術(shù)，主要是對(duì)圖像數(shù)據(jù)進(jìn)行壓縮，實(shí)現(xiàn)對(duì)圖片的有效傳遞，能最大化避免圖像出現(xiàn)失真。從運(yùn)行效果來看，有兩種壓縮方式，一是對(duì)圖片進(jìn)行有損壓縮，二是對(duì)圖片進(jìn)行無損壓縮，兩種方式在壓縮內(nèi)容和時(shí)間上具有較大差異。當(dāng)前，圖片常用的壓縮類型有兩種，一種是“JPEG”格式，一種是“MPEG”格式。其運(yùn)算方式對(duì)“圖像交換”技術(shù)進(jìn)行了運(yùn)用，與“游程碼”類似。

2計(jì)算機(jī)圖像處理技術(shù)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用

2.1設(shè)計(jì)網(wǎng)頁風(fēng)格形象中的應(yīng)用

在網(wǎng)頁設(shè)計(jì)過程中，需處理大量圖像。對(duì)圖像進(jìn)行處理，即需巧妙應(yīng)用計(jì)算機(jī)圖像處理技術(shù)，對(duì)網(wǎng)頁風(fēng)格進(jìn)行統(tǒng)一化處理，并明確網(wǎng)頁主題，最大化增強(qiáng)網(wǎng)頁設(shè)計(jì)的美觀性和科學(xué)性。網(wǎng)頁是傳達(dá)網(wǎng)絡(luò)信息的重要“門戶”，網(wǎng)頁呈現(xiàn)出的整體風(fēng)格，即是網(wǎng)站具備的信息資源的外在代表，能彰顯網(wǎng)站具備的文化特點(diǎn)。因此，在對(duì)網(wǎng)站風(fēng)格進(jìn)行設(shè)計(jì)時(shí)，根據(jù)網(wǎng)絡(luò)圖片具備的圖文信息，對(duì)之實(shí)施“修圖”處理。同時(shí)，斟酌網(wǎng)頁結(jié)構(gòu)，合理設(shè)計(jì)排版，靈活運(yùn)用發(fā)散思維傳遞簡略、清晰的信息[3]。對(duì)網(wǎng)頁風(fēng)格進(jìn)行設(shè)計(jì)，應(yīng)選用瀏覽者青睞的風(fēng)格，并考慮其接收信息的能力。例如，設(shè)計(jì)具有中國風(fēng)特點(diǎn)的網(wǎng)頁，應(yīng)對(duì)內(nèi)部構(gòu)圖進(jìn)行優(yōu)化設(shè)計(jì)，并采用合理的色彩搭配，利用具有山水畫、水墨畫特征的圖片，進(jìn)行“拼接”和“摳圖”處理。以“攜程網(wǎng)”為例，從色系上來看，該網(wǎng)站以淡藍(lán)色為底色，網(wǎng)站字體主要采用黑色、藍(lán)色和黃色。網(wǎng)頁整體上呈現(xiàn)出清新的風(fēng)格，能契合用戶的旅游預(yù)期，還能彰顯網(wǎng)站自身的文化特點(diǎn)。從網(wǎng)頁框架以及排版來看，攜程頁面包括三大區(qū)塊，位于上部的區(qū)塊是導(dǎo)航欄，位于中間的區(qū)塊是網(wǎng)站主體，位于下部的區(qū)塊是連接和廣告區(qū)域。三大區(qū)塊層次分明，呈現(xiàn)出的信息清晰簡略，形成了良好的視覺效果。另外，網(wǎng)頁對(duì)Flash、script、Java等特效進(jìn)行了巧妙運(yùn)用，為網(wǎng)站風(fēng)格增添了活力。

2.2提升網(wǎng)頁瀏覽量上的應(yīng)用

網(wǎng)頁設(shè)計(jì)需對(duì)各類圖像進(jìn)行采用，常用的圖像類型包括動(dòng)態(tài)圖、截屏圖以及拍攝圖。將類型不同的圖片添加在網(wǎng)頁設(shè)計(jì)中，能增強(qiáng)網(wǎng)頁的觀賞感，并增強(qiáng)網(wǎng)頁內(nèi)容的豐富性，還能增強(qiáng)網(wǎng)頁的視覺效果[4]。新浪、網(wǎng)易等門戶網(wǎng)站，均對(duì)計(jì)算機(jī)圖像處理技術(shù)進(jìn)行了應(yīng)用。用戶從網(wǎng)站上，能觀看短視頻，網(wǎng)站帶給用戶的寫實(shí)感極為強(qiáng)烈。用戶在瀏覽網(wǎng)頁時(shí)，能形成較強(qiáng)的代入感。網(wǎng)頁通過動(dòng)圖圖像解釋部分功能，便于用戶對(duì)網(wǎng)頁操作進(jìn)行理解，能增強(qiáng)用戶對(duì)網(wǎng)頁的滿意度。在網(wǎng)頁中運(yùn)用多種圖像，增強(qiáng)其趣味性和科學(xué)性，能提升網(wǎng)頁的美觀度，增強(qiáng)用戶的瀏覽體驗(yàn)，進(jìn)而提升網(wǎng)頁瀏覽量。

2.3 LOGO創(chuàng)造上的應(yīng)用

在網(wǎng)頁設(shè)計(jì)中，矢量設(shè)計(jì)占據(jù)著重要地位。生動(dòng)簡潔的LOGO能讓用戶迅速記住所瀏覽網(wǎng)頁的信息內(nèi)容。不同的LOGO圖形，能帶來瀏覽者不同的心理感覺。例如，圓形LOGO能帶來瀏覽者溫暖的心理感覺，不規(guī)則圖形的LOGO則能帶來瀏覽者動(dòng)態(tài)化的心理感覺。瀏覽者觀看矩形或者方形LOGO時(shí)，一般會(huì)產(chǎn)生受束縛的心理感覺。單個(gè)網(wǎng)頁通常會(huì)包含網(wǎng)頁特有的標(biāo)識(shí)，各類網(wǎng)站標(biāo)識(shí)均具有不同含義，對(duì)網(wǎng)站標(biāo)識(shí)進(jìn)行合理設(shè)計(jì)，能增強(qiáng)用戶的瀏覽欲望，并彰顯網(wǎng)站文化。以小米手機(jī)為例，其標(biāo)識(shí)為簡潔生動(dòng)的“MI”，該標(biāo)識(shí)看似是對(duì)字母的簡單組合，實(shí)則對(duì)計(jì)算機(jī)圖像處理技術(shù)進(jìn)行了巧妙應(yīng)用。該標(biāo)識(shí)具有更強(qiáng)的美感，彰顯了小米企業(yè)用心的理念，能在潛移默化中引導(dǎo)瀏覽者感受小米的企業(yè)文化，并激發(fā)瀏覽者對(duì)小米商城的瀏覽興趣，進(jìn)而增強(qiáng)瀏覽者的消費(fèi)欲望。瀏覽者在對(duì)小米網(wǎng)站的網(wǎng)頁進(jìn)行瀏覽的過程中，會(huì)逐漸認(rèn)同小米企業(yè)的商品和文化。為增強(qiáng)網(wǎng)頁質(zhì)感，提升網(wǎng)頁檔次，需精心制作網(wǎng)頁背景圖，確保背景圖片良好匹配網(wǎng)頁信息，幫助瀏覽者明確網(wǎng)頁表達(dá)的主題，并增強(qiáng)瀏覽者的視覺體驗(yàn)。將精美圖像添加于網(wǎng)頁中，能獲取瀏覽者的青睞，并增強(qiáng)網(wǎng)頁的信息表達(dá)效果。網(wǎng)頁運(yùn)用細(xì)膩文字表達(dá)主題，并結(jié)合精美圖像，能增強(qiáng)瀏覽者的視覺體驗(yàn)[5]。

2.4 傳輸網(wǎng)頁針對(duì)性信息中的應(yīng)用

靈活運(yùn)用計(jì)算機(jī)圖像處理技術(shù)，能實(shí)現(xiàn)對(duì)網(wǎng)頁設(shè)計(jì)的優(yōu)化。網(wǎng)頁設(shè)計(jì)運(yùn)用不同圖像，能帶給瀏覽者不同的心理感受。例如，網(wǎng)頁運(yùn)用黃色的三角形圖像對(duì)受限功能進(jìn)行表示，網(wǎng)頁運(yùn)用紅色感嘆號(hào)對(duì)性能失效進(jìn)行表示。在網(wǎng)頁設(shè)計(jì)過程中，應(yīng)明確不同顏色的各類圖像扮演的角色和發(fā)揮的職責(zé)。例如，在公益性網(wǎng)站中，網(wǎng)頁圖文搭配和后期修圖通常選用淺色調(diào)，在修圖時(shí)，會(huì)避免采用過多顏色，防止形成干擾信息。在商業(yè)性網(wǎng)站中，網(wǎng)站內(nèi)容主要是銷售信息，在其圖像設(shè)計(jì)上，通常對(duì)“精修圖”進(jìn)行應(yīng)用，并強(qiáng)化“撞色”，激發(fā)消費(fèi)者對(duì)商品的購買欲望。法院或者公安部門的官方網(wǎng)站，通常對(duì)方對(duì)圖像進(jìn)行應(yīng)用，能增強(qiáng)網(wǎng)頁的莊嚴(yán)感。

2.5 網(wǎng)頁盲區(qū)設(shè)計(jì)中的應(yīng)用

2.5.1 利用補(bǔ)充像素模式對(duì)視覺反差盲區(qū)進(jìn)行處理

運(yùn)用鋼筆工具對(duì)各類圖形結(jié)構(gòu)進(jìn)行創(chuàng)造。通過各不相同的形狀信息，有效區(qū)分視覺盲區(qū)，強(qiáng)化對(duì)線條的勾勒，形成對(duì)比強(qiáng)烈的視覺效果，在明顯的輪廓特征中彰顯特性。以不規(guī)則圖形勾勒形狀輪廓，并對(duì)之實(shí)施集中化處理，使圖像呈現(xiàn)出差異性顯著的分布特征[6]。

通過填充像素，增強(qiáng)色彩差異對(duì)比，形成新穎的主體風(fēng)格。若網(wǎng)頁主題背景采用暖色調(diào)，應(yīng)運(yùn)用冷色調(diào)處理關(guān)鍵圖像，形成強(qiáng)烈的色彩反差，凸顯視覺信息，優(yōu)化突出色彩具備的引導(dǎo)作用。明確創(chuàng)建方式相應(yīng)的空間結(jié)構(gòu)，先對(duì)柵欄進(jìn)行構(gòu)建，再優(yōu)化后期處理效果，增強(qiáng)顏色分布具備的協(xié)調(diào)性和沖擊性，促進(jìn)審美作用的良好發(fā)揮，并補(bǔ)充視覺反差盲區(qū)。

引導(dǎo)動(dòng)態(tài)化信息，對(duì)立體圖案設(shè)計(jì)方案進(jìn)行采用，對(duì)網(wǎng)頁運(yùn)用形狀結(jié)構(gòu)，增強(qiáng)其視覺沖擊力，形成良好的設(shè)計(jì)效果。對(duì)PS軟件進(jìn)行應(yīng)用，雖然也能增強(qiáng)網(wǎng)頁的三維視覺效果，但PS軟件的設(shè)計(jì)空間相對(duì)狹隘，僅能利用色澤變化和陰影實(shí)現(xiàn)立體映射，無法通過立體圖形具備的多維視角實(shí)現(xiàn)良好延伸，對(duì)此，可運(yùn)用3DMAX軟件，對(duì)網(wǎng)頁的視覺特征進(jìn)行補(bǔ)充[7]。

2.5.2 通過結(jié)構(gòu)調(diào)整方案對(duì)圖像比例盲區(qū)進(jìn)行調(diào)整

對(duì)初始圖片而言，其空間尺寸出現(xiàn)錯(cuò)誤，將形成圖像比例盲區(qū)。該問題會(huì)導(dǎo)致網(wǎng)頁設(shè)計(jì)呈現(xiàn)出較強(qiáng)的單一性，難以增強(qiáng)網(wǎng)頁視覺效果。在網(wǎng)頁設(shè)計(jì)中，未形成黃金比例，僅憑設(shè)計(jì)師經(jīng)驗(yàn)，難以形成良好的視覺效果，會(huì)對(duì)網(wǎng)頁流量造成直接影響。因此，對(duì)網(wǎng)頁主題、網(wǎng)頁比例以及網(wǎng)頁風(fēng)格進(jìn)行設(shè)計(jì)，應(yīng)對(duì)H5頁面和Web頁面二者的對(duì)比效果進(jìn)行綜合考量，并對(duì)用戶瀏覽數(shù)據(jù)進(jìn)行分析，對(duì)網(wǎng)頁元素實(shí)施補(bǔ)充調(diào)整。在原則上可對(duì)Web頁面涉及的文本信息進(jìn)行擴(kuò)充，但H5頁面要求集中的元素設(shè)計(jì)?？赏ㄟ^PS軟件，在網(wǎng)頁設(shè)計(jì)中，對(duì)網(wǎng)格比例分區(qū)進(jìn)行設(shè)置，對(duì)網(wǎng)頁主要元素設(shè)定相應(yīng)的空間比例，結(jié)合連接導(dǎo)向的重要性排序，判斷空間結(jié)構(gòu)具備的合理性。在網(wǎng)頁設(shè)計(jì)中，應(yīng)對(duì)各種類型的圖形結(jié)構(gòu)進(jìn)行綜合運(yùn)用。例如，網(wǎng)頁向?yàn)g覽者傳遞正規(guī)嚴(yán)謹(jǐn)?shù)男畔r(shí)，可對(duì)方形圖像進(jìn)行使用;網(wǎng)頁向?yàn)g覽者傳遞柔美圓潤的信息，可對(duì)圓形圖像進(jìn)行使用。網(wǎng)站設(shè)計(jì)為凸顯其個(gè)性化特點(diǎn)，可對(duì)棱角尖銳的三角形圖像進(jìn)行使用。從設(shè)計(jì)本質(zhì)來看，網(wǎng)站必須根據(jù)自身主旨，對(duì)各種類型的圖像結(jié)構(gòu)進(jìn)行合理應(yīng)用，突出網(wǎng)頁主題，并彰顯網(wǎng)頁的個(gè)性化特點(diǎn)，增強(qiáng)網(wǎng)頁內(nèi)容的豐富性，形成良好的頁面效果[8]。

2.5.3 對(duì)體驗(yàn)需求盲區(qū)實(shí)施個(gè)性化創(chuàng)新

網(wǎng)頁瀏覽的商業(yè)目的較強(qiáng)，對(duì)網(wǎng)頁設(shè)計(jì)進(jìn)行評(píng)估，應(yīng)重點(diǎn)衡量其能否為用戶帶來良好的體驗(yàn)需求。因此，應(yīng)巧妙利用計(jì)算機(jī)圖像處理技術(shù)，對(duì)網(wǎng)頁體驗(yàn)需求盲區(qū)實(shí)施個(gè)性化創(chuàng)新。應(yīng)對(duì)各類圖像處理軟件進(jìn)行綜合應(yīng)用，防止出現(xiàn)用戶體驗(yàn)盲區(qū)，增強(qiáng)網(wǎng)頁設(shè)計(jì)的人性化特點(diǎn)，形成更為豐富的設(shè)計(jì)元素，凸顯網(wǎng)頁設(shè)計(jì)的創(chuàng)意感，為用戶帶來舒適的體驗(yàn)效果。

3 結(jié)語

在網(wǎng)頁設(shè)計(jì)中，對(duì)計(jì)算機(jī)圖像處理技術(shù)進(jìn)行巧妙應(yīng)用，能增強(qiáng)網(wǎng)頁設(shè)計(jì)的美觀性和科學(xué)性。通過制作精美的圖像，能增強(qiáng)網(wǎng)頁的視覺效果，使網(wǎng)頁瀏覽者感到美感。對(duì)此，要加強(qiáng)計(jì)算機(jī)圖像處理技術(shù)在設(shè)計(jì)網(wǎng)頁風(fēng)格形象中、提升網(wǎng)頁瀏覽量、LOGO創(chuàng)造、傳輸網(wǎng)頁針對(duì)性信息等方面的應(yīng)用。

參考文獻(xiàn)：

[1] 譚云游，余長梅，李光歡.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用探析[J].電腦知識(shí)與技術(shù)，2021，17（15）：202-203.

[2] 李子彥.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用[J].辦公自動(dòng)化，2021，26（10）：26-27.

[3] 張醒芝，宋真真.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用探討[J].無線互聯(lián)科技，2021，18（7）：100-101.

[4] 高飛.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用[J].數(shù)碼世界，2020（11）：94-95.

[5] 解睿.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用[J].信息記錄材料，2020，21（10）：229-230.

[6] 李賢.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用分析[J].電腦知識(shí)與技術(shù)，2020，16（27）：198-199.

[7] 張林燕.網(wǎng)頁設(shè)計(jì)中對(duì)計(jì)算機(jī)圖像處理技術(shù)的有效應(yīng)用[J].信息記錄材料，2020，21（9）：175-176.

[8] 房艷萍.網(wǎng)頁設(shè)計(jì)中計(jì)算機(jī)圖像處理技術(shù)的應(yīng)用研究[J].無線互聯(lián)科技，2020，17（13）：91-92.

【通聯(lián)編輯：光文玲】