什么是網(wǎng)頁(yè)藝術(shù)設計 ?

網(wǎng)頁(yè)藝術(shù)設計是是網(wǎng)頁(yè)設計者以所處時(shí)代所能獲取的技術(shù)和藝術(shù)經(jīng)驗為基礎，依照設計目的和要求自覺(jué)地對網(wǎng)頁(yè)的構成元素進(jìn)行藝術(shù)規劃的創(chuàng )造性思維活動(dòng)。下面詳細介紹什么是網(wǎng)頁(yè)藝術(shù)設計，希望為大家帶來(lái)幫助。 ?

網(wǎng)頁(yè)藝術(shù)設計： ?

網(wǎng)頁(yè)藝術(shù)設計是是網(wǎng)頁(yè)設計者以所處時(shí)代所能獲取的技術(shù)和藝術(shù)經(jīng)驗為基礎，依照設計目的和要求自覺(jué)地對網(wǎng)頁(yè)的構成元素進(jìn)行藝術(shù)規劃的創(chuàng )造性思維活動(dòng)。 ?

設計活動(dòng)中包含著(zhù)主觀(guān)和客觀(guān)兩方面的因素，在確立了網(wǎng)頁(yè)主題之后，首先要明確和熟悉設計的對象和構成的要素。網(wǎng)頁(yè)藝術(shù)設計涉及的具體內容很多，可以概括為視聽(tīng)元素和版式設計兩個(gè)方面。 ?

設計內容： ?

視聽(tīng)元素 ?

這里所說(shuō)的視聽(tīng)元素，主要包括：文本、背景、按鈕、圖標、圖像、表格、顏色、導航工具、背景音樂(lè )、動(dòng)態(tài)影像等。無(wú)論是文字、圖形、動(dòng)畫(huà)，還是音頻、視頻，網(wǎng)頁(yè)設計者所要考慮的是如何以感人的形式把它們放進(jìn)頁(yè)面這個(gè)“大畫(huà)布”里。多媒體技術(shù)的運用大大豐富了網(wǎng)頁(yè)藝術(shù)設計的表現力。 ?

以上各視聽(tīng)元素大多數瀏覽器本身都可以顯示或收聽(tīng)，無(wú)需任何外部程序或模塊支持。比如，大部分瀏覽器都可以顯示GIF、JPEG圖形和GIF89a動(dòng)畫(huà)。還有些多媒體文件(如MP3音樂(lè ))需要先下載到本地硬盤(pán)上，然后啟動(dòng)相應的外部程序來(lái)播放。另外，在瀏覽器使用插件(Plug-in)可以播放更多格式的多媒體文件。微軟推出IE瀏覽器后，提供了基于OLE的ActiveX技術(shù)，用來(lái)在網(wǎng)頁(yè)中播放多媒體。ActiveX已經(jīng)成為熱門(mén)技術(shù)。另一種播放多媒體的技術(shù)是JavaApplet。它是用Java語(yǔ)言編寫(xiě)的應用于網(wǎng)頁(yè)之中的小應用程序，相比于插件和ActiveX，JavaApplet具有更大的靈活性和良好的跨平臺能力，因此具有很好的發(fā)展前景?？傊?，技術(shù)的不斷發(fā)展使多媒體元素在網(wǎng)頁(yè)藝術(shù)設計中的綜合運用越來(lái)越廣泛，使瀏覽者可以享受到更加完美的視聽(tīng)效果。這些新技術(shù)的出現，也對網(wǎng)頁(yè)的藝術(shù)設計提出了更高的要求。 ?

版式設計 ?

網(wǎng)頁(yè)的版式設計同報刊雜志等平面媒體的版式設計有很多共同之處，它在網(wǎng)頁(yè)的藝術(shù)設計中占據著(zhù)重要的地位。所謂網(wǎng)頁(yè)的版式設計，是在有限的屏幕空間上將視聽(tīng)多媒體元素進(jìn)行有機的排列組合，將理性思維個(gè)性化的表現出來(lái)，是一種具有個(gè)人風(fēng)格和藝術(shù)特色的視聽(tīng)傳達方式。它在傳達信息的同時(shí)，也產(chǎn)生感官上的美感和精神上的享受。 ?

