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

Advanced

Re: [期中作業] 以單欄為主的網站設計

[期中作業] 以單欄為主的網站設計

[期中作業] 以單欄為主的網站設計



1. 一、製作說明:


1.請參考期中之前教過的做法及講義,製作以單欄為主的網站

2.每個同學記得在title的部分打上"自訂的主題"

在#footer 註明 Designed by 某某某(可自行取名) 1055445ooo

3.題目自訂,請設計出符合網站主題的配色及設計風格。

4.需自行設計圖片,製作網站內容。

5.需以DIV搭配CSS的方式完成,設定尺寸、字體、顏色等等。

6.頁數要求:
(1)至少完成三頁的內容,語法無錯誤(60分),若內容完整,設計精美可再加分至多80。
(2)至少完成五頁的內容,語法無錯誤(80分),若內容完整,設計質感高,最多100分。

7.若真的不會做,可下載附檔,參考老師的檔案,加以修改完成,但圖片及文字內容不可一樣。
(附檔有兩組:
一組是以圖片按鈕為主,需自行製作圖片
一組是以導覽列為主(色彩編排),請選擇一組參考製作)


8.製作完成上傳至FTP

9.本次作業的重點在於:

(1)能自行設計以DIV與CSS製作的網站
(2)利用自已設計的圖片、色彩搭配與字體設定等設計出具有質感的網頁



2. 二、評分標準與製作檢核


1.HTML的正確架構(DIV的使用)
2.整體設計美感(CSS運用,風格及配色,字體設定、圖片製作)
3.導覽列的正確性(含導覽超連結)
4.h1或h2的使用
5.class(類別)的運用
6.HTML Title的設定
7.Footer的版權宣告
8.內容完整的兩頁(至少)的連結
9.製作說明


3. 三、繳交作業方式


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

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

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

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

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



2.全部完成後上傳至FTP

3.依進度回覆本篇文章


前置作業(11/16)
(1)網站主題:
(2)製作動機:
(3)製作內容:
(每個導覽列的中文及(英文檔名))
(4)風格設定:
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:



完成品(11/23/30前)
請將這項放置於文章最前面
(1)作業網址
(2)
1有無遇到的問題
2.製作感想
3.製作作業的時間


4.請務必在11/23前回覆,否則為遲交

寫法參考:http://mepopedia.com/forum/read.php?2603,82673

4. 五、同學常見問題之注意事項



隨時補充:

1.網頁圖檔不宜太大,否則網頁開啟速度會變慢,請盡量在Photoshop或Illustrator的『儲存為網頁與裝置用』的功能裡,修改圖檔的大小至100KB以下,100KB會佔1Mb頻寬(每秒鐘),以此類推。

2.有文字出現的區塊,要記得設定padding,文字才不會跟邊框黏在一起。

3.亂碼問題,放在 <head> </head> 之間
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 編碼方式記得存utf-8

5.CSS檔案的路徑,放在 <head> </head> 之間
<link rel="stylesheet" href="style.css" media="screen" />
6.檔案宣告,在HTML檔最前面放 <!DOCTYPE html>
7.任何出現在網頁裡的命名不能出現中文及全形字。

8.圖片必須放在images圖片資料夾裡



5. 參考範例



http://mepopedia.com/forum/read.php?851,16485

http://mepopedia.com/forum/read.php?855,16484



http://mepopedia.com/~web100b/midterm/midterm-1001445022/
http://mepopedia.com/~web100b/midterm/midterm-1001445042/
http://mepopedia.com/~web100b/midterm/midterm-1001445006/
http://mepopedia.com/~web100a/midterm/midterm-1001445068/
http://mepopedia.com/~web100a/midterm/midterm-1001445096/
http://mepopedia.com/~web100a/midterm/midterm-1001445015/
http://mepopedia.com/~web100b/midterm/midterm-1001445049/
http://mepopedia.com/~web100b/midterm/midterm-1001445123/
http://mepopedia.com/~web100b/midterm/midterm-1001445026/
http://mepopedia.com/~web100a/midterm/midterm-1001445072/
http://mepopedia.com/~web100a/midterm/midterm-1001445080/

http://mepopedia.com/~web103-a/midterm/midterm-1025445001/
http://mepopedia.com/~web103-a/midterm/midterm-1025445070/
http://mepopedia.com/~web103-c/midterm/midterm-1025445069/

=================================================
若經發現作業為直接複製同學檔案以零分計
=================================================

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445095/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了功能更多的網站了!
3.製作作業的時間:約兩天。

