漫談我的網頁編寫路

編寫網頁不是我的拿手好戲，不過最近接連開始寫了兩個網頁，原本想分享一下寫的心得及技巧，無奈yahoo把大部份的HTML碼和scripts都攔截了，變成在這裡要談也十分困難，只好隨便的漫談一下好了。

圖一：我的http://dog.ocoy.net/網頁，是為On Canine On Youth的工作而開始編寫的，為了省工夫，就把一張設計好的海報做網頁的背景，也是苜頁，附加進入繁體中文或英文的按鍵，按下圖可以進入該未完成的網頁瀏覽。

首先要寫網頁有很多工具可以幫手，最常用的又專業的是Dreamweaver之類，不過，用Word也可以把文章變為網頁，當然少了許多互動功能；大家又有沒有想到，其實寫yahoo blog也是寫網頁，只是被限制在一定的範圍裡而已，所以，如果你對什麼是HTML不太清楚，只要在寫blog時click入HTML模式看一看便知了。

我自己最喜愛是用記事本來編寫網頁，因為這最原始，最不受限制，當然，也是最難與最花時間的了，有時一丁點疏忽就要賠上一整天在debug了。


圖二：dog.ocoy.net進入其他的頁面後，還是用原來的海報，分中文版及英文版，不過用電腦先把海報變暗，方便在上面蓋寫文字，也用了最常見的選單方式讓用戶一見便明白有那些資料可以獲得。

網頁裡有許多東西可以引入，最基本是Hypertext Markup Language，亦即是HTML，這是一些文字及如何把這些文字和其他連結的圖片重組的指引，要實現這些工作，文字中會夾雜了一些標記，如等＜ｂ＞、＜ｂｒ　＼＞的東西，叫瀏覽器重組時把文字用粗體顯現或斷行就是這兩個標記的意思了，當然這些東西很多也有很多的變化，要談，足足可以有一本兩吋厚的書，我就有這樣的書在編寫網頁時不時要翻看。

圖三、四：主要的資料都在原有的海報背景中呈現出來，盡量做到感覺統一。要在同一網頁中隨用戶的心意而出現不同的資料，用的就是DHTML加javascript的技巧了。

但HTML是固定的東西，一旦送到瀏覽器後便不能變化，這顯得太沒趣，所以有所謂的DHTML出現，D是dynamic的意思，有了動態的HTML後，網頁可以隨著用戶的使用情況而發生變化。

不過DTHML始終不是一種電腦語言，對於要作決定或是要運用數據時，就應付不來，所以網頁中要有近似電腦語言的東西輔助才好用，於是就有javascript了，這是一種簡單的script，配合DHTML就可以令網頁千變萬化了。

圖五、六：不過，當資料再進一步伸延出去時，保留用同一個背景總有點為難，所以在連結出去我就不再限制要在這個海報的背景下編寫了：

上面說到的互動性，都是在瀏覽器端的互動，若果網頁要為不同的用戶提供不同的資料時，還需要在伺服器端也有互動能力，就好像網上銀行，用戶A的帳戶資料決不可能全送到其他用戶的手裡，到達瀏覽器才決定顯示那些資料給用戶看，要達到這些要求，網頁中就要有一些如PHP的東西在傳送網頁前自動編好特定的網頁送出。

說了一大堆，大家應該心中有數，好的網頁不單單是靠Word就可以完成的，有時，甚至乎用強大的商業軟件如Dreamweaver也不能簡單的完成，所以，我還是喜歡用記事本逐句逐句的寫出來。

上面講的，都只是技術層面的東西，網頁設計除了要能通過技術的要求，更重要的是這還是一種設計，當中有審美的部份、有實用的部份。

怎樣才是美？這問題沒有固定答案，個人的網頁當然可以有不同的風格，夢幻也好，超現實也好，個人喜歡便好了，公司的網頁就要顧及產品服務的要求，也有公司的形像，這是要配合的。說到實用，就是網頁的功用要易於達到，大量引入flash動畫，用戶未等動畫下載完成便離開，網頁的功用能達到了嗎？美觀與功能不一定相違背，但也不易於結合，所以，在設計的部份，更是編寫網頁困難之處。

我自己希望用的原則是：

1. 統一：形式和用色等各方面均要統一。
2. 簡單：文字固然要簡單，表達也要直接了當的點題，所以動畫可免則免。
3. 協調：網頁是一件平面設計，單說用色就有許多學問。

我雖然也曾教學生編寫網頁，也寫過不少網頁，但不是高手，連入門還未到，上面的分享，只是胡亂的說說吧了。國內最近興起了網頁化娤師的行業，花幾十塊錢就可以替自己的網頁改變得美侖美奐，或者，網頁根本不是要自己動手寫的呢。

圖七：為OCOY工作室設計的網頁，那是一個攝影和平面設計的工作室，所以也要有點味道，同時為了符合我要統一、簡單和協調的要求，我選了一張日出的相片做背景，其他的東西只會在這框框內出現，不再另開新頁。可以按下圖進入該網頁。