感謝旗標出版社贈書試閱，我有好好把這本書看完。本文除了心得外、另寫了些個人和書中觀點不同的部份。這是本值得入手的好書。

結論

先講結論：我最喜歡日本人寫的教學書啦！一條條要怎麼做、不要怎麼做列得清清楚楚。雖然這本對我來講就是復習，但有很多即使我很熟悉的觀念，要講給別人理解的話沒辦法講的比這本書好。

這本我覺得是給初學到入行 3 年左右的網頁設計師看的。大約有半本拿 Photoshop 當操作範例，若是 PM 或企劃要研讀本書請斟酌一下，但前 1/4 的觀念滿適合非設計師閱讀。

看日本人寫的教學書有另一個好處：他們的日文、漢字比較接近繁體中文，在字體編排上各種注意事項、細節等，會比英文字母更適合台灣人研究。

這本書大概能說是作者的踩坑紀錄，初學者剛接觸網頁設計頭幾年，該被坑過的陷阱大都踩到了…

個人閱讀

以下是我把整本看完寫的筆記，基本上沒特別提到的部份和作者觀點相同。在這裡只提出不一樣的部份，如果你有入手這本書可以一起搭配著看。

22 用圖層管理滑鼠指向效果及裝置文字

不確定是翻譯人員太好心或是原文寫日文，圖層命名請全部用「英文」。不要使用中文。

25 使用雲端圖示字型製做簡易圖示

為了對應 Retina 高解析螢幕，目前業界有股潮流使用雲端圖示字型。但我自己不太喜歡這種作法。很久以前逛日本的 Wacom 官網時，網站上所有的 icon 全部都變成方框，icon 旁沒有任何說明文字，我非常不爽地把所有方框都按一遍爬資料後才想起是自己瀏覽器設定過字型蓋過網頁本身的設定，所以看不到任何圖示。

當然、會使用雲端圖示字型一定有各種考量，甚至有 SVG 這個選擇，但目前我還是先觀望…

P.78 不透過設計軟體的瀏覽器設計（in-browser design）

…RWD 和動態效果平面圖無法傳達…為了順應此潮流趨勢，設計師也必須具備撰寫程式的基礎知識。

如果是「網頁設計師」，網頁程式的基礎知識必須要具備。
如果是「UI 設計師」，我就不覺得是「必須」了，會撰寫程式是加分。有很多工具可以輔助 RWD 和動態效果與專案成員間的溝通。

最近常聊一個話題：UI 設計師是否一定該會 HTML/CSS？很多職缺上都要求要會。

就和「全端」工程師一樣啊。什麼都要包，錢還是給一個職務的錢。網頁設計師一定要會手寫 HTML+CSS 不然玩什麼？UI 設計師會手寫 HTML+CSS 大加分，但不是必備。我不懂為什麼要把 F2E 和 UI 設計師混在一起講，明明工作內容不一樣。老闆想省錢少請人、別助長歪風啊。

58 讓圖層面版告別「髒亂衣櫃」的狀態

一定要好好整理圖層、好好命名！但書中建議取消「增加『拷貝』至拷貝的圖層和群組」，我不建議這樣做，會忘記哪個圖層改好命名、哪個圖層還沒改，配合外掛切圖時一旦沒有檢查到重復圖檔命名，跑出來的圖要抓漏很痛苦。

60 將元素「狀態」整合一起

書中的按鈕狀態只有 on、off 兩種，但按鈕狀態有 5 種…

• normal
• hover
• clicked / pressed
• selected
• disabled

72 有助於撰寫程式的 Photoshop 「拷貝CSS」

拷貝 CSS 是非常方便的功能沒錯，但我很少用它，它都是「絕對位置」的座標啊！拷貝漸層色之類的就很好用。

75~84 illustrator

我覺得做印刷的軟體拿來做網頁設計不太適合，但高手用小畫家也畫得出蒙娜麗莎，就挑自己擅長使用的工具吧。（但我自己不會拿 illustrator 做網頁就是了。）