大家今天跟大家伙兒聊聊我最近搗鼓的一個(gè)事兒——給一家設(shè)計(jì)公司做網(wǎng)站。這活兒可真不簡(jiǎn)單，不過(guò)做完還挺有成就感的，來(lái)跟你們分享分享我的整個(gè)過(guò)程。

從零開始，摸石頭過(guò)河

我跟這家設(shè)計(jì)公司的老板碰個(gè)面，聊聊他們想要啥樣的網(wǎng)站。他們主要想展示自己的設(shè)計(jì)作品，還有公司的文化啥的。我，就一邊聽(tīng)一邊記，琢磨著怎么把這些東西在網(wǎng)站上給弄出來(lái)。

琢磨網(wǎng)站的“骨架”

跟老板聊完，我就開始琢磨網(wǎng)站的“骨架”。這就像蓋房子先搭框架一樣，得把網(wǎng)站的欄目、頁(yè)面啥的都想清楚。我畫好多草圖，把網(wǎng)站的首頁(yè)、作品展示頁(yè)、關(guān)于我們頁(yè)等等都給規(guī)劃一下。這期間，還跟設(shè)計(jì)公司的人來(lái)回討論好幾回，改好幾次，才最終定下來(lái)。

開始“裝修”——設(shè)計(jì)網(wǎng)站

框架搭好，接下來(lái)就是“裝修”。這部分可是重頭戲，得把網(wǎng)站做得好看、有設(shè)計(jì)感。我先是選幾個(gè)比較流行的網(wǎng)站設(shè)計(jì)風(fēng)格，然后結(jié)合這家設(shè)計(jì)公司的特點(diǎn)，選一種簡(jiǎn)約、大氣又有點(diǎn)小個(gè)性的風(fēng)格。顏色上，我用黑白灰這種經(jīng)典搭配，然后加一點(diǎn)點(diǎn)亮眼的紅色，這樣整個(gè)網(wǎng)站看起來(lái)既高級(jí)又不沉悶，還有點(diǎn)小亮點(diǎn)。

設(shè)計(jì)風(fēng)格定，我就開始弄具體的頁(yè)面。我把每個(gè)頁(yè)面的內(nèi)容都好好排排版，哪些地方放圖片，哪些地方放文字，文字怎么寫，都得好好琢磨。我盡量讓文字簡(jiǎn)短、重點(diǎn)突出，圖片，就選那些最能代表公司設(shè)計(jì)水平的。我還特意把一些交互元素做得不太規(guī)則，讓整個(gè)頁(yè)面看起來(lái)更活潑、更有趣。

• 重點(diǎn)突出：重要的信息，比如公司的名字、口號(hào)啥的，我都會(huì)放在最顯眼的地方，讓人一眼就能看到。
• 圖片精選：圖片可不能亂放，得選那些質(zhì)量高、又能體現(xiàn)公司設(shè)計(jì)風(fēng)格的。
• 文字簡(jiǎn)練：文字能少就少，但要說(shuō)清楚重點(diǎn)，讓人一看就明白。

讓網(wǎng)站“活”起來(lái)——加點(diǎn)動(dòng)效

光是好看還不行，我還得讓網(wǎng)站“活”起來(lái)。我在一些地方加點(diǎn)小動(dòng)效，比如鼠標(biāo)移到圖片上，圖片會(huì)放大或者變色啥的。這樣用戶在瀏覽網(wǎng)站的時(shí)候，就不會(huì)覺(jué)得太單調(diào)，還能增加點(diǎn)互動(dòng)性。

“測(cè)試”一下，看看效果

網(wǎng)站做得差不多，我就開始“測(cè)試”。我自己在不同的瀏覽器、不同的設(shè)備上都試試，看看網(wǎng)站有沒(méi)有啥問(wèn)題。我還找?guī)讉€(gè)朋友幫忙看看，讓他們提提意見(jiàn)。根據(jù)大家的反饋，我又對(duì)網(wǎng)站做一些調(diào)整，改改一些小細(xì)節(jié)。

大功告成，網(wǎng)站上線！

經(jīng)過(guò)一番折騰，網(wǎng)站終于做好！設(shè)計(jì)公司的人看很滿意，我也覺(jué)得挺自豪的?？粗约旱淖髌吩诰W(wǎng)上展示，那種感覺(jué)真是太棒！

這就是我這回做設(shè)計(jì)公司網(wǎng)站的整個(gè)過(guò)程。雖然有點(diǎn)累，但收獲滿滿。希望我的分享對(duì)你們有點(diǎn)幫助！