ข้อแนะนำนี้จัดทำขึ้นมาเพื่อให้การพัฒนาเว็บไซต์
โดยเฉพาะเว็บไซต์ที่นำเสนอเอกสารเป็นภาษาไทย
ซึ่งมักจะเกิดปัญหาด้านการแสดงผลภาษาไทยผ่านเบราเซอร์ค่ายต่างๆ
มีระบบและมาตรฐานเดียวกัน
ชื่อของเอกสารเว็บ
เอกสารเว็บทุกไฟล์ ควรมีการกำหนดชื่อเอกสาร ไว้ในส่วนของแท็ก <TITLE>
.</TITLE>
โดยชื่อที่กำหนดขึ้นมานี้ จะเป็นภาษาไทย หรือภาษาอังกฤษก็ได้
แต่ควรมีความหมายอธิบายถึง ภาพรวมของเว็บเพจนั้นๆ ให้ได้มากที่สุด
เนื่องจากข้อความส่วนนี้ จะเป็นข้อความที่จะถูกนำมาใช้เป็นคำสำคัญ (Keyword)
ในการสืบค้นข้อมูลจาก Search Engine ด้วยเช่น เช่น
ชื่อเอกสารเว็บของโครงการคลังข้อมูลอิเล็กทรอนิกส์ของเครือข่าย
SchoolNet สามารถกำหนดชื่อของเอกสารเว็บได้ดังนี้
<TITLE> Digital Library for Thai SchoolNet </TITLE>
คีย์เวิร์ดของเว็บเพจ
เว็บไซต์ที่นำเสนอในเครือข่ายอินเทอร์เน็ต
ย่อมต้องการให้เป็นที่รู้จักกันอย่างแพร่หลาย โดยเฉพาะเว็บไซต์ท่า (Search
Engine Website) ชั้นนำ เช่น Yahoo, Google, SiamGuru
วิธีหนึ่งที่จะช่วยให้เว็บไซต์ท่ารู้จักเว็บไซต์ที่พัฒนาขึ้นมา
คือการกำหนดคีย์เวิร์ดให้กับเว็บเพจนั้นๆ โดยใช้แท็ก
<META NAME = "Keyword" CONTENT = "คีย์เวิร์ด 1, คีย์เวิร์ด 2,
">
คีย์เวิร์ดที่กำหนดขึ้นมานี้ สามารถกำหนดได้ทั้งภาษาไทย และภาษาอังกฤษ
สามารถกำหนดคีย์เวิร์ดได้มากกว่า 1 ตัว
โดยเขียนคั่นด้วยเครื่องหมายจุลภาค (,) เช่น
<META NAME = "Keyword" CONTENT = "การศึกษา, ประเทศไทย, Education,
Thailand">
การควบคุมการเข้ารหัสภาษาไทย << >>
ปัจจุบันเบราเซอร์แต่ละตัว
จะตรวจสอบการแสดงผลภาษาด้วยค่าการเข้ารหัสภาษา (Character Set)
และหากเอกสารใด กำหนดค่าผิดพลาด หรือไม่กำหนด อาจจะทำให้โปรแกรมเบราเซอร์แปลความหมายผิดพลาด
และแสดงผลภาษาผ่านเบราเซอร์ไม่ถูกต้อง
ดังนั้นเพื่อให้การแสดงผลภาษาไทยผ่านเบราเซอร์ต่างๆ
แสดงผลได้อย่างถูกต้อง ควรกำหนดค่าการเข้ารหัสภาษาไทยสำหรับเอกสารเว็บ
ด้วยแท็ก
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=TIS-620">
รูปแบบของเว็บเพจ
สำหรับรูปแบบของเอกสารนั้น ในส่วนของเนื้อหา ตัวอักษร และพื้นหลัง (Background)
ควรใช้สีที่ดูแล้วสบายตาในการอ่าน
ยกเว้นหัวข้อหรือข้อความบางส่วนที่ต้องการเน้น
สามารถใช้สีอื่นได้ตามความเหมาะสม
การตั้งชื่อไฟล์
ชื่อไฟล์สามารถประกอบด้วยตัวอักษรภาษาอังกฤษตัวพิมพ์เล็ก (a - z)
และตัวเลข (0 - 9) ผสมกันได้ แต่ไม่ควรยาวจนเกินไป
และสื่อความหมายถึงเนื้อหาของเว็บเพจด้วย โดยนามสกุลของไฟล์เอกสาร HTML
ต้องเป็น .html หรือ .htm ทั้งหมด นอกจากนี้ไฟล์เอกสาร HTML ไฟล์แรก
หรือไฟล์ที่ทำหน้าที่เป็น Homepage จะต้องตั้งชื่อเป็น index.html
เท่านั้น
ระบุที่มาของเว็บเพจ
ท้ายสุดของเว็บเพจแต่ละหน้า ควรระบุที่มาของเว็บเพจด้วย
ซึ่งมีรูปแบบการเขียนดังนี้
ที่มา: เรียบเรียงโดย ชื่อนามสกุลผู้เรียบเรียงบทความนี้
วันที่ที่เรียบเรียง
หรือสามารถดูตัวอย่างได้จาก http://www.school.net.th/library
การกำหนดความกว้างของเว็บเพจ
ความกว้างของเว็บเพจในกรณีที่เป็นตาราง หรือเฟรมสามารถกำหนดได้ 2
หน่วยคือ หน่วย pixel และหน่วยเปอร์เซ็นต์ (%) โดยในหน่วยของ pixel
นั้นไม่ควรเกิน 750 pixel (สำหรับการนำเสนอผ่านจอภาพ 800 x 600 pixels)
และในหน่วยของเปอร์เซ็นต์ ไม่ควรเกิน 90% เพื่อไม่ให้เกิดสกอล์บาร์ (Scrollbar)
ทางด้านล่างของโปรแกรมเว็บบราวเซอร์
การกำหนดฟอนต์
เอกสารเว็บที่เป็นภาษาไทย หรือภาษาไทยผสมภาษาอังกฤษ นอกจากจะต้องกำหนดแท็กควบคุมการเข้ารหัสตามข้อ
3 แล้วควรกำหนดแบบอักษร (Font) ให้กับข้อความในเอกสารเว็บด้วย
โดยการใช้แท็ก
<FONT FACE ="ชื่อฟอนต์ที่1, ชื่อฟอนต์ที่ 2,
">
และควรกำหนดฟอนต์ที่สามารถแสดงผลได้ทั้งเครื่องคอมพิวเตอร์ระบบ
Macintosh และ PC พร้อมทั้งระบุขนาดที่เหมาะสมด้วย
รูปแบบ การกำหนดชื่อฟอนต์ที่เหมาะสมสำหรับข้อมูลที่เป็นภาษาไทย ได้แก่
<FONT FACE = "MS Sans Serif, Microsoft Sans Serif, Thonburi">
</FONT>
รูปแบบ การกำหนดชื่อฟอนต์ที่เหมาะสมสำหรับข้อมูลที่เป็นภาษาอังกฤษ
ได้แก่
<FONT FACE = "Arial, Helvetica, Times">
</FONT>
โดยขนาดที่เหมาะสม ควรจะอยู่ในช่วง 1 - 3 เช่น หัวเรื่องใช้ขนาดเท่ากับ
3 ส่วนเนื้อหาใช้ ขนาดอักษรเทากับ 1 หรือ 2 เป็นต้น โดยมีรูปแบบแท็ก
คือ
<FONT SIZE="1">
</FONT>
ทั้งนี้การใช้แท็ก <FONT FACE = "
"> นั้น
ให้ระบุไว้ที่ตอนต้นของเอกสารครั้งเดียว ไม่ต้องเขียนหลายรอบ
เพราะจะเป็นการเพิ่มขนาดของไฟล์เอกสาร HTML โดยไม่จำเป็น
ยกเว้นเมื่อมีการใช้แท็ก <TABLE> จะต้องมีการระบุ <FONT FACE = "
">
ไว้ ในทุกๆ แท็ก <TD>
และในกรณีที่มีการเปลี่ยนขนาดของฟอนต์ไม่ต้องกำหนด <FONT FACE = "
">
ให้ใช้แท็ก <FONT SIZE = "
"> ได้เลย
การแสดงข้อมูลประเภทรายการหรือตาราง
การสร้างลำดับรายการ (Order List/Unorder List) ซึ่งจะเป็นการใช้แท็ก <OL>,
<UL>, <DL> ไม่ควรจะใช้ซ้อนกัน หลายชั้นเกินไป เพราะอาจเป็นผลทำให้
เอกสารนั้นกว้างเกินหน้าจอ ทำให้เกิดสกอล์บาร์ทางด้านล่างของโปรแกรมเว็บบราวเซอร์
ซึ่งจะทำให้ผู้ใช้ ต้องทำการเลื่อนดูข้อมูลที่ขาดหายไป
และทำให้เมื่อสั่งพิมพ์เว็บเพจนั้นออกมาทางเครื่องพิมพ์
ข้อความบางส่วนจะขาดหายไป (ส่วนที่เกินหน้าจอ)
การจัดการเกี่ยวกับภาพ
-
ภาพควรมีความสัมพันธ์กับเนื้อหา
โดยคำนึงถึงสาระสำคัญของเนื้อหาเป็นหลัก
-
ควรมีจำนวนภาพพอเหมาะไม่มากเกินไป
เพื่อความรวดเร็วในการเคลื่อนย้ายข้อมูล (transfer)
ความสวยงามของโฮมเพจ
-
เพื่อให้สามารถใช้ได้กับจอภาพของผู้เข้าชมโฮมเพจซึ่งอาจมีขนาดจอภาพต่างๆ
กัน ควรใช้ภาพประกอบขนาดเล็ก (thumbnail)
และสามารถคลิกที่ภาพเล็กเพื่อแสดงภาพที่ใหญ่ขึ้นได้
-
เลือกใช้ฟอร์แมตของภาพที่เหมาะสม เช่น ภาพสี
หรือภาพที่ต้องการแสดงถึงความคมชัดของเนื้อหา ควรใช้ฟอร์แมต .JPG
ในขณะที่ภาพขาวดำ หรือภาพที่ไม่เน้นรายละเอียดเกี่ยวกับสี
ควรใช้ฟอร์แมต .GIF เป็น
-
ข้อมูลภาพฟอร์แมต .JPG
-
ข้อมูลภาพฟอร์แมต .GIF
-
ภาพที่มีขนาดโต แต่ไม่มากนัก ควรกำหนดรูปแบบการแสดงผลเป็น Interlaced
หรือ Progressive ตามฟอร์แมตของภาพที่เลือกใช้งานด้วย
-
ภาพที่มีขนาดโตมาก ควรแบ่งซอยเป็นภาพเล็กๆ
แล้วใช้เทคนิคการประกบภาพด้วยตาราง
-
ไม่ควรใช้ภาพโตเกินไปหลายๆ ภาพในหน้าเอกสารเว็บแต่ละหน้า
-
ควรกำหนดแอทริบิวท์ WIDTH และ HEIGHT ให้กับภาพ (หรือในแท็ก <img
>)ด้วย
เพื่อระบุความกว้างและความยาวของรูปภาพให้
เว็บบราวเซอร์รู้ซึ่งมีผลให้การปรากฏภาพบนจอเร็วขึ้น
-
ควรกำหนดแอทริบิวท์ ALT ให้กับภาพ (หรือในแท็ก <img
>)
เพื่อแสดงข้อความอธิบายสำหรับเว็บบราวเซอร์ที่ไม่สามารถแสดงข้อมูลที่เป็นรูปภาพได้
โดยข้อความควรมีความหมายเหมาะสมกับภาพสามารถอ่านแล้วเข้าใจหรือเห็นภาพ
ตัวอย่าง ของ Image tag
<IMG alt="VIDEO" src="video-56.gif" width=56 height=20 border=0>
ขนาดข้อมูลที่เหมาะสม
ควรจะควบคุมให้มีขนาดไม่เกิน 150 กิโลไบต์ (ซึ่งจะใช้เวลาประมาณ 60
วินาที ในการเคลื่อนย้ายข้อมูล) เพราะหากมีขนาดใหญ่กว่า 150 กิโลไบต์
จะเสียเวลาในการเคลื่อนย้ายข้อมูลมาก ทำให้ผู้เข้าชมเกิดความเบื่อได้
การทดสอบการแสดงผล
ควรแสดงผลด้วยความสวยงามที่ความละเอียดของหน้าจออย่างต่ำ 800 x 600 จุด
และควรทดสอบกับเบราเซอร์หลายๆ ค่าย หลายๆ รุ่น
|