ต้องบอกก่อนว่า อันที่จริงแล้ว ตัวผม ก็ไม่ได้เก่งขนาดจะมาเล่าให้ใครฟัง ก็ยังคงมั่วๆ ยังคงจับฉ่าย ?ครูพักลักจำมาเรื่อยๆ ดังนั้นในบทความนี้จะมีการ อ้างอิง บุคคลที่ 3 ซึ่ง เมพๆ และ Ref ซะเยอะหน่อยเรียกว่า เอามาแชร์ ก็แล้วกันนะครับ?

ชื่อหัวข้อก็บอกแล้วว่า Typeface in iOS แต่ก่อนอื่น เราก็ต้องมารู้ก่อนว่า Typeface สำคัญไฉน??

ผมจะอ้างอิงจากหนังสือเล่มนี้แล้วกัน อาจจะเก่าไปหน่อย แต่ก็จัดได้ว่าเป็นหนังสือ Graphic ภาษาไทยที่เนื้อหาค่อนข้างแน่นเลยทีเดียว

แรกเริ่มเดิมที ตัวอักษรมีบทบาทในงานสิ่งพิมพ์เป็นหลัก แต่ในปัจจุบัน งานออกแบบแทบทุกชนิดต้องใช้ตัวหนังสือเป็นองค์ประกอบในภาพที่จัดวางได้อย่างลงตัว ตัวหนังสือจึงมีอิทธิพลต่อความสวยงามมาก งานกราฟิกบางชิ้นอาศัยแค่รูปถายสวยๆ รูปเดียว แล้วโปรยตัวหนังสือที่เข้ากันลงไปเท่านั้นก็จบ งานออกมาดูดี
– โสรชัย นันวัชรวิบูลย์

เรียกได้ว่า ตัวอักษร ก็เป็นสิ่งที่สำคัญไม่แพ้องค์ประกอบอื่นๆเลยทีเดียว ดังจะเห็นว่า เวบต่างชาติยุคนี้ ให้ความสำคัญกับ Typography มากเป็นพิเศษ ขนาดที่ว่า บางเว็บไซต์มีแต่ Text สวยๆเลยก็ว่าได้ ดังเช่นเว็บต่อไปนี้?

Finch

HUGE

Benny Roth

polargold

Carsonified

Academy

เห็นแล้ว ก็คงอยากจะได้บ้างใช่ไหมล่ะ? แต่ Web ที่ยกตัวอย่างมาให้ดูเนี่ย Typeface แปลกตาทั้งนั้นเลย ครั้นจะยัดรูปภาพก็ลงไปแบบเขาก็คงไม่ไหว เพราะขึ้นชื่อว่า Smart Phone แล้ว 3G ไทยเรายังไม่บูมขนาดเมืองนอก EDGE Internet ของบ้านเราวิ่งไม่ถึง 256k ดังนั้นถ้ายัดรูปภาพลงไปก็ลองนึกดูว่า นานแค่ไหนกว่าจะโหลดเสร็จ เผลอๆนานจนเขาปิดหน้าต่างทิ้งเลยดีกว่า งั้นถ้าข้อจำกัดคือ Internet ทำให้การใส่รูปภาพ ไม่เวิค งั้นลองมาดู typeface ที่มีอยู่น้อยนิดใน iOS กันดีกว่าครับ iOS มีฟอนต์ที่มากับตัวเครื่อง (ที่ไม่ได้แหกคุก) แค่ 57 แบบใน iPad และ 40 แบบใน iPhone (iOS 4.3) แต่ถ้าเรารู้จัก และเลือกเอามาใช้ได้ ก็จะทำให้หน้า Website สำหรับ Smart Phone สวยขึ้นได้

(Source: iOS Fonts)

