หน้าเว็บ

Lecture

เลือกใช้สีสำหรับเว็บไซต์ (Designing Web Colors)
สีสันในเว็บเพจเป็นสิ่งที่สำคัญมากในการดึงดูดความสนใจของผู้ใช้ เนื่องจากสิ่งแรกที่ผู้ใช้มองเห็นจากเว็บก็คือสี ซึ่งเป็นสิ่งที่กำหนดบรรยากาศและความรู้สึกโดยตรงของเว็บไซต์และสามารถใช้สีได้กับทุกองคืประกอบของเว็บเพจ ตั้งแต่รูปภาพ ตัวอักษร สีพื้นหลัง     การใช้สีที่เหมาะสมจะช่ายให้ในการสื่อความหมายของเนื้อหา   
ประโยชน์ของสีในเว็บไซต์
1.ช่วยสร้างระเบียบให้กับข้อความต่างๆ เช่น ใช้สีแยกระหว่างหัวเรื่องกับเนื้อเรื่อง
2.สามารถส่งเสริมเอกลักษณ์ขององค์กรหรือหน่วยงานนั้นๆ 
3.สามารถชักนำสายตาผู้อ่านให้ไปยังทุกบริเวณในเว็บเพจที่เราต้องการได้
4.สีช่วยเชื่อมโยงบริเวณที่ได้รับการออกแบบเข้าด้วยกัน
5. สีสามารถใช้ในการดึงดูดความสนใจของผู้อ่าน
6.สีสามารถสร้างอารมณ์โดยรวมของเว็บเพจ
 ความรู้เบื้องต้นเกี่ยวกับสี
การผสมสี (Color Mixing)
         1. การผสมสีแบบบวก(Addittive mixing) จะเป็นรูปแบบการผสมของแสง ไม่ใช่การผสมของวัตถุที่มีสีบนกระดาษ 
          2. การผสมสีแบบลบ (Subtractive mixing) การผสมสีแบบนี้ไม่เกี่ยวข้องกับแสง แต่เกี่ยวเน่องกับการดูดกลืนและสะท้อนแสงของวัตถุต่างๆ
          วงล้อสี (Color Wheel)
          สีที่เป็นกลาง (Neutral Color)
          สีอ่อน สีเข้ม และโทนสี (Tint,Shade and Tone)
          ความกลมกลืนของสี (Color Harmony)
รูปแบบชุดสีพื้นหลัง (Simple Color Schemes)
-ชุดสีร้อน                                 -ชุดสีเย็น
-ชุดสีแบบเดียว                        -ชุดสีแบบสามเส้า
-ชุดสีที่คล้ายคลึงกัน                -ชุดสีตรงข้าม
-ชุดสีตรงข้ามข้างเคียง             -ชุดสีตรงข้ามข้างเคียงทั้ง 2 ด้าน

ออกแบบกราฟฟิกสำหรับเว็บไซต์ (Design Web Graphics)
        กราฟฟิกเป็นองค์ประกอบสำคัญของเว็บเพจ ซึ่งปัญหาส่วนใหญ่ที่เกิดขึ้นมักจะเกิดขึ้นกับการสร้างกราฟฟิก คือการใช้ลักษณะรูปแบบกราฟฟิกที่ไม่เหมาะสมกับลักษณะของรูป
กราฟฟิกรูปแบบหลัก 2 ประเภท
        1. GIF ย่อมาจาก Graphic Interchange Format
            1.1 ได้รับความนิยมในยุดแรก
            1.2 มีระบบสีแบบ Index ซึ่งมีข้อมูลสีขนาด 8 บิต ทำให้มีสีมากสุด 256 สี
            1.3 การบีบอัดข้อมูลตามแนวของพิกเซล
         2. JPG ย่อมาจาก Joint Photographic Experts Group
            2.1มีนามสกุลเป็น .jpg หรือ .jpeg
