Lecture 5 ตัวอักษร.

งานนำเสนอเรื่อง: "Lecture 5 ตัวอักษร."— ใบสำเนางานนำเสนอ:

1 Lecture 5 ตัวอักษร

2 เรื่องทั่วไปเกี่ยวกับตัวอักษรและชุดตัวอักษร
ในอดีตมนุษย์ได้มีการใช้ข้อความหรือตัวอักษรเป็นภาษาสื่อกลางติดต่อระหว่างกัน โดยผ่านทางการอ่านหรือบันทึกเรื่องราวต่างๆ ต่อมาได้มีการนำตัวอักษรมาประยุกต์ใช้ร่วมกับคอมพิวเตอร์ด้วยกระบวนการเรียบเรียง ประมวลผล จัดเก็บและนำมาใช้งาน ซึ่งได้ก่อให้เกิดประโยชน์ในทุกแวดวงธุรกิจ หรือแม้แต่การสื่อสารด้วยข้อความที่เป็นเท็กซ์ (Text Messaging)

3 ข้อความที่นำมาประยุกต์ใช้ในรูปแบบสื่อสิ่งพิมพ์

4 ข้อความที่นำมาประยุกต์ใช้ในรูปแบบข้อความสำหรับติดต่อสื่อสาร

5 เรื่องทั่วไปเกี่ยวกับตัวอักษรและชุดตัวอักษร
จนกระทั่ง ได้มีการเริ่มนำตัวอักษรมาใช้ และเผยแพร่ผ่านช่องทางการสื่อสารบนระบบเครือข่ายอินเทอร์เน็ตในรูปแบบภาษา Html (Hypertext Markup Language) ซึ่งปัจจุบันกำลังได้รับความนิยมใช้งานกันอย่างแพร่หลาย

6 ข้อความภาษาเอชทีเอ็มแอลในโปรแกรมโน้ตแพด

7 มาตรฐาน (Standard) ของตัวอักษร
มาตรฐานตัวอักษรแบ่งออกเป็น 2 ชนิด คือ แอสกี (Ascii) ยูนิโค้ด (Unicode)

8 แอสกี (ASCII) แอสกี ASCII ย่อมาจาก American Standard Code For Information Interchange ได้มีการพัฒนาในช่วงปี ค.ศ ซึ่งแอสกีเป็นรหัสขนาด 7 บิต รองรับตัวอักษร (A-Z ทั้งตัวพิมพ์เล็กและตัวพิมพ์ใหญ่) ตัวเลข (0-9) และสัญลักษณ์พิเศษต่างๆ ได้ 128 รหัส (Code Point) ต่อมาได้รับการพัฒนามาเป็นมาตรฐาน ISO 646 ในปี ค.ศ สำหรับใช้งานทุกพื้นที่ในประเทศสหรัฐอเมริกา แต่มาตรฐานที่พัฒนาขึ้นมานั้น ยังไม่สามารถแก้ไขปัญหาทางด้านภาษาที่เกิดขึ้นได้อย่างจริงจัง ในการเก็บข้อมูล 1 ไบต์ จะมีการใช้งานขนาด 8 บิต แต่รหัสแอสกีจะใช้งานเพียง 7 บิต โดยที่อีกหนึ่งบิตที่เหลือจะใช้สำหรับแสดงสถานะความผิดพลาดของการส่งผ่านข้อมูล เรียกว่า แพริตีบิต (Parity Bit) ทำให้สามารถทำงานได้ 256 รหัส ซึ่งต่อมาได้มีการพัฒนาการใช้งานรหัสแบบ 8 บิตนี้ โดยแบ่งเป็น 2 กลุ่ม กลุ่มแรก (0-127) ยังคงเป็นรหัสแอสกีแบบเดิม กลุ่มที่สอง ( ) เป็นรหัสของสัญลักษณ์พิเศษต่างๆ และสัญลักษณ์ทางคณิตศาสตร์