(1)網站主題: globe
(2)製作動機: 喜歡復古風格的電音
(3)製作內容:
首頁(index)>>樂隊歷史
關於(globe)>> 樂隊介紹
成員(member)>>成員簡介
音樂(music)>>音樂介紹
圖片(photo)>>圖片一覽
連結(link)>>正版官方網址
(4)風格設定: 復古的黑灰白三色。
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
官網: http://avex.jp/globe/
配色編排簡約,選單理解容易。



Edited 1 time(s). Last edit at 11/29/2017 04:11PM by Daniel Wang.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445008/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了功能更多的網站了!
3.製作作業的時間:約兩天。

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445107/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了功能更多的網站了!
3.製作作業的時間:約兩天。

(1)作業網址 http://mepopedia.com/~css106-2b/midterm/midterm-1055445152
(2)
1有無遇到的問題 無
2.製作感想 只要照著老師的節奏走就可以得心應手
3.製作作業的時間 4hrs

smiling bouncing smiley

(1)網站主題: 恐懼集散地
(2)製作動機: 喜歡這些探索人類心底恐懼的主題
(3)製作內容:
(index.html) 高個子男人>> slender man
(mandela.html) 曼德拉效應 >>the mandela effect
(smiley.html) 微笑殺人理論 >>smiley face murder theory
(salt.html) 鹽湖城的神祕托兒所>> salt lake city daycare
(4)風格設定: 黑暗
(5)資料蒐集分析 http://aaronnieh.com/
◎設計優良網站(風格)列表與分析:喜歡這種簡約大方的風格



Edited 2 time(s). Last edit at 11/29/2017 10:08PM by 1055445152.
(編輯記錄)

(1)網站主題: KJHRPG資料庫
(2)製作動機: 想製作跟朋友一起玩的 文字冒險遊戲 的資料庫
(3)製作內容:
首頁 簡易的圖片與介紹
世界觀資料庫
遊玩系統與戰鬥系統介紹
角色資料庫
敵方資料庫
(4)風格設定: 簡單 介紹向網頁
(5)資料蒐集分析 http://pad.skyozora.com/
◎設計優良網站(風格)列表與分析:簡易的陳列項目讓觀看者能更快的搜索到想看的網頁

(1)網站主題:一家人
(2)製作動機: 喜歡臺灣八點檔
(3)製作內容:
劇情介紹(index)=介紹劇情
角色介紹(Character introduction)=介紹角色
製作團隊(Production team)=介紹幕後工作人員
花絮照片(Activities tidbits)=觀看花絮
(4)風格設定: 使用清新風格
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
官網: https://tw.news.yahoo.com/weather/
看起來很有質感的網頁,深受喜愛。

(1)作業網址 :http://mepopedia.com/~css106-2b/midterm/midterm-1055445197/hw03-1055445197/
1有無遇到的問題 :目前沒有
2.製作感想 :很累,花了很多時間,但感覺不錯
3.製作作業的時間 :好幾天

(1)網站主題: MUSE band(繆斯樂團)
(2)製作動機:,他們對各種陰謀論、外星生物、神學以及末世預言等的怪異受到年輕人的追捧。、
(3)製作內容: MUSE band 成員member 專輯album 周邊surrounding 視屏video(每個導覽列的中文及(英文檔名))
(4)風格設定: 搖滾風
(5)資料蒐集分析  ◎設計優良網站(風格)列表與分析:
網站 網址 風格 優點



一方設計 http://www.e-fun.com.tw/company.php 簡潔,商務 信息傳達精準,排版字體大小有序,富有設計感



Shopping design https://www.shoppingdesign.com.tw/ 整齊,整潔,靚麗 整齊圖與文的編排方式使得閲讀十分容易



Edited 6 time(s). Last edit at 11/29/2017 01:06AM by onfriend.
(編輯記錄)

(1)網站主題: 質感好物
(2)製作動機: 想分享喜歡的物件
(3)製作內容:
首頁(index)
鋼筆(pen)
墨水(ink)
蠟封章(wax)
沙擺(sand)
(4)風格設定: 用大理石紋去襯托
(5)資料蒐集分析
https://udesign.udnfunlife.com/mall/Cc1a00.do
感覺很簡潔,閱讀容易

(1)作業網址 http://mepopedia.com/~css106-2b/midterm/midterm-1055448122/
(2)
1有無遇到的問題 多設定到一個圖片...找好久才看到...
2.製作感想 過程很挫敗 但是完成的時候很開心
3.製作作業的時間 接近兩個禮拜 好幾天都在找錯的程式碼...



