วันจันทร์ที่ 18 มิถุนายน พ.ศ. 2555

HTML TAG พื้นฐาน

HTML TAG พื้นฐาน


HTML ย่อมาจาก
(Hypertext Markup Language)
ใช้โปรแกม
Notepad++ เป็นโปรแกรมที่ใช้ช่วยเขียนโปรแกรมภาษาต่างๆ สำหรับนักพัฒนาโปรแกรมน่าจะคุ้นเคยกับโปรแกรมนี้เป็นอย่างดี เราสามารถใช้โปรแกรมนี้ช่วยเขียนโปรแกรมได้เกือบทุกภาษา ไม่ว่าจะเป็น C, C++, C#, Java, HTML, XML, PHP ASP, VB, SQL และอื่นๆ อีกมากมาย


  Text Editor 

คือ โปรแกรมที่ใช้สำหรับสร้างและแก้ไขข้อความ
ในการสร้างเว็บเพจด้วยภาษา HTML นั้นต้องมีเครื่องมือที่ใช้ในการเขียน และแก้ไขตัวอักษรซึ่งเป็นคำสั่งต่าง ๆปัจจุบันมี โปรแกรม Text Editor หลายโปรแกรม เช่น NotePad, EditPlus หรือโปรแกรม Dreamweaver ซึ่งมีคุณสมบัติเป็นทั้งโปรแกรมสำเร็จรูปในการสร้างเว็บเพจด้วย

ตัวอย่าง Notepad 


ผลการแสดง



 จะใช้โปรแกรม Internet Web Browser เช่น Internet Explorer (IE), Mozilla Firefox, Safari, Opera, และ Netscape Navigator เป็นต้น

โครงสร้างของภาษา HTML

      การเขียนโฮมเพจด้วยภาษา HTML  นั้น เอกสาร HTML จะประกอบด้วยส่วนประกอบ 2 ส่วน ดังนี้ 

     1. ส่วน Head คือส่วนที่จะเป็นหัว (Header) ของหน้าเอกสารทั่วไป หรือส่วนชื่อเรื่อง (Title) ของหน้าต่างการทำงานในระบบ Windows
      2. ส่วน Body จะเป็นส่วนเนื้อหาของเอกสารนั้น ซึ่งจะประกอบด้วย Tag คำสั่งในการจัดรูปแบบ หรือตกแต่งเอกสาร HTML

     

       ในทั้งสองส่วนนี้จะอยู่ภายใน Tag <HTML>…</HTML> ดังนี้
<html>

 


<head> <title> ส่วนชื่อเอกสาร </title> </head>
 

 
<body>
 
    tag คำสั่ง
 
 



</body>
 
</html>

 

        คำสั่ง หรือ Tag ที่ใช้ในภาษา HTML ประกอบไปด้วยเครื่องหมายน้อยกว่า "<" ตามด้วย ชื่อคำสั่งและปิดท้ายด้วยเครื่องหมายมากกว่า ">" เป็นส่วนที่ทำหน้าที่ตกแต่งข้อความ เพื่อ การแสดงผลข้อมูล โดยทั่วไปคำสั่งของ HTML ส่วนใหญ่จะอยู่เป็นคู่ มีเพียงบาง คำสั่งเท่านั้น ที่มีรูปแบบคำสั่งอยู่เพียงตัวเดียว ในแต่ละคำสั่ง จะมีคำสั่งเปิดและปิด คำสั่งปิดของแต่ละ คำสั่งจะมี รูปแบบเหมือนคำสั่งเปิด เพียงแต่จะเพิ่ม "/" (Slash) นำหน้าคำสั่ง ปิดให้ดู แตกต่าง เท่านั้น และในคำสั่งเปิดบางคำสั่ง อาจมีส่วนขยายอื่นผสมอยู่ด้วย
       ในการเขียนคำสั่งภาษา HTML สามารถเขียน ด้วยตัวอักษร เล็กหรือใหญ่ ทั้งหมดหรือเขียนคละกันได้ เช่น <HTML> หรือ <Html> หรือ <html> ซึ่งจะให้ผลเหมือนกัน
 

คำสั่งเริ่มต้นของเอกสาร HTML 
   <HTML>..........</HTML> 
  คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรมและคำสั่ง       </HTML> เป็นการสิ้นสุดโปรแกรม HTML คำสั่งนี้จะไม่แสดงผลในโปรแกรมเว็บเบราเซอร์ แต่ต้องเขียนเพื่อให้เกิดความเป็นระบบของงาน และเพื่อจะให้รู้ว่าเอกสารนี้เป็นเอกสารของภาษา HTML ส่วนหัวเรื่องเอกสารเว็บ (Head Section)
<HEAD>..........</HEAD>
Head Section เป็นส่วนที่ใช้อธิบายเกี่ยวกับข้อมูลเฉพาะของหน้าเว็บนั้น ๆ เช่น ชื่อเรื่องของหน้าเว็บ (Title), ชื่อผู้จัดทำเว็บ(Author), คีย์เวิร์ดสำหรับการค้นหา (Keyword) โดยมี Tag สำคัญ คือ
  <TITLE>..........</TITLE >
  ข้อความที่ใช้เป็น TITLE ไม่ควรพิมพ์เกิน 64 ตัวอักษร, ไม่ต้องใส่ลักษณะ
   พิเศษ เช่น ตัวหนา เอียง หรือสี และควรใช้ภาษาที่มีความหมายครอบคลุม
   ถึงเนื้อหาของเว็บเพจ นั้น หรือเป็นคำสำคัญในการค้นหา (Keyword)

<BODY>..........</BODY>
Body Section เป็นส่วนเนื้อหาหลักของหน้าเว็บ ซึ่งการแสดงผลจะต้องใช้ Tag จำนวนมาก ขึ้นอยู่กับลักษณะของข้อมูล เช่น ข้อความ, รูปภาพ, เสียง, วีดิโอ หรือไฟล์ต่างๆส่วนเนื้อหาเอกสารเว็บ เป็นส่วนการทำงานหลักของหน้าเว็บ ประกอบด้วย Tag มากมายตามลักษณะของข้อมูล ที่ต้องการนำเสนอ การป้อนคำสั่งในส่วนนี้ ไม่มีข้อจำกัดสามารถป้อนติดกัน หรือ 1 บรรทัดต่อ 1 คำสั่งก็ได้ แต่ส่วนใหญ่จะยึดรูปแบบที่อ่านง่าย คือ การทำย่อหน้าในชุดคำสั่งที่เกี่ยวข้องกัน ทั้งนี้ให้ป้อนคำสั่งทั้งหมดภายใต้ Tag <BODY> … </BODY>

        

สรุป

<HTML>....</HTML>  คำสั่งเริ่มต้น คำสั่ง html เป็นคำสั่งเริ่มการเขียน
<HEAD>....</HEAD>  เป็นส่วนหัวของเว็บเพจ บอกคุณสมบัติของเว็บเพจ
 

<TITLE>....</TITLE>   ใช้บอกชื่อของเว็บเพจ

<BODY>....</BODY>  เป็นส่วนสำคัญที่สุด เพราะเป็นส่วนที่แสดงเนื้อหา  ทั้งหมด อาจรวมถึง ข้อความ รูปภาพ ตารางการเชื่อมโยง

ที่มา

 http://pirun.ku.ac.th/~agrtnk/web/units/unit1/unit1-3.htm


7 กรกฎาคม 2555

ไม่มีความคิดเห็น:

แสดงความคิดเห็น