Differences

This shows you the differences between the selected revision and the current version of the page.


standard:web 2009/03/21 10:19 standard:web 2010/06/09 04:54 current
Line 33: Line 33:
  - แต่ละเว็บย่อยภายใต้ศูนย์ฯ จะต้องแก้ไขเส้นเชื่อมที่เสีย (Broken Links) ให้แล้วเสร็จภายใน 2 สัปดาห์ นับจากวันที่ได้รับแจ้ง และผู้ดูแลเว็บควรใช้เครื่องมือตรวจ Links ด้วยตนเองอย่างสม่ำเสมอ   - แต่ละเว็บย่อยภายใต้ศูนย์ฯ จะต้องแก้ไขเส้นเชื่อมที่เสีย (Broken Links) ให้แล้วเสร็จภายใน 2 สัปดาห์ นับจากวันที่ได้รับแจ้ง และผู้ดูแลเว็บควรใช้เครื่องมือตรวจ Links ด้วยตนเองอย่างสม่ำเสมอ
  - ทุกๆ หน้าเว็บ ควรจะแสดงข้อมูลต่างๆ (ยกเว้นหน้าเว็บอินทราเน็ต) ดังต่อไปนี้   - ทุกๆ หน้าเว็บ ควรจะแสดงข้อมูลต่างๆ (ยกเว้นหน้าเว็บอินทราเน็ต) ดังต่อไปนี้
-      * ข้อมูลติดต่อหน่วยงาน ได้แก่ ที่อยู่ เบอร์โทรศัพท์ และอีเมล์ +      * ข้อมูลติดต่อหน่วยงาน ได้แก่ ที่อยู่ เบอร์โทรศัพท์ และอีเมล
      * เส้นเชื่อมกลับไปยังหน้าหลักของศูนย์ฯ       * เส้นเชื่อมกลับไปยังหน้าหลักของศูนย์ฯ
      * คำแถลงการณ์สงวนลิขสิทธิ์       * คำแถลงการณ์สงวนลิขสิทธิ์
Line 68: Line 68:
  - เกี่ยวกับหน่วยงาน (About us) เป็นส่วนที่นำเสนอข้อมูลแนะนำหน่วยงานนั้นๆ   - เกี่ยวกับหน่วยงาน (About us) เป็นส่วนที่นำเสนอข้อมูลแนะนำหน่วยงานนั้นๆ
-  - โครงสร้างหน่วยงาน (Organization Structure and Staff Directory) เป็นส่วนที่แนะนำโครงสร้างของหน่วยงาน ว่าแบ่งออกเป็นกี่ระดับ มีใครบ้าง โดยนำเสนอทั้งชื่อ อีเมล์ และเบอร์โทรติดต่อ+  - โครงสร้างหน่วยงาน (Organization Structure and Staff Directory) เป็นส่วนที่แนะนำโครงสร้างของหน่วยงาน ว่าแบ่งออกเป็นกี่ระดับ มีใครบ้าง โดยนำเสนอทั้งชื่อ อีเมล และเบอร์โทรติดต่อ
  - โครงการสำคัญ เป็นส่วนนำเสนอโครงการต่างๆ ของหน่วยงานนั้น ทั้งโครงการที่กำลังอยู่ในขั้นตอนของการดำเนินการ และโครงการที่ดำเนินการเสร็จสิ้นไปแล้ว   - โครงการสำคัญ เป็นส่วนนำเสนอโครงการต่างๆ ของหน่วยงานนั้น ทั้งโครงการที่กำลังอยู่ในขั้นตอนของการดำเนินการ และโครงการที่ดำเนินการเสร็จสิ้นไปแล้ว
  - Site Map เป็นส่วนที่นำเสนอโครงสร้างของเว็บไซต์ของหน่วยงานนั้น   - Site Map เป็นส่วนที่นำเสนอโครงสร้างของเว็บไซต์ของหน่วยงานนั้น
-  - Contact us เป็นส่วนที่นำเสนอข้อมูลเกี่ยวกับวิธีการติดต่อกับหน่วยงานนั้น โดยมีที่อยู่ เบอร์โทรศัพท์หน่วยงาน และอีเมล์ โดยที่อยู่ของอีเมล์ในเว็บเพจ ให้ทำเป็นกราฟิก โดยไม่มี ALT ประกอบ+  - Contact us เป็นส่วนที่นำเสนอข้อมูลเกี่ยวกับวิธีการติดต่อกับหน่วยงานนั้น โดยมีที่อยู่ เบอร์โทรศัพท์หน่วยงาน และอีเมล โดยที่อยู่ของอีเมลในเว็บเพจ ให้ทำเป็นกราฟิก โดยไม่มี ALT mailto:email-address ประกอบ 
 +    * [[http://services.nexodyne.com/email/index_custom.php|บริการออนไลน์ช่วยสร้างอีเมลแบบกราฟิก]]
**คำแนะนำ** **คำแนะนำ**
Line 103: Line 104:
  * เอกสารเว็บจะต้องมีการกำหนดชื่อของเอกสารหน้านั้น ไว้ในส่วนของแท็ก <title>...</title> โดยชื่อที่กำหนดขึ้นมาควรใช้ภาษาอังกฤษ และต่อท้ายด้วยภาษาไทยได้ และอธิบายถึงภาพรวมของเว็บไซต์นั้นๆ ให้ได้มากที่สุด เพราะชื่อของเอกสารที่กำหนดไว้นี้ จะส่งผลให้โปรแกรมเก็บข้อมูลของเว็บไซต์ที่ให้บริการค้นหาข้อมูล (Search Engine) สามารถตรวจพบ และเก็บชื่อที่กำหนดให้กับเอกสาร เข้าไว้ในระบบฐานข้อมูล เพื่อใช้เป็นคีย์เวิร์ด สำหรับการค้นหาเว็บไซต์ต่อไป (ข้อความที่ระบุใน <title> นี้ไม่ควรยาวเกิน 64 ตัวอักษร)   * เอกสารเว็บจะต้องมีการกำหนดชื่อของเอกสารหน้านั้น ไว้ในส่วนของแท็ก <title>...</title> โดยชื่อที่กำหนดขึ้นมาควรใช้ภาษาอังกฤษ และต่อท้ายด้วยภาษาไทยได้ และอธิบายถึงภาพรวมของเว็บไซต์นั้นๆ ให้ได้มากที่สุด เพราะชื่อของเอกสารที่กำหนดไว้นี้ จะส่งผลให้โปรแกรมเก็บข้อมูลของเว็บไซต์ที่ให้บริการค้นหาข้อมูล (Search Engine) สามารถตรวจพบ และเก็บชื่อที่กำหนดให้กับเอกสาร เข้าไว้ในระบบฐานข้อมูล เพื่อใช้เป็นคีย์เวิร์ด สำหรับการค้นหาเว็บไซต์ต่อไป (ข้อความที่ระบุใน <title> นี้ไม่ควรยาวเกิน 64 ตัวอักษร)
    * ไม่ควรใช้เทคนิคใดๆ ในการพิมพ์ เช่น เว้นวรรคระหว่างตัวอักษร หรือควบคุมด้วย Javascript     * ไม่ควรใช้เทคนิคใดๆ ในการพิมพ์ เช่น เว้นวรรคระหว่างตัวอักษร หรือควบคุมด้วย Javascript
 +    * ตัวอย่างชื่อเว็บของมหาวิทยาลัยเกษตรศาสตร์ โดยการค้นด้วยคำว่า ku ผ่าน Google ปรากฏเป็น Kasetsart University มหาวิทยาลัยเกษตรศาสตร์
 +
 +{{  :standard:title-tag.png?nolink  |}}
 +
 +    * กรณีที่พัฒนาเว็บด้วย CMS: Content Management System เช่น Joomla จะต้องกำหนด Title ของบทความและเว็บไซต์จากส่วนควบคุม CMS ด้วย
 +
 +{{  :standard:title-joomla-article.png?nolink  |}}
 +
  * เอกสารเว็บควรกำหนดคีย์เวิร์ดให้กับเอกสารนั้นๆ โดยการใช้แท็ก <meta name="keywords" content="คีย์เวิร์ดสำหรับโฮมเพจ"> ตัวอย่างเช่น <meta name="keywords" content="STKS, Science and Technology Knowledge Services, NSTDA, Library, ห้องสมุด, บริการทรัพยากรสารสนเทศ"> เป็นต้น ซึ่งคีย์เวิร์ดนี้จะเป็นข้อมูลอีกส่วนหนึ่งที่โปรแกรมเก็บข้อมูลของเว็บไซต์ค้นหาข้อมูล (Search Engine) บางชนิด เก็บไปทำเป็นคีย์เวิร์ด สำหรับการค้นหาเว็บไซต์ ดังนั้นถ้าต้องการให้เอกสารถูกตรวจพบโดยเว็บไซต์ที่เป็น Search Engine หลายๆ ชนิด เราควรจะใส่ทั้งชื่อของเอกสาร และใส่คีย์เวิร์ดในแท็ก <meta name="keywords" ...>   * เอกสารเว็บควรกำหนดคีย์เวิร์ดให้กับเอกสารนั้นๆ โดยการใช้แท็ก <meta name="keywords" content="คีย์เวิร์ดสำหรับโฮมเพจ"> ตัวอย่างเช่น <meta name="keywords" content="STKS, Science and Technology Knowledge Services, NSTDA, Library, ห้องสมุด, บริการทรัพยากรสารสนเทศ"> เป็นต้น ซึ่งคีย์เวิร์ดนี้จะเป็นข้อมูลอีกส่วนหนึ่งที่โปรแกรมเก็บข้อมูลของเว็บไซต์ค้นหาข้อมูล (Search Engine) บางชนิด เก็บไปทำเป็นคีย์เวิร์ด สำหรับการค้นหาเว็บไซต์ ดังนั้นถ้าต้องการให้เอกสารถูกตรวจพบโดยเว็บไซต์ที่เป็น Search Engine หลายๆ ชนิด เราควรจะใส่ทั้งชื่อของเอกสาร และใส่คีย์เวิร์ดในแท็ก <meta name="keywords" ...>
 +    * กรณีที่พัฒนาเว็บด้วย CMS จะต้องกำหนด Keyword ของบทความและเว็บไซต์จากส่วนควบคุม CMS ด้วย
 +
 +{{  :standard:keyword-metatag.png?nolink  |}}
 +
 +  * เอกสารเว็บทุกแฟ้มจะต้องกำหนดคำอธิบายเว็บอย่างย่อโดยการใช้แท็ก <meta name=“description” content=“คำอธิบายเว็บ”> เพื่อเป็นข้อมูลสำหรับ Search Engine แสดงผลประกอบการสืบค้นเว็บไซต์ ทั้งนี้ไม่ควรยาวเกิน 250 ตัวอักษร
 +    * กรณีที่พัฒนาเว็บด้วย CMS จะต้องกำหนดคำอธิบายเว็บของบทความและเว็บไซต์จากส่วนควบคุม CMS ด้วย
 +    * ตัวอย่างคำอธิบายเว็บของมหาวิทยาลัยเกษตรศาสตร์
 +
 +{{  :standard:title-tag.png?nolink  |}}
 +
 +  * เอกสารเว็บควรกำหนดชื่อหน่วยงานหรือผู้พัฒนาเว็บ โดยการใช้แท็ก <meta name=“author” content=“ชื่อหน่วยงาน/ผู้พัฒนาเว็บ”>
  * เอกสาร HTML ทุกหน้าจะต้องมีการกำหนดชุดของตัวอักษร (Character Set) โดยจะต้องกำหนดเป็นชุด TIS-620 หรือ UTF-8 ซึ่งการกำหนดชุดของตัวอักษรในเอกสารแต่ละหน้านั้นจะใช้รูปแบบเป็น <meta http-equiv="Content-Type" content="text/html;charset=TIS-620"> หรือ <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">   * เอกสาร HTML ทุกหน้าจะต้องมีการกำหนดชุดของตัวอักษร (Character Set) โดยจะต้องกำหนดเป็นชุด TIS-620 หรือ UTF-8 ซึ่งการกำหนดชุดของตัวอักษรในเอกสารแต่ละหน้านั้นจะใช้รูปแบบเป็น <meta http-equiv="Content-Type" content="text/html;charset=TIS-620"> หรือ <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    * การระบุ TIS-620 หรือ UTF-8 จะต้องระบุให้เหมือนกันทั้งเว็บ และต้องตรงกับระบบภาษาไทยของโปรแกรมจัดการฐานข้อมูล และ Web Programming     * การระบุ TIS-620 หรือ UTF-8 จะต้องระบุให้เหมือนกันทั้งเว็บ และต้องตรงกับระบบภาษาไทยของโปรแกรมจัดการฐานข้อมูล และ Web Programming
 +      * [[http://www.submitexpress.com/analyzer|บริการออนไลน์ตรวจสอบ/ให้คำแนะนำการระบุ Web Metatag]]
 +      * [[http://www.submitexpress.com/metatags.html|บริการออนไลน์ช่วยสร้างรายการ Web Metatag]]
 +      * [[standard:thai-encodig-notepad|การเลือก Thai Encoding สำหรับ NotePad]]
 +      * [[standard:thai-encodig-dreamweaver|การเลือก Thai Encoding สำหรับ Dreamweaver]]
 +      * [[standard:thai-encodig-notepad-plus|การเลือก Thai Encoding สำหรับ NotePad++]]
 +
  * ในเอกสารที่จะนำขึ้นเผยแพร่บนระบบเครือข่ายอินเทอร์เน็ต จะต้องกำหนดชนิดของฟอนต์ที่ใช้ โดยการใช้แท็ก <font face="ชื่อของฟอนต์"> โดยเฉพาะเว็บไซต์ที่มีการใช้ข้อมูลที่เป็นภาษาไทย จะต้องกำหนดชื่อฟอนต์ที่มีอยู่ในเครื่อง Macintosh และ PC พร้อมทั้งระบุขนาดที่เหมาะสมด้วย   * ในเอกสารที่จะนำขึ้นเผยแพร่บนระบบเครือข่ายอินเทอร์เน็ต จะต้องกำหนดชนิดของฟอนต์ที่ใช้ โดยการใช้แท็ก <font face="ชื่อของฟอนต์"> โดยเฉพาะเว็บไซต์ที่มีการใช้ข้อมูลที่เป็นภาษาไทย จะต้องกำหนดชื่อฟอนต์ที่มีอยู่ในเครื่อง Macintosh และ PC พร้อมทั้งระบุขนาดที่เหมาะสมด้วย
    * ในหน้าภาษาไทยกำหนดเป็น <font face=" "Tahoma, MS Sans Serif, Thonburi">...</font>     * ในหน้าภาษาไทยกำหนดเป็น <font face=" "Tahoma, MS Sans Serif, Thonburi">...</font>
Line 116: Line 142:
  * ในการเขียน HTML นั้น ควรจะเขียนโค้ดให้เป็นระเบียบ และมีคอมเมนต์อธิบายไว้เป็นระยะ โดยความยาวของ HTML ในแต่ละบรรทัด ไม่ควรเกิน 80-90 ตัวอักษร เพื่อให้สามารถอ่านข้อมูล และปรับปรุงแก้ไขได้ง่าย นอกจากนั้นการตัดคำภาษาไทยของเอกสารหน้านั้นๆ ยังสามารถทำได้อย่างถูกต้องอีกด้วย   * ในการเขียน HTML นั้น ควรจะเขียนโค้ดให้เป็นระเบียบ และมีคอมเมนต์อธิบายไว้เป็นระยะ โดยความยาวของ HTML ในแต่ละบรรทัด ไม่ควรเกิน 80-90 ตัวอักษร เพื่อให้สามารถอ่านข้อมูล และปรับปรุงแก้ไขได้ง่าย นอกจากนั้นการตัดคำภาษาไทยของเอกสารหน้านั้นๆ ยังสามารถทำได้อย่างถูกต้องอีกด้วย
  * การนำภาพมาประกอบในเอกสาร โดยการใช้แท็ก <img ...> นั้น จะต้องกำหนดความกว้าง และความสูงที่ถูกต้องของภาพนั้นไว้ด้วยเสมอ เพราะจะทำให้การจัดโครงร่างของเอกสาร ทำได้อย่างรวดเร็ว และที่สำคัญจะต้องกำหนดแอทริบิวต์ alt และ title ไว้ภายในแท็ก <img scr="ชื่อไฟล์ภาพ" width="ความกว้างเป็นพิกเซล" height="ความสูงเป็นพิกเซล" alt="คำอธิบายภาพ" title="คำอธิบายภาพ"> เพื่อแสดงข้อความอธิบายสำหรับเว็บเบราว์เซอร์บางชนิด ที่ไม่สามารถแสดงข้อมูลที่เป็นรูปภาพได้ และเป็นข้อมูลสำหรับการสืบค้นของ Search Engine   * การนำภาพมาประกอบในเอกสาร โดยการใช้แท็ก <img ...> นั้น จะต้องกำหนดความกว้าง และความสูงที่ถูกต้องของภาพนั้นไว้ด้วยเสมอ เพราะจะทำให้การจัดโครงร่างของเอกสาร ทำได้อย่างรวดเร็ว และที่สำคัญจะต้องกำหนดแอทริบิวต์ alt และ title ไว้ภายในแท็ก <img scr="ชื่อไฟล์ภาพ" width="ความกว้างเป็นพิกเซล" height="ความสูงเป็นพิกเซล" alt="คำอธิบายภาพ" title="คำอธิบายภาพ"> เพื่อแสดงข้อความอธิบายสำหรับเว็บเบราว์เซอร์บางชนิด ที่ไม่สามารถแสดงข้อมูลที่เป็นรูปภาพได้ และเป็นข้อมูลสำหรับการสืบค้นของ Search Engine
 +    * กรณีที่ใช้ CMS สามารถกำหนดค่าความกว้าง ความสูง และคำอธิบายภาพได้จากระบบ
  * การนำรูปภาพมาประกอบในเอกสาร HTML นั้น ถ้ารอบๆ ตำแหน่งที่วางรูปภาพมีตัวอักษร ควรจะกำหนดระยะห่างจากขอบของรูปทุกด้าน โดยการใช้แอทริบิวต์ vspace="ระยะห่างเป็นพิกเซล" hspace="ระยะห่างเป็นพิกเซล" และถ้ารูปนั้นเป็นตัวเชื่อมโยงไปยังเอกสารอื่น ไม่ควรกำหนดความกว้างของกรอบ คือ ความกว้างเท่ากับศูนย์ โดยใช้แอทริบิวต์ border="0" เช่น %%<img alt="VIDEO" src="http://www.stks.or.th/graphics/video-56.gif" width= "56" height= "20" border="0" hspace="3" vspace="3">%%   * การนำรูปภาพมาประกอบในเอกสาร HTML นั้น ถ้ารอบๆ ตำแหน่งที่วางรูปภาพมีตัวอักษร ควรจะกำหนดระยะห่างจากขอบของรูปทุกด้าน โดยการใช้แอทริบิวต์ vspace="ระยะห่างเป็นพิกเซล" hspace="ระยะห่างเป็นพิกเซล" และถ้ารูปนั้นเป็นตัวเชื่อมโยงไปยังเอกสารอื่น ไม่ควรกำหนดความกว้างของกรอบ คือ ความกว้างเท่ากับศูนย์ โดยใช้แอทริบิวต์ border="0" เช่น %%<img alt="VIDEO" src="http://www.stks.or.th/graphics/video-56.gif" width= "56" height= "20" border="0" hspace="3" vspace="3">%%
 +    * กรณีที่ใช้ CMS สามารถกำหนดค่าความกว้าง ความสูง และคำอธิบายภาพได้จากระบบ
 +
 +{{  :standard:image-joomla.png?nolink  |}}
 +
  * ในการตั้งชื่อแฟ้มข้อมูลและชื่อไดเร็กทอรี่ ที่ใช้ในการเก็บข้อมูล จะต้องใช้ชื่อภาษาอังกฤษที่ไม่ยาวเกินไปและสื่อความหมาย โดยชื่อประกอบด้วยตัวอักษรตัวเล็ก ไม่มีการเว้นวรรคระหว่างชื่อ และนามสกุลของไฟล์เอกสาร HTML จะต้องเป็น .html หรือ.htm (หรืออื่นๆ ตามระบบที่ดำเนินการ) และแฟ้มข้อมูลแรกที่ต้องการให้ผู้เข้าชมเห็นควรจะตั้งชื่อเป็น "index" ในทุกๆ ไดเร็กทอรี่จะต้องมีไฟล์ชื่อนี้อยู่ด้วย เพื่อไม่ให้ผู้ใช้เห็นแฟ้มข้อมูลทั้งหมดที่อยู่ในไดเร็กทอรี่นั้น เช่น ในไดเร็กทอรี่ที่เก็บภาพควรจะสร้างไฟล์เปล่าๆ แล้วบันทึกไว้ในชื่อ "index" เพื่อไม่ให้ผู้เข้าชมมองเห็นรายชื่อของไฟล์ทั้งหมด ที่อยู่ในไดเร็กทอรี่นั้น เป็นต้น   * ในการตั้งชื่อแฟ้มข้อมูลและชื่อไดเร็กทอรี่ ที่ใช้ในการเก็บข้อมูล จะต้องใช้ชื่อภาษาอังกฤษที่ไม่ยาวเกินไปและสื่อความหมาย โดยชื่อประกอบด้วยตัวอักษรตัวเล็ก ไม่มีการเว้นวรรคระหว่างชื่อ และนามสกุลของไฟล์เอกสาร HTML จะต้องเป็น .html หรือ.htm (หรืออื่นๆ ตามระบบที่ดำเนินการ) และแฟ้มข้อมูลแรกที่ต้องการให้ผู้เข้าชมเห็นควรจะตั้งชื่อเป็น "index" ในทุกๆ ไดเร็กทอรี่จะต้องมีไฟล์ชื่อนี้อยู่ด้วย เพื่อไม่ให้ผู้ใช้เห็นแฟ้มข้อมูลทั้งหมดที่อยู่ในไดเร็กทอรี่นั้น เช่น ในไดเร็กทอรี่ที่เก็บภาพควรจะสร้างไฟล์เปล่าๆ แล้วบันทึกไว้ในชื่อ "index" เพื่อไม่ให้ผู้เข้าชมมองเห็นรายชื่อของไฟล์ทั้งหมด ที่อยู่ในไดเร็กทอรี่นั้น เป็นต้น
-  * ผู้เข้าชมเว็บไซต์ควรได้รับแจ้งความต้องการใช้งานโปรแกรมปลั๊กอิน พร้อมทั้งควรมีเส้นเชื่อมเพื่อการถ่ายโอนโปรแกรมนั้นๆ ได้โดยสะดวก+  * ผู้เข้าชมเว็บไซต์ควรได้รับแจ้งข้อมูลเกี่ยวกับการใช้งานโปรแกรมปลั๊กอิน (Plug-ins) พร้อมทั้งควรมีจุดเชื่อม (Link) ให้สามารถดาวน์โหลดและติดตั้งโปรแกรมนั้นๆ ได้โดยสะดวก 
 +  * ห้ามคัดลอก (Copy) เอกสารจากเว็บใดๆ หรือเอกสารต้นฉบับเช่น Microsoft Office, OpenOffice.org มาวางบน WYSIWYG Editor เนื่องจากจะติด Special Code ของโปรแกรมนั้นๆ มาด้วย ส่งผลให้การแสดงผลเอกสารไม่เป็นไปในแนวทางเดียวกันทั้งหมด ควรจะนำไปวาง (Paste) บน NotePad หรือ Text Editor ใดๆ ก่อนแล้วจึงคัดลอกมาวางบน WYSIWYG Editor อีกครั้ง หรือใช้บริการ HTML Cleaner 
 +  * เว็บไซต์จะต้องติดซอฟต์แวร์วิเคราะห์การเข้าชม เช่น Truehits, Google Analytic 
**คำแนะนำ** **คำแนะนำ**
Line 131: Line 165:
  * ในการทดสอบการแสดงผล ควรทดสอบที่ความละเอียดของหน้าจออย่างต่ำ 800 x 600 จุด และแนะนำให้ใช้ความละเอียดของหน้าจอ 1024 x 768 จุด เพื่อความเหมาะสมและสวยงามที่สุด   * ในการทดสอบการแสดงผล ควรทดสอบที่ความละเอียดของหน้าจออย่างต่ำ 800 x 600 จุด และแนะนำให้ใช้ความละเอียดของหน้าจอ 1024 x 768 จุด เพื่อความเหมาะสมและสวยงามที่สุด
  * ควรทดสอบระยะเวลาที่ใช้ในการดูเว็บเพจ โดยทดสอบด้วยการใช้โมเด็มความเร็ว 56 kbps ซึ่งเว็บเพจที่พัฒนาขึ้นควรจะเริ่มแสดงผลข้อมูลไม่เกิน 10 วินาทีหลังจากได้รับการร้องขอ (Request) และแสดงผลได้สมบูรณ์ไม่เกิน 30 วินาที เนื่องจากผู้เข้าชมเว็บเพจที่พัฒนาขึ้น อาจจะมาจากต่างสถานที่กัน ใช้โมเด็มความเร็วต่างกัน ผู้พัฒนาควรทดสอบการเข้าชมเว็บเพจ จากโมเด็มที่มีความเร็วที่ครอบคลุมถึงผู้ใช้ส่วนใหญ่   * ควรทดสอบระยะเวลาที่ใช้ในการดูเว็บเพจ โดยทดสอบด้วยการใช้โมเด็มความเร็ว 56 kbps ซึ่งเว็บเพจที่พัฒนาขึ้นควรจะเริ่มแสดงผลข้อมูลไม่เกิน 10 วินาทีหลังจากได้รับการร้องขอ (Request) และแสดงผลได้สมบูรณ์ไม่เกิน 30 วินาที เนื่องจากผู้เข้าชมเว็บเพจที่พัฒนาขึ้น อาจจะมาจากต่างสถานที่กัน ใช้โมเด็มความเร็วต่างกัน ผู้พัฒนาควรทดสอบการเข้าชมเว็บเพจ จากโมเด็มที่มีความเร็วที่ครอบคลุมถึงผู้ใช้ส่วนใหญ่
-  * การตั้งชื่อที่อยู่ของอีเมลของหน่วยงาน ให้ตั้งชื่อเป็นกลาง "webmaster@หน่วยงาน/บริการ.stks.or.th" หรือ "webmaster-หน่วยงาน@stks.or.th" โดยเสนอให้จัดแสดงที่อยู่ของอีเมล ในลักษณะภาพลักษณ์ (Image) เพื่อป้องกันการเก็บรวบรวมอีเมล โดยอัตโนมัติเพื่อการส่งอีเมลขยะ+  * การตั้งชื่อที่อยู่ของอีเมลของหน่วยงาน ให้ตั้งชื่อเป็นกลาง "webmaster@หน่วยงาน/บริการ.stks.or.th" หรือ "webmaster-หน่วยงาน@stks.or.th" โดยเสนอให้จัดแสดงที่อยู่ของอีเมลในลักษณะภาพกราฟิก(Image) เพื่อป้องกันการเก็บรวบรวมอีเมลโดยอัตโนมัติเพื่อการส่งอีเมลขยะ
===== ตารางช่วยวิเคราะห์ ===== ===== ตารางช่วยวิเคราะห์ =====
 +
 +**หมายเหตุเกี่ยวกับตารางนี้**
 +
 +คำว่า "ถูก" หรือ "ผิด" ในที่นี้หมายถึง สอดคล้องตามมาตรฐานนี้ ไม่ได้แปลว่าจะผิดไวยารกรณ์ของการตั้งชื่อไฟล์หรือการสร้างเว็บ ท่านทำผิดแล้วคอมพิวเตอร์จะไม่ยอมทำตาม ระบบของเว็บจะไม่ปรากฏข้อความแสดงปัญหาใดๆไม่ว่าท่านจะทำ "ถูก" หรือ "ผิด"
<html> <html>
Line 148: Line 186:
  <tr bgcolor="#FFFFCC">   <tr bgcolor="#FFFFCC">
    <td colspan="2" valign="top">      <p> ชื่อไฟล์ทุกฟอร์แมตให้ตั้งชื่อเป็นภาษาอังกฤษเท่านั้น </p></td>     <td colspan="2" valign="top">      <p> ชื่อไฟล์ทุกฟอร์แมตให้ตั้งชื่อเป็นภาษาอังกฤษเท่านั้น </p></td>
-    <td width="568" valign="top"><p> ห้องสมุดดิจิทัล.odt ผิด </p> +    <td width="568" valign="top"><p> ห้องสมุดดิจิทัล.odt - ผิด </p> 
-        <p>digital-library.odt ถูก </p></td>+        <p>digital-library.odt - ถูก </p></td>
    <td width="568" valign="top"><p>&nbsp; </p></td>     <td width="568" valign="top"><p>&nbsp; </p></td>
  </tr>   </tr>
  <tr>   <tr>
    <td colspan="2" valign="top">          <p> ให้ใช้ตัวอักษรและตัวเลข โดยไม่มีเครื่องหมายวรรคตอนใดๆ ยกเว้น . และ – เท่านั้น ( ไม่ใช้ space และ underscore “_” เพราะจะสร้างปัญหาเมื่อเป็นส่วนหนึ่งของ URL) </p></td>     <td colspan="2" valign="top">          <p> ให้ใช้ตัวอักษรและตัวเลข โดยไม่มีเครื่องหมายวรรคตอนใดๆ ยกเว้น . และ – เท่านั้น ( ไม่ใช้ space และ underscore “_” เพราะจะสร้างปัญหาเมื่อเป็นส่วนหนึ่งของ URL) </p></td>
-    <td width="568" valign="top"><p>digital_library.odt ผิด </p> +    <td width="568" valign="top"><p>digital_library.odt - ผิด </p> 
-        <p>digital-library.odt ถูก</p>+        <p>digital-library.odt - ถูก</p>
        </td>         </td>
    <td width="568" valign="top"><p>&nbsp; </p></td>     <td width="568" valign="top"><p>&nbsp; </p></td>
Line 162: Line 200:
    <td colspan="2" valign="top"> ควรเป็นคำที่สื่อความหมายสำหรับ <br>     <td colspan="2" valign="top"> ควรเป็นคำที่สื่อความหมายสำหรับ <br>
    Search Engine </td>     Search Engine </td>
-    <td width="568" valign="top"><p>dl.odt ผิด </p> +    <td width="568" valign="top"><p>dl.odt - ผิด </p> 
-        <p>digital-library.odt ถูก </p></td>+        <p>digital-library.odt - ถูก </p></td>
    <td width="568" valign="top"><p>&nbsp; </p></td>     <td width="568" valign="top"><p>&nbsp; </p></td>
  </tr>   </tr>
Line 264: Line 302:
  * [[http://www.stks.or.th/web/index2.php?option=com_docman&task=doc_view&gid=406&Itemid=31|Web Accessibility]]   * [[http://www.stks.or.th/web/index2.php?option=com_docman&task=doc_view&gid=406&Itemid=31|Web Accessibility]]
  * [[http://www.stks.or.th/web/index2.php?option=com_docman&task=doc_view&gid=99&Itemid=31|Metadata]]   * [[http://www.stks.or.th/web/index2.php?option=com_docman&task=doc_view&gid=99&Itemid=31|Metadata]]
 +  * http://www.w3.org/
 +  * http://en.wikipedia.org/wiki/Web_standards
 +  * http://www.maxdesign.com.au/articles/checklist/
 +  * http://webstandardsgroup.org/
  * [[web:color-code|ตารางสี]]   * [[web:color-code|ตารางสี]]
 +
===== Online Services ===== ===== Online Services =====
-  * http://www.submitexpress.com/analyzer เครื่องมือตรวจวิเคราะห์ Metadata ของเอกสารเว็บ+  * [[http://www.submitexpress.com/analyzer|เครื่องมือตรวจวิเคราะห์ Metadata ของเอกสารเว็บ]] 
 +  * [[http://services.nexodyne.com/email/index_custom.php|บริการออนไลน์ช่วยสร้างอีเมลแบบกราฟิก]]  
 +  * [[http://www.submitexpress.com/metatags.html|บริการออนไลน์ช่วยสร้างรายการ Web Metatag]]
===== กรณีศึกษา STKS ===== ===== กรณีศึกษา STKS =====
Line 280: Line 325:
  * บุญเลิศ อรุณพิบูลย์ นักวิชาการ ศูนย์บริการความรู้ทางวิทยาศาสตร์และเทคโนโลยี   * บุญเลิศ อรุณพิบูลย์ นักวิชาการ ศูนย์บริการความรู้ทางวิทยาศาสตร์และเทคโนโลยี
-{{tag>standard web เอกสารเว็บ}}+{{tag>standard web}}

Personal Tools
Creative Commons License
STKS Online Learning โดย http://stks.or.th/wiki อนุญาตให้ใช้ได้ตาม สัญญาอนุญาตของครีเอทีฟคอมมอนส์แบบ แสดงที่มา-ไม่ใช้เพื่อการค้า-อนุญาตแบบเดียวกัน 3.0 ประเทศไทย.