|
ข้อแนะนำนี้จัดทำขึ้นมาเพื่อให้การพัฒนาเว็บไซต์
โดยเฉพาะเว็บไซต์ที่นำเสนอเอกสารเป็นภาษาไทย ซึ่งมักจะเกิดปัญหาด้านการแสดงผลภาษาไทยผ่านเบราเซอร์ค่ายต่างๆ
มีระบบและมาตรฐานเดียวกัน
ชื่อของเอกสารเว็บ
<< ข้อมูลเพิ่มเติมสำหรับโปรแกรม
DreamWeaver >>
เอกสารเว็บทุกไฟล์
ควรมีการกำหนดชื่อเอกสาร ไว้ในส่วนของแท็ก <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">
การควบคุมการเข้ารหัสภาษาไทย
<< ข้อมูลเพิ่มเติมสำหรับโปรแกรม
DreamWeaver >>
ปัจจุบันเบราเซอร์แต่ละตัว
จะตรวจสอบการแสดงผลภาษาด้วยค่าการเข้ารหัสภาษา (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) ทางด้านล่างของโปรแกรมเว็บบราวเซอร์
การกำหนดฟอนต์
<< ข้อมูลเพิ่มเติมสำหรับโปรแกรม
DreamWeaver >>
เอกสารเว็บที่เป็นภาษาไทย
หรือภาษาไทยผสมภาษาอังกฤษ นอกจากจะต้องกำหนดแท็กควบคุมการเข้ารหัสตามข้อ
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 เป็น
- ภาพที่มีขนาดโต
แต่ไม่มากนัก ควรกำหนดรูปแบบการแสดงผลเป็น 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 จุด และควรทดสอบกับเบราเซอร์หลายๆ ค่าย หลายๆ รุ่น
|
