Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

[作業03]期末作業首頁篇

[作業03]期末作業首頁篇

[作業03] 期末作業首頁篇

作業範例:http://jinjin.mepopedia.com/~jinjin/hw/hw03/
期末作業:http://jinjin.mepopedia.com/~jinjin/webdesign-notes/

1. 製作說明



1.請參考以下講義

[url=http://jinjin.mepopedia.com/~jinjin/webdesign-notes/homeworks-3.html][作業03講義] 期末作業首頁設計/article/section/table[/url] 的步驟製作。

本單元為作業03,為期末作業首頁設計,首頁內容通常包含整個網站的概述與精華內容統整。

設定header中的LOGO設計與導覽列設定,以及main區塊內table表格的基本設定,加入區塊,呈現不同分類主題,設定繞圖排文,並加入圖片,增加網頁的豐富性。綜合期中作業所學,可依期末作業內容,自行設定版面。

設計內容:
1.設計多頁式網站,自行設定主題,針對內容,設定配色及主要風格。
2.可以以主題式網站為主,介紹一個地方文化、特色、美食或喜歡的事物、喜歡的明星、介紹自己,也可延續期中作業主題,使之更完整。
3.準備網站內容所需之圖與文,需要設計logo、視覺主圖、以及其他頁面內容需要的圖文資料,需要原創或取得授權。
4.footer請設定個人的專屬版權聲明,並註明『本網頁為作業之用,如有侵權敬請告知』字樣。

5.以FileZilla上傳至FTP

2. 繳交作業方式



1. 製作完成後,檔案命名方式:



第一個作業FTP上的資料夾為:hw03

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

資料夾內含:
1.html部分:首頁命名為index.html
2.css部分:命名為style.css
3.img:圖片資料夾

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


2. 上傳至FTP



3. 回覆本篇文章



作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-107xxxxxxx
1.製作主題:
2.網頁類型(活動式/主題式/個人/企業/..):
3.導覽列分類(網站內容/中英文):
4.欲呈現之配色風格:
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 3 time(s). Last edit at 05/16/2019 10:06PM by JinJin.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445050
1.製作主題: 鯨魚
2.網頁類型(活動式/主題式/個人/企業/..):主題式
3.導覽列分類(網站內容/中英文): 首頁index,焦點新聞news,生物種類介紹kind,捕鯨waling,相關網站related
4.欲呈現之配色風格: 日本傳統色
5.有無遇到的問題? 第二個表格的字跟表格下方的距離,已解決
6.花多少時間製作: 2天
7.製作心得:比上一個複雜



Edited 1 time(s). Last edit at 06/10/2019 12:33PM by 1075445050.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445038
1.製作主題:肯德基
2.網頁類型(活動式/主題式/個人/企業/..):企業
3.導覽列分類(網站內容/中英文): https://www.kfcclub.com.tw/tw/
4.欲呈現之配色風格: 美味顏色
5.有無遇到的問題? 不知道怎麼配色
6.花多少時間製作: 5小時
7.製作心得:心累累

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445054
1.製作主題: 韓劇
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): | 韓劇介紹 | 演員陣容 | 分集劇情 | 原聲帶 | 幕後花絮
4.欲呈現之配色風格: 粉色浪漫
5.有無遇到的問題? 顏色配色
6.花多少時間製作: 三小時
7.製作心得:做完自己最喜歡的一部韓劇真爽,很有成就感



