Your SlideShare is downloading. ×
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร

21,180

Published on

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
21,180
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
99
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. บทที่ 5 ตัวอักษรและรูปแบบตัวอักษร ( Character and Fonts )
  • 2. ขอบเขตการบรรยาย
    • เรื่องทั่วไปเกี่ยวกับตัวอักษรและชุดอักษร
    • มาตรฐานของตัวอักษร
    • รูปแบบและลักษณะของตัวอักษร
    • การใช้งานตัวอักษรและรูปแบบตัวอักษรใน Multimedia
    • เครื่องมือสำหรับสร้างและแก้ไขรูปแบบของตัวอักษร
    • รูปแบบของตัวอักษรที่ใช้บน Web
  • 3. เรื่องทั่วไปเกี่ยวกับตัวอักษรและชุดตัวอักษร
    • ในอดีตสังคมของมนุษย์ ได้มีการใช้ข้อความหรือตัวอักษรเป็นภาษาสื่อกลางติดต่อระหว่างกันโดยผ่านการอ่านหรือบันทึกเรื่องราวต่างๆ ต่อมาได้มีการนำตัวอักษรมาประยุกต์ใช้ร่วมกับคอมพิวเตอร์ด้วยกระบวนการเรียบเรียง ประมวลผล และนำมาใช้งาน ในการจัดทำสื่อสิงพิมพ์และโฆษณาต่างๆ เช่น รายงาน โบชัวร์ แบบฟอร์ม หนังสือ และพจนานุกรม เป็นต้น หรือแม้แต่การสื่อสารด้วยข้อความที่เป็นเท็กซ์ ( Text Messaging ) และเผยแพร่ผ่านระบบเครือข่ายอินเตอร์เน็ตในรูปแบบภาษาเอ็ชทีเอ็มแอล ( HTML:Hypertext Markup Language ) ซึ่งปัจจุบันกำลังได้รับความนิยมใช้งานอย่างแพร่หลาย
  • 4. แสดงข้อความหรือตัวอักษรที่นำมาประยุกต์ใช้ในรูปแบบเท็กซ์ สำหรับใช้ติดต่อสื่อสาร
  • 5. ภาพแสดงกลไกการทำงานของภาษา HTML ที่เป็นรูปแบบมาตรฐาน
  • 6.
    • ในการติดต่อสื่อสารข้อมูล มักจะเกิดปัญหาเกี่ยวกับตัวอักษรหรือข้อความที่ปลายทางไม่สามารถแสดงผลได้อย่างถูกต้อง ทั้งนี้เนื่องจากรูปแบบและคุณลักษณะของตัวอักษรมีความแตกต่างกันนั้นเอง เพื่อเป็นการแก้ไขปัญหาเป็นในแนวทางเดียวกันได้อย่างมีประสิทธิผล จึงมีการกำหนดมาตราฐานของตัวอักษรขึ้น โดยแบ่งมาตราฐานตัวอักษรออกเป็น 2 ชนิด คือ
    • แอสกี ( ASCII ) และยูนิโค้ด (Unicode)
    มาตรฐาน ( Standard ) ของตัวอักษร
  • 7.
    • แอสกี ( ASCII ย่อมาจาก American Standard Code for Information Interchange) พัฒนาเมื่อ ค . ศ . 1970 แอสกี เป็นรหัสขนาด 7 บิต รองรับตัวอักษร ( a-z ทั้งตัวพิมพ์เล็กตัวพิมพ์ใหญ่ ) ตัวเลข (0-9) และ สัญลักษณ์พิเศษต่างๆ ได้ 128 รหัส ( Code Point ) ประกอบขึ้นด้วยตัว 95 ตัวอักษร มีค่าแบ่งเป็น 0-31 และ 0-127 รหัสแอสกีพัฒนาขึ้นมาเพื่อรองรับภาษาอังกฤษ ซึ่งมีการใช้งานอย่างแพร่หลาย
    • ในการใช้งาน ข้อมูล 1 byte = 8 bits ระบบจะใช้ 1 bit เป็น Parity Bit เพื่อตรวจสอบ ( Odd/Even Parity Checking)
    แอสกี ( ASCII )
  • 8. แสดงตารางรหัส ASCII
  • 9. ยูนิโค้ด ( Unicode ) ยูนิโค้ดเป็นรหัสที่พัฒนาขึ้นเพื่อใช้งานที่เป็นสากล โดยองค์กรกำหนดมาตรฐานสากล ( ISO: International Organization for Standardization) เนื่องจากคอมพิวเตอร์ในปัจจุบันได้มีผู้ใช้งานหลายชนชาติ โดยผู้พัฒนาคือองค์กรมาตราฐานสากลหรือไอเอสโอ เพื่อรองรับตัวอักษรและสัญลักษณ์ต่าง ๆ ของแต่ละภาษา ตัวอย่างเช่น Code Point เป็นต้น เช่น CJK เป็นมาตรฐาน Unicode ของ 3 ประเทศ คือ Chinese , Japan , Korean
  • 10. แสดงยูนิโค้ด ( Unicode ) ของตัวอักษรภาษาไทย น 86
  • 11.
    • สามารถจัดแบ่งได้เป็น 3 ระดับ ได้แก่
    • ประเภท ( Category)
    • 1. Serif: อักษรจะมีเส้นคล้ายๆ ขีด - เหลี่ยม
    • 2. Sans-Serif: มีรูปร่างมนกลม และดูสวยงาม
    • 3. Monospaced: บางครั้งเรียกว่า Typewriter Font เนื่องจากเป็นตัวอักษรที่ใกล้เคียงกับเครื่องพิมพ์ดีด
    • 4. Script: เป็นแหล่งรวบรวมของแบบอักษรทุกชนิดที่มีลักษณะพิเศษต่างๆ
    5.3 รูปแบบและลักษณะของตัวอักษร
  • 12. รูปแบบและลักษณะของตัวอักษร
    • ตระกูล ( Family)
      • เป็นหมวดที่ย่อยลงไปจาก Category แต่ตัวอักษรที่อยู่ในตระกูลเดียวกัน จะมีบรรพบรุษร่วมกันดังตาราง
    แสดงความสัมพันธ์ระหว่าง Category และ Family Whimsy, Arribal, Bergell Decorative Courier , Courier New Monospaced Helvetica, Arial, Verdana Sans-Serif Times, Century Schoolbook, Garamond Serif Family Category
  • 13. รูปแบบและลักษณะของตัวอักษร
    • ชื่อเฉพาะ (Face)
      • เป็นตัวอักษรที่สามารถแสดงความสัมพันธ์ระหว่าง Family และ Face ที่เราพบเห็นบ่อยๆ ดังตาราง
    แสดงความสัมพันธ์ระหว่าง Family และ Face Regular, Bold Whimsy Regular, Oblique Courier Regular, Bold, Italic Arial Roman, Italic Times Face Family
  • 14. รูปแบบและลักษณะของตัวอักษร
    • การจัดวางตำแหน่ง (Alignment)
    • เป็นการกำหนดวิธีการเรียงของตัวอักษรหรือข้อความในแต่ละย่อหน้า ว่าต้องการให้ชิดซ้าย หรือชิดขวา หรือตำแหน่งอื่นๆ
    • เส้นขอบ (Borders)
    • เป็นการกำหนดขอบส้นว่าต้องการลักษณะแบบใด
    • ขนาดของตัวอักษร (Font Size)
  • 15. รูปแบบและลักษณะของตัวอักษร
    • สี (Colors)
    • ตัวอักษรหรือข้อความ (Text)
    แสดงโครงสร้างตัวอักษรภาษาอังกฤษ
  • 16.  
  • 17. 5.4 การใช้งานตัวอักษรและรูปแบบตัวอักษรในมัลติมีเดีย
    • มีวิธีการดังนี้
      • ตัวอักษรเล็กเมื่อใช้ต้องชัดเจน
      • ข้อความที่เน้นต้องแตกต่างจากข้อความอื่น
      • จัดช่องว่างบรรทัดให้เหมาะสม อ่านง่าย
      • จัดขนาดตัวอักษรตามความสำคัญของข้อความ
      • หัวข้อที่ใช้ตัวอักษรขนาดใหญ่ต้องเว้นช่องไฟให้รู้สึกไม่ติดขัด
      • จัดสีข้อความให้อ่านง่าย
      • ควรใช้วิธีการ Anti-aliasing กับหัวข้อที่เป็นอักษรกราฟฟิกขนาดใหญ่
  • 18. การนำรูปแบบตัวอักษรมาประยุกต์ใช้ในมัลติมีเดีย
    • เมนูนำทาง ( Menus for Navigation )
    • เป็นการสร้างรายการให้เลือกแบบเมนูควรวางตำแหน่งบนจอภาพให้ง่ายต่อการมองเห็นและน่าสนใจ และควรทำการเชื่อมโยงในแต่ละหน้าให้สัมพันธ์กันและสามารถกลับมาเริ่มต้นที่จอภาพหลักได้
    • ปุ่มกดโต้ตอบ ( Button for Interaction )
      • ปุ่มกด ( Button ) เป็นกล่องข้อความแบบ 3 มิติสำหรับสร้างเหตุการณ์ใดเหตุการณ์หนึ่งเมื่อคลิกเมาส์ที่ปุ่มกด การออกแบบบนเว็บนั้น ข้อความและกราฟฟิกสามารถใช้เป็นปุ่มกดได้
  • 19. แสดงตัวอย่างเว็บไซต์ที่มีส่วนประกอบของ Menus for Navigation และ Button for Interaction
  • 20.
    • การจัดวางข้อความสำหรับการอ่าน ( Field for Reading )
      • จัดวางข้อความที่สำคัญๆ แต่ละหัวข้อให้อยู่ในจอภาพเดียวกัน
      • แบ่งเนื้อความอธิบายเป็นส่วนๆ แยกย่อยกันไปแต่ละย่อหน้า
      • ใช้ตัวอักษรที่อ่านง่าย
      • เชื่อมโยงความสัมพันธ์ของข้อความให้ง่ายต่อการเข้าถึงข้อมูล
    • การกำหนดรูปแบบของเอกสาร ( Format Document )
      • การกำหนดรูปแบบของเอกสารสามารถจัดทำได้ทั้งที่เป็นแบบแนวตั้ง
      • ( Portrait ) และแบบแนวนอน (Landscape) เพื่อประโยชน์สำหรับการพิมพ์ออก
      • ทางเครื่องพิมพ์ และการจัดทำเอกสารให้อยู่ในรูปแบบไฟล์เอกสาร
      • อิเล็กทรอนิกส์ เป็นต้น
  • 21.
    • เอกสารภาษา HTML
    • เอกสารภาษา HTML จะเป็นการนำข้อความหรือตัวอักษรใส่ลงไปในแต่ละหน้าเอกสาร ( Web Page) โดยเรียกหน้าแรกว่า Home Page รวมเรียกว่า Web Site
    แสดงข้อความด้วยภาษา HTML Notepad
  • 22.
    • สัญลักษณ์และภาพสัญลักษณ์ ( Symbols and Icons)
    • สัญลักษณ์เป็นการสร้างภาพแทนข้อความต่างๆ
    แสดงสัญลักษณ์ในรูปแบบต่างๆ ตามวัตถุประสงค์การใช้งาน
  • 23. 5.5 เครื่องมือสำหรับสร้างและแก้ไขรูปแบบของตัวอักษร
    • ปัจจุบันมีเครื่องมือสำหรับสร้างและแก้ไขตัวอักษรโดยเฉพาะมากมายให้เลือกตามความเหมาะสม
    แสดงการปรับแต่งข้อความด้วยโปรแกรม Photoshop
  • 24. 5.6 รูปแบบของตัวอักษรที่ใช้บนเว็บ
    • Cascading Style Sheet(CSS) มีรูปแบบการใช้งาน ดังนี้
      • Inline CSS การกำหนดรูปแบบของตัวอักษรให้กับข้อความวรรคตอน ย่อหน้า
      • Embeded CSS การกำหนดรูปแบบของตัวอักษรให้กับเว็บเพจในแต่ละหน้า
      • Link CSS การกำหนดรูปแบบของตัวอักษรให้กับเว็บเพจทั้งหมด
    • Imported Text(Txt) เป็นเท็กซ์ไฟล์ที่นำเข้าข้อมูลมาจากโปรแกรม Editor เช่น NotePad
    • Portable Document Format (PDF) เป็นไฟล์เอกสารอิเล็กทรอนิกส์ คุณลักษณะที่โดดเด่น สนับสนุนมาตรฐานการบีบอัดข้อมูลต่างๆ
        • รองรับการทำงานร่วมกับระบบปฏิบัติการอื่นๆ ได้อย่างเป็นอิสระ
        • สามารถแปลงรูปภาพ ข้อความให้อยู่ในรูปแบบเอกสารอิเล็กทรอนิกส์ ( .pdf )
        • ได้เหมือนต้นฉบับจริง

×