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

Advanced

[作業03] HTML與CSS練習--首頁實作篇

[作業03] HTML與CSS練習--首頁實作篇

1. HTML與CSS練習--首頁實作篇作業說明


請參考
[講義] HTML與CSS練習--首頁實作篇:http://mepopedia.com/forum/read.php?804,43670

1. 作業目的

1.進一步熟悉HTML與CSS
2.練習將視覺與語法結合
3.學習如何修改HTML與CSS語法



2. 作業說明

1.請以範例網站為基模,使用其排版概念,重新改編為一新的網站設計,除了架構一樣,其他資訊皆要更新。
2.製作:(1)完成首頁,(2)設定滑鼠移過的效果,其他頁面將陸續完成。



3. 作業步驟

1.參考http://mepopedia.com/~web102-c/hw03/hw03/
並以講義中的語法為參考http://mepopedia.com/forum/read.php?804,43670
2.重新設定一全新網站的主題,蒐集相關主題及內容資料
3.重新設定網站主題、使用對象、色彩計畫、圖片元素等。
4.製作背景圖片、整體色彩設定,標題及文字內容。
5.將HTML與CSS語法分別貼上後,修改HTML與CSS語法。
6.將資料夾命名為 hw03-學號,以FTP上傳至hw03資料夾
作業網址為http://mepopedia.com/~web102-a/hw03/hw03-1015445XXX

並請回覆:

(1)作業網址:
(2)網站主題:
(2)對象:
(3)色彩計畫:
(4)風格設定、網頁看點、預期成效:
(5)請整理以下數值:
字體設定(font-family)
標題級數、文章標題級數、內文級數(font-size)(單位px)
區塊內與區塊間的距離(padding)(margin)(單位px)
網站寬度(width)(單位px)
(6)製作心得:
學號



請於規定時間準時繳交作業,逾期不後。



(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445006/ 〈原本的〉
http://mepopedia.com/~web102-a/hw03/hw03-1%201015445006/〈更改過的〉
(2)網站主題:YA-HAN Designer Website
(2)對象:幼稚園以上的人包誇小朋友
(3)色彩計畫:整個色調以粉紅色為主,讓人一看就有很浪漫的感覺~~~
(4)風格設定、網頁看點、預期成效:
風格設定:以粉紅色為主,想表達出可愛、親切的風格
網頁看點:以我的主畫面圖片為主─繪本,每一個標籤滑鼠移過去都會有顏色的變化,這是值得看的
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數:YA-HAN Designer Website 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:終於可以用dreamweaver寫一篇網站了,又以自己最喜歡的主題去做,雖然語法每個html都要看對哪一個的css ,但是,這的確學到非常多,以前看不懂的語法,沒想到現在看懂了一些,相信只要越來越多這種自己架設的網頁,就可以讓我學到更多東西。
學號 1015445006



Edited 1 time(s). Last edit at 04/02/2014 10:28PM by 蘭雅涵.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445001/
(2)網站主題:大自然
(2)對象: 25以上的吧
(3)色彩計畫: 自然色調為主,不高的彩度給人舒服的感覺
(4)風格設定、網頁看點、預期成效: 風格呈現是輕鬆舒服的,圖片變化是特點,預期成效為讓觀看者能知道多
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數:24px 文章標題級數:20px 內文級數: 12px
區塊內與區塊間的距離l:22px
網站寬度: 1351px
(6)製作心得:簡單的區塊,和基本架構就能做出很有質感的網站,我覺得非常棒!一開始用語法做摸索很久,但也因為有去自己暸解因此有明白一些東西。


1015445001



Edited 2 time(s). Last edit at 04/01/2014 10:49AM by light.
(編輯記錄)

1)作業網址:

(2)網站主題:卡通網站

(2)對象: 10~40歲左右

(3)色彩計畫:使用綠色系

(4)風格設定、網頁看點、預期成效: 簡約的風格設定黃黑配色是看點,預期做成閱讀方便的感覺

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:能製作喜愛的卡通網頁還滿有趣的。


