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

Advanced

[作業02] 期中前置篇-header/nav/LOGO設計與導覽列設定/main/table

[作業02] 期中前置篇-header/nav/LOGO設計與導覽列設定/main/table

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

1. 製作說明



1.請參考以下講義

[url=http://jinjin.mepopedia.com/~jinjin/webdesign-notes/homework-2.html][講義] 期中前置篇-header/nav/LOGO設計與導覽列設定/main/table[/url] 的步驟製作。

本單元是期中作業一頁式網頁(OnePage)的前置階段,主要設定header中的LOGO設計與導覽列設定,以及main區塊內table表格的基本設定

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

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

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

5.以FileZilla上傳至FTP


2. 教學影片





3. 繳交作業方式



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



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

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

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

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


2. 上傳至FTP



3. 回覆本篇文章



(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-107xxxxxxx

(2).請回答以下問題:
1.製作主題:
2.欲呈現之配色風格:
3.有無遇到的問題?
4.花多少時間製作:
5.製作心得:



Edited 1 time(s). Last edit at 04/12/2019 07:51AM by JinJin.
(編輯記錄)

1.作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445045
(2)回答問題:
1.製作主題:MOCHI麻糬
2.欲呈現之配色風格:咖啡色、黑色
3.有無遇到的問題? 無
4.花多少時間製作: 2天
5.製作心得:麻糬真可愛

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075005785

(2).請回答以下問題:
1.製作主題: 東京喰種
2.欲呈現之配色風格:黑色、白色、紅色、陰鬱風
3.有無遇到的問題? 無
4.花多少時間製作:1天
5.製作心得:這動漫角色真多,雖然還有更多的。
視傳1A 1075445085 張芮瑄

作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445072/
(2)回答問題:
1.製作主題:傳說對決輔助霸主
2.欲呈現之配色風格:青色、藍色
3.有無遇到的問題? 不知道如何修改網址
4.花多少時間製作: 1天
5.製作心得:網頁設計讓我心好累
視傳1B朱廷翌

1.作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445034
(2)回答問題:
1.製作主題:甜點
2.欲呈現之配色風格:白色、淡黃色
3.有無遇到的問題? 已解決
4.花多少時間製作: 天
5.製作心得:
視傳一B 1075445034 鄭詳霖

1.作業網址:http://cute.mepopedia.com/~web107b/midterm/midterm-1075445023/
(2)回答問題:
1.製作主題: 攝影
2.欲呈現之配色風格:橘黃色
3.有無遇到的問題? 無
4.花多少時間製作: 5天
5.製作心得:剛開始覺得困難,但是看了老師的教學影片影片就會做了。



Edited 7 time(s). Last edit at 06/01/2019 09:18PM by 1075445023.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1055433048

(2).請回答以下問題:
1.製作主題:自我介紹
2.欲呈現之配色風格:簡約、現代風
3.有無遇到的問題? 無
4.花多少時間製作:1天
5.製作心得:這個作業讓我學會如何放置圖片、表格。

行管三A 1055433048 葉珈昀

作业网址http://cute.mepopedia.com/~web107b/hw02/hw02-1055443132
(2)回答问题
1、制作主题:MIT 陆生在台湾
2、欲呈现之配色风格:红、蓝
3、有无遇到的问题:不知怎么改变颜色;h1的LOGO旁怎样加上文字标题
4、花多少时间:1小时
5、制作心得:有的语法掌握不熟

视传3C 黃喬永

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445068

(2).請回答以下問題:
1.製作主題:偶像
2.欲呈現之配色風格:藍、粉
3.有無遇到的問題? 無
4.花多少時間製作:1天
5.製作心得:覺得很有趣

視傳1B 1075445068

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445086/

(2).請回答以下問題:
1.製作主題: 個人網頁
2.欲呈現之配色風格:橘色,黑色
3.有無遇到的問題? 無
4.花多少時間製作:1天
5.製作心得:雖然很難,可是很有趣

視傳1B 1075445086 比嘉伊津希

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1055433049

(2).請回答以下問題:
1.製作主題: ONE PIECE 航海王介紹
2.欲呈現之配色風格: 簡單、明亮設計
3.有無遇到的問題? 無
4.花多少時間製作: 2天
5.製作心得:學習到很多程式碼的知識,漸漸地知道如何用程式碼去排版,做出自己一個獨特的一頁式網頁。

行管3A 1055433049 鍾逸玟



Edited 2 time(s). Last edit at 05/18/2019 10:49AM by 1055433049.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445062

(2).請回答以下問題:
1.製作主題: 自我介紹
2.欲呈現之配色風格: 橘色系列和可愛風格
3.有無遇到的問題? 有
4.花多少時間製作: 1天
5.製作心得:我的主題是做介紹我自己,同時也能更了解自己。



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

(1).作業網址http://cute.mepopedia.com/~web107b/hw02/hw02-1075445006

(2).請回答以下問題:
1.製作主題:搖滾樂團
2.欲呈現之配色風格: 黑 白 黃
3.有無遇到的問題? 有
4.花多少時間製作: 有一點時間
5.製作心得 好累

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445031

(2).請回答以下問題:
1.製作主題: 進擊的巨人 人物介紹
2.欲呈現之配色風格: 紅白
3.有無遇到的問題? 有 不太會用,請別人教
4.花多少時間製作: 90分
5.製作心得:製作時因為人物眾多,所以只挑幾個頭領代表,因為不太會用,所以也花了不少時間去用。

MEPOERs said:
1075445085: 登錯帳號,請老師幫忙刪掉
(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445031

(2).請回答以下問題:
1.製作主題: 進擊的巨人 人物介紹
2.欲呈現之配色風格: 紅白
3.有無遇到的問題? 有 不太會用,請別人教
4.花多少時間製作: 90分
5.製作心得:製作時因為人物眾多,所以只挑幾個頭領代表,因為不太會用,所以也花了不少時間去用。

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1045445134

(2).請回答以下問題:
1.製作主題:神探夏洛克
2.欲呈現之配色風格: 灰藍、灰白
3.有無遇到的問題? 找不到圖片置中,我好想要對齊他QAQ
4.花多少時間製作: 一個禮拜(分心成分居多
5.製作心得:夏洛克很好看呀,好希望他出新一季

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445070

(2).請回答以下問題:
1.製作主題:INFNITE偶像網頁
2.欲呈現之配色風格: 粉嫩嫩///
3.有無遇到的問題? 尚無
4.花多少時間製作: 三個小時
5.製作心得:一開始以為首圖不能置中,後來才知道是因為還沒用css的原因XD



Edited 1 time(s). Last edit at 05/27/2019 11:05PM by 1075445070.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445049

(2).請回答以下問題:
1.製作主題: 偶像
2.欲呈現之配色風格:簡單樸素
3.有無遇到的問題:難到爆炸
4.花多少時間製作:半小時
5.製作心得:覺得可以做自己的偶像很開心 耶

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445049

(2).請回答以下問題:
1.製作主題:偶像 韓國團體
2.欲呈現之配色風格:簡單樸素
3.有無遇到的問題:難道爆炸
4.花多少時間製作:一小時
5.製作心得:可以做自己喜歡的偶像覺得很開心 耶!

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445079

(2).請回答以下問題:
1.製作主題: 偶像
2.欲呈現之配色風格:黃橘色
3.有無遇到的問題? 非常多 ! 哇超多 ! 覺得好難!!!!!!
4.花多少時間製作: 3and4小時
5.製作心得:哇好好看!有成就感。

1.作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445067
(2)回答問題:
1.製作主題:BABYMETAL
2.欲呈現之配色風格:紅色、黑色、白色
3.有無遇到的問題? 無
4.花多少時間製作: 3小時左右
5.製作心得:覺得頭痛希望影片有經過剪接不然會花費很多不必要的時間

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445032

(2).請回答以下問題:
1.製作主題:甜點
2.欲呈現之配色風格:白色、淡黃色讓人覺得甜甜的
3.有無遇到的問題?沒有
4.花多少時間製作:1天
5.製作心得:
覺得還行,不會到太難

作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445011

1.製作主題: fate grand order
2.欲呈現之配色風格: 藍色
3.有無遇到的問題? 兩張圖片剛開始換錯
4.花多少時間製作: 4小時
5.製作心得:要花時間看才能看得懂

1.作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445027
(2)回答問題:
1.製作主題:夜市美食
2.欲呈現之配色風格:紅色、橘色
3.有無遇到的問題? 經過修正,沒有問題。
4.花多少時間製作: 2天
5.製作心得:看不太懂語法,也記不太熟,目前只能先觀摩同學的作業製作,再自己去摸索,雖然製作進度慢很多,但是希望作業能越做越好。



Edited 5 time(s). Last edit at 06/08/2019 06:22PM by 1075445027.
(編輯記錄)

作業網址:file:///E:/hw-02-1075445029/index.html
1.製作主題:嚇奇驚影院
2.欲呈現之配色風格: 令人透過視覺感到驚悚的風格
3.有無遇到的問題? : 1. 有時css會不給換顏色而導致要再從做一次
2. 沒有軟體要一直跑圖書館,老師您可以將軟體發到line群嗎!!這樣大家都能下載了,感謝老師。
3. 改到最後下面的邊框不見了
4.花多少時間製作: 5 個小時
5.製作心得:
雖然說都是複製老師的網頁原始碼,還是需要自己去專研才會了解。

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445004

(2).請回答以下問題:
1.製作主題:自我介紹
2.欲呈現之配色風格:可愛甜美
3.有無遇到的問題? :一開始不太懂
4.花多少時間製作: 1天
5.製作心得:會了之後就很簡單



Edited 1 time(s). Last edit at 06/09/2019 11:46PM by 1075445004 葉沛妘.
(編輯記錄)

作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445029
1.製作主題:嚇奇驚影院
2.欲呈現之配色風格: 令人透過視覺感到驚悚的風格
3.有無遇到的問題? : 1. 有時css會不給換顏色而導致要再從做一次
2. 沒有軟體要一直跑圖書館,老師您可以將軟體發到line群嗎!!這樣大家都能下載了,感謝老師。
3. 改到最後下面的邊框不見了
4.花多少時間製作: 5 個小時
5.製作心得:
雖然說都是複製老師的網頁原始碼,還是需要自己去專研才會了解。



Edited 1 time(s). Last edit at 06/20/2019 07:15AM by 林郁惠.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445076

(2).請回答以下問題:
1.製作主題: Lamigo 桃猿隊
2.欲呈現之配色風格:藍.白.紅
3.有無遇到的問題? 有些字無法改顏色
4.花多少時間製作: 兩小時
5.製作心得:希望能夠繼續加油
視傳1B 1075445076

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445082
(2).請回答以下問題:
1.製作主題: 牛奶的日常
2.欲呈現之配色風格:溫興
3.有無遇到的問題? 沒
4.花多少時間製作: 1天
5.製作心得:很好玩讚讚!!

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445000

(2).請回答以下問題:
1.製作主題:
2.欲呈現之配色風格:
3.有無遇到的問題? 無
4.花多少時間製作:
5.製作心得:



Edited 2 time(s). Last edit at 06/08/2019 01:29AM by 陳鈺晴.
(編輯記錄)

廖瑄珈 Wrote:
-------------------------------------------------------
> (1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445007/
> (2).請回答以下問題:
> 1.製作主題:朴智旻
> 2.欲呈現之配色風格: 黑白灰
> 3.有無遇到的問題? 無
> 4.花多少時間製作: 1天
> 5.製作心得:越做越好



Edited 1 time(s). Last edit at 06/08/2019 01:28AM by 1075445007.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445084

(2).請回答以下問題:
1.製作主題:maroon 5
2.欲呈現之配色風格: 紅色
3.有無遇到的問題? 感恩同學幫忙
4.花多少時間製作: 1小時
5.製作心得:愛你沒法度

1075445084 視傳1B



Edited 1 time(s). Last edit at 06/10/2019 08:28PM by 黃章豪.
(編輯記錄)

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1035461031/

1.製作主題: 偶像
2.欲呈現之配色風格: 紅 黑
3.有無遇到的問題? 無
4.花多少時間製作: 1-2小時
5.製作心得:很有成就感

1035461031劉貞妏

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445040

(2).請回答以下問題:
1.製作主題: 蛋糕
2.欲呈現之配色風格: 簡單
3.有無遇到的問題? 沒有
4.花多少時間製作: 2小時
5.製作心得:終於做完了

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445087

(2).請回答以下問題:
1.製作主題:甜品.蛋糕
2.欲呈現之配色風格: 簡約
3.有無遇到的問題? 應該是沒吧
4.花多少時間製作: 兩個小時
5.製作心得:好開心 終於做完了!

http://cute.mepopedia.com/~web107b/hw02/hw02-1075445015

1.製作主題:育頡的老公
2.欲呈現之配色風格: 粉咖
3.有無遇到的問題? 最大的問題就是整個網頁製作過程
4.花多少時間製作: 2個禮拜
5.製作心得:頭很痛,痛到一直撞牆,理解力爛的真的不適合弄網頁



Edited 1 time(s). Last edit at 06/18/2019 01:12AM by 1075445015 1A.
(編輯記錄)

1.作業網址:file:///Users/xiaoyouhan/Desktop/hw02-1075445025/index.html
(2)回答問題:
1.製作主題:StreetSexy photo studio
2.欲呈現之配色風格:咖啡色、黑色
3.有無遇到的問題? 無
4.花多少時間製作: 2天
5.製作心得:複雜需要多細心

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1065445046

(2).請回答以下問題:
1.製作主題: 攝影
2.欲呈現之配色風格:簡單粉色調
3.有無遇到的問題? 很難做
4.花多少時間製作: 5個小時
5.製作心得:老師拜託給我過

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445060

(2).請回答以下問題:
1.製作主題: 攝影
2.欲呈現之配色風格: 冷色系
3.有無遇到的問題? 還好
4.花多少時間製作: 2hr
5.製作心得:開心

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445077/#3

(2).請回答以下問題:
1.製作主題: 粄回一城
2.欲呈現之配色風格: 可愛與現代融合
3.有無遇到的問題? 有時候不能更改顏色
4.花多少時間製作: 一天
5.製作心得:網頁好難喔

(1).作業網址:http://cute.mepopedia.com/~web107b/hw02/hw02-1075445043/

(2).請回答以下問題:
1.製作主題: 天竺鼠
2.欲呈現之配色風格: 綠白
3.有無遇到的問題? 教我的人亂教
4.花多少時間製作: 2h
5.製作心得: