Re: [期末作業] 專題網站設計

週一, 五月 28. 2018

1.網站主題: 主題是高中的畢業製作 豕卷
2.內容大綱(導覽列/中文/檔名): 首頁 index 由來 about 故事介紹 portfoilo 海報設計 poster 週邊商品 around
3.參考版型: 老師的版型
4.主要對象(分析): 主要介紹水的流動方式
5.網頁架構圖(樹狀圖):
6.色彩規劃:顏色上的搭配以主題的灰色系列以及白色來做設計
7.歷屆得獎分析(至少三組):
一.台灣十大茗茶: 覺得版面很乾淨 讓人看起來很舒服
二.歲月時分:用可愛的動畫來呈現出網站,版面看起來也很乾淨
三.HiIsland 純淨之島:利用可愛的圖 來帶動整個網站的有趣
8.組員名單(學號)
1055445075 1055445186


1.作業網址:http://mepopedia.com/~web106-2c/final/final-1055445075

2.網站主題:豕卷
3.內容描述: 主要介紹水的流動方式 利用水墨來呈現三隻小豬的故事
4.風格設計: 以簡潔 乾淨的感覺來呈現
5.組員名單,工作分配(視覺規劃、HTML CSS設計、動態效果):
1055445075 林宥柔 工作分配: 視覺規劃、HTML
1055445186 施婉晴 工作分配: CSS設計、動態效果
6.個人製作心得:
1055445075 林宥柔:我覺得這次的網頁設計 ,有點難度 但在上課時有跟著老師的步驟做,就感覺"好像"不會這麼難,也很感謝老師教我們許多網頁設計的技巧,謝謝老師的教導~~

1055445186 施婉晴: 這一次的網頁設計我覺得越來越有難度,也越來越複雜,有時候會眼花撩亂,但是知道訣竅的時候就能夠慢慢的理解,最後完成期末也很開心! 謝謝老師的教導喔!!!

Re: [作業06] RWD網頁實作/列表頁/內容頁/Google Fonts網路中文字型應用

週日, 五月 27. 2018

(1).網址: :http://mepopedia.com/~web106-2c/hw06/hw06-1055445075
(2).主題、風格:
 主題是高中的畢業製作豕卷 風格是以簡潔 乾淨
(3).設計概念與製作心得: 顏色上的搭配以主題的灰色系列以及白色來做設計

Re: [作業05] RWD網頁實作 navigation/dropdown/sub-menu/video

週二, 五月 15. 2018

(1).網址: :http://mepopedia.com/~web106-2c/hw05/hw05-1055445075
(2).主題、風格:
 主題是高中的畢業製作 風格是以簡潔 乾淨
(3).設計概念與製作心得: 顏色上的搭配以主題的灰色系列以及白色來做設計

Re: [作業04] OnePage網頁實作/slider /Grid system

週三, 四月 18. 2018

(1).網址: :http://mepopedia.com/~web106-2c/hw04/hw04-1055445075
(2).版型網址:
http://www.tooplate.com/live/2098-health
(3).主題、風格:
主題是自己拍的攝影照片/風格是簡單明瞭 乾淨
(4).設計概念與製作心得:在製作的過程中,我遇到不知道要從那裡修改輪播圖片,所以我做了很久才找到修改輪播圖片的地方。

Re: [期中作業] OnePage-個人網頁製作

週二, 四月 10. 2018

(1) 作業網址 :http://mepopedia.com/~web106-2c/midterm/midterm-1055445075
(2) 參考之版型網址: http://www.tooplate.com/live/2090-kinetic 或 http://www.tooplate.com/live/2098-health
(3) 設計主題 / 風格 : 主題是自己拍的攝影照片 風格是簡單 乾淨
(4) 導覽列項目:首頁 home 關於about 人物攝影People photography 風景攝影 Landscape photography 聯繫contact
(5) 遇到之問題: 在製作的過程中,我遇到不知道要從那裡修改輪播圖片,所以我做了很久才找到修改輪播圖片的地方。以及最後的個人favicon做了好久才發現是打錯語法。
(6) 製作時間: 三到五天左右
(7) 製作心得:做完的感覺就是眼睛會眼花瞭亂 而且很難,但做完很有成就感!!

Re: [作業03] Font Awesome字型練習與應用

週二, 四月 10. 2018


(1).網址: :http://mepopedia.com/~web106-2c/hw03/hw03-1055445075
(2).設計概念與製作心得:利用深色的顏色系列,來突出韓風的感覺。再加上一些旋轉圖示以及分享連結圖示讓這個網頁更有生動感,但我一個問題就是分享連結圖示加了連結網址顏色就跑掉了,我也找不出要從哪裡改顏色。

Re: [作業02] EDM/Newsletter製作

週二, 三月 27. 2018


(1).網址: :http://mepopedia.com/~web106-2c/hw02/hw02-1055445075
(2).設計概念與製作心得:我這次做的主題是黏黏怪物研究所,顏色我設計成跟黏黏怪物的LOGO顏色是一樣的藍色系列,排版是找個簡潔 乾淨的
做完的感覺是很開心,但在製作的過程當中,圖片都上傳了到資料夾,也有貼上圖片的絕對路徑,但是有幾張圖片就是跑不出來。

Re: [作業01] DIV與CSS複習--以色塊為主的基本單欄網頁版型(新增CSS3練習)

週二, 三月 13. 2018

1.網址:http://mepopedia.com/~web106-2c/hw01/hw01-1055445075
2.設計概念與製作心得: 利用深色的顏色系列,來突出韓風的感覺。 我覺得上完一學期的網頁 有變得更熟悉了 希望這學期可以更加努力的學習。
3.何謂HTML、DIV及CSS:
HTML :是一種用於建立網頁的標準標示語言
DIV:是一種建立網頁區塊或標籤包起來的東西,瀏覽器會視為一個物件
CSS:是一種讓網頁增加許多不同的效果
4.附上至少一個覺得設計很有質感的網站,並說明原因
https://www.mydesy.com/
這個網站設計得很簡單,也可以在這裡尋找設計的靈感
5.期待這門課的學習成果與收穫為何? 希望這門課能學習更深入的網頁語法

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

週日, 一月 14. 2018

(1)作業網址:http://mepopedia.com/~css106-2c/final/final-1055445075

(2).
1.製作作業的時間:2~4天
2.有無遇到的問題: 在做作業五的時候,一開始做繞圖排文時,一直無法全部對整齊 但只後知道做繞圖排文時,文字要夠多,才會比較整齊。最後有看講義 也能慢慢的理解
3.製作心得與感想: 讓我了解到做網頁設計的知識,也讓我學習到很多不同的語法。
4.本學期於網頁設計課程上的收穫: 一開始上課完全聽不懂語法,經過老師的耐心教導以及教學影片和講義,後面慢慢的了解語法的意思,也讓自己更加的了解整個網頁設計的架構,做到最後面的作業時,也能自己慢慢發現自己的錯誤並且修改,也很謝謝老師這學期的耐心教導我們,謝謝老師~~

前置作業
(1)網站主題: 玩具總動員 Toy Story
(2)導覽列架構設定 :劇情(index) 人物(people) 電影介紹(about) 製作(making) 影片(video)
(3)主要瀏覽族群:喜歡皮克斯動畫的人們 12~25歲
(5)風格設定: 乾淨 簡單的藍色系列風格
(6)主色調,輔助色調: 主色調是藍色 輔助色調是淡黃色以及淡藍色
(7)製作動機:很喜歡巴斯光年,所以做他演出的電影 玩具總動員
(8)製作目的: 能讓大家了解玩具總動員的電影由來
預期效果: 希望分數不會太低 能順順利利的過關

Re: [作業07 ] 以Float:浮動,製作雙欄網頁

週二, 一月 9. 2018

(1).作業網址 :http://mepopedia.com/~css106-2c/hw07/hw07-1055445075/making.html

