網頁設計該怎么學？

時間：2022-09-03 14:15:02 | 來源：網站運營

時間：2022-09-03 14:15:02 來源：網站運營

個人覺得，以下分享即是最終答案！

一、明確網頁設計需要學些什么

軟件技能、創(chuàng)意表達、視覺刻畫，這是網頁設計師的核心技能。網頁設計是生產運營中的一個技術支撐環(huán)節(jié)，其最終的作品輸出都是為企業(yè)或商業(yè)產品服務的。學會理解你的服務對象，將企業(yè)的文化價值、產品的功能屬性準確傳遞給潛在客戶，這就是網頁設計的階段性目的，也是一名好的網頁設計師需要學會的東西。

二、網頁設計師的工作日常

1.信息的收集整理（前期調研階段、競品分析、受眾分析）

說人話：首先要分析理解自己的設計內容，設計初期可以先收集一些同行、或競品相關的網頁設計、或者圖片素材做參考。

2.信息的歸納提煉（策劃設計階段）

說人話：把收集來的信息加以提煉，歸納整理出適合自己的網頁設計的有用信息，以此來把握整體的網頁設計風格及大的方向。

3.信息的視覺化表現（軟件制作及執(zhí)行傳播階段）

說人話：信息的視覺化表現也就是，在Photoshop軟件中完成排版布局、頁面的icon設計、圖片的合成處理等，以及推廣banner海報的設計，然后切圖交接給web前端開發(fā)。

三、網頁設計的常見類型

△房地產官網設計，作者：騰訊-郭亮，來源：網頁設計高級教程

目前，關于網頁設計的常見類型及方向有：淘寶天貓類型的電商視覺設計、企業(yè)官網的設計、新品宣傳、活動專題類型的網頁設計、后臺管控類的網頁端UI設計。在日常的工作中這幾種也許你都會接觸到。在學習之初你還得從軟件技能、排版布局、圖像處理、切圖輸出等這些具體的點著手熟悉。

四、學習網頁設計的具體知識點

(1).首先要精通設計軟件，把photoshop玩轉，這是網頁設計的主力工具！

(2).深入學習排版設計，以及三大構成中的平面構成、色彩構成、立體構成，掌握一定的素描基礎，以明確：光影變化、透視結構、構圖平衡的基本視覺規(guī)律。

(3).掌握網頁設計規(guī)范，學習網頁設計概述、制作流程、視覺元素、色彩搭配、以網頁布局排版、切圖、交互知識等。

(4).學習網頁設計創(chuàng)意表達的思路流程，如何將文案創(chuàng)意具體到視覺化呈現的全過程，以及畫面光影細節(jié)刻畫的技能提高。請參考：網頁設計高級教程。

(5).了解一點前端代碼HTML、CSS的運用，學一款代碼編輯軟件，推薦網頁設計師用Dreamweaver。

(6).了解你設計網站的公司及產品，熟悉這個公司及其產品面向的人群！

(7).拓展學習網站優(yōu)化、開發(fā)、后臺數據處理常識（加分項目?。?br>

五、學習網頁設計，你要知道的以下三點。

1、網站的制作流程

引用于：自學網頁設計，需要了解的網站開發(fā)流程

通常情況下，任何一網站的建立，都會經過“分析策劃—交互設計—視覺設計—前端制作—后端制作—測試上線”6個環(huán)節(jié)。

在實際的工作崗位中，一般由“網頁設計師”負責「視覺設計」板塊，即我們平常所說的「網頁設計」。而「前端制作」環(huán)節(jié)則主要有“前端工程師”來負責，即用代碼來重構還原設計師的視覺稿，這一環(huán)節(jié)也就是我們平常所說的「網頁制作」。

很多初學網頁設計的朋友，對這兩者的關系往往是傻傻分不清楚的狀態(tài)，對自己的專業(yè)定位沒有清晰的認識。這就導致學設計的同學，后來干到了“前端工程師”的崗位，學前端的孩子開始猛補“設計知識”，這個就是要走偏的節(jié)奏。

2、網頁設計，是以視覺設計為主的工作。

自學網頁設計的核心任務是學習“視覺設計”相關的知識點。用什么樣的排版，去梳信息的層次邏輯，用什么樣的顏色，以及多大的字號？如何讓畫面表現更具視覺創(chuàng)意、交互體驗會更好，這是新手學習網頁設計應該畫下的重點。

一個網頁被設計出來，是給人用，給人看的。 要好看（簡潔）、要好用（高效）這才是一個設計師需要反復考慮的。視覺+交互，是網頁設計師的核心競爭力。

其中“視覺設計”的依據，源于前面的策劃和交互設計。最后出具的“視覺設計稿”得符合品牌定位，滿足生產運營、以及用戶需求，這是網頁設計師必修的基本功！

3、前端制作，是以前端代碼為主。

前端制作在流程上，是在視覺設計之后。這部分工作通常是由WEB前端工程師來完成的，工程師通常會運用到HTML、CSS、以及JavaScript、jQuery等網頁前端代碼，來重構網頁設計師的“視覺設計稿”，以及交互動畫等。

“前端工程師”除了要配合網頁設計師外，還要配合做后端工程師，做好網頁端的數據收集處理等工作。如果你要勵志成為一個優(yōu)秀的網頁設計師，請牢記自己的崗位職責和學習重點，在沒有認清“視覺設計”前，要當心自己是不是越位到Web前端開發(fā)這個坑里去了。

△圖例：優(yōu)秀的電商網頁設計作品，視覺合成。作者：尚云

再比如優(yōu)化網站所需的SEO、Ajax等技術，雖無需你動手實踐，但能做到了解一二，也是不錯的加分項。在設計的時候，也可充分利用這些規(guī)則和技術來規(guī)劃你的版面，使其更加的專業(yè)友好。

再往后

上面所說的，都是網頁設計師必須掌握或了解的基本功。在基本功掌握扎實了以后，則可圍繞著創(chuàng)意表達、營銷傳播、用戶心理、交互體驗的維度在進行深入學習探討，以指導你做出更好的設計。這一階段，則是思維層面的提升，可購買相關領域書籍進行學習。

—

原創(chuàng)回答，禁止轉載！圖片版權歸原作者所有。