Easyhome 2010
KruMontree.com
Basic HTML Navigation Bar

 

Basic HTML Menu
What is HTML?
Basic HTML files
Text & Background Color
Images
Table
Link
Set Thai
Stylesheet

 

 
ADS 250x250
 
ADS_250

HTML Header
Millen ทำโฮมเพจให้อ่านภาษาไทยได้ในทุกบราวเซอร์

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

ตามคาดครับเมล์เข้ามากันตรึมว่า "อ่านภาษาไทยไม่ออก" เอ๊ะ! ก็เราทดสอบแล้วนี่นา ว่าอ่านได้ด้วยบราวเซอร์ตัวเก่งของเรา แล้วบราวเซอร์อื่น ๆ เหตุไฉนมันเป็นอักษรขอมหมดล่ะนี่ มันเป็นเรื่องที่น่าปวดร้าวมากครับ

เรามาดูปัญหาและวิธีการแก้ไขกัน

  • ถ้าคุณใช้โปรแกรมสำเร็จรูปสร้างโฮมเพจ ไม่ว่าจะเป็น MS Frontpage 98 หรือ Netscape Composer หรือโปรแกรม ประเภท WYSIWYG อื่น ๆ สร้างโฮมเพจให้คุณสังเกตดูว่ามี Tag คำสั่ง ดังบรรทัดข้างล่างต่อไปนี้ หรือไม่ ?
    1) <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    2) <meta http-equiv="Content-Type" content="text/html; charset=TIS-620">
    3) <meta http-equiv="Content-Type" content="text/html; charset=x-user-defined">
    • บรรทัดที่ 1-2 จะพบได้จากการใช้ FrontPage 98 สร้าง
    • บรรทัดที่ 3 จะพบได้จากการใช้ Netscape Composer สร้าง

ในบรรทัดที่ 1 จะอ่านภาษาไทยไม่ออกในบราวเซอร์ Netscape ส่วนบรรทัดที่ 3 จะ อ่านภาษาไทยใน Internet Explorer ไม่ได้ครับ

เพราะจะเป็นการกำหนดให้บราวเซอร์ต้องใช้ Font Code ที่ตรงกับที่ระบุไว้ใน Tag เท่านั้น จึงไม่เหมาะกับการแสดงผลเป็นภาษาไทย วิธีแก้ปัญหา ให้ลบบรรทัดที่ 1 และ 3 ทิ้งไปเลยครับ ในปัจจุบันได้มีการกำหนดรหัสฟอนต์ภาษาไทยให้ใช้กันแล้วและบราวเซอร์ใหม่ๆ ก็สามารถแสดงผลได้ถูกต้องคือ

<meta http-equiv="Content-Type" content="text/html; charset=TIS-620">
  • การกำหนดรูปแบบฟอนต์การแสดงผลในเว็บบราวเซอร์ด้วยคำสั่ง
    <BODY FONTFACE="ชื่อฟอนต์ที่ต้องการ (ใส่ได้หลายตัว) ">
    เป็นคำสั่งบังคับให้บราวเซอร์แสดงข้อความด้วยฟอนต์ตัวอักษรที่กำหนดไว้ คำสั่งนี้จะมี หรือไม่ก็ได้ครับ แนะนำให้ใส่ฟอนต์หลายๆ ตัวให้ครอบคลุมฟอนต์ระบบไว้ด้วย (รายละเอียดมีข้างล่าง)

ถ้าต้องการให้มีในไซต์ของคุณ สิ่งที่ผมอยากจะแนะนำให้กับมือใหม่ทั้งหลายได้ทราบ ก็คือ เรื่องของการแสดงผลเป็นภาษาไทย เพราะโปรแกรมใช้สร้างโฮมเพจส่วนใหญ่จะเหมาะกับ การแสดงอักขระภาษาอังกฤษมากกว่า บางโปรแกรมที่มีคุณสมบัติ WYSIWYG (What You See Is What You Get) เมื่อเขียนเสร็จแล้ว ถ้าต้องการแก้ไขในโปรแกรม Notepad หรือ Text editor อื่น ๆ จะอ่านอักขระภาษาไทยไม่ออก ทำให้การแก้ไขทำได้ลำบากครับ แต่ถ้าคุณใช้ Home Site 4.5 หรือ HTML Assistant จะไม่เกิดปัญหานี้เลยครับ

