在【完美的像素】規劃你的工作環境 中，我們知道面對不同的工作目標，妥善地準備自己的工作環境是多麼重要的一件事情。尤其是結合各種不同專長領域分工的工作中更是如此。
網頁設計師與程式設計師之間的合作可以說是最常見的狀況了，Photoshop、Illustrtor 以及 Flash 等視覺化的設計工具與標籤語言有著不同的性質，網頁設計師的工作是讓網頁看起來更美觀、排版更協調等、因此利用這些工具方便快速地做視覺上的調整。而程式設計師則是必須設法將這些完成後的設計透過標籤語言實現出來。尤其在 Flash 日漸式微以及HTML5 蓬勃發展的現在越來越常遇到。
因此，網頁設計師最好能在製作完排版設計後，為圖像做清楚的標註，讓接手的程式設計師更快的進入製作狀況，常見需要標示的狀況如下所示：
- 預備使用標籤語言製作的按鈕等互動元件的色彩、尺寸以及細節等
- 版面上各元件彼此間的距離等
- 其他常見必須標示的環節
因此這張標示圖差不多會長這樣 (示意)：
但有時候太多資訊在畫面上也容易造成閱讀跟製作上的困擾，因此注意以下幾點，會讓你的資訊傳遞更明確：
- 將同種類資訊擺放在一起、並整齊排列，讓人一目瞭然
- 標註色彩清晰、勿使用會與背景難以分辨的色彩
- 標註與圖像本身間預留適當間隔，以不擾亂圖像本身為原則
- 切勿重複標註
雖然清楚的標示可以免去很多溝通上的困擾，但是要 Photoshop 跟 Illustrator 中加入這些標示還是個可怕的噩夢，尤其是遇到重複修改的狀況時，這件工作真的會讓人受不了。其實除了在這些常用繪圖軟體土法煉鋼繪製這些標示圖以外，有許多軟體開發者開發了許多好用的小工具，節省大家浪費花費的時間與精力。
首先是由 Onpixel 開發的 Specctr ，這是一個 Firework 的外掛套件、具有可沿續原本工作環境流程以及跨平台的優點，該程式提供試用以及 Lite 的免費版可以下載
另外一個則是由中國大陸所開發的 MarkMan（馬克鰻），使用 Adobe AIR 所開發，因此也有著跨平台的特性，雖然是簡體中文，但是所有的按鈕都經過圖形視覺化，介面也相當精簡明確，並不會造成使用上的困擾。
相關連結：
Image via Maverick Dal, cc license