但網(wǎng)頁(yè)的排版與書(shū)籍雜志的排版又有很多差異。印刷品都有固定的規格尺寸，網(wǎng)頁(yè)則不然，它的尺寸是由讀者來(lái)控制的。這使網(wǎng)頁(yè)設計者不能精確控制頁(yè)面上每個(gè)元素的尺寸和位置。而且，網(wǎng)頁(yè)的組織結構不像印刷品那樣為線(xiàn)性組合，這給網(wǎng)頁(yè)的版式設計帶來(lái)了一定的難度。 ?

什么是網(wǎng)頁(yè)設計 ?

網(wǎng)頁(yè)設計是一種視覺(jué)語(yǔ)言，特別講究編排和布局，雖然主頁(yè)的設計不等同于平面設計，但它們有許多相近之處。版式設計通過(guò)文字圖形的空間組合，表達出和諧與美。 ?

多頁(yè)面站點(diǎn)頁(yè)面的編排設計要求把頁(yè)面之間的有機聯(lián)系反映出來(lái)，特別要求處理好頁(yè)面之間和頁(yè)面內的秩序與內容的關(guān)系。為了達到*的視覺(jué)表現效果，反復推敲整體布局的合理性，使瀏覽者有一個(gè)流暢的視覺(jué)體驗。 ?

網(wǎng)頁(yè)設計(web design，又稱(chēng)為Web UI design，WUI design，WUI)，是根據企業(yè)希望向瀏覽者傳遞的信息(包括產(chǎn)品、服務(wù)、理念、文化)，進(jìn)行網(wǎng)站功能策劃，然后進(jìn)行的頁(yè)面設計美化工作。作為企業(yè)對外宣傳物料的其中一種，精美的網(wǎng)頁(yè)設計，對于提升企業(yè)的互聯(lián)網(wǎng)品牌形象至關(guān)重要。 ?

網(wǎng)頁(yè)設計一般分為三種大類(lèi):功能型網(wǎng)頁(yè)設計(服務(wù)網(wǎng)站&B/S軟件用戶(hù)端)、形象型網(wǎng)頁(yè)設計(品牌形象站)、信息型網(wǎng)頁(yè)設計(門(mén)戶(hù)站)。設計網(wǎng)頁(yè)的目的不同，應選擇不同的網(wǎng)頁(yè)策劃與設計方案。 ?

網(wǎng)頁(yè)設計主要以Adobe產(chǎn)品為主，常見(jiàn)的工具包括FW、PS、FL、DW、CDR、AI等，其中DW是代碼工具，其他是圖形圖像和FL動(dòng)畫(huà)工具。還有最近幾年Adobe新出的EdgeReflow、EdgeCode、Muse。 ?

什么是自適應網(wǎng)頁(yè)設計 ?

一、什么是自適應網(wǎng)頁(yè)設計? ?

2011年，網(wǎng)頁(yè)設計師Aaron Gustafson在他的書(shū)《自適應網(wǎng)頁(yè)設計》里率先提出了自適應網(wǎng)頁(yè)設計的概念。 ?

?

Adaptive design (自適應設計)：為不同類(lèi)別的設備建立不同的網(wǎng)頁(yè)，檢測到設備分辨率大小后調用相應的網(wǎng)頁(yè)。目前AWD網(wǎng)頁(yè)主要針對這幾種分辨率(320，480，760，960，1200，1600) ?