9 แอสกี (ASCII) (ต่อ) มาตรฐานรหัส 8 บิต ในช่วงปี ค.ศ จะมีการใช้มาตรฐาน ISO 8859 โดยแยกตามกลุ่มของภาษาในกลุ่มแรกจะเป็นมาตรฐาน ISO เป็นการอ้างถึงภาษาในกลุ่ม ISO Latin1 และครอบคลุมรวมไปถึงภาษาของประเทศทางตะวันตกของยุโรป (Western European) ส่วนมาตรฐาน ISO 8859 สำหรับภาษาของประเทศทางตะวันออกของยุโรป เช่น Czech, Slovak และ Croatian จะใช้มาตรบาน ISO หรือ Latin2 โดยแต่ละประเทศจะมีมาตรฐานของภาษาที่แตกต่างกัน เช่น Cyrillic จะใช้มาตรฐาน ISO Greek จะใช้มาตรฐาน ISO และ Hebrew จะใช้มาตรฐาน ISO เป็นต้น จากข้อบกพร่องของมาตรฐาน ISO 8859 ที่ถูกแบ่งออกเป็นหลายประเภทดังกล่าวข้างต้นและมาตรฐานนี้ไม่สนับสนุนระบบปฏิบัติการและซอฟต์แวร์ต่างๆ อย่างครอบคลุม เป็นผลให้มาตรฐาน ISO 8859 ไม่สามารถใช้งานได้อย่างทั่วถึงและไม่เพียงพอที่จะรองรับกับรหัสของทุกชาติทุกภาษาได้ ดังนั้นเพื่อแก้ไขปัญหาจึงได้มีการพัฒนาพื้นที่ในการเก็บตัวอักษรเป็น 16 บิต (65536 รหัส) โดยมีการจัดกลุ่มของรหัสแบบ 8 บิตออกเป็น 256 กลุ่ม ในทำนองเดียวกันเมื่อจัดกลุ่มของรหัสแบบ 16 บิตออกเป็น 256 กลุ่ม จะได้รหัสแบบ 24 บิต จากนั้น จัดกลุ่มรหัสแบบ 24 บิต เพิ่มอีก 256 กลุ่ม ก็จะพัฒนาไปสู่ ISO หรือ รหัสแบบ 32 บิต

10 ตัวอย่างตารางรหัสแอสกี (ASCII)

11 ยูนิโค้ด( Unicode) เป็นรหัสขนาด 16 บิต จึงสามารถรองรับตัวอักษรได้มากถึง 65,536 (รหัส) ในรูปแบบของ “Code Point”

12 แสดงยูนิโค้ด (Unicode) ของตัวอักษรภาษาไทย

13 แสดงยูนิโค้ด (Unicode) ของตัวอักษรภาษาไทย

14 ยูนิโค้ด( Unicode) (ต่อ)
ปัจจุบันในหลายๆ ประเทศได้มีการนำเอายูนิโค้ดมาใช้ประโยชน์ร่วมกัน โดยการสร้างมาตรฐานของตนเองขึ้นมา ตัวอย่างเช่น มาตรฐาน “ซีเจเค (CJK)” ซึ่งเกิดขึ้นจากการรวมตัวของ 3ประเทศ ได้แก่ จีน (Chinese) ญี่ปุ่น (Japan) และเกาหลี (Korean)

15 ตัวอย่างรหัสยูนิโคดของซีเจเค