การแสดงผลภาษาไทยในบราวเซอร์ก็เป็นอีกปัญหาหนึ่งที่ควรคำนึงครับ เพราะเราไม่ สามารถทราบได้ว่า นักท่องเว็บแต่ละคนใช้เครื่อง PC หรือ Mac และมีฟอนต์ตัวอักษรภาษาไทย ตัวใดบ้างอยู่ภายในเครื่อง การที่เราจะกำหนด Font Face ของอักษรไว้เป็นการเฉพาะตัวใดตัวหนึ่ง จึงมักจะทำให้ผู้ชมเว็บของเราอ่านภาษาไทยไม่ออก ถ้าจะให้ดีควรกำหนด ให้เป็นกลาง ๆ ไว้ดีที่สุด

รูปแบบอักษรกำหนดไว้ใน tag body ดังตัวอย่างข้างล่างนี้ จะได้ผลดีทีเดียวกับการชม ในทุกๆ บราวเซอร์

<BODY FONT FACE="Thonburi, CordiaUPC, EucrosiaUPC, LilyUPC, AngsanaUPC, FixedDB ThaiText New, DB ThaiTextFixed, MS Sans Serif " >

เพราะคำสั่ง Font Face นี้ จะสามารถทำให้ผู้เข้าชมเว็บเพจของเราอ่านภาษา ไทยได้ โดยการเรียกเอา Font ในเครื่องของผู้ใช้ที่เข้ามาชมเว็บไซต์ของเราออกมาใช้ จะค้นหา Font เรียง ตามลำดับที่เราเขียนไว้ ถ้าไม่พบก็จะไปใช้ฟอนต์ตามคำสั่งของผู้ชมที่กำหนดไว้ในบราวเซอร์ใน ส่วนของ View > Encoding > User define ต่อไป

ทำไมจึงต้องเรียง Font แบบนี้ ???

