[作業04]期末作業-列表頁設計

[作業04] 期末作業-列表頁設計

作業範例：http://jinjin.mepopedia.com/~jinjin/hw/hw04/list.html
期末作業：http://jinjin.mepopedia.com/~jinjin/webdesign-notes/

1. 製作說明

1.請參考以下講義

[url=http://jinjin.mepopedia.com/~jinjin/webdesign-notes/homework-4.html][作業04講義] 期末作業-列表頁設計/article/section/[/url] 的步驟製作。

本單元為作業04，為期末作業次頁，列表頁設計，列表頁通常扮演索引的功能，常出現在首頁之後的次頁，如文章列表頁、新聞列表頁、活動列表頁、相關連結列表頁等。

設計內容：
1.延續作業三以期末作業為主題之設定，自行設定主題，針對內容，設定配色及主要風格。
2.本主題之列表頁設定，可設定之主題為第二階層，可往下延伸至第三階層，或做外部連結
3.如為文章列表，第三階層則為文章頁；如為相關連結列表，則可作外部連結。

5.以FileZilla上傳至FTP

2. 繳交作業方式

1. 製作完成後，檔案命名方式：

第一個作業FTP上的資料夾為：hw04

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

資料夾內含：
1.html部分：列表頁可命名為list.html，或其他設定好的檔名，首頁則為index.html
2.css部分：命名為style.css
3.img：圖片資料夾

存放在 < hw04-學號 > 的資夾內

2. 上傳至FTP

3. 回覆本篇文章

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-107xxxxxxx/list.html (或其他自行命名的檔名）
1.製作主題：
2.有無遇到的問題?
3.花多少時間製作：
4.製作心得：



(編輯記錄)

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445050/related.html
1.製作主題：鯨魚
2.有無遇到的問題?有，已解決
3.花多少時間製作： 3小時
4.製作心得：很好

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445028/list.html
1.製作主題：桃園的秘密
2.有無遇到的問題? 無
3.花多少時間製作： 兩小時
4.製作心得：很累



(編輯記錄)

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445054/list.html
1.製作主題： 韓劇
2.有無遇到的問題? 編排上花很多時間
3.花多少時間製作： 兩個小時
4.製作心得：很有成就感

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445005/list.html
1.製作主題： 鄭秀晶
2.有無遇到的問題? 無
3.花多少時間製作： 半天
4.製作心得：很累很累很累

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445022/list.html
1.製作主題： 韓團偶像
2.有無遇到的問題? 無
3.花多少時間製作： 1小時
4.製作心得：做完很開心

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445066/list.html
1.製作主題：YOUTUBER : MARKIPLIER
2.有無遇到的問題? 無
3.花多少時間製作：2小時
4.製作心得：很順利

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445024/list.html
1.製作主題： 關於Kanahei
2.有無遇到的問題? 無
3.花多少時間製作： 3小時
4.製作心得：很有成就感!

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445044/list.html
1.製作主題： 大陸劇
2.有無遇到的問題? 沒
3.花多少時間製作： 還好
4.製作心得：重溫劇情變得更加深刻

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445018/html.html

1.製作主題： 宜蘭新生活。旅遊
2.有無遇到的問題? 無
3.花多少時間製作： 3小時
4.製作心得：很有趣，做完很有成就感

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445010/SHARE.html
1.製作主題：個人網站
2.有無遇到的問題? 無
3.花多少時間製作： 2小時
4.製作心得：雖然複製網址很累，但看到成品很快樂ε٩(๑> ₃ <)۶з💖



(編輯記錄)

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1055440119/index.html
1.製作主題：こまつなな 小松菜奈
2.有無遇到的問題? 做CSS的時候還是很混亂。
3.花多少時間製作：黃金48小時
4.製作心得：做炒雞美的小姐姐網頁，沒睡覺也不困。

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445048/list.html
1.製作主題：英雄
2.有無遇到的問題? 頭痛
3.花多少時間製作： 2小時
4.製作心得：累難

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445059/list.html
1.製作主題： 個人作品集
2.有無遇到的問題?
3.花多少時間製作： 3hr
4.製作心得：

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1055445221/advanced.html
1.製作主題： 個人網站 作品區
2.有無遇到的問題?
3.花多少時間製作： 兩小時
4.製作心得：經過多次練習我更明白到網頁是如何利用分區塊的方式整合調整

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445063/list.html (或其他自行命名的檔名）
1.製作主題： 時裝介紹
2.有無遇到的問題? 超連結網業跑不出來
3.花多少時間製作： 4小時
4.製作心得：腦細胞感覺快被燒完了

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445021
1.製作主題：
2.網頁類型（活動式/主題式/個人/企業/..)： 個人網站
3.導覽列分類（網站內容/中英文）:食記.IG景點
4.欲呈現之配色風格： 粉色
5.有無遇到的問題? 上傳
6.花多少時間製作：6個小時
7.製作心得：比上次難度增加

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445075/2222.html
1.製作主題： troye sivan
2.有無遇到的問題? 無
3.花多少時間製作：全部4-5hr在拆開來交
4.製作心得：感覺自己沒有做得很理想

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445012/list.html
1.製作主題：偶像
2.有無遇到的問題? 有，表格喬不好
3.花多少時間製作： 1小時
4.製作心得：難度越來越高

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445038/list.html
1.製作主題：肯德基
2.有無遇到的問題? 很多困難
3.花多少時間製作：3天
4.製作心得：好累...

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445073/list.html (或其他自行命名的檔名）
1.製作主題： 韓國藝人
2.有無遇到的問題? 無
3.花多少時間製作： 3hr
4.製作心得：覺得列表比較簡單

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445037/index2.html
1.製作主題：熱門音樂社
2.有無遇到的問題? 還是覺得很難
3.花多少時間製作： 5小時
4.製作心得：嗚嗚嗚嗚嗚

作業網址：http://cute.mepopedia.com/~web107a/hw03/hw03-1075445026
1.製作主題： 遊戲網頁
2.網頁類型（活動式/主題式/個人/企業/..)： 遊戲
3.導覽列分類（網站內容/中英文）: =-=
4.欲呈現之配色風格：黑暗 髒髒的
5.有無遇到的問題? 從頭到尾都是問題
6.花多少時間製作： 數不清
7.製作心得：我試著想理解 卻理解不能

http://cute.mepopedia.com/~web107a/hw02/hw02-1075445035

(2).請回答以下問題：
1.製作主題： 偶像介紹
2.欲呈現之配色風格：活潑糖果色系
3.有無遇到的問題? 不會分頁
4.花多少時間製作：好多天
5.製作心得：真難

作業網址： http://cute.mepopedia.com/~web107a/hw04/hw04-1055440093
1.製作主題： ONE OK ROCK
2.有無遇到的問題? 以解決
3.花多少時間製作： 2小時
4.製作心得：作業3做完後作業4很順

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445061/list.html
1.製作主題： 我的自我介紹
2.有無遇到的問題? 有
3.花多少時間製作：1天
4.製作心得：很難，但也有學到東西。

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445208
1.製作主題：輕黏土DIY
2.有無遇到的問題? 無
3.花多少時間製作： 1天
4.製作心得：很累。但很開心~~

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445002/list.html (或其他自行命名的檔名）
1.製作主題： 模型製作 DIY
2.有無遇到的問題? 圖片很難用
3.花多少時間製作：昨天和今天
4.製作心得：沒有分配到其它的時間製作

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445073/
1.製作主題： 韓國藝人
2.有無遇到的問題? 無
3.花多少時間製作： 2HR
4.製作心得：覺得列表比較簡單

作業網址：http://cute.mepopedia.com/~web107a/hw04/hw04-1075445058/index.html
1.製作主題： 心動城 品牌形象網頁
2.有無遇到的問題? 無
3.花多少時間製作： 2H
4.製作心得：繼續前行~