視傳系98級　網頁設計課程網（課程結束）

oct. 13, 2009

從這個星期起，我也要和各位一起進行網站的設計：各位做自己的個人網站，我則是陸陸續續把課程的內容在這裡做點小筆記。這個星期，我們學習了如何使用表格 (<table>)，讓內容以表的方式呈現出來，也學到讓表格做橫向 (colspan) 與縱向 (rowspan) 的合併，相信只要慢慢練習，妳就會找到合併的邏輯與規則。記得要多多練習喔！

oct. 20, 2009

努力了三個星期，我們終於把 HTML 基本概念練習過了，相信大家現在看原始碼至少不會霧裡看花了吧？ :D

這個星期我們開始進入了 CSS 的部份，開始學習如何美化我們的網頁，以及設計不同的格式，相信各位也從課堂的練習中認識到 CSS 的厲害。接下去的課程，會讓我們用 CSS 去做排版的工作，屆時妳的網站就會很有型喔！

oct. 27, 2009

這個星期我們的進度慢了一點，只說了 class selector (類別選擇器)，希望大家多多應用，熟悉這種自己可以宣告新樣式的方法。在使用 class時，要注意幾點：

1. 前面要加 "." ，例如： .highlight
2. 樣式的名稱開頭不要用數字。
3. 樣式的名稱不能是兩個英文字；如非用不可，請使用其它方式分開，例如： .markerRed, .blingBlingStyle, .marker_green, .high_lighter_yellow

另外，我們也學到如何使用圖片當背景的方法，請大家多多練習，持續豐富自己的網頁，讓內容越來越完整。加油！

nov. 02, 2009

方塊模式 (Box Moduel) 是網頁排版最重要的觀念；如果想要隨心所欲地排出好看的圖文版面，就一定要熟悉排版的 CSS。重要的語法包括使用 width, padding, border, margin將內容「裝」起來；使用 float來控制這些 box 的排版方向；也可以使用 overflow 來控制看不到的內容會如何顯示。在課堂上的示範與練習，相信已經讓很多同學認識這個部份。如果妳已經對方塊模式已經瞭解，恭喜妳已經跨進了網頁設計的領域，也算對語法掌握了一半。假如你還不能預測盒子的動向，你一定要多多練習。記住，如果有任何問題，隨時來找我喔！

下星期我們將不再有任何新進度，我會在課堂上重新解釋所有上過的語法；如果妳對之前的內容還有不懂的，這會是妳讓自己重新學習的好機會，要把握喔！

nov. 09, 2009

很快的，各位來到明志過了半個學期，期中考便在眼前。這個星期我們複習了 HTML與CSS所有的重要概念與細節，希望大家透過完整的解說，能夠把過去幾週沒聽懂的，或沒聽清楚的，再 make up 起來。

期中實作的目的不是在為難大家，是要請大家花點時間把我們做過的全部整合起來；其實妳／你只要把這幾週所學與練習的內容充實一下，就能夠完成作業。做作業的過程裡，如果遇到了困難，千萬不要自己悶著頭想，請盡快來求援，我會很樂意再說一次妳沒聽懂的部份。對了，也請不要忘了把上課的想法或建議告訴我，讓我們在後半學期能學得更充實。加油加油！

nov. 18, 2009

感覺起來好像大家昨天才進明志，沒想到我們的期中考也就這麼結束了！看到各位的考試結果，讓我也稍稍鬆了一口氣！總算大部份的語法與觀念，大家都有學起來。雖然有些細節不容易記住，但我相信只要多練習，一樣會熟練的。

接下來就是要請各位把期中的實作在星期天完成。在這裡要提醒的是，我們在課堂中會用框線加在box的外圍（虛線或實線），其實那是不需要的，妳／你可以把這些框拿掉，網頁看起來會更好。記住，如果有任何問題（或忘了的上課內容），歡迎隨時來問，我們可以一起來研究、學習！加油！

nov. 24, 2009

期中考結束了，我們一起為自己的表現用力鼓鼓掌！

今天檢討期中考筆試，也要求大家訂正，目的就是讓大家有多一點點機會去練習與熟悉。此外，我們也學了更進一步的表格製作，包括<thead>, <tbody>, <caption>，當然，還有最重要的美化表格的方法。請大家在學完這個部份的CSS後，一定要回家改改自己的schedule.html，讓妳／你的表格更美！另外，我們也開始學習如何簡化CSS的表示方法，這意謂著，我們對HTML/CSS的掌握程度也越來越好囉！開心吧！

dec. 1, 2009

今天的進度不多，也不繁複，但卻是網站建構，以及網頁設計中相當重要的觀念。為了讓網站更整齊，我們必須學會使用路徑（資料夾）來管理。為了讓網頁在未來的維護工作中更有效率，我們一定要知道如何使用外部連結 CSS。請各位一定要在這個星期完成網站的瘦身改造，以及網頁CSS大變身，妳的網頁技術就更進一步了！

dec. 15, 2009

今天是第二次上Dreamweaver的課，進度較多一點，但並不困難。在Dreamweaver操作網頁很方便，但往往因為看到太多面版，或對介面不熟悉而慌張。記住做網頁的步驟：1) 放入陽春的文字及圖樣，2) 至 CSS 浮動視窗去增加 CSS 的樣式，3) 套用到陽春的圖文上，4) 使用<div> 來規劃版塊，並完成排版。只要多多練習，就可以熟悉在Dreamweaver上使用CSS；妳的網頁設計速度也會更有效率。

dec. 29, 2009

這是今年最後一堂課了！相信大家在網頁設計的過程中，一定很多收穫吧！

今天我們把上星期的「直式導覽列」改為「橫式」的，雖然導覽列的CSS看似複雜一些，其實也都是觀念的應用，只要照著上課的步驟，自己多加練習，並仔細揣摩每一行CSS的意義，一定可以瞭解運作的方式。把完成的導覽列放上網頁，是不是看起來更專業了？

祝大家新年快樂！

Jan. 5, 2010

伴隨著新年的來到，課程也接近尾聲。回顧過去十幾週來，大家的網頁設計觀念與技巧也都逐漸的完整。期末作業也已經放在網路上，希望大家都能在學期結束前，設計出自己個人的網站，也放上自己的作品。在這週的課程中，我們學習如何將導覽列加上好看的底圖，對網頁的美化有很大的幫助。同時，也學會了如何使用流動式的版面，讓妳的頁面會隨著網頁的寬度而變大，但版塊box的排列又不會變形，真是太讚了！希望大家都能夠利用學習到的技巧，將自己的網站做到最好。

Jan. 12, 2010

今天是期末考前的最後一次上課，大家在課堂上也都聚精會神地，要將網頁做好。如果下學期沒有選修進階網頁設計，這可能是你唯一會花這麼多時間在自己的網頁設計，且無拘無束地讓想像力奔馳的一次。很開心有這麼一個學期，與各位一同學習網頁、討論網頁；看到許多同學從對網頁的一知半解，到現在能夠使用記事本徒手做網頁，這麼大的進步，讓人感動！希望各位在課程結束後，在課堂所學的知識與技能，都可以在未來繼續發揮。祝福各位！