怎麼梳理大量複雜的知識內容?

學前端,到css,目前感覺是學新忘舊,用心記了,代碼也操練多遍,筆記也反反覆復看,但就是用到某標籤時就想不起某個屬性或標籤長啥樣了,後面還要涉及到諸多雜亂的知識,我想請前輩您是怎麼梳理這麼多枯燥無味而又多的知識點。

- - - - -- - - - - - -- - -

多讀多敲多看,這我懂,但還是記不住,我現在是明白什麼是天賦的重要性了,我這人笨,學東西比別人用的時間長,唉……


實際開發css代碼通常是這樣「寫」的

調試css的時候是這樣的

所以不需要記全名,知道字體是「font」,顏色是「color」,然後讓工具去「聯想」提示就行了。


1、什麼天賦不天賦的,簡直就是用心和不用心。

2、問問自己,有沒有給自己適當的休息時間?因為學習要保持大腦清醒,思路清晰。

3、多思考,對每個標籤的用法都要深入了解,多思考,舉一反三。說起舉一反三,讓我想起以前教我英語的譚老師,曾經跟我們說過單詞不要死記,學了一個單詞就要多用這個單片語句。。。


各種強答,叫題主務必要用心,要努力,再不然就是xx軟體xx組織萬能。諸位,看完標籤確定完領域再答題好嗎?

----------------

有個成語叫:高屋建瓴

編程是實踐性很強的工作,靠背背背是沒有太多成效的。

學習編程,特別在前端領域。初期最大的問題就是無法抓住技術主幹。各種細枝末節都覺得應該要能記住,『萬一以後工作要用我都完全不會寫多丟臉!」。所以有的同學想把基本功打好吶,先苦學3個月HTML5,再鑽研CSS3半年,把各種標籤、屬性、hack、草案刷了一次又一次。[嚴肅臉]這種學法,可能你學習速度還沒該技術發展速度快。