16 ยูนิโค้ด( Unicode) (ต่อ)
ในการนำรหัส ISO มาใช้งานให้สามารถส่งข้อมูลผ่านระบบเครือข่าย (ในระบบเครือข่ายส่งข้อมูลได้ครั้งละ 8 บิต) จะต้องทำการเข้ารหัส (Encoding) ตัวอักษรซึ่งการเข้ารหัสแบบนี้ จะรู้จักกันในชื่อ “ยูซีเอส (UCS)” แบ่งออกเป็น UCS-2 และ UCS-4 จากนั้นรหัสยูนิโค้ดจะนำไปใช้ในการแปลงเป็นรูปแบบของ UCS (UCS Transformation Formats : UTS-8 จะใช้สำหรับเข้ารหัส UCS-2 เป็นต้น สำหรับภาษาที่ยูนิโค้ดสามารถรองรับได้ มีดังนี้ Latin, Greek, Cyrillic, American, Hebrew, Arabic, Devanagari, Bengali, Gurmukhi, Gujarati, Oriya, Tamil, Telugu, Kannada, Malayalam, Thai, Lao, Georgian, Tibetan, Chinese, Japanese และ Korean

17 รูปแบบและลักษณะของตัวอักษร
รูปแบบตัวอักษร (Fonts) สามารถจัดแบ่งประเภทตัวอักษรออกเป็นหมวดหมู่ได้ 3 ระดับ ได้แก่ ประเภท (Category) ตระกูล (Family) ชื่อเฉพาะ (Face)

18 ประเภท (Category) เป็นที่รวมของตระกูล (Family) และชื่อเฉพาะ (Face) ของแต่ละตัวอักษร (Font) สามารถแบ่งออกได้ดังนี้ Serif: เป็นแบบอักษรที่ใช้เป็นมาตรฐาน ในแต่ละตัวอักษรจะมีเส้นคล้ายๆ ขีดเหลี่ยม Sans-Serif: เป็นแบบอักษรที่คุ้นเคยมากกว่า Serif เพราะเป็นที่นิยมของผู้เขียนเว็บ มีรูปร่างมนกลม และดูสวยงาม Monospaced: เป็นแบบอักษรที่มีขนาดความกว้างของทุกตัวอักษรเท่ากันหมด บางทีเรียกว่า Typewriter Font เนื่องจากมีลักษณะคล้ายตัวอักษรที่ได้จากเครื่องพิมพ์ดีด Script: เป็นแหล่งรวมของแบบอักษรทุกชนิด ที่มีลักษณะพิเศษต่างๆ เช่น มีจุด มีหาง เป็นต้น และมีลักษณะของตัวอักษรที่คล้ายกับลายมือ

19 ตระกูล (Family) เป็นหมวดที่ย่อยลงไปจาก Category แต่ตัวอักษรที่อยู่ในตระกูลเดียวกันจะมีบรรพบุรุษร่วมกัน Category Family Sarif Times, Century Schoolbook, Garamond Sans-Serif Helvetica, Arial, Verdana Monospaced Courier, Courier New Decorative Whimsy, Arribal, Bergell ตารางแสดงความสัมพันธ์ระหว่าง Category และ Family

20 ชื่อเฉพาะ (Face) เป็นตัวอักษรที่ย่อยลงไปจาก Family
Times Roman Regular, Italic Arial Regular, Bold, Italic Courier Regular, Oblique Whimsy Regular, Bold ตารางแสดงความสัมพันธ์ระหว่าง Family และ Face

21 การกำหนดลักษณะของตัวอักษร
การจัดวางตำแหน่ง (Alignment) เป็นการกำหนดวิธีการเรียงของอักษรหรือข้อความในแต่ละย่อหน้า ว่าต้องการให้ชิดซ้าย ชิดขวา อยู่ตรงกึ่งกลาง หรือจัดซ้ายขวาเสมอกันภายในทั้งด้านซ้าย ขวา บน และล่าง (Left, Top, Right And Bottom) สามารถกำหนดระยะขอบ หรือระยะห่างระหว่างกล่องข้อความ (Text Box) กับข้อความภายใน รวมทั้งระยะเว้นห่างของข้อความกับกรอบที่ล้อมรอบอยู่ได้ เส้นขอบ (Borders) เป็นการกำหนดค่าให้กับเส้นขอบว่าต้องการลักษณะของเส้นขอบ สีของเส้นขอบ และความหนักเบาของเส้นขอบหรือความหนาของเส้นขอบอย่างไร ขนาดของตัวอักษร (Font Size) จะเริ่มกำหนดตั้งแต่ส่วนบนสุดของตัวอักษร (Serif) จนถึงส่วนล่างของอักษรตัวพิมพ์เล็ก (เช่น ตัว g และ y ของตัวอักษรแบบ Helvetica, Times และ Courier เป็นต้น) ดังนั้นขนาดของตัวอักษรจึงมิได้หมายความถึงส่วนสูงหรือความกว้างของตัวอักษรเพียงเท่านั้น แต่จะขึ้นอยู่กับช่วงของตัวอักษรแต่ละแบบด้วย สี (Colors) เป็นส่วนกำหนดรายละเอียดเกี่ยวกับสีของตัวอักษร สีพื้นหลังของตัวอักษร และรวมถึงการเลือกรูปภาพ พื้นหลังของตัวอักษร และการจัดเรียงตัวของรูปภาพพื้นหลัง ตัวอักษรหรือข้อความ เป็นการกำหนดรูปแบบของตัวอักษรหรือข้อความโดยตรง ซึ่งสามารถกำหนดความหนาของตัวอักษร ลักษณะของตัวอักษร เช่น แบบตัวอักษรธรรมดา (Normal) แบบตัวหนา (Bold) แบบตัวเอียง (Italic) หรือแบบที่มีการขีดเส้นใต้ (Underline) เป็นต้น เปลี่ยนอักษรตัวเล็กให้เป็นตัวใหญ่ ตั้งระยะห่างระหว่างอักษรและระยะห่างระหว่างบรรทัดได้ รวมทั้งจัดการเรียงอักษรทั้งย่อหน้าใช้ชิดขอบซ้าย ขอบขวา อยู่กึ่งกลาง หรือตัดขอบซ้ายขวาทั้งสองด้านได้

22 การกำหนดลักษณะของตัวอักษร (ต่อ)
ตัวอักษรมีให้เลือกใช้มากมายหลายรูปแบบ เช่น รูปแบบอักษรที่เหมาะสำหรับข้อความภาษาไทย / อังกฤษ ได้แก่ MS Sans Serif, Microsoft Sans Serif, Thonburi เป็นต้น ส่วนรูปแบบอักษรที่เหมาะสำหรับข้อความภาษาอังกฤษได้แก่ Arial, Helvetica, Sans-Serif เป็นต้น โดยสามารถแสดงรูปแบบของตัวอักษรเป็น AngsanaUPC ที่มีลักษณะเป็น ตัวอักษรธรรมดา ตัวอักษรหนา ตัวอักษรเอียง ตัวอักษรธรรมดาขีดเส้นใต้ ตัวอักษรหนาขีดเส้นใต้ ตัวอักษรเอียงหนา และตัวอักษรเอียงหนาขีดเส้นใต้ และมีขนาดของตัวอักษรให้เลือกใช้ตั้งแต่ 8-72 จุดต่อหนึ่งตัวอักษร (หนึ่งจุดเท่ากับ นิ้ว)

23 ตัวอักษรธรรมดา ตัวอักษรหนา ตัวอักษรเอียง ตัวอักษรธรรมดาขีดเส้นใต้
แสดงตัวอักษร Cordia New ลักษณะต่างๆ

24 แสดงตัวอักษรขนาดต่างๆ
ขนาด 12 จุด ขนาด 66 จุด ขนาด 14 จุด ขนาด 72 จุด ขนาด 16 จุด ขนาด 60 จุด ขนาด 18 จุด ขนาด 20 จุด ขนาด 54 จุด ขนาด 24 จุด ขนาด 48 จุด ขนาด 28 จุด ขนาด 32 จุด ขนาด 44 จุด ขนาด 36 จุด ขนาด 40 จุด แสดงตัวอักษรขนาดต่างๆ

25 โครงสร้างของตัวอักษรภาษาอังกฤษ
แสดงโครงสร้างของตัวอักษรภาษาอังกฤษ Serif คือ เส้นที่กำหนดส่วนบนสุดของตัวอักษร Mean Lineคือ เส้นที่กำหนดความสูงของอักษรตัวพิมพ์เล็ก Base Lineคือ เส้นที่กำหนดขอบล่างของตัวอักษร Point Sizeคือ ช่วงความสูงทั้งหมดที่ตัวอักษรต้องใช้ Cap Heightคือ ความสูงของตัวอักษรตัวพิมพ์ใหญ่ Shoulderคือ ช่องว่างที่เผื่อไว้สำหรับเว้นบรรทัด Set Widthคือ ความกว้างของตัวอักษร X - Height คือ ความสูงของตัวอักษรพิมพ์เล็ก Ascender คือ ส่วนที่เลยเส้น Mean Line ขึ้นไปด้านบน ใช้กับอักษรตัวพิมพ์เล็ก Descender คือ ส่วนที่เลยเส้น Baseline ลงมาด้านล่าง ใช้กับอักษรตัวพิมพ์เล็กเช่นกัน

26 การใช้งานตัวอักษรและรูปแบบตัวอักษรในมัลติมีเดีย
ในการใช้ตัวอักษรที่มีขนาดเล็กจะต้องชัดเจนและอ่านง่าย ข้อความที่ต้องการจะเน้นควรจะมีลักษณะที่แตกต่างจากข้อความธรรมดา เช่น มีการขีดเส้นใต้ ทำเป็นอักษรตัวเอียง หรือตัวหนา เป็นต้น จัดช่องว่างของบรรทัดให้เหมาะสมและอ่านง่าย จัดขนาดของตัวอักษรตามความสำคัญของข้อความ หัวข้อที่ใช้ตัวอักษรขนาดใหญ่ควรมีระยะช่องไฟของตัวอักษรที่ให้ความรู้สึกที่ดี ไม่ติด หรือห่างกันเกินไป จัดสีของข้อความให้อ่านง่าย มีความแตกต่างจากสีของพื้นหลัง เช่น ตัวอักษรสีดำบนพื้นขาว ควรใช้วิธีการ Anti-Aliasing กับหัวข้อที่เป็นอักษรกราฟิกขนาดใหญ่ (อักษรกราฟิกขนาดใหญ่จะมีรอยหยักบริเวณขอบของตัวอักษรเกิดขึ้น การปรับรอยหยักดังกล่าวให้เรียบดูสวยงามเรียกว่า Anti-Aliasing

27 ความแตกต่างระหว่างตัวอักษรแบบธรรมดากับตัวอักษรที่ใช้การขจัดรอยหยัก

28 การใช้งานตัวอักษรและรูปแบบตัวอักษรในมัลติมีเดีย (ต่อ)
หากต้องการจัดข้อความให้อยู่กึ่งกลางบรรทัด ไม่ควรทำติดต่อกันหลายบรรทัดจะดูไม่สวยงาม ในภาษาอังกฤษควรใช้อักษรพิมพ์ใหญ่ และพิมพ์เล็กอย่างเหมาะสม เน้นความน่าสนใจของข้อความด้วยการใส่แสงเงาให้ตัวอักษร หรือวางหัวข้อหลักๆ บนพื้นที่ว่าง ซึ่งเป็นจุดสนใจที่มองเห็นได้อย่างชัดเจน สรรหาข้อคิด คำเสนอแนะ หรือคำติชมจากหลายๆ ความคิดมาสรุปเพื่อเลือกใช้ตัวอักษรที่เหมาะสมที่สุดกับข้อความที่ต้องการ ใช้คำศัพท์ที่มีความหมายน่าสนใจและเข้าใจง่าย เพื่อเชื่อมโยงหัวข้อกับเนื้อความเข้าด้วยกัน ข้อความสำหรับเชื่อมโยงบนหน้าเว็บเพ็จ (Text Link) ควรมีลักษณะตัวอักษรที่เน้นข้อความ เช่น ใส่สีสัน ขีดเส้นใต้ข้อความ และควรหลีกเลี่ยงการเน้นด้วยสีเขียวบนพื้นสีแดง เพราะจะทำให้ตัวอักษรมีสีสันที่ไม่น่าอ่าน เน้นเนื้อความที่เป็นจุดสำคัญด้วยการทำแถบสีที่ข้อความนั้นๆ แต่ไม่ควรให้เหมือน Text Link หรือข้อความบนปุ่มกด (Button)

29 เมนูนำทาง (Menus For Navigation)
การสร้างปฏิสัมพันธ์ด้วยข้อความที่เข้าใจง่าย จะช่วยให้การติดต่อสื่อสารผ่านคอมพิวเตอร์สะดวกและรวดเร็วยิ่งขึ้น เช่น การจัดให้มีข้อความภายในกรอบสี่เหลี่ยมจำนวนสองกรอบ กรอบข้อความแรกเขียนว่า “ไปหน้าถัดไป” และอีกกรอบข้อความที่สองเขียนว่า “ย้อนกลับไปหน้าที่ผ่านมา” ทำให้ผู้ใช้เข้าใจถึงทิศทางที่จะไปได้อย่างถูกวิธี การสร้างรายการให้เลือกบนเมนูควรวางตำแหน่งบนจอภาพให้ง่ายต่อการมองเห็น และน่าสนใจที่จะติดตามข้อมูลต่างๆ ได้อย่างทั่วถึง นอกจากนี้ ควรทำการเชื่อมโยงในแต่ละหน้าให้สัมพันธ์กันและสามารถกลับมาเริ่มต้นที่จอภาพหลักได้

30 ปุ่มกดโต้ตอบ (Button For Interaction)
โปรแกรมที่เป็นเครื่องมือในการสร้างปุ่มกดสำหรับงานมัลติมีเดีย และเอกสาร Html หลายโปรแกรมด้วยกัน สามารถเปลี่ยนสถานะของปุ่มกดตามการทำงานโดยอัตโนมัติ แต่ผู้สร้างงานจะต้องทำการปรับแต่งข้อความบนปุ่มกดให้สัมพันธ์กับการทำงานของปุ่มกดเอง การวางข้อความบนปุ่มกดจะต้องมีขนาดตัวอักษรที่เหมาะสมกับขนาดของปุ่มกด เมื่อวางข้อความแล้ว ต้องมีระยะห่างระหว่างขอบของปุ่มกดกับข้อความที่ไม่กว้างหรือชิดขอบจนเกินไป และสีสันที่ใช้จะต้องมองดูแล้วสบายตา น่าอ่าน และชัดเจน นอกจากนี้การทำปุ่มกดเป็นรูปภาพพร้อมคำอธิบายจะช่วยทำให้ง่ายและมีความน่าสนใจมากยิ่งขึ้น

31 เว็บไซต์ที่มีส่วนประกอบของรายการเลือกนำทางและปุ่มกดโต้ตอบ

32 การจัดวางข้อความสำหรับการอ่าน (Fields For Reading)
จัดวางข้อความสำคัญๆ แต่ละหัวข้อให้อยู่บนจอภาพเดียวกัน แบ่งเนื้อความอธิบายเป็นส่วนๆ แยกย่อยกันไปในแต่ละย่อหน้า ใช้ตัวอักษรที่อ่านง่าย และมีขนาดของตัวอักษรไม่ใหญ่หรือเล็กจนเกินไป เชื่อมโยงความสัมพันธ์ของข้อความให้ง่ายต่อการเข้าถึงข้อมูลที่ต้องการได้อย่างรวดเร็ว

33 การกำหนดรูปแบบของเอกสาร (Format Document)
เอกสารในแนวตั้ง (Portrait Document) เป็นการกำหนดเอกสารหรือกระดาษในแนวตั้งให้มีความสูงมากกว่าความกว้าง ทำให้ไม่สามารถอ่านข้อความภายในเอกสารทั้งหน้ากระดาษบนจอภาพคอมพิวเตอร์ที่มีความละเอียด 640 X 480 พิกเซลได้เอกสารที่จัดวางแบบ Portrait จะเป็นกระดาษขนาด 8.5X11 นิ้ว หรือกระดาษ A4 ซึ่งมีขนาด 8.27 X11.69 นิ้ว ตัวอย่างการพิมพ์เอกสารในแนวตั้ง

34 การกำหนดรูปแบบของเอกสาร (ต่อ)
เอกสารในแนวนอน (Landscape Document) เป็นการกำหนดกระดาษในแนวนอนให้มีขนาดด้านกว้างมากว่า ด้านสูง เทียบได้กับจอภาพคอมพิวเตอร์ทั่วไปที่มีความสูง 480 พิกเซล กว้าง 640 พิกเซล แต่การปรับจอภาพไปที่ความละเอียด 1024 X 768 พิกเซล หรือ 1280 X1024 พิกเซล จะสามรถแสดงเอกสารแบบ Portrait ได้ภายในจอภาพเดียว ตัวอย่างการพิมพ์เอกสารในแนวนอน

35 สัญลักษณ์และภาพสัญลักษณ์ (Symbols And Icon)
การใช้สัญลักษณ์แทนการส่งข้อความเพื่อการติดต่อสื่อสารระหว่างกัน อาจเป็นได้ทั้งภาพนิ่ง ไอคอน หรือภาพเคลื่อนไหว ทั้งนี้เพื่อสร้างจุดสนใจและช่วยให้ง่ายต่อการจดจำ ดังนั้นในการผลิตงานด้านมัลติมีเดียควรจะมีทั้งข้อความและสัญลักษณ์ต่างๆ รวมอยู่ด้วยกันอย่างกลมกลืนและเหมาะสม สัญลักษณ์ในงานด้านมัลติมีเดียจะมีรูปแบบและความหมายประจำตัว ซึ่งบางสัญลักษณ์มีการใช้กันอย่างแพร่หลายจนทุกคนเข้าใจความหมายได้เป็นอย่างดี นอกจากนี้ การศึกษาความหมายของสัญลักษณ์จะใช้ความรู้สึกเข้าใจได้ง่ายกว่าการศึกษาจากภาษาเขียน จากตัวอย่างรูปที่ 5.15 จะแสดงสัญลักษณ์ที่ใช้งานกันบ่อย และคนส่วนใหญ่จะเข้าใจความหมายได้เป็นอย่างดี ส่วนรูปที่ 5.16 แสดงสัญลักษณ์ของเดือนทั้ง 12 ของประเทศทางตะวันตก ซึ่งมีเพียงเฉพาะบางคนบางกลุ่มเท่านั้นที่สามารถแปลความหมายของสัญลักษณ์เหล่านี้ได้ว่า แต่ละภาพหมายถึงเดือนอะไร ในขณะที่คนกลุ่มอื่นอาจไม่เข้าใจความหมายเลยก็ได้

36 แสดงสัญลักษณ์และภาพสัญลักษณ์ (ไอคอน) ที่ใช้ทั่วไป
แสดงสัญลักษณ์ 12 ราศี

37 วัตถุประสงค์ของการใช้งาน
ภาพสัญลักษณ์ วัตถุประสงค์ของการใช้งาน สัญลักษณ์ ความหมาย การติดต่อสื่อสารระหว่างกันบนระบบเครือข่าย :-) ยิ้มธรรมดา ;-) ยิ้มและขยิบตาหนึ่งข้าง :-| แสดงอาการไม่สนใจ :-> อาการกรี๊ดอย่างแรง :-( กำลังหน้าบึ้ง 8-) แสดงอาการตื่นเต้น :-D อาการประหลาดใจ :-/ อาการงง ฉงน การเล่นชมวีดิทัศน์  เล่นเพลง  หยุด  นำแผ่นออก  เล่นเพลงถัดไป  เล่นเพลงก่อนหน้า  กรอไปข้างหน้า  กรอกลับ งานด้านมัลติมีเดียยังมีการใช้งานสัญลักษณ์ไม่มากนัก ซึ่งสัญลักษณ์ที่ถูกนำไปใช้ส่วนใหญ่จะมีความหมายเป็นสากล ดังตัวอย่างในตารางแสดงให้เห็นถึงสัญลักษณ์ในรูปแบบต่างๆ ตามแต่วัตถุประสงค์ของการใช้งาน