1015445020

1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445030/

(2)網站主題:進階網頁設計課程的作業

(2)對象: 老師

(3)色彩計畫:使用綠色系

(4)風格設定、網頁看點、預期成效: 簡約的風格是設定也是看點,預期做成容易閱覽一目了然的感覺

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:好高深難懂


1015445030



Edited 3 time(s). Last edit at 04/01/2014 12:28PM by 1015445030陳族維.
(編輯記錄)

1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445017/

(2)網站主題:JORDAN球鞋

(2)對象: 球鞋迷

(3)色彩計畫:紅色背景中帶點復古黑白

(4)風格設定、網頁看點、預期成效:90年代JORDAN叱吒NBA美國職籃,也推出了很多個人鞋款,想用簡單的方式介紹給大家。

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:自從第一次碰到網頁就覺得他是我的剋星,還有很多很難的都不會,只能盡力去完成他!


1015445017

1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445051/

(2)網站主題:伍佰&China Blue

(2)對象: 一般大眾

(3)色彩計畫:使用暗灰色系

(4)風格設定、網頁看點、預期成效: 簡約

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:hot smiley

MEPOERs said:
lin yi: 伍佰就是讚
lin yi: 伍佰就是讚 好球好棒棒
(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03_1015445024/

(2)網站主題:個人網站

(2)對象: 一般大眾

(3)色彩計畫:使用暗色黑橘

(4)風格設定、網頁看點、預期成效: 簡約

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:陳全福大哥有指導



Edited 8 time(s). Last edit at 04/01/2014 01:24PM by lin yi.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445018/
(2)網站主題:辛普森家庭
(2)對象:收看的大眾
(3)色彩計畫:以節目的logo擷取色彩,以黃色與紅色為主。
(4)風格設定、網頁看點、預期成效:
風格設定:以黃色為主,表達出幽默、無理頭的逗趣風格。
網頁看點:詳細的介紹人物及節目的內容。
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:更了解製作網站的方法。



Edited 2 time(s). Last edit at 04/01/2014 03:28AM by 1015445018.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445023/
(2)網站主題: 攝影平台
(2)對象: 喜愛攝影族群,一般大眾,初入門攝影者。
(3)色彩計畫: 以深藍色調為主,輔以黑色,些許的漸層色點綴網站的質感。
(4)風格設定、網頁看點、預期成效: 風格用深藍色的沉穩感帶出攝影所能表達出的質感,和深色比較能夠突顯出影像,讓影像成為重點。
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數:24px文章標題級數:20px內文級數:12px
區塊內與區塊間的距離
(padding 20px)
(margin 20px)

網站寬度(width) 800px

(6)製作心得:
起初上課操作的時候其實有點不清楚,但是回家慢慢操作理解區塊的差別,改內容參數,就能夠慢慢的理解出哪一個部分影響哪一個部分,
我覺得這樣才能夠真正理解網站的結構,所以還是要實際的操作才能夠真正了解網站。

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445012/
(2)網站主題:角落生物介紹
(2)對象:對此生物有興趣的人
(3)色彩計畫:黃色、綠色系
(4)風格設定、網頁看點、預期成效:希望能有清新的風格
(5)請整理以下數值:
字體設定:微軟正黑體
標題級數:24px
文章標題級數:15px
內文級數:12px
(6)製作心得:手忙腳亂好像有喚起一點之前用DW的記憶


1015445012

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445027/
(2)網站主題:怪獸電力公司
(2)對象:喜好DISNEY的各位觀眾
(3)色彩計畫:以怪獸電力公司的LOGO顏色做連結
(4)風格設定、網頁看點、預期成效:
風格設定:用簡單的藍色色塊呈現怪獸電力公司的特色
網頁看點:詳細的介紹人物及電影上大家不知道的小事
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數:怪獸電力公司 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:網頁真的好煩啊!!!!

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445020/

(2)網站主題:卡通網站

(2)對象:10~40歲

(3)色彩計畫:使用黃黑配色

(4)風格設定、網頁看點、預期成效: 簡約的風格設定黃黑配色是看點,預期做成閱覽方便的感覺

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:能製作喜愛卡通的網頁還滿有趣的


1015445020



Edited 1 time(s). Last edit at 04/01/2014 12:32PM by 摔角哥.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445038/
(2)網站主題:Super Mario Bro
(2)對象:喜歡玩這項遊戲的玩家
(3)色彩計畫:以遊戲角色Mario身上的色彩,紅色黃色為主。
(4)風格設定、網頁看點、預期成效:
風格設定:以紅黃色系,表現這個角色活潑的樣子。
網頁看點:介紹人物及遊戲玩法的內容。
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:對於語法還是有些困難 無法一下子就了解
但慢慢一個一個看就大致可以知道 還是要再努力...

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445043/
(2)網站主題:Hello Kitty
(2)對象:1~50歲女性
(3)色彩計畫:淡粉色系
(4)風格設定、網頁看點、預期成效:
風格設定:淡淡粉粉舒舒服服
網頁看點:Hello Kitty房間
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數:YA-HAN Designer Website 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:真好玩~
學號 1015445043



Edited 1 time(s). Last edit at 04/01/2014 02:02PM by emaly83315.
(編輯記錄)

1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445054/
(2)網站主題:喜喜巧克力
(2)對象:愛吃甜甜的女性
(3)色彩計畫:整個色調以咖啡色為主
(4)風格設定、網頁看點、預期成效:
風格設定:以咖啡色為主,想表達出可愛、親切的風格
網頁看點:每一個標籤滑鼠移過去都會有顏色的變化
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得一直玩配色,超有趣的,而且一直變色還可以知道語法在哪裡更改,很喜歡這次的網頁設計
學號 1015445054

1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445004/

(2)網站主題:Warframe

(2)對象: 學生

(3)色彩計畫:使用暗色系提升質感

(4)風格設定、網頁看點、預期成效: 簡約風格,並以灰階為主讓網頁看起來很乾淨。

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:製作過程有點困難,但是做出來很有成就感。

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445010/
(2)網站主題:迪士尼公司
(2)對象:喜愛迪士尼的大眾
(3)色彩計畫:以繽紛的色彩表示
(4)風格設定、網頁看點、預期成效:
風格設定:以淡粉色系為主
網頁看點:介紹迪士尼所上映的電影以及其他資訊
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:一開始使用DW做作業很麻煩
但是後來比較熟練之後覺得滿有趣的

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445016/
(2)網站主題:豆酥朋
(2)對象:熱愛美食的大眾
(3)色彩計畫:甜點的粉色系為主
(4)風格設定、網頁看點、預期成效:
風格設定:以淡淡的粉色系為主加上一點花樣點綴
網頁看點:介紹關於豆酥朋相關資訊以及商品介紹
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:還要多多練習才會比較熟悉,目前還是在摸索的階段

1015445016楊佩軒

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445055/
(2)網站主題: QOO碳酸果汁飲料
(2)對象:15-30歲喜愛碳酸飲料的消費者
(3)色彩計畫:QOO代表色 藍色,塑造清涼夏天冰爽的感覺
(4)風格設定、網頁看點、預期成效:風格設定在炎熱夏天配上冰涼飲料的感覺情境,內容簡單豐富的內容,讓預覽人觀看一個既簡單又不複雜能感受夏天清涼感受的網站
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數24px
文章標題級數15px
內文級數5px
網站寬度1351px
(6)製作心得: dw這軟體每次都讓我不能一次做完作業存檔成功過都得做到第二第三次才成功~希望下次能跟她相處融洽一點ఠ_ఠ
學號 1015445055

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445266/
(2)網站主題:Kapibarasan水豚君
(2)對象:喜愛水豚君大眾
(3)色彩計畫:淺橘色系列
(4)風格設定、網頁看點、預期成效:
風格設定:呈現水豚君的軟綿綿、慵懶感
網頁看點:介紹水豚君各類產品以及其他資訊
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數:24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:希望能越來越順手
學號:1015445266

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445059/
(2)網站主題:LARVA 豆豆蟲。
(2)對象:喜愛LARVA 豆豆蟲的大小朋友。
(3)色彩計畫:以暖色系為主,呈現活潑的感覺。
(4)風格設定、網頁看點、預期成效:
風格設定:以可愛、鮮明為主,給人逗趣的感覺。
網頁看點:動畫人物的介紹及影片導覽及網站的連結。
預期成效:希望看到這網頁的大小朋友,能更加喜愛這部動畫。
(5)請整理以下數值:
字體設定(font-family):微軟正黑體 12px
標題級數:微軟正黑體 24px
文章標題級數:微軟正黑體 20px
內文級數(font-size)(單位px):微軟正黑體 12px
區塊內與區塊間的距離(padding)(margin)(單位px):(padding):0 (margin):0
網站寬度(width)(單位px):1024x768px
(6)製作心得:從剛開始的不懂,到後來,越做越覺得有成就,很新鮮、也很有趣。
1015445059

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445268/
(2)網站主題:Havaianas
(2)對象:消費者
(3)色彩計畫:色彩鮮艷的Havaianas
(4)風格設定、網頁看點、預期成效:
色彩鮮艷,希望消費者能多停留在網頁上
網頁看點:介紹Havaianas的故事與產品
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0
(margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:^_^

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445050/
(2)網站主題: SHINee迷你五輯
(2)對象: 喜歡音樂的人
(3)色彩計畫:湖水綠色系
(4)風格設定、網頁看點、預期成效:色塊、簡約
(5)請整理以下數值:
字體設定(font-family) :微軟正黑體
標題級數:24px文章標題級數:20px內文級數:12px
區塊內與區塊間的距離):20px
網站寬度:800px
(6)製作心得:有點難可能對有些英文和意思還不太熟
學號 1015445050

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445048/
(2)網站主題:GEO medical
(2)對象:年輕族群
(3)色彩計畫:使用甜美的色系讓視覺更柔和
(4)風格設定、網頁看點、預期成效:
色調和諧、一目了然
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:多練習才能更加熟練
學號1015445048

(1)作業網址:作業網址
(2)網站主題:宮崎駿動畫
(2)對象:動畫迷
(3)色彩計畫:灰色系
(4)風格設定、網頁看點、預期成效:
風格設定:懷舊簡潔
網頁看點:宮崎駿動畫電影 介紹
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px 、
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:多虧老師的教學影片,作業才得以順利完成!

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445033/
(2)網站主題:LEVI‘S
(2)對象:年輕族群
(3)色彩計畫:使用中性的色系
(4)風格設定、網頁看點、預期成效:
色調和諧、簡單明瞭
(5)請整理以下數值:
字體設定(font-family): 微軟正黑體 12px
標題級數: 24px
文章標題級數: 微軟正黑體 20px
內文級數(font-size):微軟正黑體 12px
區塊內與區塊間的距離padding:0 (margin):0
網站寬度(width)(單位px) 1024#768px
(6)製作心得:果然程式碼很難
學號1015445055

作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445022/
(2)網站主題:歌手專欄
(2)對象:15歲以上
(3)色彩計畫:以紅色強調,專欄歌手在歌謠界的一縷鮮明的紅。
(4)風格設定、網頁看點、預期成效:強調色彩,搭配歌手的強烈風格。
(5)請整理以下數值:
字體設定:calibri
標題級數:36px 文章標題級數:12px 內文級數: 12px
網站寬度:800px
(6)製作心得:導覽列的變化還是不懂為什麼,怎麼放都放不進去,好像有點會了,但又好像不是很會......。

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445002
(2)網站主題: 美食
(2)對象: 大眾
(3)色彩計畫: 紅、黑
(4)風格設定、網頁看點、預期成效:
簡單、沉穩
(5)請整理以下數值:
字體設定(font-family)
"Trebuchet MS", Arial, Helvetica, sans-serif

標題級數、文章標題級數、內文級數(font-size)
12px

區塊內與區塊間的距離(padding)(margin)
0px / 0px

網站寬度(width)
1024x768px
(6)製作心得: 英文好難 ..

學號 1015445002 陳玉穎

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445044/
(2)網站主題: 美食˙製作分享平台
(2)對象: 喜愛動手DIY做美食的人
(3)色彩計畫: 以溫暖色系為主
(4)風格設定、網頁看點、預期成效: 使用色相偏高的顏色,讓人溫暖且一目了然
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數:24px文章標題級數:20px內文級數:12px
區塊內與區塊間的距離
(padding 20px)
(margin 20px)

網站寬度(width) 800px

(6)製作心得:
上課時真的聽不太懂在講什麼,但回去多看幾次影片,就會比較清楚了

(1)作業網址:
http://mepopedia.com/~web102-a/hw03/hw03-1015445045/
(2)網站主題: 日劇-小海女介紹
(2)對象: 一般大眾
(3)色彩計畫: 藍色系

(4)風格設定、網頁看點、預期成效:
風格設定: 夏天有大海的感覺
網頁看點: 好多藍色
預期成效: 都是藍色

(5)請整理以下數值:
字體設定(font-family)
標題級數 24px
文章標題級數20px
內文級數14px
區塊內與區塊間的距離
網站寬度1351x1025 px

(6)製作心得:
沒有常碰很容易就忘記,
好險老師有錄下來才可以複習

學號 1015445045

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445060/
(2)網站主題:介紹鮭魚
(2)對象:喜歡吃鮭魚的人
(3)色彩計畫:橘色系
(4)風格設定、網頁看點、預期成效:希望能有很鮭魚的風格
(5)請整理以下數值:
字體設定:微軟正黑體
標題級數:24px
文章標題級數:15px
內文級數:12px
(6)製作心得:老師都幫我們把語法打好,一樣一樣來改..
算是..亂中有序吧?

1015445060

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445015/1.html
(2)網站主題:平價時尚
(2)對象:不拘
(3)色彩計畫:以藕色和灰灰的冷色作一個平價的感覺,提高質感
(4)風格設定、網頁看點、預期成效: 風格呈現是輕鬆舒服的棉質商品,特點是平價中帶有質感,預期成效希望能有便宜買到高品質的感受
(5)請整理以下數值:
微軟正黑體, sans-serif
標題級數:24px 文章標題級數:12px 內文級數: 12px
(6)製作心得:簡單的區塊級配色,能有種低調質感的效果,語法不好打要慢慢研究才能有好的網站。

1015445015 姜佳妤

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1005445225/index.html
(2)網站主題: 神魔之塔
(2)對象: 玩家
(3)色彩計畫: 灰黑色色調
(4)風格設定、網頁看點、預期成效:簡約

製作心得: 慢慢有抓到方向
學號 1005445225



Edited 2 time(s). Last edit at 04/15/2014 05:14PM by ab927loom.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445014/
(2)網站主題:Tyra Lynne Banks
(2)對象:Tyra Banks粉絲
(3)色彩計畫:黑白灰
(4)風格設定、網頁看點、預期成效:簡單
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數24px、文章標題級數20px、內文級數12px
區塊內與區塊間的距離0px
網站寬度800px
(6)製作心得:Tyra超美
1015445014

1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445007/

(2)網站主題:懶懶熊

(2)對象: 小朋友

(3)色彩計畫:橘色系等溫暖顏色

(4)風格設定、網頁看點、預期成效:比較屬於溫暖色系,可以讓小朋友一看見就喜歡上

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:在配色方面想了很久

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445008/

(2)網站主題:斑馬

(2)對象: 對斑馬有興趣者

(3)色彩計畫:使用橘黃色系

(4)風格設定、網頁看點、預期成效: 簡約的風格

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

(6)製作心得:老師教導的好仔細

1015445008

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445025/
(2)網站主題: 介紹蕭敬騰
(2)對象: 社會大眾
(3)色彩計畫: 單一色彩
(4)風格設定、網頁看點、預期成效: 簡單版面規劃,直接顯示有關蕭敬騰的相關資料
(5)請整理以下數值:
字體設定(font-family) :微軟正黑體
標題級數、文章標題級數、內文級數(font-size)(單位px) :標題級數24px、文章標題級數20px、內文級數14px
區塊內與區塊間的距離(padding)(margin)(單位px):20px
網站寬度(width)(單位px) :800px
(6)製作心得: 本身很喜歡蕭敬騰,搜集完參考資料又更加了解他了。
學號 1015445025

1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445019/

(2)網站主題:達利

(2)對象:對達利有興趣者
(3)色彩計畫:使用紅黑高對比

(4)風格設定、網頁看點、預期成效: 簡約的風格是設定也是看點,預期做成容易閱覽一目了然的感覺

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:很累

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445267/
(2)網站主題: 隔壁太太想借鹽
(2)對象: 婆婆媽媽
(3)色彩計畫: 明度低淺藍淺黃
(4)風格設定、網頁看點、預期成效: 清新簡單手工風
(5)請整理以下數值:
字體設定(font-family) 微軟正黑體
標題級數 24px 文章標題級數:20px 內文級數: 12px
區塊內與區塊間的距離 22px
網站寬度(width)(單位px) 800px
(6)製作心得: 看很久才慢慢做完(´ཀ` )
學號1015445267李金樺

1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445063/

(2)網站主題:LINKIN PARK

(2)對象: 喜歡音樂的人

(3)色彩計畫:使用黑色系

(4)風格設定、網頁看點、預期成效: 簡約的風格是設定也是看點,預期做成容易閱覽一目了然的感覺

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:好高深難懂

(1作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445057/hw03-1015445057.html

(2)網站主題:網頁設計課程的作業

(2)對象: 老師

(3)色彩計畫:使用灰色系

(4)風格設定、網頁看點、預期成效: 簡約風格,簡約看點,簡約成效。

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:網頁設計真是博大精深

1015445057 王靖淳

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445056/hw03-1015445056.html

(2)網站主題:網頁設計課程的作業

(2)對象: 老師

(3)色彩計畫:使用淺色系

(4)風格設定、網頁看點、預期成效: 簡約風格,簡約看點,簡約成效。

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

區塊內與區塊間的距離l:22px

網站寬度: 800px

(6)製作心得:網頁設計真是艱難又有趣

1015445056 陳柏儒

(1)作業網址: http://mepopedia.com/~web102-a/hw03/hw03-1015445058/
(2)網站主題: 麥克當樂
(2)對象: 所有人
(3)色彩計畫: 以兩種顏色簡單做區隔
(4)風格設定、網頁看點、預期成效: 風格簡單、閱讀方便
(5)請整理以下數值:
字體設定(font-family) : 微軟正黑體
標題級數: 24px
文章標題級數: 20px
內文級數(font-size)(單位px): 12px
區塊內與區塊間的距離(padding)(margin)(單位px) : 22px
網站寬度(width)(單位px) : 800px
(6)製作心得: 有了這些技術,網頁設計是很酷的!!可是還是有難度......
學號1015445058

(1)作業網址:http://mepopedia.com/~web102-a/hw03/hw03-1015445009/

(2)網站主題:國榮桌球

(2)對象: 對桌球有興趣者

(3)色彩計畫:使用藍白色系

(4)風格設定、網頁看點、預期成效: 簡約的風格

(5)請整理以下數值:

字體設定(font-family) 微軟正黑體

標題級數:24px 文章標題級數:20px 內文級數: 12px

(6)製作心得:網頁好難好複雜,會網頁的都好強

1015445009