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

Advanced

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

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

1. 網頁基礎複習


[url=http://mepopedia.com/forum/read.php?804,41760][講義] HTML & CSS網頁基礎複習整理[/url]

[hr]

2. 課堂範例


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

[hr]

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


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

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

[hr]
以及盒子與盒子(元素與元素)之間的關係



<<熟記元素與元素之間的關係,下週舉行小考>>

[hr]

4. 作業說明


參照講義
[url=http://mepopedia.com/forum/read.php?804,16481]利用Div標籤與CSS建立基本單欄網頁版型--以單純色塊為例[/url]

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

可參考http://www.css3maker.com/
適當加入CSS3效果


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

並回覆於此篇文章

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

[hr]
範例:
http://mepopedia.com/~web103-2a/hw01/hw01-102/
(1) http://mepopedia.com/~web102-c/hw01/hw01-1015445243/
(2) http://mepopedia.com/~web103-2a/hw01/hw01-1025445058/
(3) http://mepopedia.com/~web103-2a/hw01/hw01-1025445178/
(4) http://mepopedia.com/~web103-2a/hw01/hw01-1025445073/
http://mepopedia.com/forum/read.php?1651,42170

[hr]

5. 上課影音



2015 03 05作業一課堂講解
http://youtu.be/TnaMIVYyf4Y



1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445044/
2.設計概念與製作心得:覺得在進步中,還需要再多努力。
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.pazzo.com.tw/
簡約有型,畫面乾淨。

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

能進步我就很開心了,希望跟上進度。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445170
2.設計概念與製作心得:
設計的概念:走一個比較清新的路線
3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構
DIV: 網頁的標籤 ~~
CSS:美化與設計網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。
[url=https://green-name.kirin.jp/]GREEN NAME 種出你的名字[/url]
這是日本的網站
有我想要的清新畫面~還有可愛的手繪圖鴉~

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

希望可以靈活的運用這學期所學的一切 做一個自己專屬的小網站~



Edited 1 time(s). Last edit at 03/09/2016 04:51PM by mineko15.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445209

2.設計概念與製作心得:覺得CSS很有趣可以做到很多設計。

3.何謂HTML、DIV及CSS?
HTML是超文字連結標示語言(Hypertext Markup Language)它所包括的程式碼集(稱為標籤)是用於控制 Web 瀏覽器顯示文件的方式。
DIV是個標籤或把某東西包起來的包裝。
CSS就是把HTML美化的東西。

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.starbucks.com.tw/home/index.jspx
簡潔明瞭,加一點動態可以更好。

5.期待這門課的學習成果與收穫為何?
能學到更多東西~可以的話想知道HTML5怎做出動畫~

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445134/
2.設計概念與製作心得:
從配色方面開始發想,想要營造春天生機勃勃的感覺,大部分採用暖色調
3.何謂HTML、DIV及CSS:
HTML:負責建立網頁的基本架構。
DIV:是種標籤,負責區分各個主要頁面,做為主要排版的架構。
CSS:美化/設計網頁。
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://cargocollective.com/
這是一個許多設計師都會po上自己插畫的網站,平時作業中沒有設計靈感時,經常會瀏覽這個網站
5.期待這門課的學習成果與收穫為何?
希望能學習到更多網頁設計的進階技巧,更加深入了解網頁設計精髓。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445080
2.設計概念與製作心得:
顏色上面用的比較神秘一點。
其實網頁設計還不錯好玩。
3.何謂HTML、DIV及CSS
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.lgcare.com/index.jsp
我覺得他上面的那個圖會跟著滑鼠動耶!很帥!
5.期待這門課的學習成果與收穫為何?
學習成果當然是要好一點啊~
收穫就要看看學得好不好囉~

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445158
2.設計概念與製作心得:
設計的概念是以大理石的素材作為基底,搭配呼應的文章,想讓畫面呈現冰冷的質感,在製作的過程當中已經有基本的概念在腦中了,所以製做起來很流暢。
3.何謂HTML、DIV及CSS:
HTML:負責建立網頁的基本架構。
DIV:是種標籤,負責區分各個主要頁面,做為主要排版的架構。
CSS:負責美化網頁。
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://www.q-co.jp/
這是一個日本的網站,我覺得他們的創意點子很棒!用一支筆讓瀏覽者自行塗鴉或畫上記號,畫一個封閉式的圓圈就會有動態圖像可以觀看,在排版方面也做得非常精緻,顏色簡單俐落,網頁做的很細膩,每個畫面都有一個有趣的小機關,不但讓觀看者有了視覺享受,也讓觀看者能快速知道想要的資訊,讓瀏覽網頁變得不再無聊,這是一個非常值得學習的網站。’
5.期待這門課的學習成果與收穫為何?
希望能學習到更多網頁設計的技巧,讓自己做的網頁設計作品能更有質感,更趨近於業界所做的網站。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445002
2.設計概念與製作心得:
設計的概念:主要是用柴犬身上的顏色去配色的!
3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構
DIV: 網頁的標籤
CSS:美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。

http://twart100.ntmofa.gov.tw/History.aspx
我覺得他設計的很有百年歷史風格,而且資料詳細!


5.期待這門課的學習成果與收穫為何? 我希望能設計出獨一無二的網站,供許多人觀賞!

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445113/
2.設計概念與製作心得:快不知道要放甚麼主題了
3.何謂HTML、DIV及CSS:
(1)HTML:網頁
(2)DIV:CSS裡面的其中細節
(3)CSS:網頁的樣式
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.piecettes.com.tw/
畫面乾淨,比較有西洋風,讓人有種高級感

5.期待這門課的學習成果與收穫為何?
想要做做看滑動頁面時,網葉會跟著跑下來的那種

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445206
2.設計概念與製作心得: 這學期有變得更熟練
3.何謂HTML、DIV及CSS
HTML:網頁架構 DIV:提供結構和背景 CSS讓網頁變得有設計感
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.sodagreen.com.tw/ 亂中有序
5.期待這門課的學習成果與收穫為何? 希望這學期的網頁能更加的熟練,設計得更好看。



Edited 1 time(s). Last edit at 02/29/2016 05:50PM by 王文筠.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445200
2.設計概念與製作心得:
設計的概念:以插畫家為主,利用背景的顏色來搭配。
3.何謂HTML、DIV及CSS:
HTML: 網頁中的基本架構形式 DIV: 網頁裡的標籤 CSS:美化網頁的結構

4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://shibanomaru.blog43.fc2.com/page-1.html
風格獨特,簡約又明瞭,

5.期待這門課的學習成果與收穫為何?
希望能夠設計出專屬於自己的網頁設計。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445068
2.設計概念與製作心得:

3.何謂HTML、DIV及CSS:
HTML: HTML是一種基礎技術
DIV: 就是標籤
CSS:美化網頁的結構

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

5.期待這門課的學習成果與收穫為何?
希望可以學到東西。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445104

2.設計概念與製作心得:製作的時間比起上學期縮短了許多,基本架構都還記得非常清楚!

3.何謂HTML、DIV及CSS
HTML:網頁架構 DIV:提供結構和背景 CSS讓網頁變得更有美感

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.tods.com/en_ww/ 用圖示分類,讓人一目了然

5.期待這門課的學習成果與收穫為何? 希望這學期的網頁能學到更多功能

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445074
2.設計概念與製作心得:
最近在迷一部大陸劇 (新-蕭十一郎) 風格用這部的風格去呈現
複習之前的 還好沒忘記
3.何謂HTML、DIV及CSS:

HTML: 網頁中的基本架構
DIV: 網頁的標籤
CSS:美化網頁

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

風格很獨特,簡約又明瞭, 我很喜歡這種風格

5.期待這門課的學習成果與收穫為何?
希望接下來能夠越來越感的上進度

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445152

2.設計概念與製作心得:希望版面看起來舒適就好

3.何謂HTML、DIV及CSS?
HTML為“網頁創建和其它可在網頁瀏覽器中看到的信息”設計的一種標記語言。
DIV為一種以標籤的行式,提供網頁內容與結構等樣式的標籤。
CSS一種用來為結構化文檔添加樣式的計算機語言。

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.ok-studios.de/home/
1.畫面簡約有動態感
2.覺得很特別

5.期待這門課的學習成果與收穫為何?
加入動畫和動態效果

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445107/
2.設計概念與製作心得:
絢麗的顏色顯得清新,感覺又回復了一些記憶。
3.何謂HTML、DIV及CSS
HTML:網頁的基本架構。 DIV:標籤各個主要頁面,區分主要排版的架構。 CSS:花樣或樣式,控制內容呈現,美化網頁。
4.附上至少一個覺得設計很有質感的網站,並說明原因
Tumblr,排版整潔且功能明確。
5.期待這門課的學習成果與收穫為何?
希望再一次燃燒生命XD 。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445194/
2.設計概念與製作心得: 用了許多暖色調、橘色調,希望呈現典雅的感覺,以及表現食慾。
3.何謂HTML、DIV及CSS :HTML負責建構網頁的基本架構 。DIV類似標籤,用來建立網頁區塊 。CSS專門負責美化網頁的任務 。
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.gotmilk.com/
橫式翻閱很特別,版面井然有序。
5.期待這門課的學習成果與收穫為何?
希望能學習到更多,並且越來越熟練。



Edited 1 time(s). Last edit at 02/29/2016 09:59PM by 1035445194.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445053/
2.設計概念與製作心得:學習到框不一定要方的還可以有圓角跟陰影
3.何謂HTML、DIV及CSS:
(1)HTML:負責建構網頁的基本架構
(2)DIV:網頁的標籤
(3)CSS:網頁的樣式
4.附上至少一個覺得設計很有質感的網站,並說明原因:
https://www.sweetrobot.co.uk/theoven/
後面的背景很有特色讓人覺得很有質感,配色又很乾淨

5.期待這門課的學習成果與收穫為何?
期待可以做出互動網站,讓人進來會覺得有趣又新奇



Edited 1 time(s). Last edit at 02/29/2016 10:06PM by 1035445053.
(編輯記錄)

1035445218 柯惠文

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445218
2.設計概念與製作心得: 因為內容很少 所以想加張圖片
3.何謂HTML、DIV及CSS
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://0970091667.com/
這種的我就覺得蠻漂亮的了,用色簡單、無形的線、對齊等有點。

5.期待這門課的學習成果與收穫為何? @想做出有質感的網站
@想把這項專業達到可以在外面工作的程度(至少輔助)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445026
2.設計概念與製作心得:以蘋果派的蘋果與餅皮顏色作為色彩配置
製作心得是css3maker的預覽效果很方便
3.何謂HTML、DIV及CSS
HTML是編寫網頁的基本語言 全名是「超文字連結標示語言」(Hypertext Markup Language) 網頁的架構設定
DIV是提供網頁內容與結構樣式的標籤
CSS 是 Cascading Style Sheets 的縮寫, 網頁的風格設定
4.附上至少一個覺得設計很有質感的網站,並說明原因
網站:[url=http://www.austinshaw.com/][url=http://www.austinshaw.com/][/url][/url]
5.期待這門課的學習成果與收穫為何?
希望可以收穫更多網頁知識



Edited 2 time(s). Last edit at 02/29/2016 10:59PM by 1035445026.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445185

2.設計概念與製作心得:
以柔色調和簡單的畫面構成

3.何謂HTML、DIV及CSS
HTML:網頁中基本的架構
DIV:網頁的標籤
CSS:它負責美化網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://cyclemon.com/
這是一個外國腳踏車的網站,喜歡這種插畫和配色的感覺,
而且畫面很特別,滑鼠往下滑腳踏車和背景也會跟著改變,覺得很酷!!!


5.期待這門課的學習成果與收穫為何?
希望能比上學期更進步,學到關於更多製作網頁的方法



Edited 1 time(s). Last edit at 02/29/2016 10:35PM by 1035445185 徐于庭.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445222

2.設計概念與製作心得:

以粉色及灰色搭配出低調柔和的感覺。

3.何謂HTML、DIV及CSS

HTML:架構設定
DIV:建立網頁區塊
CSS:風格設定

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

臺北市立美術館
http://www.tfam.museum/index.aspx?ddlLang=zh-tw
網頁設計及顏色搭配都很簡潔營造出美術館寧靜的感覺。

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

希望能比上個學期學到更多網頁設計的方法。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445059
2.設計概念與製作心得:
因為這是很喜歡的卡通又不會很無趣
複習之前的 還好沒忘記
3.何謂HTML、DIV及CSS:

HTML: 網頁中的基本架構
DIV: 網頁的標籤
CSS:美化網頁

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

我先歡那個網頁的排版
5.期待這門課的學習成果與收穫為何?
希望能學習到更多的網頁設計

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035461133/
2.設計概念與製作心得:
可愛的感覺,把遺忘的記憶慢慢找回來了。
3.何謂HTML、DIV及CSS
HTML: 網頁中的基本架構
DIV: 網頁的標籤
CSS:美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
http://skullhong.com/
5.期待這門課的學習成果與收穫為何?
再學到更多製作網頁的方法

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445191

2.設計概念與製作心得:整體都是使用藍色系,想呈現外國旅遊的感覺,
           隔了一個寒假都沒練習,對有些語法有點生疏,不過漸漸抓回感覺了

3.何謂HTML、DIV及CSS?
HTML為製作網頁的基本架構
DIV 可以把它視為標籤,命名這個標籤之後可以用CSS去做排版
CSS負責將基本的網頁架構美化

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.quil-fait-bon.com/
顏色明亮,排版簡單,看了很舒服,且也有一點動態的設計,不會很死板

5.期待這門課的學習成果與收穫為何?
希望能學到更多把網頁製作得更有質感的方法,還有關於動態的設計

(1)網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445032
(2)設計概念與製作心得:
monicaramos的元素風格去呈現,製作時需要花點時間來回溫一下上學期的網頁。
(3)何謂HTML、DIV及CSS:
HTML: 網頁的基本架構,建立網頁的標準語言。
DIV: 是一個區分的標記,標籤會產生一個區塊,設定字、畫、表格等的擺放位置。
CSS:目的是將檔案的內容與顯示分隔開來,可增添網頁的美化可讀性的加強等。
(4)附上至少一個覺得設計很有質感的網站,並說明原因。
http://waterlife.nfb.ca/#/
Waterlife 是一個紀錄片,介紹關於水的一切。簡單的元素主題,用3D互動的方式呈現。
滑鼠移動到下方有各種說明,上面的圖會旋轉,呈現相關的意象圖,簡單明瞭、有趣、美感俱佳,滿推一個網站。
http://mono-1.com/monoface/main.html
Mono 是來自美國的一家廣告商。它的標語是:越簡單越好。這個網頁具有公司的精神,很間單、很美觀又很好玩。
(5)期待這門課的學習成果與收穫為何?
希望能更進一步學到架設網站的語法跟技巧,做出更有質感或是互動式的網頁。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445137
2.設計概念與製作心得:
以普普藝術為主題所製作的單欄網頁

根據新加入的css3.0多了更多創造的可能
3.何謂HTML、DIV及CSS:

HTML: 網頁中的基本架構
DIV: 網頁的標籤
CSS:用於美化網頁

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

風格很獨特,簡約又明瞭

5.期待這門課的學習成果與收穫為何?
希望可以更加精進自己的能力

1035445137 周李銘

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445131/
2.設計概念與製作心得:
設計概念:我用了粉紅色來代表性感
 製作心得:覺得比上學期更熟悉網頁設計了
3.何謂HTML、DIV及CSS :
 HTML:網頁中的基本架構
 DIV:網頁的標籤
 CSS:負責美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
 http://first-launch.com/
 感覺很有趣,像玩遊戲一樣
5.期待這門課的學習成果與收穫為何?
 期待自己可以做出好玩有趣的網站。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445140/
2.設計概念與製作心得:每次配色都很糾結
3.何謂HTML、DIV及CSS:
(1)HTML:負責建構網頁的基本架構
(2)DIV:網頁的標籤
(3)CSS:網頁的樣式
4.附上至少一個覺得設計很有質感的網站,並說明原因:
http://nipponcolors.com/#usuao
可以调节色彩的,简单、典雅,又好玩。
开启右边的MUNSELL,有炫酷效果。

5.期待這門課的學習成果與收穫為何?
期待可以做出好看好玩的網站。

1.網址http://mepopedia.com/~css104-2b/hw01/hw01-1025445186/

2.設計概念與製作心得:

以紅色及黑色搭配出的感覺。

3.何謂HTML、DIV及CSS

HTML:架構設定
DIV:建立網頁區塊
CSS:風格設定

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

http://www.tfam.museum/index.aspx?ddlLang=zh-tw
網頁設計及顏色搭配都很簡潔營造出寧靜的感覺。

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

希望能學到更多網頁設計的操作方法

視傳3C 1025445186 彭韋豪



Edited 2 time(s). Last edit at 03/01/2016 03:20PM by 1025445186.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1025445234/

2.設計概念與製作心得:理解後會覺有趣和小小成就感。

3.何謂HTML、DIV及CSS:HTML是網站的架構,CSS為美化網頁。

4.附上至少一個覺得設計很有質感的網站,並說明原因 :
http://designah.pts.org.tw/
一個很可愛、童趣看起來又舒服的網頁設計。

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



Edited 3 time(s). Last edit at 03/02/2016 01:01AM by unite2003@yahoo.com.tw.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445014
2.設計概念與製作心得:
設計的概念:主要是用過年的氣氛去色的!
3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構
DIV: 網頁的標籤
CSS:美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。

http://www.masterhands.com.tw/index.aspx
覺得他們的網頁分成不同的區塊真的有種點選雜誌的FU


5.期待這門課的學習成果與收穫為何?
希望可以獲得不一樣的觀點

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445149

2.設計概念與製作心得:設計簡單的風格來呈現這個服飾的特色

3.何謂HTML、DIV及CSS?
HTML為製作網頁的基本架構
DIV 可以把它視為標籤,命名這個標籤之後可以用CSS去做排版
CSS負責將基本的網頁架構美化

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://onlyny.com/collections/all-collection
網站以簡單的方式呈現

5.期待這門課的學習成果與收穫為何?
希望這學期能在這門課學到更多相關的知識

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1025445032

2.設計概念與製作心得:覺得在進步中,還需要再多努力。

3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.ducati.com.tw/category2s/lists
簡約有型,畫面乾淨顏色不多但很有層次感。

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

希望跟上進度...。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445189

2.設計概念與製作心得:以浩克的配色來呈現
3.何謂HTML、DIV及CSS?
HTML:網頁的基本架構
DIV: 可以把它視為標籤,命名這個標籤之後可以用CSS去做排版
CSS:負責將基本的網頁架構美化

4.附上至少一個覺得設計很有質感的網站,並說明原因
https://www.alasha.com.tw/maintain.php
配色不複雜,簡單中又帶有童趣,看起來很舒服


5.期待這門課的學習成果與收穫為何?
希望可以繼續學到更多的網頁設計技巧spinning smiley sticking its tongue out

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445071
2.設計概念與製作心得:巧克力色系
3.何謂HTML、DIV及CSS
HTML:網頁的主體
DIV:區分一頁面中各個區塊
CSS:網頁的設計
4.附上至少一個覺得設計很有質感的網站,並說明原因
目前暫無,找到補上
5.期待這門課的學習成果與收穫為何? 可以應用自如

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445098
2.設計概念與製作心得:過了一個寒假沒做網業感覺又有點忘寄但做了這次作業後有點回想起來了。
3.何謂HTML、DIV及CSS
HTML:負責建構網頁的基本架構
CSS :專門負責美化網頁的任務
DIV :使用標籤來建立網頁區塊

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://wallpaperswide.com/vintage-desktop-wallpapers/page/2
這個網站雖然看起來素素的,但有一種簡單的樸素美。
5.期待這門課的學習成果與收穫為何?希望網頁設計能越來越強。



Edited 1 time(s). Last edit at 03/04/2016 01:12AM by 1035445098.
(編輯記錄)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445086
2.設計概念與製作心得:太久沒碰 感覺變生疏很多
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

https://www.plain-me.com/index.asp
這個是目前看到現在最喜歡的網頁
裡面許多設計排版都很簡潔有力,不像一般服飾店所呈現的那麼雜亂不堪。

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

希望能比上學期更進步,設計屬於自己的服飾穿搭網站。

1.網址:[url=http://mepopedia.com/~css104-2b/hw01/hw01-1035445176/]http://mepopedia.com/~css104-2b/hw01/hw01-1035445176/[/url]
2.設計概念與製作心得:有些東西都忘記了 要複習
3.何謂HTML、DIV及CSS:
HTML:網頁的基本架構
DIV:標籤
CSS:美化和設計網頁

4.附上至少一個覺得設計很有質感的網站,並說明原因:
[url=http://wear.jp/]http://wear.jp/[/url]
簡潔有力

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

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445047/
2.設計概念與製作心得:自己摸索許多東西。
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.pazzo.com.tw/
簡約有型,畫面乾淨。

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

慢慢有跟上老師的步調,希望能夠更加熟練。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445047/
2.設計概念與製作心得:自己有在摸索更多的東西。
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.pazzo.com.tw/
配色簡單,畫面單一。

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

慢慢跟上老師的步調,希望能更熟練。

Attachments:
開啟 | 下載 - index.html (3.1 KB)
1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445011
2.設計概念與製作心得:以底圖當作主要顏色,再用比較舒服的色調來製作。
一陣子沒碰,有點生疏,不過做完這個網頁時,有慢慢地想起來了
3.何謂HTML、DIV及CSS:
HTML:網頁的基本架構。
DIV:網頁的結構的標籤
CSS:設計網頁讓網頁美化。
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://www.iutopi.com/
這個網頁很有趣,也很可愛。越往下滑還會顯示底多深,還有許多不同的海底生物
5.期待這門課的學習成果與收穫為何?
以後有點想學上面那個網站的做法,覺得很有趣

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445065

2.設計概念與製作心得:就在想要哪種顏色比較好看

3.何謂HTML、DIV及CSS

4.附上至少一個覺得設計很有質感的網站,並說明原因
http://www.kentisburygrange.co.uk/
清新/明亮/簡單/柔和

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



1035445065

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445047/
2.設計概念與製作心得:自己摸索了很多東西。
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:

http://www.pazzo.com.tw/
配色單一,畫面簡單。

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

可以更加了解這個軟體,希望能夠更加熟練。



Edited 1 time(s). Last edit at 03/08/2016 03:16PM by 1035445047.
(編輯記錄)

1.網址: http://mepopedia.com/~css104-2b/hw01/hw01-1035445125/
2.設計概念與製作心得:覺得對於網頁設計有一些基礎了。
3.何謂HTML、DIV及CSS:

HTML-網頁架構程式碼。DIV-是一個標籤。CSS-網頁的整體設計。

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

http://www.lavendercottage.com.tw/
很有設計與規劃,會讓人好奇繼續點下去。

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

希望快點也跟上進度。

1.網址: http://mepopedia.com/~css104-2b/hw01/hw01-1035445125/
2.設計概念與製作心得:覺得對於網頁設計有一些基礎了。
3.何謂HTML、DIV及CSS:

HTML-網頁架構程式碼。DIV-是一個標籤。CSS-網頁的整體設計。

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


很有設計與規劃,會讓人好奇繼續點下去。

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

希望快點也跟上進度。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445029/
2.設計概念與製作心得:
主題超難想的
想到後
圖也超難找的
可是圓角那個成就感很大
3.何謂HTML、DIV及CSS:
HTML:建立網頁的基本架構
DIV:標籤
CSS:美化設計網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://www.clearstone.co.jp/ladybaby/#profile5
覺得很少女很可愛
5.期待這門課的學習成果與收穫為何?
希望我可以變聰明理解語法

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445155
2.設計概念與製作心得:
因為我喜歡貓 所以用鞋貓劍客來做
重新複習 喚起記憶

3.何謂HTML、DIV及CSS:
HTML: 網頁中的基本架構
DIV: 網頁的標籤
CSS:美化網頁

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

風格很獨特 焦點清楚

5.期待這門課的學習成果與收穫為何?
希望接下來能夠越來越跟上進度

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445050/

2.設計概念與製作心得:
設計的概念:就~是~~超好看好推奧斯卡超強陣容的 丹麥女孩

3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構 。
DIV:是種標籤,負責區分各個主要頁面,做為主要排版的架構。
CSS:美化與設計網頁 。
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://everylastdrop.co.uk/
這是一個英國節約用水宣導網站,動畫互動式的網頁設計,讓觀者了解每一天所需浪費的用水量,
呼籲人類節約用水.

5.期待這門課的學習成果與收穫為何?
可以像ai&ps一樣活用! 甚至能接case啦(小聲說)

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445023
2.設計概念與製作心得:總覺得每次配色都要想很久
3.何謂HTML、DIV及CSS
HTML是架構設定
DIV是結構的標籤
CSS是風格設定,美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因
5.期待這門課的學習成果與收穫為何?
雖然多少能看懂語法了,但還是背不起來

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445119
2.設計概念與製作心得:
設計的概念:簡約
3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構
DIV: 網頁的標籤
CSS:設計與美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。
amazarashi的官網 / 這是一個日本團體的官方網站
這個網站把這個團體的所有精隨都表現出來,覺得很厲害。

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

希望可以把網頁設計做得比以前更好。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445179
2.設計概念與製作心得:
設計的概念:粉嫩
3.何謂HTML、DIV及CSS:
HTML: 網頁的基本架構
DIV: 網頁的標籤
CSS:設計與美化網頁
4.附上至少一個覺得設計很有質感的網站,並說明原因。
http://www.muji.com/tw/
這是無印良品的官方網站。排版設計的都很好,項目也都一目了然,簡潔明瞭讓人很佩服。

5.期待這門課的學習成果與收穫為何?
希望自己可以網頁設計做的比之前好。

1.網址:http://mepopedia.com/~css104-2b/hw01/hw01-1035445056/
2.設計概念與製作心得:還需要進步
3.何謂HTML、DIV及CSS:
4.附上至少一個覺得設計很有質感的網站,並說明原因:


http://www.obdesign.com.tw/

簡單圖多教吸引人。

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

了解更多不清楚的知識。