(2).請回答以下問題:
1.網頁主題: 玩具總動員 (我的作業7是在"making"那一頁)
配色與風格設定: 藍色系列
2.有無遇到的問題? 一直把這個caption的CSS語法 寫錯 後來去看講義檢查,才知道要怎麼寫
3.製作感想 :在製作過程中有一直卡住,但看講義之後有解決我的問題了 做完成時感覺很開心
4.製作作業的時間:3~5小時

Re: [作業06 ] 表格的製作美化與資料整理

週二, 一月 2. 2018

(1).作業網址 :http://mepopedia.com/~css106-2c/hw06/hw06-1055445075

(2).請回答以下問題:
1.網頁主題: 玩具總動員 (我的作業6是在"about"那一頁)
2.配色與風格設定:藍色系列
2.有無遇到的問題? 目前還可以 沒甚麼太大的問題
3.製作感想 :覺得表格不錯用,能讓資料看得很清楚,做完感覺很有成就感。
4.製作作業的時間 :3~4小時左右

Re: [作業05 ] 繞圖排文與推文按鈕的應用

週三, 十二月 20. 2017

(1).作業網址 :http://mepopedia.com/~css106-2c/hw05/hw05-1055445075/people.html

(2).請回答以下問題:
1.網頁主題: 玩具總動員 配色與風格設定:藍色系列
("我的作業5是在"people"那頁)
2.有無遇到的問題? 一開始做繞圖排文時,一直無法全部對整齊 但只後知道做繞圖排文時,文字要夠多,才會比較整齊。
3.製作感想 :覺得圖片放大很好玩 還有分享連結 覺得很酷
4.製作作業的時間: 3小時

Re: [作業04 ] 以CSS製作網頁導覽列

週三, 十二月 13. 2017

(1).作業網址 :http://mepopedia.com/~css106-2c/hw04/hw04-1055445075

(2).請回答以下問題:
1.導覽列配色與風格設定: 藍色系列
2.有無遇到的問題? 無
3.製作感想(你認為導覽列的意義為何?) 讓使用者能清楚看到以及使用
4.製作作業的時間 1~2小時

Re: [作業03 ]利用Div標籤與CSS建立基本網頁版型- 圖片篇

週一, 十一月 20. 2017

(1) 作業網址: http://mepopedia.com/~css106-2c/hw03/hw03-1055445075

(2) 主題 / 風格設定(色彩設定部份):小小兵的代表顏色 黃色系列

(3) 有無遇到的問題 :無

(4) 製作感想: 我覺得加入圖片以及按鈕 感覺起來真的很像一個網站,也希望我的期中作業能順利的完成。
謝謝老師的耐心教導

(5) 製作作業的時間 :2~3小時完成

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

週一, 十一月 13. 2017

完成品(11/22/29前)
(1)作業網址 :http://mepopedia.com/~css106-2c/midterm/midterm-1055445075
(2)
1有無遇到的問題 : 有 遇到存完第二個頁面的檔案 ,要打開Google瀏覽器時 無法跟第一個頁面連在一起,最後自己有找到是按鈕的存檔連結,沒有打到html這四個英文字母。
2.製作感想 :第一次完成自己喜歡的主題網站,感覺很開心 ,希望以後的作業可以越做越順利。
3.製作作業的時間 :2~3天完成

前置作業(11/15)
(1)網站主題: 小小兵

(2)製作動機: 因為我很喜歡小小兵,想藉由這次的網頁設計的期中作業,來介紹可愛的小小兵

(3)製作內容:
劇情介紹(index)
角色介紹(people)
小小兵語大解密(language)
精彩預告片(movie)
精彩劇照(photo)

(4)風格設定: 利用小小兵的代表色,黃色系列去製作出可愛的卡通風格的網站

(5)資料蒐集分析
◎設計優良網站(風格)列表與分析:
http://universalshowtimes.com/tw/minions/
http://www.nick-asia.com/shows/spongebob-squarepants/76ypv4
這些網站都類似用黃色系列的配色,這些配色我都還滿喜歡的