บทที่8
เลือกใช้สีสำหรับเว็บ
ประโยชน์ของสีในเว็บไซต์
สามารถชักนำสายตาผู้อ่านให้ไปยังทุกบริเวณในหน้าเว็บเพ็จที่เราต้องการได้
เช่น ข้อมูลใหม่หรือโปรโมชั่นพิเศษ
สีช่วยเชื่อมโยงบริเวณที่ได้รับการออกแบบเข้าด้วยกัน
สีสามารถนำไปใช้ในการแบ่งบริเวณต่างๆออกจากกัน
สีสามารถใช้ในการดึงดูดความสนใจของผู้อ่าน
สีสามารถสร้างอารมณ์โดยรวมของเว็บเพ็จ
ความรู้เบื้องต้นเกี่ยวกับสี
แม่สีขั้นต้น1.สีแดง2.สีเหลือง3.สีน้ำเงิน
สีขั้นที่2
สีขั้นที่3 สีขั้นที่4
การผสมสี มี2แบบ
1.การผสมแบบบวก
จะเป็นรูปแบบการผสมของแสง
ไม่ใช่การผสมของวัตถุที่มีสีบนกระดาษ
จะนำไปใช้ในสื่อที่ใช้แสงส่องออกมาเช่นโปรเจคเตอร์
ทีวี จอมอนิเตอร์
2.การผสมแบบลบ
ไม่เกี่ยวเนื่องกับแสงแต่เกี่ยวเนื่องกับการดูดกลืนและสะท้อนแสงของวัตถุต่างๆ
จะนำไปใช้ในสื่อที่เกี่ยวข้องกับการใช้วัตถุที่มีสีเช่นภาพวาด
ศิลปิน รูปปั้น สิ่งพิมพ์ต่างๆ
สีที่เป็นกลาง
คือสีกลุ่มหนึ่งที่ไม่ได้ถูกบรรจุใว้ในวงล้อสีเพราะเป็นสีที่ไม่ได้รับอิทธิพลมาจากสีอื่นซึ่งก็คือสีเทา
ขาว ดำ
สีอ่อน
สีเข้มและโทนสี
-ในการผสมสีกลางเข้ากับสีบริสุทธ์จะเกิดเป็นสีต่างๆจำนวนมากมาย
สีบริสุทธ์ผสมกับสีขาวจะได้สีอ่อน
สีบริสุทธ์ผสมกับสีเทาจะได้เป็นโทนสีระดับต่างๆ
สีบริสุทธ์ผสมกับสีดำจะได้เป็นสีเข็ม
รูปแบบชุดสีพื้นฐาน
-ชุดสีร้อน
ประกอบด้วยสีม่วงแกมแดง
แดงแกมม่วง แดง ส้ม เหลือง และเขียวอมเหลือง สีเหล่านี้สร้างความรู้สึกอบอุ่นสบาย
-ชุดสีเย็น
ประกอบด้วยสีม่วง
น้ำเงิน น้ำเงินอ่อน ฟ้า น้ำเงินแกมเขียว เขียว ให้ความรู้สึกเย็นสบาย
-ชุดสีแบบเดียว
เป็นรูปแบบที่ง่ายที่สุดคือมีค่าสีบริสุทธิ์เพียงสีเดียวแต่เพิ่มความหลากโดยการเพิ่มความเข็ม
อ่อน มีความกลมกลืน
-ชุดสีแบบสามเส้า
เป็นชุดสีที่อยู่ที่มุมของสามเหลี่ยมด้านเท่าทั้งสามมีระยะห่างจากในวงล้อเท่ากันจึงมีความเข้ากันอย่างลงตัว
-ชุดสีคล้ายคลึงกัน
ประกอบด้วยสี2หรือ3สีที่อยู่ติดกันในวงล้อ
-ชุดสีตรงข้าม
คือสีคู่ที่อยู่ตรงข้ามในวงล้อมสี
เมื่อนำมาใช้ด้วยกันจะทำให้สีทั้งสองมีความสว่าง สดใสมากขึ้น
-ชุดสีตรงข้ามข้างเคียง
เป็นชุดสีที่เปลี่ยนแปลงมาจากชุดสีตรงข้าม
มีความหลากหลายเพิ่มขึ้น แต่จะมีผลให้ความสดใส ความสะดุดตาของสีลดลง
-ชุดสีตรงข้ามข้างเคียงทั้งสองด้าน
มีความหลากหลายของสีที่มากขึ้นแต่จะมีความสดใสและกลมกลืนลดลง
.............................................................................................
บทที่9
ออกแบบกราฟิกสำหรับเว็บไซต์
-กราฟิกเป็นองค์ประกอบที่สำคัญอย่างหนึ่งของเว็บเพ็จช่วยสื่อความหมายสร้างความเข้าใจให้กับผู้ใช้รวมทั้งยังสร้างความสวยงามให้เว็บไซต์น่าดูชมยิ่งขึ้น
-ปัญหาที่มักเกิดขึ้นกับการสร้างกราฟิกคือการเลือกใช้รูปแบบกราฟิกไม่เหมาะสมกับลักษณะของรูป
โดยไม่รู้จักความแตกต่างของรูปแบบกราฟิก
ส่งผลให้รูปที่ได้มีลักษณะไม่สมบรูณ์และมีไฟล์ใหญ่เกินความจำเป็น
-หลายๆเว็บมีการใช้กราฟฟิคเป็นหลักในการออกแบบ
ทำให้เว็บเพจมีความสวยงามและน่าสนใจอย่างมาก
-การนำกราฟฟิกประเภท GIF
ไปใช้กับรูปถ่ายทำให้ภาพเป็นจุดๆ
-การใช้ตัวอักษรในกราฟฟิกประเภท
JPEGผลคือเป็นรอยขรุขระ
GIF ย่อมาจาก Graphic Interchange Format
-ได้รับความนิยมในยุคแรก
-มีระบบสีแบบ Index
ซึ้งมีสีขนาด 8บิต ทำให้มีสีมากสุด 256สี
-มีการบีบอัดข้อมูลตามแนวของพิกเซล
เหมาะสำหรับกราฟฟิคที่ประกอบด้วยสีพื้น
JPG ย่อมาจาก Joint Photographic Experts Group
-มีข้อมูลสีขนาด 24บิต สามารถแสดงสีได้ถึง16.7ล้านสี
-ใช้ระบบบีบอัดที่มีลักษณะที่สูญเสีย
-ไฟล์ประเภทนี้ควรนำไปใช้กับรูปถ่ายหรือกราฟฟิกที่มีการไล่ระดับสีอย่างละเอียด
PNG ย่อมาจาก Portable Network Graphic
เป็นรูปแบบไฟล์ภาพที่ถูกคิดค้นเพื่อมาแทนที่
GIF ที่มีปัญหาเรื่องลิขสิทธิ์
ซึ่งคุณสมบัติของ PNG นั้นจะคล้ายกับGIF
-สามารถสนับสนุนระบบสีได้ทั้ง
8บิต และ 24บิต
-มีระบบการบีบอัดแบบ Deflate
ที่ไม่ทำให้เกิดการสูญเสีย
-มีระบบการควบคุมค่าแกมม่าและความโปร่งใสในตัวเอง
-ไม่สามารถทำ Animation
-ทำพื้นหลังให้เป็น Transparent ได้ดีกว่า GIF
-บีบอัดไฟล์ให้มีขนาดเล็กกว่าไฟล์
GIF ประมาณ 10-30%
กราฟฟิกรูปแบบ GIF
-มีไฟล์นามสกุล .
-ลักษณะเด่นของ GIF
คือการไม่ขึ้นกับระบบปฏิบัติการใดๆ
-GIF เป็นกราฟฟิกประเภทเดียวที่สามารถนำไปใช้กับเบราเซอร์ทุกชนิดโดยไม่คำนึงถึงเวอร์ชันใดๆ
-GIF มีคุณสมบัติในการเคลื่อนไหว
-GIF มีระบบสีแบบ Index
เก็บข้อมูลสีได้สูงสุด 8บิต
-คุณสมบัติ interlacing
คือการบันทึกไฟล์ GIF เป็น 4ระดับคือ ที่คุณภาพ 12.5% 25% 50% 100%
ข้อดีคือได้เห็นภาพที่กำลังโหลดอยู่ชัดขึ้นเรื่อยๆ
ข้อเสียคือขนาดไฟล์จะเพิ่มขึ้นเล็กน้อย
กราฟฟิกรูปแบบ JPEG
-ระบบการบีบอัดข้อมูลในไฟล์
JPEG
รูปที่ได้จากการบีบอัดข้อมูลที่อัตราสูง
รูปที่ได้จากการบีบอัดข้อมูลที่อัตราต่ำ
JPEG สามารถบีบอัดข้อมูลในอัตราสูงตั้งแต่
10:1 จนถึง 20:1โดยที่สายตามนุษย์ไม่อาจมองเห็นคุณภาพที่ลดลงแต่อย่างใด
-การลดขนาดไฟล์ JPEG
เนื่องจากจำนวนบิตของไฟล์ JPEG เป็น 24บิต เสมอ
จึงไม่สามารถลดขนาดไฟล์โดยการลดจำนวนบิตของสีลงได้
การลดขนาดไฟล์ทำได้โดยการบีบอัดในอัตราที่สูง
ทั้งนี้ก็ขึ้นอยู่กับคุณภาพที่ต้องการด้วย
-คำแนะนำในการเลือกใช้ชนิดของไฟล์ภาพ
ภาพถ่าย : JPEG ดีที่สุด
โลโก้ ,พื้นหลังเว็บ,รูปส่วนต่างๆของเว็บ : GIF และ PNG-8 ดีที่สุด
รูปที่เอฟเฟ็คอย่าง Drop
Shadow,Glow หรือรูปที่มี Transparent : PNG-24 ดีทีสุด
.......................................................................................
บทที่10
จัดรูปแบบตัวอักษรสำหรับเว็บไซต์
รูปแบบตัวอักษร
ตัวอักษรที่มีขนาดสัมพันธ์กับรูปร่างหรือตัวอักษรที่มีขนาดไม่คงที
-ตัวอักษรแต่ละตัวมีพื้นที่ตามแนวนอนไม่เท่ากันขึ้นกับรูปร่างของตัวอักษรนั้น
-สิ่งพิมพ์ต่างๆที่ผลิตด้วยคอมพิวเตอร์ส่วนใหญ่จะถูกออกแบบโดยใช้ตัวอักษรแบบนี้เพื่อให้ดูเหมาะสมและอ่านง่าย
ตัวอักษรที่มีขนาดคงที่
จะเป็นตัวอักษรที่มีพื้นที่ตามแนวนอนเท่ากันหมด
ซึ่งเป็นรูปแบบที่เรียบง่ายและมีลักษณะคล้ายตัวพิมพ์ดีด
เปรียบเทียบพื้นที่ตามแนวนอนของตัวอักษร2แบบ
ตัวอักษรประเภท
Serif และ Sans-Serif
ตัวอักษรประเภท
Serif
-ตัวอักษรประเภทนี้จะมีลายเส้นเพิ่มขึ้นที่ส่วนปลาย
-ตัวอักษรประเภทนี้เหมาะที่จะใช้ในส่วนที่เป็นรายละเอียดของเนื้อหา
-ไม่เหมาะกับการใช้เป็นตัวหนา
เส้นตกแต่งอาจมีได้หลายแบบ
แตกต่างกันไปตามชนิดตัวอักษร
ตัวอักษรประเภทSans-Serif
-ไม่มีลายเส้นตกแต่งติดอยู่กับตัวอักษร
-เหมาะที่จะใช้กับหัวข้อหรือตัวอักษรขนาดใหญ่
-ไม่เหมาะกับลักษณะเอียงเพราะจะทำให้รูปร่างเปลี่ยนไปมาก
......................................................................................................................
ไม่มีความคิดเห็น:
แสดงความคิดเห็น