<h1>[color=#990000][期末作業] 以雙欄為主的網站設計[/color]</h1>

<h2>一、製作說明：</h2>
<b>1.請參考期末之前教過的做法及講義，製作以雙欄(多欄)為主的網站。

2.題目自訂，可以延續期中作業的主題，也可以是全新的主題。

3.需自行設計圖片，製作網站內容。

4.需以Float浮動的方式建立雙欄(多欄)、DIV搭配CSS的方式完成，設定尺寸、字體、顏色等等。

5.至少需包含(1).Table：表格→匯整資料，(2)Float→繞圖排文，(3)臉書、噗浪等推文設定，(4)圖片跳窗連結，(5)導覽列設定。


6.製作完成上傳至FTP

<h2>作業設計重點</h2>

<b>[color=#CC0000](1)能自行設計以DIV與CSS製作的網站
(2)利用float設計雙欄網站
(3)利用項目清單設計導覽列
(4)利用自已設計的圖片、色彩搭配與字體設定等設計出具有質感的網頁[/color]</b>


<h2>二、評分標準與製作檢核</h2>
1.雙欄的製作(Float的使用)，不同的連結方式
2.HTML的正確架構(DIV的使用)
3.整體設計美感(CSS運用，風格及配色，字體設定、圖片製作)
4.導覽列的正確性(含導覽超連結)
5.表格、繞圖排文、推文等設定
6.HTML Title的設定，Footer的版權宣告
7.內容的完整性
8.製作說明


<h2>三、繳交作業方式</h2>
<b>[color=#CC0066]1.製作完成後，檔案命名方式：[/color]</b>

[color=#669900]期中作業FTP上的資料夾為：final

每位同學請將自己的資料夾命名為：final-學號
這個作業的網址則為:http://mepopedia.com/~web100a/final/final-100xxxxxxx

資料夾內含：
(1).首頁命名為index.html
(2).其他頁面請自行命名，但需注意命名為則，不可出現中文及全形字、特殊符號等等
(3).一個命名為style.css的css樣式檔
(4).存放圖檔的images資料夾

存放在 < final-學號 > 的資夾內[/color]


<b>[color=#CC0066]2.全部完成後上傳至FTP[/color]</b>

<b>[color=#CC0066]3.依進度回覆本篇文章[/color]</b>

<h2>回覆說明</h2>

<b>[color=#0066CC]完成品[/color]</b>(12/28前)
[color=#FF0066]請將這項放置於文章最前面[/color]
(1)作業網址：
(2).
1.製作作業的時間：
2.有無遇到的問題：
3.製作心得與感想：
<b>[color=#CC0066]4.請務必在12/28前回覆，否則為遲交[/color]</b>


<b>[color=#0066CC]前置作業[/color]</b>(10/19)
<b>(1)網站主題：
(2)導覽列架構設定

範例參考：
[IMG]http://i556.photobucket.com/albums/ss1/whc915/webtree.jpg[/IMG]

(3)尺寸與架構設定

範例參考：
[IMG]http://i556.photobucket.com/albums/ss1/whc915/web-layout.jpg[/IMG]

(4)風格設定：
(5)主色調，輔助色調：
(6)製作動機：
(7)製作目的：
預期效果：

(8)資料蒐集分析

[color=#CC0099]<b>◎設計優良網站(風格)列表與分析
請參考：http://mepopedia.com/forum/read.php?804,18412
並將網站分析回覆於前述網址</b>[/color]

◎相關網站列表與分析：</b>



<h2>四、期末作業進度參考</h2>
第十五週　12/14　題目及網站架構確定，版型、ˋ尺寸確定，資料蒐集與網站分析
第十六週　12/21　圖片製作，內容建構
第十七週　12/28　完成與上傳，檢討與修正
第十八週　01/04　成績確認與最後修改
</b>


=================================================
[color=#CC0066]※期作業無論如何請一定要繳交，否則以期末以零分計※
※若經發現作業為直接複製同學檔案以零分計※[/color]
=================================================[color=#CC0066]※期末作業無論如何請一定要繳交，否則以期末以零分計※
※若經發現作業為直接複製同學檔案以零分計※[/color]
=================================================

[color=#990000][期末作業] 以雙欄為主的網站設計[/color]

一、製作說明：

1.請參考期末之前教過的做法及講義，製作以雙欄(多欄)為主的網站。

2.題目自訂，可以延續期中作業的主題，也可以是全新的主題。

3.需自行設計圖片，製作網站內容。

4.需以Float浮動的方式建立雙欄(多欄)、DIV搭配CSS的方式完成，設定尺寸、字體、顏色等等。

5.至少需包含(1).Table：表格→匯整資料，(2)Float→繞圖排文，(3)臉書、噗浪等推文設定，(4)圖片跳窗連結，(5)導覽列設定。


6.製作完成上傳至FTP

作業設計重點

[color=#CC0000](1)能自行設計以DIV與CSS製作的網站
(2)利用float設計雙欄網站
(3)利用項目清單設計導覽列
(4)利用自已設計的圖片、色彩搭配與字體設定等設計出具有質感的網頁[/color]

二、評分標準與製作檢核

1.雙欄的製作(Float的使用)，不同的連結方式
2.HTML的正確架構(DIV的使用)
3.整體設計美感(CSS運用，風格及配色，字體設定、圖片製作)
4.導覽列的正確性(含導覽超連結)
5.表格、繞圖排文、推文等設定
6.HTML Title的設定，Footer的版權宣告
7.內容的完整性
8.製作說明

三、繳交作業方式

[color=#CC0066]1.製作完成後，檔案命名方式：[/color]

[color=#669900]期中作業FTP上的資料夾為：final

每位同學請將自己的資料夾命名為：final-學號
這個作業的網址則為:http://mepopedia.com/~web100a/final/final-100xxxxxxx

資料夾內含：
(1).首頁命名為index.html
(2).其他頁面請自行命名，但需注意命名為則，不可出現中文及全形字、特殊符號等等
(3).一個命名為style.css的css樣式檔
(4).存放圖檔的images資料夾

存放在 < final-學號 > 的資夾內[/color]


[color=#CC0066]2.全部完成後上傳至FTP[/color]

[color=#CC0066]3.依進度回覆本篇文章[/color]

回覆說明

[color=#0066CC]完成品[/color](12/28前)
[color=#FF0066]請將這項放置於文章最前面[/color]
(1)作業網址：
(2).
1.製作作業的時間：
2.有無遇到的問題：
3.製作心得與感想：
[color=#CC0066]4.請務必在12/28前回覆，否則為遲交[/color]


[color=#0066CC]前置作業[/color](10/19)
(1)網站主題：
(2)導覽列架構設定

範例參考：
[IMG]http://i556.photobucket.com/albums/ss1/whc915/webtree.jpg[/IMG]

(3)尺寸與架構設定

範例參考：
[IMG]http://i556.photobucket.com/albums/ss1/whc915/web-layout.jpg[/IMG]

(4)風格設定：
(5)主色調，輔助色調：
(6)製作動機：
(7)製作目的：
預期效果：

(8)資料蒐集分析

[color=#CC0099]◎設計優良網站(風格)列表與分析
請參考：http://mepopedia.com/forum/read.php?804,18412
並將網站分析回覆於前述網址[/color]

◎相關網站列表與分析：

四、期末作業進度參考

第十五週　12/14　題目及網站架構確定，版型、ˋ尺寸確定，資料蒐集與網站分析
第十六週　12/21　圖片製作，內容建構
第十七週　12/28　完成與上傳，檢討與修正
第十八週　01/04　成績確認與最後修改



=================================================
[color=#CC0066]※期作業無論如何請一定要繳交，否則以期末以零分計※
※若經發現作業為直接複製同學檔案以零分計※[/color]
=================================================[color=#CC0066]※期末作業無論如何請一定要繳交，否則以期末以零分計※
※若經發現作業為直接複製同學檔案以零分計※[/color]
=================================================