รูปแบบการเรียง Font ตามลำดับนี้ได้มาจาก อาจารย์ศุภชัย (ของเพื่อนพ้องชาวเน็ตใน pantip.com ยุคก่อน เพราะตอนหลังหายหน้าหายตาไปเลย ยังคิดถึงอยู่ครับ) ต้องขอขอบคุณอีกครั้งหนึ่ง มีรายละเอียดดังนี้ ครับ

  • สำหรับ ผู้ใช้ Mac และติดตั้ง System Thai ไว้ ส่วนใหญ่ จะมี Thonburi Font ดังนั้นเมื่อเข้า มาชม ก็จะพบ Thonburi ทันที ก็จะแสดงผลเป็นภาษาไทยได้เลย
  • สำหรับ ผู้ใช้ Mac และ ไม่ได้ ติดตั้ง System Thai ไว้ก็จะผ่านไปดู Font ตัวถัด ๆ ไปซึ่งเป็น Font ที่ไม่มีอยู่ใน Mac ดังนั้น ก็จะผ่านไปจนหมดครับและก็จะไปใช้ฟอนต์ตามที่เจ้าของ เครื่องกำหนด ให้กับ Browser ครับ (คือ Font ที่คุณบังคับไว้ใน source code ก็จะไม่มีผล ไปเลย เพราะตกเวทีไปหมดครับ)
  • สำหรับ ผู้ใช้ Windows 95 Thai ** ที่ไม่ได้ ติดตั้ง Font ใด ๆ เพิ่มเป็นพิเศษ ** ก็จะมองผ่าน Thonburi ไปเพราะว่าใน Win95 Thai ไม่มี Font นี้แน่ ๆ รวมถึงจะมองผ่าน FixedDB Thai Text New, DB ThaiTextFixed ไปด้วย เพราะว่าใน Win95 Thai ปกติไม่มี Font นี้จน ไปถึง MS Sans Serif ซึ่งเขียนดักไว้ตัวสุดท้าย ก็จะแสดงภาษาไทยได้ Font MS Sans Serif นี้เป็น Font ที่มีมากับ Windows ทุกรุ่นอยู่แล้วครับ เป็น Font ที่ตามปกติ แล้วจะใช้ในการแสดงชื่อ Icon ต่าง ๆ และจะแสดงภาษาไทยได้ หากเป็น Thai edition (MS ย่อมาจาก Microsoft)
  • สำหรับ ผู้ใช้ Windows 95 English Edition (US Edition) *** ที่ติดตั้ง Thai Master *** ก็วิเคราะห์ได้ เช่นเดียวกันกับ กรณีของ Win 95 Thai Edition ครับ คือ จะผ่านไปถึงฟอนต์ MS Sans Serif
  • สำหรับ Windows 3.11 Thai Edition ก็วิเคราะห์ ได้เช่นเดียวกันกับ Windows 95 Thai Edition ครับ ก็คือ ผ่านไป MS Sans Serif เช่นเดียวกัน
  • สำหรับ Windows 95 ไม่ว่าจะ Thai Edition หรือ US Edition *** ที่ได้ติดตั้ง Font FixedDB ThaiText New, DB ThaiTextFixed ของคุณหมอสมนึก *** ก็จะมองผ่านฟอนต์ Thonburi และไปเจอฟอนต์ FixedDB ThaiText New, DB ThaiTextFixed (ตามลำดับ ว่าลง Font ใด ใน 2 Font นี้) และก็จะนำมาใช้แสดงให้อ่านไทยได้เลย
  • สำหรับ Windows 98 ที่ลงโปรแกรม ThaiMaster ก็จะวิเคราะห์ได้เช่นเดียวกับตัว Windows 95 ที่ลง ThaiMaster ก็คือ จะมาตกที่ใช้ MS Sans Serif และอ่านภาษาไทยได้ครับ

จะเห็นได้ว่าถ้าคุณกำหนดด้วยรูปแบบ font face="ชื่อฟอนท์ลงท้ายด้วย UPC หรือ NEW" เพียงตัวใดตัวหนึ่งเพียงตัวเดียวจะเกิดปัญหากับคนที่ใช้ Windows ที่ไม่ใช่ Thai Edition ครับ เพราะจะไม่มีฟอนต์เหล่านี้ในระบบแน่นอน จึงอ่านภาษาไทยไม่ได้ ต้องระวังให้มากครับ

เนื่องจากในปัจจุบันนี้ได้มีการนำเอาการควบคุมการแสดงผลด้วย Stylesheet มาใช้กันมากขึ้น เพราะมีข้อดีมี่สามารถระบุไว้ที่ส่วนหัวของไฟล์เพียงที่เดียว เพื่อให้ครอบคลุมการแสดงผลในทุกส่วน หรืออาจจะสร้างเป็นไฟล์แยกต่างหากแล้วจัดเก็บในรูปไฟล์สกุล *.css แล้วเขียนคำสั่งให้เรียกไฟล์นี้มาใช้งานอีกที จะทำให้ขนาดของไฟล์ HTML มีขนาดเล็กลง และเมื่อมีการแก้ไขเปลี่ยนแปลง Stylesheet ในภายหลังเพียงไฟล์เดียวก็จะมีผลการเปลี่ยนแปลงกับทุกๆ ไฟล์ที่เรียกใช้ Stylesheet นี้ทันทีเลย ดูตัวอย่างไฟล์ Stylesheet   >>คลิกที่นี่<<

กรุงโรมไม่ได้สร้างวันเดียว บ้านคุณและบ้านผมก็สร้างหลายวันเหมือนกันครับ
ขอให้กำลังใจ อย่าพึ่งละความพยายามครับ

Top

 

red line
Home | What's new? | Basic HTML | Reviews Programs | Tip&Tricks | Download | Site Map
red line

 

Home Basic HTML Review Software More Tip & Tricks Download Software Site Map