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

Advanced

[作業01] DIV與CSS複習--以色塊為主的基本單欄網頁版型

經過了一年,為了讓大家回復記憶,請先複習基礎的網頁設計概念

1. 網頁基礎複習


[講義] HTML & CSS網頁基礎複習整理



2. 課堂範例


http://mepopedia.com/~web103-2a/hw01/hw01-102



3. 盒子模型/區塊模型(Box Model)


.參考以下網址,並牢記下圖 盒子模型/區塊模型(Box Model)
http://mepopedia.com/forum/read.php?844,15917

http://i1136.photobucket.com/albums/n481/parkparkyang/box-moddle-01.gif



4. 作業說明


參照講義
利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例

自行選擇主題,製作以DIV架構搭配CSS的基本網頁,請注意字體大小、整體質感與配色

直接將語法撰寫於http://codepen.io/pen
並將之儲存

製作完畢請上傳FTP
下載:http://filezilla-project.org/download.php?type=client

並回覆於此篇文章

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-101xxxxxxx
2.設計概念與製作心得:
3.何謂HTML、DIV及CSS
4.附上至少一個覺得設計很有質感的網站,並說明原因
5.期待這門課的學習成果與收穫為何?



範例:
http://mepopedia.com/~web101-a/hw01/hw01-1006445002/
http://mepopedia.com/~web101-a/hw01/hw01-1006445010/