和響應式網(wǎng)頁(yè)不同，自適應設計是基于斷點(diǎn)使用靜態(tài)布局，一旦頁(yè)面被加載就無(wú)法再進(jìn)行自動(dòng)適應，自適應會(huì )自動(dòng)檢測屏幕的大小來(lái)加載適當的工作布局。因此，當您在電腦上打開(kāi)瀏覽器瀏覽網(wǎng)頁(yè)時(shí)，該網(wǎng)站會(huì )自動(dòng)檢測并選擇該桌面屏幕的*布局。 ?

二、如何做自適應網(wǎng)頁(yè)設計? ?

基礎的網(wǎng)頁(yè)設計涵蓋了幾大重要環(huán)節： ?

前期的原型設計(工具：Axure，Mockplus)UX設計(工具：Justinmind)UI設計(工具：Sketch)后期的前后端，HTML,CSS, JS. ?

而做好自適應網(wǎng)頁(yè)設計則需要遵循以下幾個(gè)步驟： ?

Step 1. Meta 標簽 ?

為了適應屏幕，不少移動(dòng)瀏覽器都會(huì )把HTML頁(yè)面置于較大視口寬度(一般會(huì )大于屏幕寬度)，你可以使用viewport meta標簽來(lái)設定。以下viewport meta標簽告訴瀏覽器視口寬度等于設備屏幕寬度，且不進(jìn)行初始縮放： ?

Step 2. HTML結構 ?

在這個(gè)例子中，頁(yè)面布局包括 Header, Content, Sidebar和Footer. Header固定高度為180px, Content寬600px, Sidebar寬300px。 ?

Step 3. Media Queries ?

CSS3 media query是自適應網(wǎng)頁(yè)設計的關(guān)鍵，就像高級語(yǔ)言里的if條件語(yǔ)句，告訴瀏覽器根據不同的視口寬度(這里等于瀏覽器寬度)來(lái)渲染網(wǎng)頁(yè)。 ?

網(wǎng)頁(yè)設計和web前端的區別 ?

web前端通常稱(chēng)為軟件設計或者美工，普遍工資確實(shí)要比網(wǎng)頁(yè)設計高，因為軟件的收費比網(wǎng)頁(yè)或者網(wǎng)站高多了，一個(gè)網(wǎng)站收費過(guò)萬(wàn)就算比較高了，而軟件隨隨便便就是好幾萬(wàn)的，一二十萬(wàn)、幾十萬(wàn)甚至上百萬(wàn)的都也是正常，但是網(wǎng)站的制作周期比較短，小點(diǎn)的網(wǎng)站通常是一兩周之內就可以完成，而軟件的周期短則幾個(gè)月、半年，長(cháng)則一年幾年都有可能，像我們公司就是給**做監控及統計軟件的，每個(gè)項目隨隨便便都是半年以上的制作周期，收費嘛自然也比較高，有個(gè)項目都做了3年了，不過(guò)這個(gè)項目是個(gè)長(cháng)期項目，不斷的提交又不斷的增加新功能而已; ?

話(huà)說(shuō)回來(lái)，網(wǎng)頁(yè)設計和web前端其實(shí)差別并不太大，對于設計師來(lái)說(shuō)兩者也就是界面模式不同而已，對于熟練的設計師來(lái)說(shuō)，兩者之間可以很好的轉換，頁(yè)面/界面布局的方式其實(shí)還是一樣的，使用的也還算div+css布局; ?

我本人做這行已經(jīng)8年了，剛開(kāi)始做了2年的網(wǎng)頁(yè)設計，后來(lái)轉了軟件設計一直做到現在，老實(shí)說(shuō)做軟件設計確實(shí)是工資高了，工作也更輕松了，因為做網(wǎng)頁(yè)的公司普遍規模都不大，為了能有收益必須大量的接單，這也勢必造成工作量很大，但是設計公司又普遍是有項目提成的，所以工資有時(shí)候反而比做軟件的高，做軟件的普遍是拿固定工資的，所以說(shuō)兩者的工資水平并不是絕對的，只能說(shuō)做軟件更輕松一些 ?