1. การสร้างโฟล์เดอร์ของผลงาน

จะต้องสร้างโฟลเดอร์หลักของผลงานทั้งหมด และสร้างโฟลเดอร์ย่อยของเนื้อหาแต่ละบท โดยชื่อโฟลเดอร์จะต้องเป็นตัวอักษรภาษาอังกฤษตัวพิมพ์เล็ก (a - z) เท่านั้นไฟล์ประกอบการสร้างผลงานของเนื้อหาแต่ละบท (ได้แก่ ไฟล์รูปภาพ, ไฟล์เสียง, ไฟล์วีดิทัศน์) จะต้องจัดเก็บทุกไฟล์ ไว้ในโฟลเดอร์ย่อยที่เกี่ยวข้องกับเนื้อหาแต่ละบทนั้น

ตัวอย่าง การสร้างโฟลเดอร์ ควรสร้างโฟลเดอร์ย่อยของเนื้อหาแต่ละบท

2. การตั้งชื่อไฟล์

· ไฟล์ของหน้าแรกของเนื้อหาที่นำเสนอผลงาน จะต้องตั้งชื่อไฟล์ และนามสกุลเป็น index.html เท่านั้น

· ไฟล์อื่นที่เหลือของผลงานและโฟลเดอร์ สามารถตั้งชื่อที่ประกอบด้วยตัวอักษรภาษาอังกฤษตัวพิมพ์เล็ก (a-z) และตัวเลข (0-9) ผสมกันได้ (ห้ามมีช่องว่าง) โดยตัวอักษรตัวแรกของชื่อไฟล์และโฟลเดอร์จะต้องเป็นตัวอักษรภาษาอังกฤษตัวพิมพ์เล็กเท่านั้น

· ชื่อไฟล์ไม่ควรยาวจนเกินไป (ไม่ควรเกิน 8 ตัวอักษร ไม่รวมนามสกุลไฟล์)

· ไฟล์ของเอกสาร HTML จะต้องมีนามสกุลของไฟล์เป็น html หรือ htm ทั้งหมด

ตัวอย่าง การกำหนดชื่อไฟล์ และนามสกุลของไฟล์เอกสารเว็บ

3. ชื่อของเอกสารเว็บ

เอกสารเว็บทุกไฟล์ ควรมีการกำหนดชื่อเอกสาร ไว้ในส่วนของแท็ก <TITLE>….</TITLE> โดยชื่อที่กำหนดขึ้นมานี้ จะเป็นภาษาไทย หรือภาษาอังกฤษก็ได้ แต่ควรมีความหมายอธิบายถึงภาพรวมของเว็บเพจนั้นๆ ให้ได้มากที่สุด เนื่องจากข้อความส่วนนี้ จะเป็นข้อความที่จะถูกนำมาใช้เป็นคำสำคัญ (Keyword) ในการสืบค้นข้อมูลจาก Search Engine ด้วย เช่น ชื่อเอกสารเว็บของคอมพิวเตอร์สร้างสรรค์ สามารถกำหนดชื่อของเอกสารเว็บได้ดังนี้
<TITLE>คอมพิวเตอร์สร้างสรรค์</TITLE>

4. คีย์เวิร์ดของเว็บเพจ

เว็บไซต์ที่นำเสนอในเครือข่ายอินเทอร์เน็ต ย่อมต้องการให้เป็นที่รู้จักกันอย่างแพร่หลาย โดยเฉพาะเว็บไซต์ท่า (Search Engine Website) ชั้นนำ เช่น Yahoo, Google, SiamGuru วิธีหนึ่งที่จะช่วยให้เว็บไซต์ท่ารู้จักเว็บไซต์ที่พัฒนาขึ้นมา คือการกำหนดคีย์เวิร์ดให้กับเว็บเพจนั้นๆ โดยใช้แท็ก
<META NAME = “Keyword” CONTENT = “คีย์เวิร์ด 1, คีย์เวิร์ด 2,…”>

คีย์เวิร์ดที่กำหนดขึ้นมานี้ สามารถกำหนดได้ทั้งภาษาไทย และภาษาอังกฤษ สามารถกำหนดคีย์เวิร์ดได้มากกว่า 1 ตัว โดยเขียนคั่นด้วยเครื่องหมายจุลภาค (,) เช่น

<META NAME = “Keyword” CONTENT = “โครงงานขนาดเล็ก, โฮมเพจ, HTML”>

5. การควบคุมการเข้ารหัสภาษาไทย