38 เครื่องมือสำหรับสร้างและแก้ไขรูปแบบของตัวอักษร
เครื่องมือที่ใช้ในการสร้างรูปแบบและลักษณะของตัวอักษรนั้น จะใช้สำหรับสร้างลักษณะพิเศษที่เป็นเอกลักษณ์เฉพาะของแต่ละงานที่ผลิตหรือสร้างเครื่องหมายการค้า ซึ่งมีมากมายหลายโปรแกรม เช่น ResEdit, Fontographer และ FontMonger เป็นต้น สำหรับใช้งานบนเครื่องแมคอินทอช Type-Designer สำหรับใช้งานบนวินโดว์ และ FontChameleon ที่สามารถใช้งานบนเครื่องแมคอินทอชและระบบปฏิบัติการวินโดว์ได้

39 การออกแบบตัวอักษรด้วยโปรแกรม Fontographer

40 เครื่องมือสำหรับสร้างและแก้ไขรูปแบบของตัวอักษร (ต่อ)
ในการสร้างตัวอักษรให้สวยงาม จะต้องใช้เครื่องมือที่มีความสามารถในการย่อขยาย ปรับเฉดสี ปรับแสงเงา และสามารถปรับขอบของตัวอักษรให้เรียบ ซึ่งการสร้างตัวอักษรด้วยโปรแกรมกราฟิกต่างๆ สามารถเลือกเอารูปแบบอักษรที่โปรแกรมได้จัดเตรียมไว้ มาดัดแปลงใช้งานและปรับปรุงเป็นตัวอักษรกราฟิกที่สวยงามได้ โปรแกรมเกี่ยวกับงานทางด้านกราฟิกมากมาย ตัวอย่างเช่น โปรแกรม Photoshop สำหรับใช้สร้างและปรับแต่งตัวอักษรให้เกิดความสวยงามได้อย่างง่ายดาย ไม่ว่าจะเป็นเรื่องของการจัดแต่งรูปลักษณ์ แสงเงา หรือแม้แต่เฉดสีบนพื้นต่างๆ

