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

Advanced

Re: [期中作業] OnePage-網頁製作

[期中作業] OnePage-網頁製作

[期中作業] OnePage-網頁製作

作業範例:http://jinjin.mepopedia.com/~jinjin/hw/midterm

1. 製作說明



1.請參考以下講義

(1)[講義] 期中前置篇-header/nav/LOGO設計與導覽列設定/main/table
(2)[講義] 期中作業-onepage/main/article/section/圖文編排區塊單元/錨點連結/

的步驟製作。

期中作業為一頁式網頁(OnePage)

1.設計一一頁式網頁(OnePage),自行設定主題,針對內容,設定配色及相關風格。

2.準備圖與文,需要設計logo、視覺主圖、以及其他頁面內容需要的圖文資料,需要原創或取得授權。

3.footer請設定個人的專屬版權聲明,並註明『本網頁為作業之用,如有侵權敬請告知』字樣。

5.以FileZilla上傳至FTP

本單元需達成的目標有:

1.header/nav/LOGO設計與導覽列設定
2.main主圖的設定
3.表格的設定
4.article/section/單元的設定
5.圖文編排區塊單元
6.錨點連結
7.footer版權說明設定


2. 教學影片


1.【作業02解析】(一) header/nav/LOGO設計與導覽列設定/main/table-初步設定
https://youtu.be/gGTm3UYMzqE




3. 繳交作業方式



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



期中作業FTP上的資料夾為:midterm

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

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

存放在 < midterm-學號 > 的資夾內
可由作業二資料夾複製修改為midterm

2. 上傳至FTP



3. 回覆本篇文章



(2).請回答以下問題/可先於4/26前回覆前三項:

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



Edited 1 time(s). Last edit at 04/22/2019 10:11AM by JinJin.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/midterm/midterm-1075445002
1.製作主題: 模型製作 DIY
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文):認識模型 model 模型運用 application 教學影片 video 認識模型的比例 proportion 認識模型的製作 production
4.欲呈現之配色風格: 攝影,文創產業的顏色
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 1 time(s). Last edit at 04/22/2019 10:51AM by 1075445002-1.
(編輯記錄)

作業網址:
1.製作主題:portfolio
2.網頁類型:個人式
3.導覽列分類:關於我about me 日常life 未來規劃plan 隨筆note 連結link
4.欲呈現之配色風格:白色調配綠色調,簡約風。
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 1 time(s). Last edit at 04/23/2019 11:55AM by 1055440119.
(編輯記錄)

1.製作主題: 歌手介紹
2.網頁類型:主題式
3.導覽列分類(網站內容/中英文): 歌手介紹(Singer introduction),得獎紀錄(Winning record),生活動態(Life dynamics),創作專輯(Creating album)
4.欲呈現之配色風格:活潑
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 3 time(s). Last edit at 04/26/2019 12:44PM by 1075445012.
(編輯記錄)

1.製作主題:繪站
2.網頁類型(活動式/主題式/個人/企業/..):個人
3.導覽列分類(網站內容/中英文):關於/IDOL/原創/商品/
4.欲呈現之配色風格:可愛
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 1 time(s). Last edit at 04/25/2019 09:19PM by 1075445010.
(編輯記錄)

作業網址:
1.製作主題: 甜點
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 產品介紹() / 製作過程() / 食材介紹() /
4.欲呈現之配色風格:
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:

1075445024 Wrote:
-------------------------------------------------------
> 作業網址:
> 1.製作主題: cake!
> 2.網頁類型(活動式/主題式/個人/企業
> /..): 主題式
> 3.導覽列分類(網站內容/中英文):
> 蛋糕預告 / 代表蛋糕 / 蛋糕變身 / 機密蛋糕
>
> 4.欲呈現之配色風格: 謎之風味
> 5.有無遇到的問題?
> 6.花多少時間製作:
> 7.製作心得:

作業網址:
1.製作主題: 遊戲
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 遊戲介紹() / 角色介紹() / 遊戲種類() / DLC影片介紹 () / 節日活動 ()
4.欲呈現之配色風格:
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:



Edited 1 time(s). Last edit at 05/16/2019 08:37PM by 1075445066.
(編輯記錄)

1.製作主題: 宜蘭旅遊
2.網頁類型:主題式
3.導覽列分類(網站內容/中英文): 關於宜蘭(about),旅玩景點(Travel),美食(Food),住宿消費(Accom)
4.欲呈現之配色風格:藍色調
5.有無遇到的問題?
6.花多少時間製作:
7.製作心得:

(2).請回答以下問題/可先於4/26前回覆前三項:

作業網址:http://cute.mepopedia.com/~web107a/midterm/midterm-1075445050
1.製作主題: 我自己
2.網頁類型(活動式/主題式/個人/企業/..): 個人網頁
3.導覽列分類(網站內容/中英文): about me關於我 interest我的興趣 like what喜歡什麼 daily日常生活 website">網站
4.欲呈現之配色風格:日本傳統色
5.有無遇到的問題? 導覽列文字不知道怎麼分開
6.花多少時間製作: 3天
7.製作心得:自己摸索製作出來,很有成就感



Edited 2 time(s). Last edit at 05/15/2019 10:58PM by 1075445050.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107a/midterm/midterm-1075445002
1.製作主題:模型製作DIY
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文):中英文(部分再修改)
4.欲呈現之配色風格:文創產業的風格
5.有無遇到的問題? 顏色修改部分困難
6.花多少時間製作:2小時
7.製作心得:目前把期中的作業完成,但是製作的方面有困難。

作業網址:http://cute.mepopedia.com/~web107a/midterm/midterm-1075445054
1.製作主題: 歌手介紹
2.網頁類型(活動式/主題式/個人/企業/..): 主題式
3.導覽列分類(網站內容/中英文): 歌手介紹/演藝經歷/代表作品/演唱會/得獎紀錄
4.欲呈現之配色風格: 暖色系
5.有無遇到的問題? 配色和調整字型大小上花比較多時間
6.花多少時間製作: 一天
7.製作心得:做完自己喜歡的歌手後,很有成就感