剛開始學習的階段,推薦HTML 系列教程 大致讀一遍混個臉熟,就多實戰掌握看案例。知道什麼是div+css布局。下個dreamweaver,實際感受下table布局和樣式內容分離比起來有多蠢,然後怒而刪之? ヽ(`Д′)? ┻━┻

強調:不要一早就分散過多精力在細枝末節上。有些令人費解的屬性,可能只是由於早年瀏覽器戰爭的歷史遺留,或是早年開發人員的惡趣味。想太多反而不好。

初期,&&&

&&&加上表單元素,合理運用class和id,配合css里的font,line-hight,text-align,text-indent,background,color,margin、padding、display、position、float、clear、border加上一些上下左右、寬高的屬性,可以實現絕大多數靜態頁布局需求。語法這種程度就夠了。然後需要就是多實踐,去分析頁面結構,一次次踩坑掌握盒模型、浮動、絕對定位的正確使用姿勢,看一些大家都推薦的書,養成良好命名習慣和代碼風格。(其實有些網課的老師代碼寫得並不好看,命名還總喜歡寫個haha、hehe,有底子有三觀再去刷網課)推薦:《精通CSS:高級Web標準解決方案》一書,學到能理解上面的案例的程度。這時,實踐中接觸過一些偽類啊,覆蓋層級的問題,細節得到了一些補充,你對網頁排版就算基本入門了。這時候再去看論壇和視頻網站的xHTML+CSS或著CSS3濾鏡什麼的,基本上就是做完大題聽講解的難度。

這時候可能就有些微的追求了,想邁進更高的層次。

強力建議!不要急著去啃大篇幅的HTML5、CSS3、Canvas、SVG詳解。先去看JS。看看基本語法,找著敲完書上案例。知道什麼事是該JS做,什麼事該CSS做。面對問題時,這時候你應該就有一些基本的解決範式了。這水平已經是忽悠大學網頁製作相關課程老師給你打90分以上的水準了,我會說我學校的不少老師都堅持認為只要寫了JS動效,用了偽類,就是高級網頁,不算靜態頁啦!

這時候,熟悉那麼20-30個html標籤,能找著圖片或成品網站做出大致相同的頁面。能用JS寫一點多層標籤,輪播圖一類的簡單效果。這時候,恭喜恭喜,你已經可以算是 [初級]-[若不經風的]-[找不到什麼靠譜實習單位的]-[還不如個美工的]-[卻自信自稱程序員的]-[手寫百行(CSS)不出BUG的]-[其實隨便什麼人都能輕鬆取代的]-[不知道綜合論壇里其他人在說什麼的]-[白色品質]-前端程序員。

如果不急著找工作換口糧,在這個階段,根據你的知識儲備,一邊堅持每周擼至少一個網站主頁,花1-2月的時間,補補TCP/IP,HTTP的基本概念,願意翻翻Linux新手入門、PHP一天通、Nodejs教程的更好不過。主要目的在於開闊視野,預先熟悉前端開發中需要和什麼人配合,什麼樣的標籤結構後端同學比較喜歡,習慣用前端開發者的視角看待其它技術。至少要混到一種,不寫代碼時能被人誤會是專業人士的程度。

有了以上的準備,好了,你已經不用再擔心面對一堆CSS屬性,JS的框架。不知所措的囧境。基本的技術嗅覺你已經具有了,在知乎或者其它職業培訓網站找個職業路徑圖。只需要按部就班跟著刷,有選擇性的摘錄,記憶,練習。享受技術飛升的快感吧。

總結一下,你現在感覺的問題,主要就是因為不知道各種屬性在實際使用的權重,沒重點的學習。這種時候,視野比努力更重要,儘力儘快去掌握整體框架。

說點廢話(?-_-?),在熟悉整個前端架構後,才算是真正的學習前端開發。戒驕戒躁,不要急於去玩開源、新JS框架,耐心把整個體系用不同的資料刷幾次,查缺補漏,勇於接受衝突的觀點,保持獨立思考。日常學習推薦還是以看書和博客里的長篇教程為主,視頻為輔。練手作品盡量以技術為驅動--(類似於學了個XXX屬性,(嗯,(想這東西可以怎麼怎麼玩,(而不是一排腦袋說要做個彈幕網站,(然後到處提傻瓜問題,(XXX怎麼現實,XXX該怎麼做,(大家都很忙,要學習,你為什麼不問問神奇海螺呢?))))))))

寫博客做筆記是,定時整理網頁收藏夾,留意大牛都是功在千秋的好習慣,望保持。

以上。


怎麼科學梳理我是不知道了,但是你要記那css這些代碼相關的東西我倒是知道,登登登登,那就是樓主你壓根就不需要記,為什麼呢,如果我沒猜錯的話你還是學生或者接觸代碼不久,還停留在要把所有東西記到腦海里這種思維,以前我也是拚命做筆記,什麼html,css,javascript,jquery... 都密密麻麻的記,但是你知道嗎,尤其像前端這種,真的是每天都在變,你壓根記不來那麼多東西,但是你要用呀對吧,沒錯,這時候你只需要對整個東西有個大概的了解(不要去記細節),然後知道從哪裡可以查到它的用法和demo就ok了(要善用好搜索引擎),之後實戰(不是簡單的做做練習哦)中用多幾遍你自然就會記住了,而且就算日後忘記了,憑著你對它有個大概的了解就可以重新找回來了。


在初高中,我記得有個錯題本的東西,大學以來學的東西都容易忘,第一,不經常用,第二,環境不同,腦子太多東西要想,要去梳理。

推薦個app,有道雲筆記,iOS系統,可以下載印象筆記,每學一樣東西,善於寫總結,順道把易忘的也寫進去,沒事多看看,忘了就查。而平時要查找的網頁,弄個標籤頁,沒事多翻翻。


多寫代碼,寫博客反思,人之所以進步,是今天學習的東西和昨天所學的是不一樣的。


對應技術學習,只要完成這三點就好了:

1.這項技術有哪些關鍵知識點,原理。與學會的其他技術有什麼更新

2.每個知識點能完成什麼事情。大概如何使用?具體使用細節在哪裡可以查到?

3.多使用該項技術,並總結。找到知識點之間的聯繫


完全不背 忘記的時候全靠stackoverflow 知道有哪些功能就好了 與其花時間背不如多做做東西build up muscle memory


用可以做標註的軟體

再看的時候可以只看自己標註的東西,避免重複閱讀。

PS:

據說龐加萊能記住看過東西在書的哪一頁,我好生羨慕。


使用百度腦圖工具幫助記憶


pocket. 印象筆記

具體操作自己探索吧


多學學英語,英語單詞的語感


注意休息,不行了,看了一下午知乎,睡覺去-_-#


試試Mindmap 吧


先畫導圖

然後 找個本子用筆畫

你整理得越科學越系統

手寫默寫得就越流暢

卡住了

說明你原來的導圖沒有理清楚

比如 基礎css 分樣式和布局兩塊 布局再分 盒子 浮動 定位 。。。 然後再分。。。再分

默寫不出導圖就是沒有理清楚

然後是運用

因為你學的都是死知識,如果用不了沒有用,你不可能記住


學習方法是因人而異的。

具體到製作網頁的HTML/CSS方面,有一個方法,就是模仿,模仿你看到的網站的頁面效果,然後自己寫一個類似效果的。瀏覽器是可以看到頁面的源代碼的,CSS也可以看見。不會就查書。做出來了,再去鑽研一遍書。至於CSS么,通常就是參考已有的CSS修改一下。

網頁一般就是用模仿的方法學習效率最高。當然權威文檔,比如HTML/XHTML/HTML5/CSS的標準,是一定要有的。英文版,有空可以翻翻。

另外,不要捨不得花錢買書。還可以充分利用圖書館。


我一直都想梳理一個個人wiki出來...最後由於各種原因擱置了...


用腦圖或者印象筆記記錄筆記 看書記筆記 寫東西總結記筆記。多寫。


感覺如果知識是系統化的知識,可以記憶的很好很系統,那些工具性的知識即用即查就可以了


我一直覺得我記不住就在紙上寫

寫大綱

寫完大綱 畫張圖

有點到面 由面到點

大概以前畫畫的原因

覺得把知識結構畫出來特別有成就

雖然字很醜

不過寫著寫著就記住了

然後反反覆復讀

不知道 是不是土了一點 當然 代碼什麼的 我還真沒有經驗

也沒有打聽過

所以 也來看看大家怎麼想的


推薦閱讀:

有哪些炫酷的sublime text3 主題?
成為一個全棧工程師是一種什麼體驗?
大公司或專業團隊目前流行的前端工具有什麼?
如何考察候選人 Vue 技術水平?

TAG:前端開發 | 個人知識管理 | 前端工程師 | 前端入門 | 思維導圖 |