41 การปรับแต่งข้อความด้วยโปรแกรม Photoshop

42 เครื่องมือสำหรับสร้างและแก้ไขรูปแบบของตัวอักษร (ต่อ)
ยังมีโปรแกรมสำหรับออกแบบอีกประเภทหนึ่งทีสามารถทำให้ตัวอักษรมีความลึก และมุมมองกระทบของแสงได้หลายทิศทางในลักษณะของภาพ 3 มิติ ได้แก่โปรแกรม Broderbund’s TypeStyler, RayDream’s Adddepth 2, Cool 3d, Vertigo 3d และ Plug-Ins ของโปรแกรม Photoshop เป็นต้น ซึ่งโปรแกรมเหล่านี้นอกจากจะมีคุณสมบัติในการปรับแต่งข้อความหรือตัวอักษรให้เกิดความสวยงามและน่าสนใจมากยิ่งขึ้นแล้วยังได้เพิ่มขีดความสามารถในการปรับแต่งพื้นผิว เฉดสี แสงตกกระทบ และการหมุนรอบได้ทั่วทิศทางได้อีกด้วย เหมาะสำหรับการนำเสนอชิ้นงานที่ต้องการความละเอียดสูงด้านการโฆษณาสินค้าและบริการ หรือจัดทำเป็นสื่อการเรียนการสอนในลักษณะเสมือนจริง (Virtual Reality)

