想要學(xué)習(xí)新東西或想要取得突破的網(wǎng)站或平面設(shè)計(jì)師和創(chuàng)意人第一件要做的事情就是需要“戒掉”拖延。 你沒有在每天踏出你的第一步，那么你將遠(yuǎn)遠(yuǎn)落后于其他人！

按照以下步驟開始你的學(xué)習(xí)計(jì)劃——如何在30天內(nèi)創(chuàng)建你的第一個(gè)網(wǎng)站！

1.開始（Start a Website）

開始學(xué)習(xí)網(wǎng)頁設(shè)計(jì)的最佳方式是你實(shí)際上直接參與它。 這是DesignHackers這本書的作者David Kadavy的建議。

你不必從龐大的網(wǎng)站或瘋狂的設(shè)計(jì)開始，從小的事項(xiàng)開始去慢慢了解，比如通過瀏覽網(wǎng)站，弄清楚是什么讓它如此有效（或相反），同時(shí)你可以檢查代碼，以便你可以開始熟悉將使你的網(wǎng)站正常工作的內(nèi)容。

2.閱讀你需要的一切（Read Everything You Can）

開始閱讀。 你可能已經(jīng)習(xí)慣于及時(shí)了解設(shè)計(jì)世界中正在或即將發(fā)生的事情。 請(qǐng)繼續(xù)抱有這種熱情并積極閱讀。

閱讀有關(guān)網(wǎng)站設(shè)計(jì)，趨勢，技術(shù)和最佳實(shí)踐的所有內(nèi)容。 在社交媒體上關(guān)注你覺得很棒的設(shè)計(jì)師。

為你的網(wǎng)站設(shè)計(jì)閱讀階段積累足夠的知識(shí)和經(jīng)驗(yàn)。 閱讀有關(guān)學(xué)習(xí)一些代碼的基礎(chǔ)知識(shí)，閱讀有關(guān)設(shè)計(jì)理論的知識(shí)，閱讀教程和當(dāng)前文章。

3.成為一個(gè)有效的溝通者（Be An Effective Communicator）

如果你不是善于表達(dá)的人，那就要熟練掌握這些技巧。 網(wǎng)站設(shè)計(jì)的一個(gè)重要部分是溝通。

網(wǎng)站設(shè)計(jì)師必須定期與客戶溝通，以確定設(shè)計(jì)需要解決的問題，他們必須傳達(dá)這些解決方案并實(shí)施它們。

4.訂閱Tuts+以及Envato Elements（Subscribe to Tuts+ & Envato Elements）

考慮訂閱Envato Elements，這也可以讓你訪問優(yōu)秀的Tuts +學(xué)習(xí)資源。

Tuts +會(huì)定期發(fā)布關(guān)于圖形和網(wǎng)頁設(shè)計(jì)的常規(guī)課程，從基礎(chǔ)技術(shù)到最新的高級(jí)方法和發(fā)展。 它完全是自定進(jìn)度的，由專業(yè)教練講授。 你還可以訪問Envato Elements，這是查找圖形，模板等絕佳資源的站點(diǎn)。

5.思考HTML（Think in HTML）

HTML或超文本標(biāo)記語言是網(wǎng)站設(shè)計(jì)的基石。 HTML是幫助創(chuàng)建網(wǎng)站結(jié)構(gòu)的骨架，一旦你學(xué)會(huì)閱讀該語言，網(wǎng)站設(shè)計(jì)的世界將更有意義。

W3Schools有一個(gè)很棒的HTML入門教程，里面有數(shù)以百計(jì)的HTML示例，你可以在屏幕上看到它們，看看會(huì)發(fā)生什么以及它是如何工作的（你可能會(huì)發(fā)現(xiàn)它比你想象的更直觀）。

6.通過Codeacademy了解代碼（Play with Code at Codeacademy）

雖然HTML是一個(gè)良好的開端，但你幾乎可以從Codeacademy學(xué)習(xí)任何編程語言。 免費(fèi)工具將教你如何使用交互式活動(dòng)和進(jìn)行編碼。

你可以隨時(shí)隨地選擇Codeacademy課程，并根據(jù)需要啟動(dòng)和停止。 選擇要學(xué)習(xí)的科目-網(wǎng)絡(luò)開發(fā)，編程，數(shù)據(jù) - 或?qū)Ｗ⒂谡Z言-HTML和CSS（一個(gè)很好的起點(diǎn)），Python，Java，SQL，Ruby等。

7.學(xué)習(xí)樣式（Learn to Understand CSS）

CSS或級(jí)聯(lián)樣式表定義了用HTML，XML和SVG編寫的文檔的表示。

Mozilla還有很多CSS資源可供入門者使用，并詳細(xì)介紹了CSS的工作原理，包括選擇器和屬性，編寫CSS規(guī)則，將CSS應(yīng)用于HTML，如何在CSS中指定長度，顏色和其他單位，級(jí)聯(lián)和繼承，盒子模型基礎(chǔ)和調(diào)試CSS等。

8.將你的設(shè)計(jì)技巧應(yīng)用到Web上（Apply Your Design Skills to the Web）