Edited 3 time(s). Last edit at 02/25/2014 01:46PM by JinJin.
(編輯記錄)

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445243 ((進到IE就......醜態百出 tongue sticking out smiley
http://mepopedia.com/~web102-c/hw01/hw01-1015445243-1/ (無聊實驗性質製作...點入前請三思..)


2.設計概念與製作心得:
製作概念喔~~就....有整體性吧!! 心得喔......恩.....就......一切盡在不言中 ˊ_>ˋ

3.何謂HTML、DIV及CSS
HTML就是所謂的架構就((好像建築的鋼筋
DIV就是容器一層一層的包覆著((就像房間的格局一樣
CSS就是美化及特效相關語法((就像是裝潢整修~~~

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://learnlakenona.com/ 整體的視覺色彩及動態性
http://www.ascensionlatorre.com/home 視覺的一致性
http://www.vogue.co.uk/ 簡潔明瞭的視覺性及快瀏覽器的的自適性功能

5.期待這門課的學習成果與收穫為何?
就希望能訓練做出一個能適用於大眾平台的視覺規劃網站



Edited 3 time(s). Last edit at 03/04/2014 09:28AM by 1015445243.
(編輯記錄)

MEPOERs said:
JinJin: 有挑戰的精神很好~~繼續努力~~不過視覺的精緻度才是最重要的~細膩度的掌握還要再提升~再多觀察好作品~加油!!!!!
1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445225/
2.設計概念與製作心得:
想說用色調與主題有所呼應,但!萬萬沒想到我忘了!還有一射!
3.何謂HTML、DIV及CSS
HTML就架構巴!!!
CSS美化功能
4.期待這門課的學習成果與收穫為何?
拜託!不要再那麼 複雜ㄉ語法ㄌ~
教CSS就好,其他....帶過就好。

1.網址:http://mepopedia.com/~web102-c/midterm/midterm-1015445209/
2.設計概念與製作心得:
藍色迷幻藥般的感覺
3.何謂HTML、DIV及CSS
像是在蓋房子一層一層的堆疊 再加些素材
4.希望下學期好好的學網頁 出社會才不會到處被打槍

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445219
2.設計概念與製作心得:
概念:顏色協調,整齊乾淨。
心得:好久沒碰了,但還好都記得。
3.何謂HTML、DIV及CSS
HTML建築網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
David Sparshott的作品網站
http://www.davidsparshott.com/
利用方格將每幅作品的小角落呈現,
點進去後會放大,旁邊還有那幅畫的解說,
這不就是我夢寐以求的嗎thumbs up不想要太多餘的裝飾。
簡單俐落又具有他的風格(好喜歡)
5.期待這門課的學習成果與收穫為何?
以前學習的網頁設計是基本的,
希望能藉由基本的去學習到更進一步的網頁設計,
這麼一來就能試著去架構自己作品的網頁了eye rolling smiley



Edited 3 time(s). Last edit at 02/25/2014 12:19AM by stying411.
(編輯記錄)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445203

2.設計概念與製作心得:
因為很喜歡SAMSUNG所出的手機,剛好在昨天SAMSUNG旗下GALAXY系列的出到第五隻,所以就想要做關於S5這支手機的資料,讓對S5有興趣的人看得清楚明瞭。

3.何謂HTML、DIV及CSS:
HTML就是一個網頁整體的頁面。
DIV就像是一個保護膜也像是一個格子,把同樣的東西包覆起來。
CSS是網頁設計中最重要的,就像人們要衣著打扮一樣,雖然不是主角,但是不能少了它。

4.附上至少一個覺得設計很有質感的網站,並說明原因
【SMOOCHES】http://www.smooches.tw/Shop/
因為自己本身就很喜歡看這間網拍的衣服,網頁內容除了一下子就能讓人點選自己所需要的以外,在風格方面也是多元化的呈現在每一次po出新品的照片裡,會讓人不自覺一邊欣賞新品的美也能一邊讓人感受悠閒而不會被別人打擾的網拍時光。
【獎金獵人】https://bhuntr.com/tw
獎金獵人這個網站對是設計的學生來說不會陌生,裡面有著許許多多可以讓人去參賽的資料,讓人不必自己一個一個去尋找,然而對自己比較有信心想去參賽的種類,也能讓人容易搜尋到。
【ㄇㄞˋ點子】http://www.mydesy.com/asia-university-art-museum
這個網站裡面介紹許多新穎的設計作品,無論是家喻戶曉的紅點設計作品等等......這個網站都會做報導,因為很喜歡看新科技設計的東西,所以不時會到這個網站來看看最近是否有新增讓人有興趣或是意想不到的設計作品,而在網站上方清楚明瞭的做成10大分類,讓我們去探索設計的世界。

5.期待這門課的學習成果與收穫為何?
希望這個學期能學期到關於rwd適應性網頁這方面的知識,讓自己的未來有很大的幫助。

1005445160 - Puro

* 網址 : http://mepopedia.com/~web102-c/hw01/hw01-1005445160

* 設計概念與製作心得 : 設計一個簡單的小網站,蠻有趣的可以各種嘗試讓他更有變化。

* 何謂HTML、DIV及CSS : HTML - 架構網站、DIV - 標籤區塊、CSS - 美化功能。

* 附上至少一個覺得設計很有質感的網站,並說明原因 :

http://www.teeteringbulb.com/
簡單的網站,但是有足夠空間放她的作品,可以欣賞到很多。

* 期待這門課的學習成果與收穫為何?
有關網頁架構的資訊,希望可以學到許多基礎的資訊打好基底。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445252
2.設計概念與製作心得:以電影冰雪奇緣為主題,整體簡潔,配色上以冷色調為主。
3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://acumen.org/ten/
http://www.art4web.sk/en/hello
整體配色很柔和/色彩繽紛(增加趣味性)。而編排清晰明瞭。
5.期待這門課的學習成果與收穫為何?
把語法搞懂、網頁排版技巧...。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445254
2.設計概念與製作心得:
寒假一直在看他演的韓劇,所以印象很深刻就做他拉^^
不過因為在網頁直接做是有點卡........
3.何謂HTML、DIV及CSS
HTML是網頁整體的頁面
DIV是一個盒子,把同樣的東西包覆起來
CSS是網頁設計中最重要的,寫程式就靠它了
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.thegirlwhoshop.com/Shop/
就很清楚明白,容易點閱,可以順便看看現在的流行趨勢
5.期待這門課的學習成果與收穫為何?
希望能夠把語法應用流暢!!!!!!!!
在建立多樣點的網站設計~~~

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445212

2.設計概念與製作心得:
以電影小太陽願望為主題,整體簡潔,配色上以黃色和黑色為主。

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://mariegardeski.com/
整體配色很柔和簡潔清晰明瞭

5.期待這門課的學習成果與收穫為何?
把網頁設計編排做好

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445207
2.設計概念與製作心得:

設計概念是以故事中的日本風格,黑與白加色紅色最為主色調,
其中wrapper的紅色用較深的紅色以防令人眼睛疲累。
對於網頁的長度設定有點忘了....

3.何謂HTML、DIV及CSS

HTML: 建築網頁架構
DIV : 標籤來建立網頁區塊
CSS: 設計.美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因

http://www.cheesequeen.com.tw/index.aspx
進入主首頁就讓人眼睛為之一亮!顏色以粉紅色為主色調,
讓人看了不複雜有整體性。

5.期待這門課的學習成果與收穫為何?

希望能製作一個有一堆自己喜愛東西的網頁W

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445216

2.設計概念與製作心得:
以第2主角身上的顏色進行黃色系的配色

3.何謂HTML、DIV及CSS
HTML:架構
DIV:空間
CSS:美化

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.moricaca.com/index.php
乾淨、清楚、溫暖,符合小甜品該有的感覺。

5.期待這門課的學習成果與收穫為何?
希望能比1年級時要學得更多弄懂更多

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445228
2.設計概念與製作心得:
其實想嘗試黑底多色塊,因為這個故事有許多的獨色幫(就是一個幫派以某種特定的顏色作為識別,團員大多穿戴有該色的衣物或配件),所以當然要有很多顏色才能顯現出它的繽紛,但是唯一敗點就是我不會用(ㄍ
3.何謂HTML、DIV及CSS
html→骨架。網頁的架構
div →內臟。標籤區塊
css→外皮。美觀外表
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://mekakushidan.com/#
http://www.mekakucityactors.com/
兩者其實是同一部作品,但為什麼分開因為要解釋很多我就不多說了。
網頁有部分雖尚未建置,但整體來看算是流暢,使用者不會說找不到自己想知道的訊息,返回首頁的標示也很明顯。
第一個網站播的影片是該作品系列歌的mv,雖說沒聲音但有一種奪住目光的效果,會讓人更想知道其故事。
5.期待這門課的學習成果與收穫為何?
希望不會像上次期末一樣...(那是你太菜

1015445233 汪紀岑

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445233/hw01-1015445233.htm

2.設計概念與製作心得
我還是覺得網頁設計很難
挑了部自己喜歡的電影做

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤建立網頁區塊
CSS用來美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.p714.com/2011/index.htm
這是一個很喜歡的品牌
它的色調很舒服
圖案很可愛
讓人想在裡面晃很久才出來



Edited 1 time(s). Last edit at 03/03/2014 09:36PM by wdcwxx4ea.
(編輯記錄)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445234

2.設計概念與製作心得: 以陽明山,新春賞花去為主軸,賞櫻、賞海芋都是不錯的選擇

3.何謂
HTML:架設網站外皮
DIV:區隔網頁上下分段內容或空間管理
CSS :美化編排設計網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.lafamille.com.tw/index.htm
很喜歡她可愛的畫風,簡簡單單,沒有太多複雜的技巧,看起來很舒服

5.期待這門課的學習成果與收穫為何?
可以比一年級學到更多東西~

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445227

2.設計概念與製作心得:
最近看過的一部電影【華爾街之狼】

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://vinevsinstagram.com/
特別的插畫風格,互動式的網頁。

5.期待這門課的學習成果與收穫為何?
更進一步的接觸網頁設計

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445218

2.設計概念與製作心得:
以愛莉絲作為主題設計,用神祕的紫色系來呈現,
讓整體更有神秘感。
有很多東西都快忘光光了,透過這次的複習剛好回復以前所學的,
雖然是用寫的語法,以前沒這樣寫過,但是也很好玩哦~

3.何謂HTML、DIV及CSS
HTML-整體的骨架
DIV-很多很多的區塊
CSS-有美化的作用

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.richardphotolab.com/
雖然簡單但又具有設計感,讓人感覺很舒服頁面設計。
http://www.beatboxacademy.ca/
很好玩的互動式網頁。
http://tdhcreative.com/
用簡單的色調就能做出整體的設計感。

5.期待這門課的學習成果與收穫為何?
希望可以學到更多的網頁設計的製作方法。



Edited 1 time(s). Last edit at 03/03/2014 11:58PM by 1015445218.
(編輯記錄)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445240
2.設計概念與製作心得: 以最近出的電影來製作,顏色以黑白紅呈現
3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV建立網頁區塊
CSS美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.crypton.co.jp/mp/pages/prod/vocaloid/cv01.jsp
背景用大的圖片,非常顯眼
5.期待這門課的學習成果與收穫為何?
能製作出很有質感的網站



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

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445239

2.設計概念與製作心得:
概念:以唐老鴨的顏色來強調,內容簡潔

3.何謂HTML、DIV及CSS
HTML 網頁架構
DIV 用標籤來建立網頁內的區塊
CSS美化網頁的視覺

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.siidcha.com/
這個網站感覺很有系統且內容看似簡單輕巧...

5.期待這門課的學習成果與收穫為何?
希望能學會css3並且運用自如:-)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445215

2.設計概念與製作心得:
以自己喜歡的樂團作為主題,利用暗色調營造龐克感覺。

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 專門美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.pazzo.com.tw/Shop/
簡單卻又有自己的風格,右邊捲軸視窗也很酷。

5.期待這門課的學習成果與收穫為何?
希望這一次進階的學習能夠更深入了解網頁整體的製作,
也希望自己因這課程能做出更精緻漂亮的網頁。

1.網址
http://mepopedia.com/~web102-c/hw01/hw01-1015445269/

2.設計概念與製作心得/
因介紹之主題的用色以黑白為主,因此選擇簡潔乾淨的排版,經過一年後有些概念真的都忘記了,希望這次能全部學回來並且謹記!

3.何謂HTML、DIV及CSS/
HTML建築網頁架構
DIV 建立網頁區塊
CSS 美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因/
-1.(鮮芋仙)http://www.meetfresh.com.tw/
一樣是乾淨簡單的排版加上小動畫,簡單操作就能搜尋到自己想知道的訊息,非常有質感。
-2.(好饗廚房)http://demo.artie.com.tw/homee.com.tw/original/menu.html
顏色和圖片的搭配也相當重要,醒目的分類標題,讓人搜尋容易,並且將網頁打造的有如電子版MENU。

5.期待這門課的學習成果與收穫為何?
希望課堂上的所教的進度能全部吸收並且學以致用,或許做網頁過程中會遇到困難,但我不會輕易放棄,也會多多去看好的作品,從模仿起步漸漸從中學習。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-10115445217

2.設計概念與製作心得: YA! 我第一次做這麼快

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 專門美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因

5.期待這門課的學習成果與收穫為何?
很開心啊很難啊

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445245

2.設計概念與製作心得:
和綠色相關的綠色博覽會,充滿了知識和愛地球的表現,因此做為我的主題選擇。

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 專門美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.disney.com.tw/DisneyChannel/playhouse/friends/mmch/index.html
趣味又具互動,是很不錯的兒童網頁。

5.期待這門課的學習成果與收穫為何?
對網頁更加的了解、更家的熟練,可以獨當一面,完成業界一些小案子。
對於以後得實習,有更多的幫助與想法。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445202

2.設計概念與製作心得:
仿效網路畫家cherngs的黑白極簡風
做完真有成就感^_^

3.何謂HTML、DIV及CSS :
HTML建築網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因 :
http://www.masterhands.com.tw/index.aspx
這個網站的設計整體看起來清楚一目瞭然
連結動向清楚

5.期待這門課的學習成果與收穫為何?
我希望這堂課可以充分了解到如何製作網頁及運用
並了解CSS語法的全部



Edited 1 time(s). Last edit at 03/07/2014 10:26PM by 1015445202.
(編輯記錄)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445206

2.設計概念與製作心得: 因為喜歡長髮公主,以前教的都忘光光了,還好有同學從旁協助,很感謝她。

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 專門美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.caco.com.tw/Shop/
黑白分明 主題清晰
http://www.secondfloorcafe.com/
主題豐富 風格獨特

5.期待這門課的學習成果與收穫為何?
希望能把網頁基本的事物都刻在腦海

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445248
2.設計概念與製作心得: 單調明瞭的呈現,心得是太久沒接觸,剛開始做會不熟悉
3.何謂HTML、DIV及CSS

HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.onlynylives.com/
這是我喜歡的網站,簡單的呈現,讓人明瞭!

5.期待這門課的學習成果與收穫為何?
能運用老師所教的,學以致用!

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445201

2.設計概念與製作心得:
覺得要把網頁做的好還是有難度的,但以前學過所以現在做很多都還有印象,期許自己越做越好摟

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://portal.disney.com.tw/
可愛有互動內容豐富

5.期待這門課的學習成果與收穫為何?
能記住每個語法所在位子希望自己能越做越好
能設計出視覺上看起來畫面美的網頁
能設計出清楚明瞭內容豐富的網頁

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445257

2.設計概念與製作心得:
用糖果色來表達天真的感覺

3.何謂HTML、DIV及CSS :
HTML建築網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因 :
http://www.niusnews.com/index.php/main/channel/charming
這個網頁很清楚知道如何操作 跟了解相關內容

5.期待這門課的學習成果與收穫為何?
希望我能更上手去運用



Edited 1 time(s). Last edit at 03/08/2014 03:44PM by 1015445257.
(編輯記錄)

網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445261
設計概念與製作心得:
配色溫暖和諧再來一點可愛
心得是複習之後有想起一些但還是生疏很多
何謂HTML、DIV及CSS :
HTML建築網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁
附上至少一個覺得設計很有質感的網站,並說明原因
http://japan-leather-pride.com/#statement
很簡單沒有太多華麗的炫技但依然很有質感

期待這門課的學習成果與收穫為何?
希望能對網頁更熟悉
然後上課內容可以再吸引我一點去投入

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445231/

2.設計概念與製作心得:
使用同色系使人感覺有一致性,我覺得我有待加強,許多地方不順暢。

3.何謂HTML、DIV及CSS
HTML 網頁結構
DIV 忘了
CSS 改變整個感覺

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.tsdo.jp/#/news
有乾淨的感覺

5.期待這門課的學習成果與收穫為何?
可以學習到新智識,要比之前還要更進步。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445232

2.設計概念與製作心得:
簡潔 甜的感覺

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://ddanga.com/#/gallery
簡潔有互動

5.期待這門課的學習成果與收穫為何?
記住每個語法能越來越上手

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445271

2.設計概念與製作心得:
想把畫面做的簡單明瞭有質感,但做完覺得好像頗困難細節編排什麼的還要多努力.

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 美化網頁 編排質感

4.附上至少一個覺得設計很有質感的網站,並說明原因
https://www.dolce-gusto.com.tw/ZH/Pages/home.aspx
標籤顏色區分清楚,種類詳細,個人覺得是個不錯的網站.

5.期待這門課的學習成果與收穫為何?
對網頁製作總總更加了解,增加許多知識,加強自己不足的部分
並加強自己.

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445222

2.設計概念與製作心得: 經過這麼久的時間,先前學的東西真的都忘了差不多了嘿嘿,不過看了一下講義印象又回來了,
這次希望能多增進排版的概念!雖然很懼怕這門課

3.何謂HTML、DIV及CSS
HTML 建構網頁的基本架構
DIV 標籤、區域範圍
CSS 專門美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.uniqlo.com/tw/

格式很清楚簡單,沒有太雜亂的顏色,讓消費者能很快選購自己想要的東西
5.期待這門課的學習成果與收穫為何?
覺得學會網頁架構真的事件amazine的事情,語法真的很重要,小地方少了就會整個壞掉,要在更細心

1.網址:
http://mepopedia.com/~web102-c/hw01/hw01-1015445208

2.設計概念與製作心得:
紙膠帶給我帶來繽紛可愛的,所以想用紅粉色調

3.何謂HTML、DIV及CSS
HTML架構
DIV標籤來建立網頁區塊
CSS美化及特效相關語法

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.alanoutten.com/ 簡單乾淨舒服
http://www.designblvd.nl/ 格子區分大小適中、圖文排版舒服

5.期待這門課的學習成果與收穫為何?
希望未來能對工作職場上有幫助,或是自己需求

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445213/
2.設計概念與製作心得:
概念:簡單、不單調
心得:好久沒碰了有一點不熟。
3.何謂HTML、DIV及CSS
HTML建築網頁架構
DIV 標籤來建立網頁區塊
CSS美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
David Sparshott的作品網站
http://instagram.com/she50113c
利用方格將每幅作品的小角落呈現,
點進去後會放大,旁邊還有那幅畫的解說,簡單又俐落的風格。
5.期待這門課的學習成果與收穫為何?
希望能藉由基本的去學習到更進一步的網頁設計,創造屬於自己的網頁。

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445226/

2.設計概念與製作心得:
明瞭顏色鮮明

3.何謂HTML、DIV及CSS
HTML網頁架構
DIV 標籤區塊
CSS美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://en-tw.havaianas.com/en-TW/home/
色彩鮮艷給人活潑的感覺

5.期待這門課的學習成果與收穫為何?
希望學的教的能全部吸收能做出漂亮的網頁

1.網址:file:///C:/Users/User/Desktop/hw01-1015445223/index.html
2.設計概念與製作心得:
有慢慢地回到以前熟悉感

3.何謂HTML、DIV及CSS
HTML架構
CSS美化功能
4.期待這門課的學習成果與收穫為何?
比以前更進步羅

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445214
2.設計概念與製作心得:以綠色和黃色做結合
3.何謂HTML、DIV及CSS
HTML網頁架構 .DIV 標籤來建立網頁區塊 .CSS美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.mydesy.com/asia-university-art-museum 編排很工整。
5.期待這門課的學習成果與收穫為何?
語法.CCS在重新複習一次.比較能夠上手

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445221

2.設計概念與製作心得:
雲端情人海報設計配色
要多加強配色與編排效果

3.何謂HTML、DIV及CSS
HTML負責建構網頁的基本架構
CSS專門負責美化網頁的任務
DIV 標籤來建立網頁區塊

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.cyrano.com.tw/index_tw.html
香水的各種介紹,每一頁都製作相當符合

http://nagiasu.jp/onair/index.html
動畫 與水滴跟藍色系它配得很清爽
5.期待這門課的學習成果與收穫為何?
多了解語法



Edited 2 time(s). Last edit at 04/21/2014 10:23PM by 姚少涵.
(編輯記錄)

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445241
2.設計概念與製作心得: 完成了
3.何謂HTML、DIV及CSS :HTML內文 DIV區塊 CSS裝飾
4.附上至少一個覺得設計很有質感的網站,並說明原因 http://prosite.com/
很有質感
5.期待這門課的學習成果與收穫為何?
複習以前忘記的

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445242
2.設計概念與製作心得: 用kitty基本的顏色搭配
3.何謂HTML、DIV及CSS html是裡面的內容 div我還是不太懂 css是外觀的配置
4.附上至少一個覺得設計很有質感的網站 http://ikiji.jp/ 很簡單的顏色配法 滾輪方式很特別
5.期待這門課的學習成果與收穫為何? 可以學會就好了.......

1005445236

* 網址 : file:///C:/Users/User/Desktop/midterm-1015445236/index.html

* 設計概念與製作心得 : 色塊的簡單但又有美感

* 何謂HTML、DIV及CSS : HTML - 架構網站、DIV - 標籤區塊、CSS - 美化功能。

* 附上至少一個覺得設計很有質感的網站,並說明原因 :

https://cn14taiwan.creativecloud.adobeevents.com/
簡單又清楚表達內容

* 期待這門課的學習成果與收穫為何?
希望可以簡單學會網頁設計

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445264/
2.設計概念與製作心得:
製作時一個頭兩個大
3.何謂HTML、DIV及CSS
HTML外部結構、CSS內部裝飾
4.期待這門課的學習成果與收穫為何?
沒有什麼期待、沒收穫

1.網址:http://mepopedia.com/~web102-c/hw01/hw01-1015445220
2.設計概念與製作心得: 在製作的時候可能是因為久沒碰了有點不習慣,不過慢慢的有找回感覺了
3.何謂HTML、DIV及CSS
HTML:應該是網站的主要架構吧
DIV:就是一層一層的隔間吧
CSS:是用來美化網頁用的
4.附上至少一個覺得設計很有質感的網站,並說明原因
5.期待這門課的學習成果與收穫為何?
希望能把比較弱的部分多作加強,然後可以多學到一些不同的東西