43 แสดงขั้นตอนเริ่มต้นการสร้างตัวอักษรด้วยโปรแกรม COOL 3D

44 การปรับแต่งและแก้ไขตัวอักษรด้วยโปรแกรม COOL 3D

45 ผลลัพธ์ของตัวอักษรที่ได้รับการแก้ไขด้วยโปรแกรม COOL 3D

46 ผลลัพธ์ของตัวอักษรตามรูปแบบเปลวไฟที่เลือกไว้ด้วยโปรแกรม COOL 3D

47 รูปแบบของตัวอักษรที่ใช้บนเว็บ
มีหลากหลายรูปแบบ แต่ที่มักนิยมนำมาประยุกต์ใช้ มีดังนี้ Cascading Style Sheet (Css) Imported Text (Txt) Portable Document Format (Pdf)

48 รูปแบบของตัวอักษรที่ใช้บนเว็บ (ต่อ)
Cascading Style Sheet (Css) เป็นไฟล์ที่เก็บข้อมูลการกำหนดรูปแบบและลักษณะของตัวอักษร (Style Sheet) เพื่อนำมาใช้กับเว็บเพ็จซึ่งเป็นคุณสมบัติใหม่ที่กำหนดขึ้นโดย World Wide Web Consortium ไม่เพียงแต่สามารถที่จะกำหนดรูปแบบอักษรที่มีความสลับซับซ้อนได้มากยิ่งขึ้นแล้ว เช่น ส่วนของหัวเรื่อง หัวข้อ และย่อหน้า เป็นต้น ยังรวมไปถึงความสามารถในการจัดวางในตำแหน่งของรูปแบบตัวอักษรได้อย่างสะดวกและเป็นระเบียบ โดยที่คุณสมบัติของไฟล์ชนิดนี้จะมีนามสกุลเป็น *.Css นอกจากนี้ ยังมีส่วนประกอบหลักสำคัญอยู่ 2 ส่วน ได้แก่ 1) ส่วนที่เป็นตัวเลือก (Selector) หมายถึงส่วนที่อยู่ก่อนหน้าเครื่องหมายวงเล็บเปิด เช่น H1 Color :Red เป็นต้น และ 2) ส่วนที่อยู่ภายใต้เครื่องหมายวงเล็บปีกกา สำหรับรูปแบบในการใช้งานมีดังนี้ Inline Css เป็นการกำหนดรูปแบบและลักษณะของตัวอักษรให้กับข้อความวรรคตอน หรือย่อหน้าโดยเฉพาะ Embeded Css เป็นการกำหนดรูปแบบและลักษณะของตัวอักษรให้กับเว็บเพ็จในแต่ละหน้า Link Css เป็นการกำหนดรูปแบบและลักษณะของตัวอักษรให้กับทั้งเว็บเพ็จทั้งหมด