Edited 3 time(s). Last edit at 11/22/2017 08:57PM by Liuyucian.
(編輯記錄)

完成品(11/23/30前)
(1)http://mepopedia.com/~css106-2b/midterm/midterm-1055445014
(2)
1.我部會繞圖排文
2.部會還是很好玩
3.3小時吧


前置作業(11/16)
(1)網站主題:山畝的網頁
(2)製作動機: 介紹YOUTUBER
(3)製作內容:YOUTUBER的影片內容
(每個導覽列的中文及(英文檔名))
(4)風格設定: YOUTUBE的配色 設計
(5)資料蒐集分析 YOUTUBE



Edited 1 time(s). Last edit at 11/30/2017 10:39AM by a0936280046.
(編輯記錄)

作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445056
有無遇到的問題:有時無法理解一些步驟(哈哈哈)
製作感想:終於完成了難搞的網站啦 !!
製作作業的時間:約 1 天多

(1)網站主題:HUNG CHI CHENG
(2)製作動機:一個介紹自己的網站
(3)製作內容:ABOUT ME / PHOTO / MUSIC / SCHOOL / BLOOD TYPE
(4)風格設定:以簡單時尚文青感

官方網址 >> http://www.e-fun.com.tw/company.php
◎ 設計優良網站(風格)列表與分析:我喜歡簡約的風格



Edited 1 time(s). Last edit at 11/30/2017 12:07AM by 1055445056.
(編輯記錄)

(1)網站主題: 航海王One Piece
(2)製作動機: 從小喜愛它的航海王迷
(3)製作內容:
index>前言(prefact)
character>角色介紹(character introduction )
movie>電影動畫(movie animation)
word>經典語錄(classic quotations)
food>主題餐廳 (themed restaurant)
(4)風格設定: 以"大海"的藍為主色系,搭配簡單淡藍為區域色,以及檸檬黃作為襯托的底色。
(5)資料蒐集分析
https://popbee.com/
◎設計優良網站(風格)列表與分析:簡潔時尚的內容、井然有序的編排、清新自然的風格。
(1)作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445086-2

1遇到的問題:看過筆記重頭做後,就解決了
2.製作感想:我覺得很開心能夠製作自己喜歡的網頁~很有成就感!
3.製作時間:3天左右



Edited 1 time(s). Last edit at 11/30/2017 10:27AM by 1055445086.
(編輯記錄)

(1)
http://mepopedia.com/~css106-2b/midterm/midterm-1055445104

(2)
製作問題:
    的點點設定
    置入圖片後蓋過fotter
    想要崁入影片

    2.很喜歡這個作業 希望能表現更精緻的網站
    3.好幾天




    (1)網站主題: VESPA 偉士牌
    (2)製作動機: 熱愛品牌文化

    (3)製作內容:
    歷史介紹(index)
    946款(946)
    Sprint款(sprint)
    GTS款(gts)
    Primavera款(pr)
    LXV款(lxv)

    (4)風格設定: 清晰明瞭 易分辨 鮮明色彩
    (5)資料蒐集分析
    官網: http://www.2121designsight.jp/
    ◎設計優良網站(風格)列表與分析: 簡單清楚的呈現所有重點 跳色的細節讓使用者更容易點取



    Edited 1 time(s). Last edit at 11/17/2017 12:32AM by MEATBALL HONG.
    (編輯記錄)

(1)網站主題: G.E.M.鄧紫棋
(2)製作動機: 最愛的歌手
(3)製作內容:
首頁 HOME
關於 ABOUT
音樂 MUSIC
相冊 PHOTO
TOUR

(4)風格設定: 簡約大方,色彩以藍、紫色為主
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
http://geteverybodymoving.com/
以圖片為重,呈現鮮豔、光鮮亮麗的感覺,能展現出明星架式


(1)作業網址 http://mepopedia.com/~css106-2b/midterm/midterm-1055445017
(2)
1有無遇到的問題:無
2.製作感想:花很久的時間才把它做完,還蠻累的,但看到成品後真的很有成就感。
3.製作作業的時間:6~7小時



Edited 3 time(s). Last edit at 11/25/2017 10:41PM by SCY.
(編輯記錄)

