最近介紹過一些令人印象深刻的色彩工具，多半都是 Google Chrome 外掛，例如我個人很喜愛的「CSSPeeper 為設計師量身打造，更聰明視覺化檢視網站 CSS 樣式表」，能以更簡單、有組織性的方式呈現網站樣式和各元件，對開發者來說是非常實用的工具。當然瀏覽器可以做的事情也很多，包括一行程式碼將瀏覽器變成網頁編輯器，直接從網頁中修改內容，在開發網站測試時會省時省事很多。
網站設計
CSSPeeper 為設計師量身打造，更聰明視覺化檢視網站 CSS 樣式表（Chrome 擴充功能）
對於網頁設計或開發者來說，想要改善使用者網頁瀏覽體驗通常會從參考其他網站設計著手，我在發現不錯的網站都會去看一下原始碼或樣式表，雖然 Google Chrome 本身就有強大的開發人員工具可以使用，但如果遇到要查詢某個網頁使用的字型或色彩時還是習慣以 Fontface Ninja、Type Sample 這類工具快速找到我要的資訊。
閱讀全文 » 關於 CSSPeeper 為設計師量身打造，更聰明視覺化檢視網站 CSS 樣式表（Chrome 擴充功能）
FREE LINE DESIGN 免費下載 400 種分隔線圖案，向量點陣圖素材可商用
分隔線在網頁設計裡聽起來好像有點古老，印象中一開始學習網頁時 FrontPage 就已經內建分隔線工具，後來使用的人慢慢變少，不過在一些日本網站中還是很常看到分隔線蹤跡，尤其是設計很可愛又精緻的日系網站，通常會以圖案來取代單調的直線。當然圖案除了有區分內容的功能外，還能使網站看起來更生動有趣，但這類素材其實並不好找，從日本網站或許可以挖掘兼具美感和功能性的分隔線圖案。
Gutenberg 開放原始碼網頁列印樣式下載，讓輸出網頁更正確美觀
現今已經很少人會把網頁內容列印出來，PDF 表格表單大多能在線上處理，再加上家裡可能也不太放印表機，其實超商就能列印影印傳真，實在是沒有必要再添購一台機器放家裡佔空間。但對網頁設計者來說，有時候仍得兼顧到使用者列印內文的需求，但要怎麼樣才能讓列印出來的畫面符合使用者期待呢？至少列印時該出現的部分要出現，不該出現的廣告也盡量避免，顏色什麼的調整一下，其實可以透過 CSS 樣式來最佳化列印效果。
Browser Frame 為螢幕擷圖加入瀏覽器外框，讓畫面更專業有質感
每次在寫文章擷圖時，總會花點時間來研究圖應該怎麼抓才比較好看，畫面及圖片比例要恰到好處，對於一些銷售應用程式、軟體或服務的網站來說又更為重要，如果能設計精美擷圖，或許有助於吸引更多使用者下載，也能讓整體加分不少。還記得我之前介紹過一款很特別的 Google Chrome 外掛「Standardized Screenshot」，在擷取網頁畫面時能自動加上 Mac 外框和陰影效果，使畫面看起來更有質感。