49 รูปแบบของตัวอักษรที่ใช้บนเว็บ (ต่อ)
Imported Text (Txt) เป็นเท็กซ์ไฟล์ (Text File) ที่นำเข้าข้อมูลมาจากโปรแกรม Editor เช่น โปรแกรม Notepad, Ms-Word หรือ Word Processing เป็นต้น แล้วมาแสดงผลเป็นเว็บเพ็จ

50 รูปแบบของตัวอักษรที่ใช้บนเว็บ (ต่อ)
Portable Document Format (Pdf) เป็นไฟล์เอกสารอิเล็กทรอนิกส์ (Electronic Document) อีกชนิดหนึ่งที่กำลังได้รับความนิยมใช้งานกันอย่างแพร่หลาย ทั้งนี้ เนื่องจากคุณลักษณะที่โดเด่นเฉพาะตัว ได้แก่ สนับสนุนมาตรฐานการบีบอัดข้อมูลต่างๆ เช่น JPEG, CCITT Group 3, CCITT Group4, Flate เป็นต้น ทำให้ไฟล์ชนิดนี้ขนาดเล็กมากเมื่อเปรียบเทียบกับไฟล์เอกสารประเภทประมวลผลคำ (Word Processing) ด้วยกัน รองรับการทำงานร่วมกับระบบปฏิบัติการอื่นๆ ได้อย่างเป็นอิสระ ไม่ว่าจะทำงานอยู่บนระบบวินโดว์ (Windows) ระบบแมคอินทอซ (Macintosh) หรือแม้แต่บนระบบยูนิกส์ (Unix) ก็ตาม สามารถแปลงรูปภาพ ข้อความ หรือแม้แต่วีดีโอให้อยู่ในรูปแบบเอกสารอิเล็กทรอนิกส์ (.Pdf) ได้เหมือนต้นฉบับจริง นอกจากนี้ ยังสามารถเปิดอ่านไฟล์เหล่านี้ผ่านทางเว็บบราวเซอร์บนเครือข่ายอินเทอร์เน็ตหรืออินทราเน็ตได้อย่างไม่มีปัญหาใดๆ

51 ให้นักศึกษาทำ workshop1

52 Thank you…