ปัจจุบันบราวเซอร์แต่ละตัว จะตรวจสอบการแสดงผลภาษาด้วยค่าการเข้ารหัสภาษา (Character Set) และหากเอกสารใด กำหนดค่าผิดพลาด หรือไม่กำหนด อาจจะทำให้โปรแกรมบราวเซอร์แปลความหมายผิดพลาด และแสดงผลภาษาผ่านบราวเซอร์ไม่ถูกต้อง ดังนั้นเพื่อให้การแสดงผลภาษาไทยผ่านบราวเซอร์ต่างๆ แสดงผลได้อย่างถูกต้อง ควรกำหนดค่าการเข้ารหัสภาษาไทยสำหรับเอกสารเว็บด้วยแท็ก

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=TIS-620"> หรือ

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Window-874">

6. การกำหนดฟอนต์

· เอกสารเว็บที่เป็นภาษาไทย หรือภาษาไทยผสมภาษาอังกฤษ นอกจากจะต้องกำหนดแท็กควบคุมการเข้ารหัสตามข้อ 5 แล้วควรกำหนดแบบอักษร (Font) ให้กับข้อความในเอกสารเว็บด้วย โดยการใช้แท็ก

<FONT FACE = “ชื่อฟอนต์ที่1, ชื่อฟอนต์ที่ 2, …”>

· ควรกำหนดฟอนต์ที่สามารถแสดงผลได้ทั้งเครื่องคอมพิวเตอร์ระบบ Macintosh และ PC พร้อมทั้งระบุขนาดที่เหมาะสมด้วย โดย

รูปแบบการกำหนดชื่อฟอนต์ที่เหมาะสมสำหรับข้อมูลที่เป็นภาษาไทย ได้แก่

<FONT FACE = “MS Sans Serif, Microsoft Sans Serif, Thonburi">…</FONT>

รูปแบบการกำหนดชื่อฟอนต์ที่เหมาะสมสำหรับข้อมูลที่เป็นภาษาอังกฤษ ได้แก่

<FONT FACE = “Arial, Helvetica, Times”>…</FONT>

· การใช้แท็ก <FONT FACE = “…”> นั้น ให้ระบุไว้ที่ตอนต้นของเอกสารครั้งเดียว ไม่ต้องเขียนหลายรอบเพราะจะเป็นการเพิ่มขนาดของไฟล์เอกสาร HTML โดยไม่จำเป็น ยกเว้นเมื่อมีการใช้แท็ก <TABLE> จะต้องมีการระบุ <FONT FACE = “…”> ไว้ ในทุกๆ แท็ก <TD> และในกรณีที่มีการเปลี่ยนขนาดของฟอนต์ไม่ต้องกำหนด <FONT FACE = “…”> ให้ใช้แท็ก <FONT SIZE = “…”> ได้เลย

· ขนาดของฟอนต์ที่เหมาะสม ควรจะอยู่ในช่วง 1 – 3 เช่น หัวเรื่องใช้ขนาดเท่ากับ 3 ส่วนเนื้อหาใช้ขนาดอักษรเท่ากับ 1 หรือ 2 เป็นต้น โดยมีรูปแบบแท็ก <FONT SIZE=”1”>…</FONT> เป็นต้น

· ควรเลือกใช้สีตัวอักษรที่อ่านได้ชัดเจน ไม่กลืนไปกับสีพื้น

7. การจัดการเกี่ยวกับภาพ

· ภาพควรมีความสัมพันธ์กับเนื้อหา โดยคำนึงถึงสาระสำคัญของเนื้อหาเป็นหลัก

· ควรมีจำนวนภาพพอเหมาะไม่มากเกินไป เพื่อความรวดเร็วในการเคลื่อนย้ายข้อมูล (transfer) ความสวยงามของเอกสารเว็บ

· เพื่อให้สามารถใช้ได้กับจอภาพของผู้เข้าชมโฮมเพจซึ่งอาจมีขนาดจอภาพต่างๆ กัน ควรใช้ภาพประกอบขนาดเล็ก (thumbnail) และสามารถคลิกที่ภาพเล็กเพื่อแสดงภาพที่ใหญ่ขึ้นได้

· ไฟล์ภาพที่สามารถเลือกใช้ได้ ประกอบด้วยฟอร์แมต .jpg .gif หรือ .png ทั้งนี้ ให้เลือกใช้ฟอร์แมตของภาพที่เหมาะสม เช่น ภาพสี หรือภาพที่ต้องการแสดงถึงความคมชัดของเนื้อหา ควรใช้ฟอร์แมต .JPG ในขณะที่ภาพขาวดำ หรือภาพที่ไม่เน้น รายละเอียดเกี่ยวกับสี ควรใช้ฟอร์แมต .GIF เป็นต้น

