lect06 web design

39
Web Design

Upload: jenchoke-tachagomain

Post on 29-May-2015

667 views

Category:

Documents


2 download

DESCRIPTION

Introduction to Online Document Development

TRANSCRIPT

Page 1: Lect06 Web Design

Web Design

Page 2: Lect06 Web Design

กำ��หนดสีที่�ใช้�

โที่นสีเดยว โที่นสีผสีม 2 สี โที่นสีผสีม 3 สี Color scheme, theme ด�สีของสี��งพิ�มพิ�, logo ห�วจดหม�ย หรื�อสี��อ

โฆษณ� ปรืะช้�สี�มพิ�นธ์�อ��นๆที่�มอย�'ของบรื�ษ�ที่

Page 3: Lect06 Web Design

โที่นสีเดยวโที่นสีเดยว: : สีฟ้*�สีฟ้*� เป+นสีของที่�องฟ้*� น�,�

ที่��ให�รื� �สี-กำสีบ�ยใจ น.'มนวล อบอ.'น

มสีฟ้*�หล�ยโที่น ให�คว�มรื� �สี-กำต่'�งๆกำ�น

Page 4: Lect06 Web Design
Page 5: Lect06 Web Design

สีน�,�เง�น ให�คว�มรื� �สี-กำข-งข�ง จรื�งจ�ง

น'�เช้��อถื�อ เป+นกำ�รืเป+นง�น ปลอดภั�ย หรื�หรื� มรืะด�บ มรื�ค�

สีน�,�เง�นรืะด�บต่'�งๆ ให�คว�มรื� �สี-กำแต่กำต่'�งกำ�น

Page 6: Lect06 Web Design
Page 7: Lect06 Web Design

สีเขยวสีเขยว

ให�คว�มรื� �สี-กำเป+นอ�สีรืะ สีดช้��น เย5นสีบ�ย

สีเขยวรืะด�บต่'�งๆ ให�คว�มรื� �สี-กำแต่กำต่'�งกำ�น

Page 8: Lect06 Web Design
Page 9: Lect06 Web Design

สีแดงสีแดง ให�คว�มรื� �สี-กำรื�อนแรืง ม

พิล�ง สีแดงรืะด�บต่'�งๆ ให�คว�ม

รื� �สี-กำแต่กำต่'�งกำ�น

Page 10: Lect06 Web Design
Page 11: Lect06 Web Design

สีสี�มสีสี�ม--เหล�องเหล�อง ให�อ�รืมณ�สีดใสี ต่��นต่�ว

ด-งด�ด เป+นสีของอ�ห�รื อ�จกำรืะต่.�นให�รื� �สี-กำห�ว

สีเหล�องสี�มรืะด�บต่'�งๆ ให�คว�มรื� �สี-กำแต่กำต่'�งกำ�น

Page 12: Lect06 Web Design
Page 13: Lect06 Web Design

โที่นสีเดยวโที่นสีเดยว: : สีเที่�สีเที่�--ข�วข�ว สีเที่�ให�คว�มรื� �สี-กำ สี.ข.ม

สีงบ ม��นคง อ�จที่��ให�รื� �สี-กำหม'นหมอง หรื�อเศรื��

สีข�ว ให�คว�มรื� �สี-กำสีะอ�ด บรื�สี.ที่ธ์�8

สีข�ว-เที่�หล�ยโที่น ให�คว�มรื� �สี-กำต่'�งๆกำ�น

Page 14: Lect06 Web Design
Page 15: Lect06 Web Design

โทนสี�แบบต่างๆโทนสี�แบบต่างๆ โทนสี�แบบสี�ชุ�ดเด�ยวกั�น โทนสี�แบบสี�ต่�ดกั�น

Page 16: Lect06 Web Design

Color Chart

Page 17: Lect06 Web Design

Color Chart: Hue

Page 18: Lect06 Web Design

Color Wheel

Page 19: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีรื�อน

Page 20: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีเย5น

Page 21: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

ช้.ดสีแบบเดยว

Page 22: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีคล��ยคล-งกำ�น

Page 23: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีต่รืงข��มกำ�น

Page 24: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีต่รืงข��มกำ�น 2 ช้.ด

Page 25: Lect06 Web Design

กำ�รืเล�อกำใช้�สี

สีต่รืงข��มกำ�น ข��งเคยง

Page 26: Lect06 Web Design

สีต่�วอ�กำษรื และสีพิ�,นหล�ง สีต่�วอ�กำษรื และสีพิ�,นหล�งสีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรื

สีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรืสีต่�วอ�กำษรื

สีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรื สีต่�วอ�กำษรื

Page 27: Lect06 Web Design

พิฤต่�กำรืรืมผ��ใช้�เว5บ

85% ของผ��ใช้�จะไม'อ'�นข�อคว�มจนจบ 10% ของผ��ใช้� ไม'เคยเล��อน scroll bar

เพิ��อด�สี'วนล'�งของจอ ผ��ใช้�ไม'ที่นต่'อกำ�รืรือด�วน�โหลดหน��ที่�น�นเกำ�นไป ผ��ใช้�ช้อบให�จ�ดห�ต่�วเล�อกำ , navigation ที่�

ช้�ดเจน แต่'ม�กำจะไม'ค'อยใช้�กำ�นน�กำ

Page 28: Lect06 Web Design

Web template design http://www.templatesbox.com/ http://www.freephotosweb.com/ http://www.templatemonster.com/

Page 29: Lect06 Web Design
Page 30: Lect06 Web Design
Page 31: Lect06 Web Design
Page 32: Lect06 Web Design
Page 33: Lect06 Web Design
Page 34: Lect06 Web Design

LOGO & SYMBOL

Page 35: Lect06 Web Design
Page 36: Lect06 Web Design
Page 37: Lect06 Web Design
Page 38: Lect06 Web Design
Page 39: Lect06 Web Design