2007年8月10日 星期五

(技)超快速網頁製作法~part2 (如何做好檔名編碼?)

上一篇講到了Dreamweaver的片段製作方式之後
接著我們來看看如何利用這個超方便的功能
基本上由於我已經拋棄了表格排版定位的設計方式
所以我現在會採用CSS來做排版設計
而CSS要發揮效用必須要與結構良好的HTML or XHML來做配合
才能有漂亮的畫面出現
但是網頁設計基本上現在也都走XHTML而非HTML了
所以我會將我的片段做好分組並做好檔名的編碼
例如我今天光是一個選單
我就可以預先搞好幾種常見的長相與結構
未來需要使用到時
直接就可以在片段上點兩下直接把Code插入到我的網頁中~
完全不用再花時間撰寫那寫過不知道幾次的一模一樣的Code
不但省時省力
更省時間可以多喝幾杯咖啡阿~
(但是我看有多餘的時間~大概會變成被老闆抓去做更多專案吧=_=)

下面寫一個很簡單的片段名稱編制方式
menu(資料夾)
A-html (片段)
A-CSS (片段)
B-html (片段)
B-CSS (片段)
.......依此類推

如上所示
我所做好的片段會有一組HTML搭配一組CSS
未來使用時就直接把HTML插入到網頁中
CSS則插入到CSS檔案中
而CSS檔則是以連結的方式連到HTML網頁裡
這樣畫面就可以呈現得出來了
看~就是那麼簡單
多麼的方便阿~
.....甚麼?
你完全感受不到它有多方便?
也感受不到有多快?
那~~就看看我的示範影片吧~

實際操作影片

 (影片約4MB~沒有下載畫面,所以播放按鈕沒作用時請各位在等他下載完再按播放即可)


看到沒~轉眼間一個畫面就搞定了

有沒有嚇好大一跳阿~~(對啦~最好是沒有啦=3=)
當然上面只是示範
所以有些片段的設定都還不是很完善
所以可以看到畫面的完成度並不是非常的美麗啦
(哀~不要怪我~這可是要花很多時間的阿~~)

實際測試的結果來說,要搞定一個站只花半小時是可能的(但是要看你的片段寫得好不好啦~)

那麼這個時候又有個疑問了~
片段存在Dreamweaver中
如果電腦重灌或是想把片段拿到其他電腦用的時候該怎麼辦?
這個問題呢
就請再接著看超快速網頁製作法~part3 片段備份法吧
(Sorry~一篇文章寫太長粉累人的....所以各位還是慢慢看續集吧)

相關文章

1 則留言:

k 提到...

感謝喔~~還有影片~~這樣比較好懂啦~~哈