Day 18 - 開發小知識(二) : 切版學習之路、實作精進切版

每日一談

嗨，大家好 ! 我是阿蘇
今天是 Day17 ， 前面的切版實作技巧分享差不多了，最後實作來分享一些學習心得，跟精進切版技巧的方法，切版易懂難精，常常實作才會發現有許多問題，可能是觀念不通，或是不夠熟練，最快的進步方式就是實作切看看，讓我們當一個切版魔人吧 !

學會查看原始碼

要如何知道自己寫的css樣式有沒有寫對呢?
有時候拼錯一個字，少打一個符號，css樣式就失效，就會花很多時間在找問題在哪，所以學會查看原始碼看自己寫的css是很重要的，也可以去各大網站查看人家寫法學習

學習之路規劃

• HTML 基礎
• CSS 基礎 (文字、色彩、border、間距、w/h)
• 基礎實作練習 (找簡單區塊試著練習排版)
• CSS 排版 ( Width 、不同版面變化)
• CSS 深入 ( 動畫、偽元素、RWD 、position)
• 實作練習
• 試著模仿大型網站

切版如何精進

1. 先從簡單小區塊切起，試著切出一模一樣的區塊
2. 當開始能掌握大部分的小區塊，試著找一些比較基礎版型(單欄、兩欄、三欄) 去切看看完整一個頁面練習
3. 開始試著使用 git /github 去上傳作品，分類管理檔案(分不同頁面、SASS/SCSS檔案規劃)
4. 再Day 5 - 開發前準備(三) : 蒐集資料、擬定風格我們有介紹很多蒐集資料的參考網站，試著挑一個來製作完整一個網頁，把你所學運用不會的試著google尋找答案，切出一個３～４頁較完整的網頁欸
5. 使用gulp 、webpack去開發網站，然後管理分類檔案，將你的專題架構建立起來
6. 最後不斷不斷實作實作練習練習，目標 大部分網站都切出來、不會的能夠自我上網找到答案、學會搜尋問題關鍵字

總結

切版的基礎實作就分享到這邊，後面開始就會進入正式開發，就會使用 bootstrap 來講解正式開發專案技巧，如果還沒學到那麼深入的，可以先把前面這些基礎關鍵字一一去google ，學扎實後在前往下一步喔 !