教學網站範例設計

此 部 分 內 容 按 照 本 章 第 一 節 所 規 劃 出 的 結 論 ， 以 Macromedia Dreamweaver 為主要軟體，製作出網站的一部分為試用的範本，並上傳為可 實際使用的網站，網址：http://hanzi4thai.net23.net/ 。

118

一、網站範例內容限制

(1) 每階段內容所提供的例字不多，但在教學順序上的安排，這些例字 將在後段內容出現，亦作為學習新字的工具。

(2) 只使用網站內提供的例字為主要的練習題目。另外一部分的練習 題，使用未出現在網站內，但是可以網站所提供的例字與知識來推論出正確 的答案。

二、 整體畫面的設計

(1) 頁面的內容分配

所有網站內容出現於總頁面。總頁面包括三部分，分為：一、網站名稱 區；二、目錄與選單；三、內容呈現區。

圖 六-1 網站總頁的分配

1.1) 網站名稱區：網站名稱出現於總頁面框，無論打開任何項目的頁 面，內容總會出現在網站名稱框之下。在使用者開很多窗口時，易於知道目 前在看的內容屬於何網站。另外在此區域提供非學習內容之常用連結，包 括：首頁、求助、網站圖、相關連結、留言版及聯絡站長。

1.2) 目錄與選單: 目錄與選單呈現於總頁的最左邊，同時在每頁面出 現，使用者隨時皆可看到。目錄框架裡邊包含了網站所有的教學內容題目，

並連接至各項教學內容頁面。有漢語基礎者可從此選單，馬上找到其要尋找 的內容，節省在大題目下尋找的時間。另外，可幫助不太了解漢字教學內容

網站名稱區

內容呈現 目錄與選單

119

者，不知道所要尋找的內容屬於何大題目，可找得到其想要學習的內容。至 未接觸漢語者，可以此目錄為學習大綱的參考，並了解目前自己所看頁面的 位置。同時參觀過網站者想要複習時，能馬上進入自己要進去的頁面，節省 尋找的時間。

1.3) 內容呈現區：每頁面的內容出現於此框架，並有該內容題目呈現 於最上面。在參考旁邊的目錄時，使用者可知道目前正在觀看的是網站的何 部分，在何大題目之下。此關鍵在於，使用者可看出與了解整個內容的連貫。

圖 六-2 內容呈現區的分配

(2) 美觀：每個頁面除了文字之外必須同時放圖畫、動畫等裝飾，為增 加頁面的美觀以及使用者的注意力。

二、網站教學內容流程

網站教學內容流程，分為如下三個階段：

(1) 學習指導：每個學習內容先由「學習指導」開始。內容包括該頁面 的使用方式、該教學內容的介紹與學習意義。

(2) 漢字基本概念內容：提供漢字學習的內容與系統性的例子，包括：

針對泰國學習者常對漢字疑問、迷思的問題與解答；漢字的來源─介紹古漢 字例子；學習漢字─造字法 (包括：象形、指事、會意及形聲) ；寫字規則 (包括：筆劃筆順規則、寫字注意、練習紙下載)。

在各項內容的學習流程，先由幾項問題，挑戰學習者動腦考慮，作為暖 內容題目

內容

120

身活動。學習者參與活動後可體會到將要學習的內容，再進入學習真正的教 學內容，將所得的經驗整理與系統化。

(3) 練習與測驗：位於漢字基本概念的某些範圍之後，作為複習剛學習 完畢的內容及測驗學習者對所學習的內容的了解度。

3.1) 練習與測驗內容

在一般的基礎內容部分，提供一種練習與測驗，但在更複雜的內容範 圍，測驗內容分為數級，按照學習者的漢語程度而學習，主要於不同程度學 習者的學習目標不同。雖然學習者知道練習題分為易難的程度，但不限制所 有網站使用者試做全部的練習。

練習與測驗部分的目的並非為測出學習者是否能夠記得所有提供的例 子，而是透過練習使學習者更了解網站所提供的內容，並依據看過漢字例子 來了解漢字的組合，以致之後能夠以這些的概念去學習其他沒看過的漢字。

至於學習者是否了解以上的概念，便在此部分內容測驗出來。若學習者 能做出正確的解答，就代表他們知道如何運用網站提供的掌握漢字概念，亦 可產生學習的成就感。即使學習者沒掌握好內容，做出不好的成績，尚等於 提供學習者的複習機會。

3.2) 回饋

練習完畢後，呈現練習答案提示、成績的公佈、稱讚語，亦提供答案的 解釋，增加學習者的理解度。