ซึ่ง Font List ใน iOS ก็ค่อนข้างจะครบทุก Style ทั้ง Serif, Sans-serif, Slab-serif, Script, Decorative, Typewriter หรือแม้แต่ Symbol ก็มี?ทั้งนี้ Font ยอดฮิตหลายๆตัวก็รวมอยู่ในนี้แล้ว ทั้ง Helvetica, Gill sans หรือ Futura ?สำหรับ Sans-serif และ Georgia, Times New Roman สำหรับ Serif หรือแม้แต่ American Typewriter ก็มีอยู่ใน iOS ส่วน Font ภาษาไทยก็มีอยู่ 1 Family คือ Thonburi มี 2 น้ำหนักคือ Regular และ Bold?!!

แต่ถ้าหาก Font ที่มากับ iOS มันยังไม่พอล่ะ?

ต้องบอกก่อนว่า แนวทางที่ผมเอามาเสนอเนี่ย จะเน้นตัวอักษรมากกว่า รูปภาพ ดังนั้น ถ้า Font ที่มากับ iOS มันยังไม่พอ เราก็ ฝังฟอนต์เพิ่มไปกับ Website เราเองเลยแล้วกัน! ซึ่งทั้งนี้ ถ้าเป็น Font ภาษาอังกฤษ ก็ค่อนข้างง่ายหน่อย เพราะมีเว็บที่ให้บริการ Web Font แบบ @font-face มากมาย อาทิเช่น?

Typekit

Fonts.com Web Fonts

แต่ถ้าเป็น Font ภาษาไทย จะลำบากหน่อย เพราะต้องมาทำ @font-face เอง แต่ก็ไม่ยาก ด้วยบริการของ Font Squirrel | Font Generator ซึ่งจะเปลี่ยน Font ประเภท TrueType ของคุณให้สามารถใช้งานบนเว็บไซต์ได้อย่างง่ายดายเพียงไม่กี่คลิก!

วิธีการก็คือ อัพโหลด Font ที่ต้องการขึ้นไป แล้วเซตค่าดังนี้

• เลือก Expert เพื่อให้มี Options อื่นๆขึ้นมา
• Font formats เลือกอะไรก็ตาม แต่ห้ามลืม SVG สำหรับ iOS
• Protection ให้เลือก WebOnly? เพื่อทำให้ font ใช้ได้เฉพาะบนเว็บเท่านั้น
• เลือก Subsetting เป็น Custom subsetting
• เซ็ต Unicode Ranges เป็น 0E01-0E5B

ดูภาพประกอบวิธีการเซ็ตค่า ? สาเหตุที่ต้องมีการ Custom subsetting ก็เพราะว่า ภาษาไทยเราไม่ได้อยู่ใน Unicode Ranges มาตรฐานของโลกอย่างภาษาอังกฤษ ดังนั้น การเซ็ตค่าดังกล่าวก็เพื่อให้สามารถใช้งานภาษาไทยได้ เมื่อกระบวนการเสร็จสิ้นจะได้ไฟล์ Zip ขึ้นมาหนึ่งไฟล์ ประกอบด้วย ไฟล์ต่างๆมากมาย เราก็แค่เอาไปวางบน Hosting และ Link Stylesheet กับเว็บไซต์เราและเขียน Stylesheet ตามปกติ

ข้อควรระวังก็คือ ลิขสิทธิ์ font ภาษาไทยส่วนมากไม่ได้รวมถึงการใช้บนสื่อ Website ดังนั้นก่อนจะเลือกใช้ Font ควรดู License ก่อนทุกครั้ง หรือ เลือกใช้ Font ฟรีคุณภาพจาก f0nt.com ส่วนตัวอย่างเลือกใช้ฟอนต์ Inseedang จาก โรจ สยามรวย

เพียงเท่านี้ก็จะได้หน้า Mobile Page ที่สวยงามไม่ว่าจะเป็นตัวอักษรภาษาอะไร และในขณะเดียวกันก็โหลดได้รวดเร็วเพราะไม่ได้ใช้ Image Replace แบบเก่าๆแล้วล่ะครับ?

ปล. ไม่เคยคิดว่าตัวเองจะเขียน Article ได้มีสาระ และยาวขนาดนี้มาก่อน