พื้นฐานการทำเว็บไซต์

Meta tags

ใช้อย่างไรสำคัญอย่างไรทำไมต้องมีด้วยนะ มาดูกันในบทความนี้

Meta tags เป็นข้อความที่เราประกาศเอาไว้ใน Code จะไม่แสดงผลในเว็บเพจ โดยเป็นเนื้อหาที่เกี่ยวกับเว็บไซต์ , Keywords ที่ใช้ที่เกี่ยวข้อกับเว็บไซต์ Search Engine จะทำการเก็บรายละเอียดพวกนี้ไว้อ้างอิงเว็บไซต์เรา

ถ้าเราไม่เขียนก็ได้ แต่ Search Engine จะทำการหาข้อความ หรือเนื้อหาที่ปรากฏอยู่ในเว็บไซต์ไปแทน ซึ่งอาจไม่ใช่ใจความสำคัญ หรือส่วนสำคัญของเว็บไซต์ของเราก็ได้ จะเป็นการดีมากถ้าเราสละเวลาเล็กน้อยเพื่อเขียนรายละเอียดส่วนนี้

จะขอลงรายละเีอียดที่ Meta tags อีกนิดหน่อย Meta tags นั้นมีไว้สำหรับใส่รายละเอียดของ Metadata ซึ่งจะบรรยายรายละเอียดเกี่ยวกับเว็บเพจที่ำกำลังแสดงผลอยู่ metadata ไม่ได้ถูกคิดค้นมาเพื่อใช้งานกับเว็บเพจ เพราะแรกเริ่มเดิมทีนั้น metadata ได้ถูกใช้ในกลุ่มพัฒนาฐานข้อมูลที่อ้างอิงถึงสารสนเทศ ในห้องสมุดเพื่อให้บรรณารักษ์ได้ใช้ในการจัดการระบบห้องสมุด ซึ่งถ้าหากจะว่าไปแล้วเราก็อาจเปรียบเทียบได้ว่า เว็บเพจต่างๆ นั้นเปรียบเสมือนห้องสมุดโลกขนาดใหญ่ ด้วยเหตุผลนี้เองจึงได้มีแนวความคิดในการนำ metadata มาประยุกต์ใช้กับเว็บเพจต่างๆ

เพื่อความเข้าใจจะแสดงตัวอย่าง Meta tags บางส่วน

<HEAD>
    <TITLE>ข้อความบรรยายหัวข้อของหน้าเว็บเพจ</TITLE>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=tis-620">
    <META NAME="keywords" CONTENT="บทเรียนทำเว็บไซต์, ทำเว็บ , สอนทำเว็บ">
    <META NAME="description" CONTENT="สอนทำเว็บแบบง่ายๆ">
    <META NAME="author" CONTENT="hellomyweb">
</HEAD>

การใช้งาน Meta tags นั้นเราจะเขียน code ให้อยู่ในส่วนของ <HEAD></HEAD> ในหน้าเว็บเพจที่เราต้องการใช้ Meta tags ตัว Meta tags เองนั้นมีมากมายหลายแบบ จะขอกล่าวแบบที่นิยมใช้กันดังนี้


Meta tags ที่ใช้กำหนดชนิดตัวอักษร

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

meta tags นี้จะบอกชุดตัวอักษรที่ใช้กับภาษาไทย ให้ Browser ใช้ชุดตัวอักษร utf-8 สำหรับเปิดเว็บเพจของเรา ส่วนนี้สำคัญมากนะครับถ้าไม่ใส่เข้าไปบางครั้งเวลาเราเปิดเว็บไซต์ขึ้นมาจะไม่แสดงภาษาไทยนะแต่จะแสดงเป็นภาษาที่เราอ่านไม่ออกแทน



Meta tags ที่จำเป็นสำหรับ Search Engine

ทั้ง 2 meta นี้มีความสำคัญสำหรับคนที่ต้องการให้เว็บไซต์เราคนหาเจอใน google เราควรจะใส่ข้อมูลพวกนี้ให้ถูกต้องนะครับ

<META NAME="keywords" CONTENT="เว็บไซต์ , ทำเว็บ , สอนทำเว็บ">

บอกคำที่เกี่ยวข้องกับเว็บเพจหน้านี้ เป็นคำที่ใช้ในการค้นหาหน้านี้ คั่นด้วยสัญลักษณ์ (,)

<META NAME="description" CONTENT="สอนทำเว็บไซต์แบบง่ายๆ">

บอกรายละเอียดของเว็บเพจแบบคร่าวๆ



Meta tags สำหรับบอกชื่อผู้เขียนหน้านี้ และลิขสิทธิ์

<META NAME="author" CONTENT="hellomyweb">

ผู้เขียนหน้านี้

<META NAME="copyright" CONTENT = "hellomyweb">

ผู้เป็นเจ้าของลิขสิทธิ์



Meta tags สำหรับบอกเครื่องมือที่ใช้สร้างเว็บเพจนี้

<META NAME="generator" CONTENT="Dreamweaver">

ใส่โปรแกรมที่ใช้ในการสร้างเว็บเพจหน้านี้้



Meta tags สำหรับสั่งให้ refresh หน้าเว็บเพจที่แสดงผลอยู่อัตโนมัติ

<META http-equiv="refresh" CONTENT="5; url=index.html">

- เลข 5 คือ จำนวนวินาทีที่ต้องการให้ refresh เช่นใส่เลข 5 คือให้ refresh ทุก 5 วินาที

- index.html คือ หน้าที่แสดงผลอยู่ (หน้าที่ต้องการให้ refresh)



Meta tags สำหรับสั่งให้ Re-direct หน้าเว็บเพจอัตโนมัติ

<META HTTP-EQUIV="Refresh" CONTENT="3;URL=http://www.hellomyweb.com">

Redirect คือการให้เปลี่ยนหน้าเ็ว็บเพจที่แสดงผลอยู่ ไปแสดงผลอีกหน้าที่เราตั้งไว้โดยอัตโนมัติ

- เลข 3 คือจำนวนวินาทีที่จะให้แสดงหน้าแรกก่อน 3 วินาทีจึงจะเปลี่ยนไปแสดงอีกหน้าที่เราตั้งไ้ว้

- URL ใส่เว็บไซต์ที่เราต้องการให้ re-direct ไป (เว็บไซต์ที่ต้องการให้แสดงผลแทนหน้าที่แสดงอยู่)



Meta tags สำหรับสั่งไม่ให้ Search engine แสดงผลหน้านี้ในรายการค้นหา เหมาะสำหรับทำในหน้า admin

<META NAME="robots" CONTENT="noindex,onfollow">

สั่งไม่ได้ Bot ของ search engine เก็บหน้านี้ไปแสดงผล ใช้สำหรับหน้าที่เป็นความลับไม่ต้องการให้ใครรู้



สำหรับ Meta tags ที่จำเป็นต้องใช้จริงๆนั้นมีแค่ 3 ตัวนั้นคือ
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<META NAME="keywords" CONTENT="">
<META NAME="description" CONTENT="">

สำหรับตัวอื่นๆนั้นขึ้นอยู่กับเราว่าจะใส่หรือไม่ใส่ก็ได้แล้วแต่ความจำเป็น


เลื่อนขึ้นด้านบน