五倍紅寶石・專業程式教育

五倍紅寶石 ・專業程式教育機構

CSS 真的這麼難學嗎?Amos 老師指點你學習捷徑!

五倍紅寶石專業程式教育機構講師團隊的專業師資 - Amos Lee(李建杭),一開始從事平面設計,後來轉職成網頁設計師,這陣子更是出了一本暢銷的技術書籍 - 金魚都能懂的CSS必學屬性:網頁設計必備寶典,解決了許多新手或 CSS 苦手的使用困擾。雖然 CSS 看似簡單,其中卻有很多技術上的「眉角」,很多屬性之間會互相影響而產生各種意想不到的效果,特別是新手學習 CSS 初期若用死背的,在版面需要進階變化時就會出現 Bug,而不同的瀏覽器可能會有不同的細節和眉角要注意,但 CSS 真的如大家所說那麼難學嗎?

若你有這樣的困擾,不如閱讀以下這篇直播活動的紀錄文,讓 Amos 跟你分享更多 CSS 突飛猛進的訣竅和方法。

是什麼原因讓 Amos 想要再度出 CSS 的相關書籍

隨著技術圈的發展,網頁設計資訊量非常龐大,但每個人的學習時間是有限的,但新手苦於無法判斷哪些東西需要優先學習,因此,這本書篩出最重要且新手必需要知道的基本觀念,以及九成以上的開發者必需要知道的基本屬性!新手可以藉由這本書掌握最基本的技術;除此之外,使用者也可以將這本書當作百科全書來用,當你看到不熟的屬性,就可以翻閱該書再次確認屬性的原理和使用方式。

什麼樣的人適合讀這本書?

無論是新手入門網頁設計,又或是初學者在做網頁設計時會遇到的狀況,都可以靠這本書來解惑。 當然網頁設計學習者也可以把這本書當成字典來查詢,當你看到某個語法想學習或確認,都可以透過翻閱這本書來找到屬性的原理和定義。

覺得 CSS 最難懂,最多人卡關的地方?

Amos 老師提到,很多人在寫 CSS 的時候,會碰到定位的問題或尺寸計算錯誤,導致畫面跑版,而這些畫面不如預期的效果,往往跟基本觀念不夠扎實穩固有關係。

老師更建議大家,切版是一件很活的事情,但並不能學,唯有打穩基礎,完全的理解原理,這樣才能快速開發。

Tailwind CSS 是一個值得學的工具嗎?

在技術快速發展的現在,每個工具的發明都是為了解決開發者的問題,因此 Amos 老師建議大家要懷抱的開放的心態去擁抱新技術,了解每個工具的適用性和和開發情境,只要用對了,那這就是一個好工具。

👉 課務小幫手:如果你想了解 Tailwind CSS,可以了解五倍紅寶石的短期課程 - 升級前端技術從 Tailwind CSS 開始

Tailwind CSS

如果想找一群夥伴共讀,會建議如何共通讀這本書

這本書其實對很多人來說就像本活字典,遇到問題去翻閱就會找到對應的原理和範例。老師非常鼓勵三五好友揪團開讀書會,大家可以藉由共讀的方式,聊聊自己的使用經驗和分享自己與書上不同的寫法,藉著彼此交流相互成長。若是未來想要邀請老師一起加入讀書會,老師也很樂意參與,除了可以和大家經驗交流,也可以以作者的角度分享一些心法和祕技。

新手常常覺得懂了原理,但碰上實戰就很卡

很多人在碰到問題時,會在網路上搜尋對應的資源,找到語法後也只是套用並沒有真的透徹理解,建議所有新手在學的時候,理解其原理,後續的進階應用才會更有效率。

Amos 老師也提到,常碰到新手跟他說:「因為自己有些不熟的地方,所以覺得要多寫才會記住。」老師認為大量練習是有效的,但是新手很容易會落入一個迷思,只要一直寫就會進步,如果你只是學會複製貼上,那麼就算是大量的練習,你也不會有明顯的進步,大量練習的目的除了熟能生巧之外,重要核心精神是要正確練習,並且要理解為何這麼寫。

而老師在 code review 的時候,常會反問學習者為什麼要這麼寫,但對方常會誤解,認為這樣的舉動是在找麻煩,其實這些反問的過程,都是要讓學習者去思考這樣寫的邏輯以及原因,去判斷是不是真的理解,並適時補充,這樣的輸出才能有真實的效益。

上課時,老師常發現學生會同步抄寫老師講解的 code,其實 Amos 和五倍紅寶石專業程式教育機構創辦人 - 龍哥都認為這不是個好方式。因為這些跟著敲打的瞬間,你會以為自己做出效果了並且學會了,但這其實是進步的假象,兩位老師建議大家最好的學習方式,是要能夠在第一時間聽懂原理,接著再實際演練自己聽懂的語法。

有考慮出電子書嗎?

Amos 老師表示,目前自己的著作並沒有電子版本的計畫,除了老師比較喜歡紙本的溫度之外,老師也很擔心資訊被剽竊,畢竟每一本著作都是作者的心血,更重要的是翻閱紙本時,會有些記憶效應,在翻到某個章節時,會寫起曾經記下的一些重點,那是電子版本所難以達到的效果。

Amos 老師有遇過有學生怎麼講都聽不懂的情況嗎

其實 Amos 老師在上課前會希望能知道這個班級的性別和年齡組成,又或是每位同學來自什麼背景,當同學卡關的時候,老師就會試著用跟學習者領域相仿或相關的知識去做類比,讓大腦產生關聯性。

倘若學習有時限的壓力或是馬上要提交給客戶的設計稿,但怎麼樣都想不通其原理,老師會請你先用背的記下來,雖然這不是一個好的方法,但是學習就跟拼圖一樣,哪裡有洞就補哪裡,這個地方卡關,先休息或換拼別的地方。有時候當你轉個彎,或先做別的事,隔一小段時間再回頭看,你會意外發現自己卡關的地方竟然開竅了。

要如何保持顛峰,維持學習狀態

Amos 提到維持學習狀態最好的方式就是對技術保持熱情,而五倍紅寶石專業程式教育機構創辦人 - 龍哥也認同,畢竟不同的工具會解決不一樣的問題,抱持著開放的心態去學習,除了學到技能本身,也會認識其生態圈和更多與原本領域不同的文化。

一般 104 上的網頁設計師的職缺需求能力要到什麼程度

網路上的職缺大概簡單來說可以分成三大類,一個是純設計但不切版,另外一種則是會設計和切版,也會知道怎麼使用套件,最後一種則是前端工程師,設計的部分相對少了,除了切版之外,還會搭配 JavaScript 和串 API 等技術,而薪資當然會隨著你的技能多寡而有所不同。

要如何看到版面,馬上就知道怎麼切?

其實這些都跟經驗有很大的關係,當你做過的作品越多,練習過的版面越多,你會越來越知道某個畫面可以很快用什麼方法切出來,其實要可以快速切版,和你對原理的熟悉程度有很大的關係,而成功地不二法門,唯有大量且正確的練習!

看完這些直播活動的精彩紀錄,有沒有受益良多的感覺呢?趕快回放再次觀看當天的直播活動- CSS 真的這麼難學嗎?Amos 老師指點你學習捷徑!

👉課務小幫手:如果聽完這場活動想要了解更多關於網頁設計的開發課程,也歡迎報名網頁前端設計女性專班,讓我們陪妳從零基礎前進網頁設計師之路。

Code for Girl

訂閱文章

  • 五倍直播間