· ภาพที่มีขนาดโต แต่ไม่มากนัก ควรกำหนดรูปแบบการแสดงผลเป็น Interlaced หรือ Progressive ตามฟอร์แมตของภาพที่เลือกใช้งานด้วย

· ภาพที่มีขนาดโตมาก ควรแบ่งซอยเป็นภาพเล็กๆ แล้วใช้เทคนิคการประกบภาพด้วยตาราง

· ไม่ควรใช้ภาพโตเกินไปหลายๆ ภาพในหน้าเอกสารเว็บแต่ละหน้า

· ควรกำหนดแอทริบิวท์ WIDTH และ HEIGHT ให้กับภาพ (หรือในแท็ก <img…>)ด้วย เพื่อระบุความกว้างและความยาวของรูปภาพให้ เว็บบราวเซอร์รู้ซึ่งมีผลให้การปรากฏภาพบนจอเร็วขึ้น

· ควรกำหนดแอทริบิวท์ ALT ให้กับภาพ (หรือในแท็ก <img…>) เพื่อแสดงข้อความอธิบายสำหรับเว็บบราวเซอร์ที่ไม่สามารถแสดงข้อมูลที่เป็นรูปภาพได้ โดยข้อความควรมีความหมายเหมาะสมกับภาพสามารถอ่านแล้วเข้าใจหรือเห็นภาพ (รวมถึงการใช้ภาพเป็น Image Map)

ตัวอย่าง ของ Image tag

<IMG alt=”combine hierarchy chart” src=”pic3_combine.gif” width=56 height=20 border=0>

8. การจัดการเกี่ยวกับวีดีทัศน์ และเสียง

ฟอร์แมตของวีดิทัศน์และเสียงจะต้องใช้เทคโนโลยี Streaming เช่น Flash หรือ Window Media Player

9. การใช้ Frame

เมื่อมีการนำเฟรมมาใช้ในการสร้างเว็บเพจ จะต้องกำหนดชื่อเฟรมเป็นภาษาอังกฤษที่สื่อความหมายได้

ชัดเจน

10. โปรแกรมประยุกต์

ผลงานสามารถนำ web programing มาพัฒนาด้วยได้ ซึ่งอนุญาตให้ใช้ได้เฉพาะ script programing
(เช่น Flash Action Script, VBScript, Java Script) และ Java Applet เท่านั้น

11. การใช้เครื่องหมายวรรคตอน (หมายเหตุ xxx และ yyy แทนข้อความใดๆ)

· นขลิขิตหรือวงเล็บ (เครื่องหมายวงเล็บ ( ))

ควรเว้นวรรค 1 ครั้งก่อนเปิดวงเล็บ และเว้นวรรค 1 ครั้งหลังปิดวงเล็บ ข้อความภายในวงเล็บควร
ติดกับเครื่องหมายวงเล็บเปิด และเครื่องหมายวงเล็บปิด ตัวอย่างเช่น xxx (yyy) xxx

· อัญประกาศหรือเครื่องหมายคำพูด (เครื่องหมาย “ก”)

ควรเว้นวรรค 1 ครั้ง ก่อนเปิดเครื่องหมายคำพูดและเว้นวรรค 1 ครั้ง หลังปิดเครื่องหมายคำพูด
ข้อความภายในเครื่องหมายคำพูด ควรติดกับเครื่องหมายคำพูดเปิด และเครื่องหมายคำพูดปิด

ตัวอย่างเช่น xxx “yyy” xxx

· ไม้ยมก (เครื่องหมาย ๆ)

ควรอยู่ติดกับข้อความ หลังเครื่องหมายไม้ยมก เว้นวรรค 1 ครั้ง ตัวอย่างเช่น xxxๆ yyy

· ไปยาลน้อย (เครื่องหมาย ฯ), จุลภาคหรือจุดลูกน้ำ(เครื่องหมาย , ) จุดคู่ (เครื่องหมาย :) และอัฒภาคหรือจุดครึ่ง (เครื่องหมาย ;)

ควรอยู่ติดกับข้อความ หลังเครื่องหมายควรเว้นวรรค 1 ครั้ง ตัวอย่างเช่น xxxฯ yyy xxx; yyy

· การใช้เครื่องหมายจุด

ควรอยู่ติดกับข้อความ หลังเครื่องหมายจุดควรเว้นวรรค ตัวอย่างเช่น xxx. yyy