文章訂閱   FeedBurner  FeedSky

htmlPlayground - 網頁設計的好幫手

Posted by Arguo

雖然目前坊間的網頁設計軟體是「滿滿是」,不過對於設計網頁程式的工程師來說,在沒有良好的介面、程式分離的架構下,很多時候,這些 “高級” 的網頁設計軟體用起來不見得方便,所以還是需要用很傳統的手法來調整輸出畫面,靠著微軟的「筆記本」就可以走遍天下。話雖如此,HTML 規格中繁複多樣的標籤(tag)與性質(attribute),要全部都給記下來,感覺也是頗難的。這時候,有一個像 htmlPlayground 這樣的網站,就像出國自助旅行帶了一台「無敵 CD」,真的是想查甚麼都可以。

使用 htmlPlayground 的第一步就是要在左上方的視窗選擇想查詢的標籤,htmlPlayground 會在右上方的視窗介紹一下這個標籤的意義,並且在右下方的視窗中提供一個簡單的使用範例。直接看 HTML 語法沒感覺是吧!htmlPlayground 也很貼心的用一個視窗來展示一下範例的輸出畫面到底會是甚麼樣子。如果想調整範例中每個標籤的性質,只要點選有興趣的標籤,左下方的視窗就會列出所有可以調整的性質,使用者只要動一動滑鼠,就可以更改範例的內容,試試不同性質所造成的不同效果。

另外,htmlPlayground 還提供一個蠻實用的小功能,只要在範例視窗中輸入網址(URL),然後點選「Try code」,htmlPlayground 會把這個網址的內容當成一個範例使用。因此,當你想調整自己網站的內容時,只要把網址丟給 htmlPlayground 以後,就可以把它當成一個簡易的網頁設計工具來使用,只不過要自己慢慢的調整每項細節就是了。

htmlPlayground 提供的功能並不複雜,但是對於開發網站的工程師來說,應該是相當的實用,特別是當你手邊沒有相關的參考書籍時,趕緊用 htmlPlayground 解救一下吧。

htmlPlayground : http://htmlplayground.com

No responses yet

Leave a Reply