(1)網站主題: 天月 niconico 歌手
(2)製作動機: 很喜歡他的歌
(3)製作內容:
關於天月(about)
專輯(Album)
演出作品(performances)
影片(vivedos)
相關連結 (related sites)
(4)風格設定: 簡單 明瞭
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
https://pick.mydesy.com/archives/30442
風格排版簡潔又乾淨
http://sayuri-web.com/
喜歡首頁滑鼠和圖的互動
(1)作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445059
(2)
1有無遇到的問題:看影片做大部分都ok,上傳後,網址有點問題。
2.製作感想:容易打錯就悲劇了。
3.製作作業的時間:好幾天的凌晨(夜貓子)

網站主題:鬼門圖文

製作動機:喜歡這個圖文作家

製作內容:
首頁(index)
關於(about)
經歷(experience)
作品(works)
商品(commodity)

風格設定: 簡約
資料蒐集分析

◎設計優良網站(風格)列表與分析:
官網: http://www.oneday.com.tw
配色不多,編排簡單,用照片顯現出內容風格

作業網址 http://mepopedia.com/~css106-2b/midterm/midterm-1055445191

(1)網站主題: B1A4
(2)製作動機: 很喜歡這個韓國團體
(3)製作內容:
關於B1A4(index)
成員介紹(introduction)
專輯唱片(album)
畫廊(gallery)
影片(video)
(4)風格設定: 沉穩、冷靜感


(1)作業網址 : http://mepopedia.com/~css106-2b/midterm/midterm-1055445182
(2)
1有無遇到的問題? 原本有,後來都解決了
2.製作感想 。很有趣
3.製作作業的時間。好幾天,不記得了



Edited 1 time(s). Last edit at 11/30/2017 10:15AM by amy2285210103.
(編輯記錄)

(1)網站主題: 抹茶小館
(2)製作動機: 喜歡吃
(3)製作內容:
關於抹茶(index)
北部抹茶(taipeimatcha)
中部抹茶(centralmatcha)
南部抹茶(southernmatcha)
海外抹茶(overseasmatcha)
(4)風格設定: 文青/可愛
(5)資料蒐集分析

(1)作業網址 : http://mepopedia.com/~css106-2b/midterm/midterm-1055445023
(2)
1有無遇到的問題? 有,index的css打開網頁跑不出來
2.製作感想 很有趣
3.製作作業的時間 2天

(1)網站主題: 歌手まふまふ
(2)製作動機:因為本身就很愛聽歌まふまふ的聲音又非常的特別
(3)製作內容:
關於まふまふ(index)
合作對象(partner)
歌曲影片(movie)
專輯(discography)
相關網站(websites)
(4)風格設定: 以灰白為主又不失可愛
(5)資料蒐集分析

https://www.bonnyread.com.tw/

(1)作業網址 : http://mepopedia.com/~css106-2b/midterm/midterm-1055445119
(2)
1有無遇到的問題? 有,但是後來花了些時間解決了
2.製作感想 比起以前做的更有成就感
3.製作作業的時間 3天以上

http://mepopedia.com/~css106-2b/midterm/midterm-1055445071
(1)網站主題:京都散步
(2)製作動機:喜歡京都的特色
(3)製作內容:
首頁 Home
景點 Attractions
料理 Cuisine
客室 Hostel
文化Culture
(4)風格設定: 簡約、日式
(5)資料蒐集分析:
https://ki-do-ri.jp
http://cineca.si
◎設計優良網站(風格)列表與分析:簡單的風格搭配上顏色使整體更有感覺

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445095/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成....想再加油
3.製作作業的時間:慢慢搞 忘記時間。

(1)網站主題:我的旅遊館
(2)製作動機: 喜歡旅遊、也想讓大家認識我。
(3)製作內容:
首頁(index)>>景點介紹、台灣特色
個人資料(me)>> 介紹我
攝影作品(works)>>我的攝影作品
比賽資訊(contest)>>近期特別的比賽
旅遊景點(tourism)>>旅遊規劃