如果你已經(jīng)在創(chuàng)意或平面設(shè)計(jì)領(lǐng)域工作，請(qǐng)考慮你已經(jīng)知道的可以應(yīng)用于網(wǎng)站設(shè)計(jì)的內(nèi)容。 使視覺上具有吸引力的原則不會(huì)基于媒介而改變，所有設(shè)計(jì)理論也將在數(shù)字空間中派上用場。

雖然學(xué)習(xí)代碼等元素可能感覺不自然，但擁有設(shè)計(jì)背景是一個(gè)巨大的好處。 如果沒有人愿意與之互動(dòng)，那么編碼再精巧的網(wǎng)站有什么用呢？

9.關(guān)注你喜歡的網(wǎng)站（Pay Attention to Websites You Love）

記下你喜歡的網(wǎng)站。 他們對(duì)你有什么吸引力？ 你要怎么學(xué)會(huì)復(fù)制這些元素？注意：

· 字體

· 導(dǎo)航

· 圖片以及空間的使用

· 表格的設(shè)計(jì)

· 動(dòng)態(tài)交互以及滾動(dòng)效果

· 用色

10.框架草稿（Draw a Wireframe）

框架草稿是網(wǎng)頁設(shè)計(jì)師的頭腦風(fēng)暴階段。

在最純粹的形式中，線框是網(wǎng)站內(nèi)容的草圖。 它不是美學(xué)元素的輪廓，而是網(wǎng)站的藍(lán)圖。 繪制線框并不是關(guān)于這種設(shè)計(jì)的外觀，而是關(guān)于其中的信息結(jié)構(gòu)。

11.花一些時(shí)間學(xué)習(xí)Sketch（Take Some Time to Learn Sketch）

Sketch是Mac的矢量繪圖工具，可以輕松創(chuàng)建設(shè)計(jì)元素。 許多設(shè)計(jì)師正在轉(zhuǎn)向Sketch來創(chuàng)建UI元素等設(shè)計(jì)項(xiàng)目。

它包含各種插件，允許你導(dǎo)出代碼以便于使用和訪問。 它是自Adobe的Creative Suite以來最強(qiáng)大，最受歡迎的工具之一，非常值得你花時(shí)間。

12.隨時(shí)了解技術(shù)（Stay Up to Date with Technology）

AI，VR，AR，全景視頻，機(jī)器人。

有許多新技術(shù)和趨勢可能很難跟上。 但是你需要掌握這些變化。

一次解決一個(gè)問題，從與你所做工作最直接相關(guān)的技術(shù)開始。 如果你有一個(gè)在線聊天的網(wǎng)站，首先要了解機(jī)器人。 或者，如果你將使用大量視頻內(nèi)容，就關(guān)注和視頻相關(guān)的技術(shù)。

人工智能和虛擬增強(qiáng)現(xiàn)實(shí)等技術(shù)更復(fù)雜，但很可能成為網(wǎng)站設(shè)計(jì)領(lǐng)域的一部分。 至少，你應(yīng)該知道它們是什么以及可能的用途。

13.考慮SEO（Get Comfortable with SEO）

雖然許多網(wǎng)頁設(shè)計(jì)師認(rèn)為搜索引擎優(yōu)化應(yīng)該交由專業(yè)的人員來處理，但很多設(shè)計(jì)工作都與搜索引擎優(yōu)化有關(guān)。

從圖像上傳的方式到創(chuàng)建干凈的代碼，包括頁面和元素的元描述，設(shè)計(jì)師應(yīng)該將搜索思維融入他們的工作流程中。

自由職業(yè)者，這對(duì)你也很重要。 大多數(shù)客戶都足夠精明，會(huì)要求SEO優(yōu)化的網(wǎng)站。 如果你獨(dú)自工作，你需要足夠的知識(shí)來創(chuàng)建一個(gè)可以閱讀的可靠框架（并且如果需要做更多的工作，可以將客戶推薦給SEO專家）。

14.了解網(wǎng)站搭建工具（Play with a Website Builder）

網(wǎng)站構(gòu)建者可以很好地熟悉最佳實(shí)踐以及快速開始構(gòu)建和設(shè)計(jì)網(wǎng)站。

這些工具中的大多數(shù)都有大量的模板，允許你自定義元素甚至添加代碼片段。 對(duì)于簡單的網(wǎng)站，許多網(wǎng)站建設(shè)者也有一個(gè)免費(fèi)的計(jì)劃，你可以在其中創(chuàng)建個(gè)人投資組合頁面或基本網(wǎng)站。

然后在網(wǎng)站構(gòu)建器中挑選出各個(gè)部分，看看它們的設(shè)計(jì)和編碼方式，以了解它們?nèi)绾谓Y(jié)合在一起。

15.尋找導(dǎo)師（Find a Mentor）

是否有與你合作過的人，或者和你比較熟悉的設(shè)計(jì)師？ 和他們一起去吃午餐或進(jìn)行簡短的談話，了解他們關(guān)于這個(gè)行業(yè)的認(rèn)識(shí)。

尋找愿意與你合作并能夠你思考該領(lǐng)域以及如何自己學(xué)習(xí)網(wǎng)頁設(shè)計(jì)的導(dǎo)師是非常寶貴的。 雖然你可以在網(wǎng)絡(luò)社區(qū)找到一個(gè)導(dǎo)師，但沒有什么比一個(gè)你可以定期面對(duì)面的活人更好。 

返回首頁 了解更多建站資訊