2.2ใช้ระบบสีขนาด 24 บิต ซึ่งจะให้สีสมจริงมากถึง 16.7 ล้านสี ส่งผลให้ได้รูปที่มีคุณภาพสูง
            2.3เป็นการบีบอัดแบบ  lossy
         3. PNG ย่อมาจาก Portable Network Graphic
            3.1สามารถสนับสนุนสีได้ทั้ง 8 บิต 16 บิต และ 24 บิต
            3.2การบีบอัดแบบ Deflate ที่ไม่ทำให้เกิดการสูญเสีย(lossless)
            3.3ควบคุมแกมม่า (Gamma) และความโปร่งใส(Transparency) ในตัวเอง

การออกแบบเว็บไซต์ให้เหมาะกับสิ่งแวดล้อม
(Design for a variety of Web Environments)
  ปัจจัยหลักที่เกี่ยวข้องกับการท่องเว็บไซต์
         -เบราเซอร์ที่ใช้ เบราเซอร์ คือ โปรแกรมที่ใช้เรียกดูเว็บเพจ สามารถแสดงผลได้ทั้งรูปแบบตัวอักษร รูปภาพ และภาพเคลื่อนไหว เบราเซอร์ที่ได้รับความนิยมเช่น Internet Explorer , Netscape NavigatorOpera , Mozilla , Firefox
         - ระบบปฏิบัติการ(Operating System) จะ มีผลต่อการทำงานของเบรา  เซอร์มากแต่ละระบบปฏิบัติการ จะมีความแตกต่างกันในเรื่องของชนิดและรุ่นของเบราเซอร์ ที่ใช้ระดับความละเอียดของหน้าจอชุดสีระบบ
         -ความละเอียดของหน้าจอ ความละเอียด 640x480 หมายถึง หน้าจอมีจุดพิกเซลเรียงตัวตามแนวนอน 640 พิกเซล และตามแนวตั้ง 480 ความละเอียดของหน้าจอจะขึ้นอยู่กัประสิทธิภาพของการ์ดแสดงผล
         -จำนวนสีที่จอของผู้ใช้สามารถแสดงได้ จำนวนสีที่การ์ดจอสามารถแสดงได้นั้นขึ้นอยู่กับค่าความละเอียดของสีที่เรียกว่า bit depth หรือ color depth ซึ่งก็คือ จำนวนบิตที่ใช้ในการเก็บข้อมูลแต่ละพิกเซล ชุดสีสำหรับเว็บ (Web Palette) หมายถึง ชุดสีจำนวน 216 สีที่มีอยู่เหมือนกันในระบบปฏิบัติการ Windows และ Mac
         -ชนิดของตัวอักษรที่มีอยู่ในเครื่องของผู้ใช้ จะแสดงฟอนต์ที่กำหนดไว้ในเว็บเพจได้ก็ต่อเมื่อคอมพิวเตอร์เครื่องนั้นมีฟอนต์เหล่านั้นติดตั้งอยู่ในเครื่อง
         - Microsoft Sans Serif เป็นฟอนต์แบบเวคเตอร์หรือลายเส้น(vector font)  สามารถปรับขนาดได้อย่างไม่จำกัด
ข้อดี : สามารถกำหนดลักษณะของตัวอักษรได้อย่างแน่นอนทั้งชนิด ขนาด สี
ข้อเสีย :ลำบากในการแก้ไขและเปลี่ยนแปลง  ความเร็วในการเชื่อมต่ออินเตอร์เน็ต จะมีผลต่อเวลาที่ใช้ในการแสดงผลของเว็บ ความเร็วของอินเตอร์เน็ตมีหลายระดับ คือ - ผู้ใช้ตามบ้าน จะใช้ความเร็ว 56 kbps และขนาดหน้าต่างเบราเซอร์
             -ความสว่างและค่าความต่างของโทนสี
               ต้องระวังไม่ให้หน้าเว็บมีโทนสีมืดหรือสว่างจนเกินไป และความเลือกใช้โทนสีที่ต่างกันพอสมควร  ต้องหลีกเลี่ยงตัวหนังสือสีส้มบนพื้นแดง