(4)風格設定: 溫暖的感覺帶給人們希望。
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
痾....我就自己做,網路找一些旅遊資訊。

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445068/
1.有無遇到的問題:無。
2.製作感想:還有好多網站要做......(冒煙
3.製作作業的時間:一個晚上。

(1)網站主題: 魔物獵人-世界
(2)製作動機: 很愛魔物獵人
(3)製作內容:
(index)>>word的大致介紹
(globe)>>魔物介紹
(member)>>狩獵介紹
(music)>>地圖介紹
(photo)>>調查據點

資料搜集:
https://www.youtube.com/watch?v=WXYveyASCeg&list=PLG9Vclgo7ASJ9Dys1U3oyjkdovTq7CkUP

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445026/index.html
(2)
1.有無遇到的問題:果然改成黑色一切就會有質感
2.製作感想:終於做完了 (開心
3.製作作業的時間:第一頁做滿久的,底色白色很不好看,後來改成白色就做比較快了
(1)網站主題:帥氣炫砲的LOL角色厚重毛毛毯網站
(2)製作動機:新竹這裡很冷 需要毛毛毯 我想要件帥氣的毛毛毯
(3)製作內容:
第一頁 毛毛毯介紹 /璃璃寶寶超柔柔軟毛毛毯/仿真毛皮的運用 優缺介紹
第二頁 雷葛爾超帥氣大毛毯
第三頁 BAGOBAGO吶兒毛毯/在冰域需要的酷炫毛毛毯
第四頁 金毛毯/探險家的毛毛毯
第五頁 Fizz精細時尚毛毛毯
(4)風格設定:成熟 穩重 帥氣
(5)資料蒐集分析: https://lol.garena.tw/preindex 維基百科 LOL
讚讚 帥氣 他的音樂有點太吵

前置作業
(1)網站主題:認識貓咪
(2)製作動機: 想讓更多人了解貓咪
(3)製作內容: 貓咪飲食及習慣禁忌cat's diet/
貓奴注意!人類對貓咪的10大誤解Misunderstanding of cats/
貓咪的尾巴Cat's tail/
貓咪的叫聲Cat's call
(4)風格設定: 穩重色調
(5)資料蒐集分析
◎設計優良網站(風格)列表與分析: https://pet.talk.tw/Article.aspx?ClassID=2&Article_ID=165
清楚明瞭


完成品
(1)作業網址 http://mepopedia.com/~css106-2b/midterm/midterm-1055445137
(2)
1有無遇到的問題 有,檔案位置亂掉
2.製作感想 有點難,但做完有成就感
3.製作作業的時間 四天



Edited 1 time(s). Last edit at 11/29/2017 10:44PM by 1055445137.
(編輯記錄)

http://mepopedia.com/~css106-2b/midterm/midterm-1055445146
1有無遇到的問題 :沒有
2.製作感想 :有待加強
3.製作作業的時間 :2017/11/30

網站主題:HONDA本田重機
製作動機:喜歡本田的各式重機
網站內容:首頁:本田歷史
CBR1000RR
CB1000R
X-ADV
VFR800
GoldWing
風格設定:唯美 簡潔俐落
參考資料:https://motocity.tw/menu/



Edited 1 time(s). Last edit at 11/30/2017 02:53AM by kevin613.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445044/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了功能更多的網站了!
3.製作作業的時間:約4天。

(1)網站主題: 陳奕迅
(2)製作動機: 很喜歡陳奕迅 覺得他的歌都是經典
(3)製作內容:
簡介(introduction)>> 介紹 陳奕迅
音樂獎項紀錄(awards)>>陳奕迅得獎紀錄
音樂作品(musical)>>陳奕迅音樂作品
演出作品(movie)>>陳奕迅演出作品
影片(film)>>影片連結
(4)風格設定: 簡約的黑灰白三色。

(1)作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445110

1遇到的問題:原始碼太長,有些不小心沒分到行就找不到了...
2.製作感想:過程一點也不暢快,但完成後真的很感動
3.製作時間:上下課+一個熬夜到晚點去上早八的時間...
( 因為筆電沒有DW所以耗很多時間搞破解版,下載很久所以就先去上班,回來看電腦還安裝失敗好崩潰...)


(1)網站主題:CHOCHOCO
(2)製作動機:是一家很有質感的巧克力專賣店 所以推薦
(3)製作內容:
品牌概念(About Us)
經典商品(Chocolate)
主打商品(Special)
購物問題(Others)
門市查詢(Contact)
(4)風格設定: 以黑色及金色襯托質感
(5)資料蒐集分析
http://www.chochoco.com/
雖然很有質感,但畫面東西有點太多顯得有些雜亂,整體來說簡潔明瞭就是很棒的網站

http://mepopedia.com/~css106-2b/midterm/midterm-1055445038
終於做完一個屬於自己的網頁了,其實做完挺帥的,之後要做一個更完整的籃球網頁,繼續努力



Edited 1 time(s). Last edit at 11/30/2017 05:59AM by litttle dot.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445164/index.html
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了功能更多的網站了!
3.製作作業的時間:約兩天。

http://mepopedia.com/~css106-2b/midterm/midterm-1055445002

(1)網站主題:自強號40周年
(2)製作動機: 製作介紹台灣火車的網站
(3)製作內容:
電氣化與自強號 1970 (index)
電氣化的通車 1980 (002)
與公路的競爭 1990 (003)
PP新世代 2000 (004)
東部傾斜的新市場 2006 (005)



Edited 2 time(s). Last edit at 11/30/2017 01:31PM by 1055445002.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445185
(2) 1.有無遇到的問題:有最後問題都解決了。
2.製作感想:還不錯。
3.製作作業的時間:忘記了。

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445032/index.html
(2)
1.有無遇到的問題:好累
2.製作感想:超累
3.製作作業的時間:5小時up

http://mepopedia.com/~css106-2b/midterm/midterm-1055445188
1)網站主題:INFINITE
(2)製作動機: 介紹INIFINTE
(3)製作內容:INFINITE簡單介紹
(每個導覽列的中文及(英文檔名))
(4)風格設定: 簡約

http://mepopedia.com/~css106-2b/midterm/midterm-1045445101
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了
3.製作作業的時間:4小時。

(1)網站主題: 怪物插畫
(2)製作動機:喜歡怪物
(3)製作內容: 怪物插畫



Edited 1 time(s). Last edit at 12/06/2017 10:44PM by 蘇雁祺.
(編輯記錄)

作業網址:http://mepopedia.com/~css106-2b/midterm/midterm-1055445201/NEWS.html

(1)網站主題:醜比頭
(2)製作動機:喜歡醜比頭
(3)製作內容:
NEWS>NEWS
KOBITOS>KOBITOS
BOOKS>BOOKS
MOVIES>MOVIES
RESTAURANT>RESTAURANT
(4)風格設定: 整個版面顏色是粉屁桃配色,咖啡色是樹木的顏色


1遇到的問題:剛開始滿多問題的,但影片幫助很多
2.製作感想:雖然有些地方會卡到,但看完影片,問了老師同學後理解很多,完成了就很有成就感
3.製作時間:3天

http://mepopedia.com/~css106-2b/midterm/midterm-1045445101
(2)
1.有無遇到的問題:無。
2.製作感想:終於完成了
3.製作作業的時間:4小時。

(1)網站主題: 怪物插畫
(2)製作動機:喜歡怪物
(3)製作內容: 怪物插畫

http://mepopedia.com/~css106-2b/midterm/midterm-1055445092
有無遇到的問題:除了忘記存檔重作之外其他都沒問題
製作感想:還是蠻有趣的拉
製作時間:漫長的歲月



Edited 1 time(s). Last edit at 12/07/2017 03:59AM by litttle dot.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445047/book.html
(2)
(1)網頁主題:偉士牌介紹
(2)製作動機:喜歡復古檔車
(3)製作內容:
<品牌故事>
<車系介紹>
<我愛VESPA>
專屬零配件>

(4)風格設定:簡約沉穩感
(5)作業網址:
(6)有無遇到甚麼問題:一大堆 只是解決了
製作感想:剛開始真的完全看不懂 好險有好同學互助 做完了真的想哭



Edited 1 time(s). Last edit at 12/07/2017 11:44AM by 1055445023.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1035461031/index.html
(2)
1.有無遇到的問題:有~~連結我有做錯可是我找不到為啥麼QQ我還是先上傳了
2.製作感想:有點搞混
3.製作作業的時間:約兩天。

(1)網站主題: 飛天小女警
(2)製作動機:很喜歡這個卡通

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445176/
(2)
1.有無遇到的問題:無。
2.製作感想:完成了
3.製作作業的時間:忘了

(1)網站主題: 我的旅遊館
(2)製作動機: 單純分享生活經驗與旅遊照片
(3)製作內容: 個人資料、攝影作品、比賽資訊、旅遊景點
(4)風格設定: 另類、自我

(1)作業網址: http://mepopedia.com/~css106-2b/midterm/midterm-1055445083/
(2)
1.有無遇到的問題:有
2.製作感想:好像感覺到他的規則
3.製作作業的時間:好久

(1)網站主題: 北京故宮
(2)製作動機: 很喜歡中國風、歷史文物
(3)製作內容: 簡單的故宮介紹
(4)風格設定: 極簡

(1)作業網址 :http://mepopedia.com/~css106-2b/midterm/midterm-1055445143
(2)
1有無遇到的問題:有 解決了
2.製作感想:桌機做起來比較方便
3.製作作業的時間:沒有計算