今天就我自己的經驗跟大家分享一下，
培養切版技能的方向～

第一階段：練習什麼靜態版面都要可以切出來

1. 基本的CSS原理一定要懂

CSS有很多，有些更是使用率高達99.99％的CSS，
這邊挑出2個我自己覺得一定要懂的CSS原理的CSS樣式

position

fixed, relative, absolute, static，之間的差別是什麼？
absolute會以哪裡為定位？
static 跟 relative的差異在哪裡？

display

inline, inline-block, block, flex，之間的差異是什麼
什麼時機點適合用哪一個

以上這兩個css可以控制主要的定位排版，不只要知道單一個的功能可以做到什麼，
也要知道彼此之間的差異，這樣才能根據原理選擇適合的屬性

2. 練習看著圖就能分出HTML結構

HTML結構的分法也是切版裡很重要的一環，
如果你不是很確定怎麼分，可以先畫在紙上大概想一下，再正式撰寫，試試看方法是否可行

3. 理解簡單的js概念

一個網頁裡面全部都是靜態畫面幾乎是不可能的，切版的你也要懂一些基本的
js，eg. 點擊後，加上class顏色改變 這種簡單的觸發事件，要大概知道要怎麼下手

4. 可以試著用scss寫css

這裡建議scss而不是sass的原因是因為scss code可以與css code直接相容，
因此你把scss寫成css也是完全沒有問題的，進入門檻較低。
從中也可以慢慢練習scss的特型，如變數、mixin等等，慢慢理解scss的優點及怎麼使用

第二階段：練習用別人的套件加深概念

1. 了解Bootstap的概念

Bootstrap就是一個UI的框架，經過很多代的演進，很適合當作切版的Guideline參考，
不一定要全部照抄使用，但可以了解他的概念之後，用在自己的切版專案上

2. 試著使用Bootstrap的動態元件

一開始我們可以先使用bootstrap的動態元件，eg. modal, popup，
了解別人的效果套件怎麼做，之後真的要做的時候也比較會有概念

第三階段：切版整體架構及Reuse的思考

SCSS的結構

1. scss 的如同前面說的 Sass 7-1 Pattern、SMACSS，都可以有結構的分類你的scss
2. scss 檔案的切割好壞，也會讓影響後續在reuse同一個切版元件的難易度

怎麼做可以更大化的Reuse？

每次切版都要重切嗎？很多類似的版為什麼每次都要重切呢？想想看怎麼樣要怎麼做才能讓你的版型可以從這個案子帶到下一個案子

第四階段：關於切版的其他技能

當你覺得你的切版越來越熟悉了，其他的切版技術類型也可以注意研究
PostCss, Storybook 等等與，切版相關的技術，
都可以幫助你的切版達到另一個層次

不分階段：了解設計與串接資料的需求、限制與概念

切版是一個銜接設計圖稿與資料串接的中間人，所以不是傻傻的一直切版就好，
必須不斷的了解上下游的需求及限制，適時的給予建議，才能共創大家都好做的網頁版型ＸＤ

最後，最好的學習方式就是實戰，透過不斷的實戰練習，會遇到很多不同的議題，
漸漸的就會不斷的成長了，很大家一樣，我也還在需要更多努力的道路上～～～～