Change History

<h2>網頁格線排版練習作業說明</h2>
請參考[講義] 網頁設計的美學原則：http://mepopedia.com/forum/read.php?804,42883
php?804,43354
otoshop製作網頁版型：http://mepopedia.com/forum/read.php?804,43354

<h3>作業目的</h3>1.熟悉格線排版的目的與意義
2.了解網頁實際內容與細節
3.觀察優良網站的設計原則
4.增強網頁排版的能力與技巧

[hr]
<h3>作業說明</h3>1.請以格線設計原則，以講義上任一優良網站為例，使用其排版概念及網頁資訊，重新改編為一新的網站設計。
2.製作：(1)首頁，(2)滑鼠移過的效果，以及(3)進入後的至少其中一子頁。

[hr]
<h3>作業步驟</h3>1.請下載[url=https://github.com/nathansmith/960-Grid-System/archive/master.zip]格線系統版型[/url]，並以photoshop軟體版本選用其中一種製作。
2.請選擇講義中任何一個你認為值得學習的網站首頁作為練習對象，截圖置入photoshop當作背景。
3.試著以格線系統重新排版，以原參考網頁的版型與網頁資訊，重新以photoshop設計新的網站，包含標題文字、圖片、色彩。
4.重新設定網站主題、使用對象、色彩計畫、圖片元素等。
5.[color=#CC0066]完成後請保留原檔[/color](以方便日後修改)，並存成PDF檔以夾檔方式上傳，並將檔名命名為 hw02-學號.pdf 。

6.上傳
(1)首頁，(2)滑鼠移過的效果，(3)進入後的至少其中一子頁。
並請回覆：

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

[hr]
<h3>注意事項</h3>1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]

<h2>網頁格線排版練習作業說明</h2>
請參考[講義] 網頁設計的美學原則：http://mepopedia.com/forum/read.php?804,42883
otoshop製作網頁版型：http://mepopedia.com/forum/read.php?804,43354

<h3>作業目的</h3>1.熟悉格線排版的目的與意義
2.了解網頁實際內容與細節
3.觀察優良網站的設計原則
4.增強網頁排版的能力與技巧

[hr]
<h3>作業說明</h3>1.請以格線設計原則，以講義上任一優良網站為例，使用其排版概念及網頁資訊，重新改編為一新的網站設計。
2.製作：(1)首頁，(2)滑鼠移過的效果，以及(3)進入後的至少其中一子頁。

[hr]
<h3>作業步驟</h3>1.請下載[url=https://github.com/nathansmith/960-Grid-System/archive/master.zip]格線系統版型[/url]，並以photoshop軟體版本選用其中一種製作。
2.請選擇講義中任何一個你認為值得學習的網站首頁作為練習對象，截圖置入photoshop當作背景。
3.試著以格線系統重新排版，以原參考網頁的版型與網頁資訊，重新以photoshop設計新的網站，包含標題文字、圖片、色彩。
4.重新設定網站主題、使用對象、色彩計畫、圖片元素等。
5.[color=#CC0066]完成後請保6.上傳後，請回覆：
參考網站網址：
(1)網站分類：
(2)網站主題：
(2)對象：
(3)色彩計畫：
(4)風格設定、網頁看點、預期成效：
(5)請整理以下數值：
字體設定(font-family)
標題級數、文章標題級數、內文級數(font-size)
區塊內與區塊間的距離(padding)(margin)
網站寬度(width)
(6)製作心得：
學號

[hr]
<h3>注意事項</h3>1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]留原檔[/color](以方便日後修改)，並存成PDF檔以夾檔方式上傳，並將檔名命名為 hw02-學號.pdf 。

6.上傳
(1)首頁，(2)滑鼠移過的效果，(3)進入後的至少其中一子頁。
並請回覆：

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

[hr]
<h3>注意事項</h3>1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]

<h2>網頁格線排版練習作業說明</h2>
請參考[講義] 網頁設計的美學原則：http://mepopedia.com/forum/read.php?804,42883
otoshop製作網頁版型：http://mepopedia.com/forum/read.php?804,43354

<h3>作業目的</h3>1.熟悉格線排版的目的與意義
2.了解網頁實際內容與細節
3.觀察優良網站的設計原則
4.增強網頁排版的能力與技巧

[hr]
<h3>2.製作一首頁，滑鼠移過的效果，以及進入後的至少其中一頁。
作業說明</h3>1.請以格線設計原則，以講義上任一優良網站為例，使用其排版概念及網頁資訊，重新改編為一新的網站設計。
2.製作：(1)首頁，(2)滑鼠移過的效果，以及(3)進入後的至少其中一子頁。

[hr]
<h3>作業步驟</h3>1.請下載[url=https://github.com/nathansmith/960-Grid-System/archive/master.zip]格線系統版型[/url]，並以photoshop軟體版本選用其中一種製作。
2.請選擇講義中任何一個你認為值得學習的網站首頁作為練習對象，截圖置入photoshop當作背景。
3.試著以格線系統重新排版，以原參考網頁的版型與網頁資訊，重新以photoshop設計新的網站，包含標題文字、圖片、色彩。
4.重新設定網站主題、使用對象、色彩計畫、圖片元素等。
5.[color=#CC0066]完成後請保6.上傳後，請回覆：
參考網站網址：
(1)網站分類：
(2)網站主題：
(2)對象：
(3)色彩計畫：
(4)風格設定、網頁看點、預期成效：
(5)請整理以下數值：
字體設定(font-family)
標題級數、文章標題級數、內文級數(font-size)
區塊內與區塊間的距離(padding)(margin)
網站寬度(width)
(6)製作心得：
學號

[hr]
<h3>注意事項</h3>1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]留原檔[/color](以方便日後修改)，並存成PDF檔以夾檔方式上傳，並將檔名命名為 hw02-學號.pdf 。

6.上傳
(1)首頁，(2)滑鼠移過的效果，(3)進入後的至少其中一子頁。
並請回覆：

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

[hr]
<h3>注意事項</h3>1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]

網頁格線排版練習作業說明

請參考[講義] 網頁設計的美學原則：http://mepopedia.com/forum/read.php?804,42883
otoshop製作網頁版型：http://mepopedia.com/forum/read.php?804,43354

作業目的

1.熟悉

作業說明

請以格線設計原則，以講義上任一優良網站為例，使用其排版概念及網頁資訊，重新改編為一新的網站設計。
格線排版的目的與意義
2.了解網頁實際內容與細節
3.觀察優良網站的設計原則
4.增強網頁排版的能力與技巧

[hr]

2.製作一首頁，滑鼠移過的效果，以及進入後的至少其中一頁。
作業說明

1.請以格線設計原則，以講義上任一優良網站為例，使用其排版概念及網頁資訊，重新改編為一新的網站設計。
2.製作：(1)首頁，(2)滑鼠移過的效果，以及(3)進入後的至少其中一子頁。

[hr]

作業步驟

1.請下載[url=https://github.com/nathansmith/960-Grid-System/archive/master.zip]格線系統版型[/url]，並以photoshop軟體版本選用其中一種製作。
2.請選擇6.上傳後，請回復：
(1)網站主題：
(2)對象：
(3)色彩計畫：
(4)風格設定、網頁看點、預期成效：
(5)製作心得：
學號

[hr]

注意事項

1.網站主題、標題名稱、圖片、配色請務必為新，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於上課前準時繳交作業，逾期不後。
[hr]講義中任何一個你認為值得學習的網站首頁作為練習對象，截圖置入photo5.完成後請保留原檔(以方便日後修改)，並存成PDF檔以夾檔方式上傳，並將檔名命名為 hw02-學號.pdf 。
6.上傳後，請回覆：
參考網站網址：
(1)網站分類：
(2)網站主題：
(2)對象：
(3)色彩計畫：
(4)風格設定、網頁看點、預期成效：
(5)請整理以下數值：
字體設定(font-family)
標題級數、文章標題級數、內文級數(font-size)
區塊內與區塊間的距離(padding)(margin)
網站寬度(width)
(6)製作心得：
學號

[hr]

注意事項

1.網站主題、標題名稱、圖片、配色請務必為新，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.若沒有特別想法，可將網站設定為：
��寬度(width)
(6)製作心得：
學號

[hr]

注意事項

1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]留原檔[/color](以方便日後修改)，並存成PDF檔以夾檔方式上傳，並將檔名命名為 hw02-學號.pdf 。

6.上傳
(1)首頁，(2)滑鼠移過的效果，(3)進入後的至少其中一子頁。
並請回覆：

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

[hr]

注意事項

1.網站主題、標題名稱、圖片、配色請務必為新的設計，單純圖片可以網頁圖片取代，但必須符合網站整體屬性與效果，需設計之圖片(如頂圖、背景圖等，需經過設計，不可以現成圖片取代)
2.[color=#CC0066]排版比例、間距、字體大小、等請盡量以參考範本為主[/color]。
3.中文字體以微軟正黑、新細明體、標楷體為主，一般設定建議以微軟正黑為主，較具設計質感。
4.[color=#CC0066]網頁單位請務必以px標示，[/color]並注意整體網頁的寬度。

5.若沒有特別想法，可將網站設定為：
(1)網站主題：設計工作室(請自行命名，中英文皆可)
(2)對象：對設計有興趣的人，以20~30為主。
3.請於規定時間準時繳交作業，逾期不後。
[hr]