Edited 1 time(s). Last edit at 05/30/2019 09:02PM by kaka6698.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445036
1.製作主題:美食紀錄
2.網頁類型(活動式/主題式/個人/企業/..): 個人
3.導覽列分類(網站內容/中英文): news最新食肥 / konwAbout155女孩 / diary豬的肥食記 / Punch豬的踏青 / life豬與老大的生活
4.欲呈現之配色風格: 繽紛好吃
5.有無遇到的問題? 放影片mp4的程式
6.花多少時間製作: 2天
7.製作心得:很開心

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445010
1.製作主題: 個人網站
2.網頁類型(活動式/主題式/個人/企業/..): 個人
3.導覽列分類(網站內容/中英文): 首頁/關於我/IDOL/商品/分享區
4.欲呈現之配色風格: 輕柔可愛
5.有無遇到的問題? 很想自己加東西上去,但是用一用就亂掉了(;´༎ຶД༎ຶ`)
6.花多少時間製作: 兩小時
7.製作心得:加油啊一定要努力記得語法(´;ω;`)ヾ(・∀・`)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445024
1.製作主題: Kanahei’s Small animals
2.網頁類型(活動式/主題式/個人/企業/..):主題式
3.導覽列分類(網站內容/中英文): 主頁/作者介紹/角色介紹/小小知識/了解更多
4.欲呈現之配色風格: 活潑俏皮可愛
5.有無遇到的問題?
6.花多少時間製作: 4小時
7.製作心得:越來越上手了!



Edited 1 time(s). Last edit at 05/31/2019 04:33AM by 1075445024.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445066
1.製作主題:YOUTUBER
2.網頁類型(活動式/主題式/個人/企業/..):個人
3.導覽列分類(網站內容/中英文): 首頁 / 認識MARK / 有趣遊戲影片 / YOUTUBER好友 / 大型計畫
4.欲呈現之配色風格:文青
5.有無遇到的問題? 無
6.花多少時間製作:6小時
7.製作心得:有比較上手

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445018
1.製作主題: 宜蘭新生活。旅遊
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 首頁(Home), 關於宜蘭(about),旅玩景點(Travel),美食(Food),住宿消費(Accom)
4.欲呈現之配色風格:藍色調
5.有無遇到的問題? 不知道該如何置中
6.花多少時間製作: 3小時
7.製作心得:很有趣,也能比較上手了。

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445028
1.製作主題:介紹桃園
2.網頁類型(活動式/主題式/個人/企業/..): 介紹
3.導覽列分類(網站內容/中英文):首頁 關於桃園 旅遊景點 美食 住宿消費
4.欲呈現之配色風格: 青綠
5.有無遇到的問題? 無
6.花多少時間製作: 兩個多小時
7.製作心得:好累

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445005
1.製作主題: 鄭秀晶
2.網頁類型(活動式/主題式/個人/企業/..):
3.導覽列分類(網站內容/中英文): 中
4.欲呈現之配色風格: 白咖啡
5.有無遇到的問題? 無
6.花多少時間製作: 半天
7.製作心得:有成就感

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445022
1.製作主題: 韓團偶像
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 首頁 演藝經歷 音樂作品 獲獎紀錄 演唱會
4.欲呈現之配色風格: 暗色
5.有無遇到的問題? 無
6.花多少時間製作: 2小時
7.製作心得:做完很開心

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445044
1.製作主題: 大陸劇
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 中文
4.欲呈現之配色風格: 單一
5.有無遇到的問題? 沒有
6.花多少時間製作: 還好
7.製作心得:更進一步的了解網頁設計。

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445048
1.製作主題:
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 最新消息/認識英雄/平行宇宙/主宇宙事件/最愛的英雄
4.欲呈現之配色風格: 冷
5.有無遇到的問題? 頭痛
6.花多少時間製作: 2小時
7.製作心得:頭太痛了

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1055445221
1.製作主題: 個人網頁
2.網頁類型(活動式/主題式/個人/企業/..):個人
3.導覽列分類(網站內容/中英文): 中
4.欲呈現之配色風格: 溫暖簡單
5.有無遇到的問題?
6.花多少時間製作: 一小時
7.製作心得:當訊息變大量時也要花費不少時間完成,太小看一頁了

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445059
1.製作主題:
2.網頁類型(活動式/主題式/個人/企業/..): 個人作品集
3.導覽列分類(網站內容/中英文): 首頁 平面設計 繪畫類 攝影 專題製作
4.欲呈現之配色風格: 寧靜 簡潔
5.有無遇到的問題?
6.花多少時間製作: 3hr
7.製作心得:

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445063
1.製作主題: 時裝介紹
2.網頁類型(活動式/主題式/個人/企業/..): 雜誌類別
3.導覽列分類(網站內容/中英文)confused smileyHOW/ Brand Introduction/ The Shows video/ Most Favorite/ NEWS!
4.欲呈現之配色風格:簡約風
5.有無遇到的問題? 太多問題
6.花多少時間製作: 2小時
7.製作心得:網業應該是我人生中最挫折的東西了哈哈

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445063
1.製作主題: 時裝介紹
2.網頁類型(活動式/主題式/個人/企業/..): 雜誌類別
3.導覽列分類(網站內容/中英文)SHOW/ Brand Introduction/ The Shows video/ NEWS!
4.欲呈現之配色風格:簡約風
5.有無遇到的問題? 太多問題
6.花多少時間製作: 2小時
7.製作心得:網業應該是我人生中最挫折的東西了哈哈



Edited 1 time(s). Last edit at 06/17/2019 07:58AM by 1075445063.
(編輯記錄)

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

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445012
1.製作主題:偶像
2.網頁類型(活動式/主題式/個人/企業/..):主題式
3.導覽列分類(網站內容/中英文): 專輯介紹,生活歷程,個人演唱會,戲劇作品
4.欲呈現之配色風格:簡約
5.有無遇到的問題? 文字無法置中
6.花多少時間製作:一天
7.製作心得:好累~

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445075
1.製作主題: troye sivan
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 首頁,about him,youth,mymymy
4.欲呈現之配色風格: 藍色
5.有無遇到的問題? 無
6.花多少時間製作: 全部4-5hr在拆開來交
7.製作心得:感覺自己沒有做得很理想



Edited 1 time(s). Last edit at 06/15/2019 09:19PM by 1075445075 林熙恩.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445063
1.製作主題: 時裝週介紹
2.網頁類型(活動式/主題式/個人/企業/..): 雜誌
3.導覽列分類(網站內容/中英文): SHOW/Brand Introduction/ The Shows video/ NEWS!
4.欲呈現之配色風格: 簡約風
5.有無遇到的問題? 很多問題
6.花多少時間製作: 6小時
7.製作心得:真的超難,做的過程中也發生超多問題,但慢慢靜下心來做,其實慢慢的就可以做要做的出來。

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1055440093
1.製作主題:ONE OK ROCK
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 樂團介紹index/ 吉他手&主唱 concept/貝斯手&鼓手html/ 專輯css /演唱會advanced
4.欲呈現之配色風格: 搖滾
5.有無遇到的問題? 暫無
6.花多少時間製作: 2.5小時
7.製作心得:還可以

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445073/
1.製作主題: 韓國藝人
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 個人介紹/粉絲名稱 /音樂作品 /影視作品/ 活動歷程
4.欲呈現之配色風格: 粉嫩色系]
5.有無遇到的問題? 常找不到換顏色的地方
6.花多少時間製作: 3hr
7.製作心得:換顏色真的很累哈哈

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445037
1.製作主題:熱門音樂社
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 首頁/精彩活動/相關連結/入社報名
4.欲呈現之配色風格:黑色系
5.有無遇到的問題? 有網頁設計真的好難
6.花多少時間製作:5小時
7.製作心得:都快哭了

作業網址: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/hw02/hw02-1075445035

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

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445061
1.製作主題:我的自我介紹
2.網頁類型(活動式/主題式/個人/企業/..):個人
3.導覽列分類(網站內容/中英文): 個人介紹、求學階段、讀書計畫、我的目標
4.欲呈現之配色風格:黃色
5.有無遇到的問題? 有
6.花多少時間製作:2天
7.製作心得:有學到東西。



Edited 1 time(s). Last edit at 06/20/2019 11:45AM by 1075445061 1A.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1055445208
1.製作主題:輕黏土DIY
2.網頁類型(活動式/主題式/個人/企業/..): 個人
3.導覽列分類(網站內容/中英文): 首頁index 、基本工具介紹concept、黏土介紹html、基礎作品css、進階作品advanced
4.欲呈現之配色風格: 活潑可愛
5.有無遇到的問題? 無
6.花多少時間製作: 1天
7.製作心得:很有成就感

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1055440119
1.製作主題: こまつなな 小松菜奈
2.網頁類型: idol主題
3.導覽列分類: 首頁 index 最新消息nana 演出作品show 相片集photo 文章連結link
4.欲呈現之配色風格: 紫橘色配色
5.有無遇到的問題? 無
6.花多少時間製作: 2HR
7.製作心得:還行!



Edited 1 time(s). Last edit at 06/20/2019 11:22PM by 1055440119.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445002
1.製作主題:模型製作 DIY
2.網頁類型(活動式/主題式/個人/企業/..):活動式和連結式
3.導覽列分類(網站內容/中英文): 中英文
4.欲呈現之配色風格:棕色、淡紅色
5.有無遇到的問題? 圖片調整有困難
6.花多少時間製作:50分鐘

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445002
1.製作主題: 模型製作DIY
2.網頁類型(活動式/主題式/個人/企業/..): 活動式和連結式
3.導覽列分類(網站內容/中英文): 中英文
4.欲呈現之配色風格: 棕色和淡紅色
5.有無遇到的問題? 沒時間用
6.花多少時間製作:50分鐘
7.製作心得:製作有部分困難

作業網址:http://cute.mepopedia.com/~web107a/hw03/hw03-1075445058/index.html
1.製作主題: 個人
2.網頁類型(活動式/主題式/個人/企業/..):個人
3.導覽列分類(網站內容/中英文):💕 最新消息 /品牌概念/ 品牌形象 /用心精匠/ 風格 💕
4.欲呈現之配色風格:溫暖
5.有無遇到的問題? 分頁連結打錯
6.花多少時間製作:4天
7.製作心得:錯一個地方又沒發覺那裡錯,感慨。