Introduction 簡介

近年來,科技越來越發達,幾乎人人都有電子設備,也常常會瀏覽各式各樣的網站。

樣式精美排版整潔的網站,總是會讓人想一看再看,以現在的科技來說,自己做一個網站並非難事,網路上有滿滿的資源可以使用,讓我們簡簡單單就能設計出一個獨具風格的網站。

Task 任務

假設你是一個新進的網頁設計師,有許多單位都要求你幫他們設計一個符合他們理念的網站,請找一個自己最有興趣的單位(慈善機構、藝人、事件……等等),替他們設計出一個能表達出其核心理念和特色的網站。

利用資料蒐集及彙整,如有需要也能做採訪,了解其核心理念及特色。

完成一個符合理念的網站,並以口頭報告解釋選擇此單位的理由和網站的設計理念。

Process 過程

同學需以3~5人為一組
共同構思一個主題,並以該主題完成一個專題網站。

  1. 蒐集該主題相關資料
  2. 整理所得資訊
  3. 繪出網頁基本架構(有幾頁、每頁內容)
  4. 利用CSS完成符合主題的排版設計(可考慮加入RWD)
  5. 可加入Javascript / jQuery 讓網頁有互動性
  6. 放上一頁組員個人心得
  7. 於最後一周專題網站展示時和同學口頭報告設計理念


參考網站: 網界博覽會-歷屆作品

Resource 資源
codecademy w3schools
Evaluation 評估

HTML架構 40%

需要努力

0 ~ 10

還不錯唷

11 ~ 20

你好優秀

21 ~ 30

內容

20%

  1. 很少符合W3C標準
  2. 標籤語意不清,無法辨識內容區塊
  1. 部分符合W3C標準
  2. 語意尚可,能分辨內容區塊
  1. 完全符合W3C標準
  2. 語意清晰,能清楚分辨內容區塊

組織架構

20%

  1. 欠缺組織架構,內容順序性不佳,資訊查找不易
  1. 組織架構尚可,易於閱讀,但部分資訊查找不易
  1. 組織架構優美,方便讓人閱讀、查找資訊

CSS排版設計 60%

需要努力

0 ~ 10

還不錯喔

11 ~ 20

你好優秀

21 ~ 30

內容

30%

  1. 很少符合W3C標準
  2. 語法繁雜,重複的語法太多
  1. 部分符合W3C標準
  2. 語法尚可,但還是不夠簡潔優美
  1. 完全符合W3C標準
  2. 語法簡潔,能清楚分辨每個部份的語法

排版設計

30%

  1. 沒有排版,使人不易閱讀
  2. 缺乏設計,不太能吸引人閱讀
  1. 有排版,閱讀觀感尚可
  2. 設計尚可,能吸引部分人閱讀
  1. 排版優良,閱讀起來很舒適
  2. 設計優美,能吸引大多數人閱讀

額外加分:
JS互動性10%
RWD 5%

Conclusion 結論

學生透過此學習活動的過程,學習收集統整資料,歸納出自己的看法。

進而將理念付諸實行,並設計出一個符合理念的網站。

此外,透過小組合作,能培養溝通協調的能力。

並且了解一個專案分工的重要性,提早接觸未來工作時會體驗到的過程。