พื้นฐาน HTML

มาสร้างเว็บกันดีกว่า ด้วยภาษา HTML ภาษาพื้นฐานที่ผู้สร้างเว็บ หรือเว็บมาสเตอร์ต้องรู้จักและเข้าใจ เพื่อนำไปใช้ในการพัฒนาพัฒนาด้วยภาษาอื่นๆ หรือจากเว็บไซต์สำเร็จรูป ก็ยังจำเป็นต้องรู้จักและเข้าใจการทำงานของภาษา HTML


ภาษา HTML คืออะไร

HTML (Hyper Text Markup Language) เป็นภาษาพื้นฐาน หรือภาษาต้นตำหรับที่ใช้ในการพัฒนา web page ภาษาหนึ่ง (นอกเหนือจาก PHP, ASP เป็นต้น) เพื่อให้โปรแกรม web brower ต่างๆ (Internet Explorer, FireFox, Opera) สามารถแปลงคำสั่ง แสดงผลในลักษณะของรูปภาพ ตัวอักษร เสียง ภาพเคลื่อนไหว โดยไฟล์ที่สร้างจะมีนามสกุล .html หรือ .htm การสร้างและแก้ไขสามารถใช้โปรแกรม NotePad, WordPad ในวินโดวส์ ลักษณะของไฟล์จะเป็น Text ไฟล์ธรรมดา

ตัวอย่างโครงสร้างภาษา HTML

<HTML>
<HEAD>

<TITLE> โปรแกรมแรกของดิฉัน </TITLE>

</HEAD>
<BODY>


<!-- สำหรับใส่ข้อความที่ช่วยในการอธิบาย การเขียนคำสั่ง //-->

Sawasdee ค่ะ นี่คือ Web Page แรกของดิฉัน

</BODY>
</HTML>

หมายเหตุ :- ตัวหนังสือสีแดง คือคำสั่งในภาษา HTML

First html page


จากตัวอย่างจะเห็นได้ว่า แต่ละคำสั่งจะอยู่ในเครื่องหมาย "< >" ซึ่งเราเรียกว่า แทก "TAG" แต่ละคำสั่งจะเป็นการบอกจุดเริ่มต้นของคำสั่ง และจุดสิ้นสุดของคำสั่งจะมีสัญลักษณ์ "</ >"

  • <HTML> </HTML> - หมายถึง คำสั่งที่ใช้กำหนดว่าเป็นเอกสาร HTML (คำสั่งนี้จะอยู่ตอนบนสุดและล่างสุดของไฟล์)
  • <HEAD> </HEAD> - หมายถึง คำสั่งที่ใช้กำหนดว่าชื่อเรื่องของไฟล์ HTML
  • <TITLE> </TITLE> - หมายถึง คำสั่งที่ใช้กำหนดว่าชื่อของเอกสาร (คำสั่งนี้จะอยู่ระหว่างคำสั่ง HEAD)
  • <BODY> </BODY> - หมายถึง คำสั่งที่ใช้กำหนดว่าเป็นส่วนของรายละเอียด (คำสั่งนี้จะอยู่หลังคำสั่ง HEAD)

หลังจากนั้นเวลาบันทึก ให้เลือกเมนู File เลือก Save เลือกตั้งชื่อไฟล์ ซึ่งชื่อไฟล์หลักของ Web Page มักจะใช้ชื่อว่า index.html หรือ index.htm หลังจากสร้างเสร็จแล้ว เราสามารถสั่งรันโดยใช้โปรแกรม Microsoft Internet Explorer ซึ่งมีมาพร้อมกับ Windows ทุกเวอร์ชั่นได้

 

  •  Tips ค้นหาข้อมูลในเว็บ 
  • หากต้องการค้นจากเนื้อหาทั้งหมด ให้คุณป้อนคำที่ต้องการลงในช่อง "ค้นหา" ที่อยู่มุมขวาบนสุดของเว็บ หรือ
  • หากคุณต้องการค้นหาหัวข้อในหมวดนี้ ให้คุณป้อนคำที่ต้องการลงในช่อง "กรองตามชื่อเรื่อง" ข้างล่างนี้ 

ทิปแปลงไฟล์ PHP มาเป็น HTML

คุณต้องการแปลงไฟล์ PHP บนเว็บของคุณ เป็น HTML หรือเปล่า

เนื่องจากข้อจำกัดของ PHP คือ จะต้องใช้ Web Server ที่รองรับ PHP เท่านั้น และการประมวลผลก็จำเป็นต้องทำงานในฝั่งของ Server เอง ซึ่งทำให้ซีพียูทำงานหนักขึ้น?ซึ่งผู้ใช้งานส่วนใหญ่อาจไม่ทราบเรื่องนี้ แต่อย่างไรก็ตาม Webmaster บางคนอาจมีความต้องการที่สร้างแปลงไฟล์ PHP เป็น HTML ทั้งนี้ อาจสืบเนื่องมาจาก ไม่เข้าใจภาษา PHP อย่างแท้จริง หรืออาจเป็นเพราะต้องการให้ง่ายในการจัดการและแก้ไข

วันนี้เราสามารถแปลงไฟล์ PHP เป็น HTML ได้ด้วยตัวเอง

เคล็ดลับง่ายๆ คือ ให้คุณเปิดเว็บไซต์ที่เขียนด้วย PHP และต้องการแปลงไฟล์เป็น HTML ด้วย Microsoft Internet Explorer จากนั้นให้คุณทำตามขั้นตอนดังนี้?

  1. คลิกเมนู File
  2. คลิกหัวข้อ Save As
  3. เลือกหัวข้อ Web Page, Complete (*.htm; *.html)
  4. รอสักครู่ โปรแกรมจะทำการ Save รวมทั้งไฟล์รูปภาพบนหน้าเว็บด้วยครับ

ข้อจำกัดของการแปลงไฟล์ PHP เป็น HTML

  • ผลลัพธ์ที่ได้อาจไม่สมบูรณ์ 100%
  • การแปลงหน้าเว็บที่มี JavaScripts? หรือมีฟอร์มเมล สามารถแปลงได้ แต่อาจไม่สามารถใช้งานได้

แค่นี้คุณก็สามารถแปลงไฟล์เป็น HMTL ได้แล้วครับ แต่หน้าเว็บที่ต้องการแปลง ควรเป็นหน้าเว็บที่เป็นแบบคงที่ หรือ Static Web (หน้าเว็บที่ไม่มีการเปลี่ยนแปลงข้อมูล)

ตารางรหัสสีในภาษา HTML

เพิ่มสีสรรให้เว็บไซต์


เพื่อให้เว็บมีความสดใสและน่าดูชมมากยิ่งขึ้น เราสามารถใส่สีของฉากหลัง หรือตัวอักษรได้ง่ายๆ ซึ่งโดยปกติแล้ว เราสามารถใส่สีได้ 2 วิธีคือ ใส่ชื่อสีลงไปตรงๆ (เช่น bgcolor = "red") หรือใส่รหัสสี (เช่น bgcolor = "#FF0000") เป็นต้น แต่ในความเป็นจริง ขอแนะนำให้ใช้รหัสสีจะดีกว่า เพราะสามารถเลือกสีได้มากมายชนิดไม่มีลิมิตเลยทีเดียว

ตารางรหัสสีในภาษา HTML

สี ค่ารหัสสี ผลลัพธ์
ขาว #FFFFFF
ดำ #000000
แดง #FF0000
เหลือง #FFFF00
เขียว #008000
น้ำเงิน #0000FF
ฟ้า #00FFFF
น้ำตาล #808000
ม่วง #800080
เทา #808080
กรมท่า #000080
แดงเลือดหมู #800000
เขียวตองอ่อน #00FF00
เขียวน้ำทะเล #008080


นอกจากนี้ เพื่อให้ง่ายในการใส่สีให้ตรงกับภาพที่เราต้องการ เราสามารถใช้เครื่องมือในการเปรียบเทียบสีได้ด้วยโปรแกรมประเภทที่เรียกว่า "ดูดสี" สนใจอ่านรายละเอียดเพิ่มเติมได้ที่หัวข้อ เครื่องมือดูดสี สำหรับนักพัฒนา

ตารางสัญลักษณ์พิเศษในภาษา HTML

รหัสพิเศษสำหรับการใส่บนเว็บ


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

ตารางสัญลักษณ์พิเศษของภาษา HTML

ตัวอักษร รหัสที่ต้องพิมพ์ลงไป
? &copy;
? &reg;?
? ?&cent;
? ?&pound;
? &yen;
? &frac14;
? &frac12;
? &frac34;
ช่องว่าง &nbsp;
&? &amp;
<? &lt;
>? &gt;



SGML ภาษาต้นแบบของ HTML

ทำความรู้จัก SGML

SGML ย่อมาจาก Standardized Markupu Language เป็นภาษาต้นกำเนิดของ HTML พัฒนาเมื่อปี ค.ศ. 1986 โดยนักวิจัยกลุ่มหนึ่งที่ต้องการแลกเปลี่ยนข้อมูลทางเน็ตเวิร์ค?โดยเน้นในเรื่องของการยืดหยุ่น และสามารถพัฒนาต่อในอนาคตได้ SGML มีการเก็บข้อมูลในรูปแบบ ASCII

SGML สามารถแบ่งการทำงานได้ 2 ส่วน

  1. ส่วนประกาศโครงสร้าง (DTD: Document Type Definition)
  2. ส่วนตัวเอกสาร (Document Body)

ภาษา SGML เป็นภาษาที่ไม่นิยมมากนัก เนื่องจากมีความยุ่งยากในการประยุกต์ใช้งาน รวมทั้งการจัดเก็บข้อมูลด้วย และยากในการจัดทำโปรแกรม? ต่อมาจึงได้มีการพัฒนาภาษา HTML, XML เพิ่มเติมที่มีความสามารถสูงกว่าเดิมมาก..

 

ป้องกันเว็บ HTML ของคุณด้วย HTML Lock

คุณพัฒนาเว็บไซต์ด้วยภาษา HTML หรือไม่

สำหรับนักพัฒนาเว็บส่วนใหญ่คงรู้จักกันดีว่า ภาษา HTML เป็นภาษาพื้นฐานในการพัฒนาเว็บไซต์ที่ดีที่สุดตัวหนึ่ง เข้าถึงได้ง่าย เว็บ Hosting ต่างๆ ก็ชอบเพราะเป็นเปลืองทรัพยากรในการแปลงข้อมูล แต่สิ่งหนึ่งที่หลายๆ คนเข้าใจคือ ไม่มีระบบรักษาความปลอดภัยของข้อมูล ใครต้องการ copy ไปใช้งานหรือไว้ดูแบบ Offline ก็สามารถทำได้ค่อนข้างสะดวก

HTML Lock ปกป้อง HTML ไฟล์ของคุณ

HTML lock file tool

  • สนใจ download HTML Lock ขนาดไฟล์ 112 KB เท่านั้นเอง

วิธีง่ายๆ?ในการเข้ารหัสไฟล์ประเภท HTML ก็คือใช้โปรแกรมช่วยในการเข้ารหัส และที่สำคัญผมกำลังแนะนำฟรีโปรแกรมในการเข้ารหัสไฟล์ HTML ของคุณ ที่ใช้งานง่ายๆ เพียงเลือกไฟล์ที่ต้องการแปลง และสั่ง Lock เท่านั้นเอง นอกจากนี้การเข้ารหัสไฟล์ HTML นี้จะไม่มีผลกับระบบ Hosting แต่อย่างไร ผู้เข้าชมเว็บไซต์ก็ยังใช้งานได้ปกติ


Member

               

Main Menu

it-guides.com สงวนลิขสิทธิ์ พ.ศ. 2543 | thanks Joomla!
แนะนำการใช้คอมพิวเตอร์ และการแก้ไขปัญหา Windows, Word, Excel, Outlook, Photoshop, Facebook พร้อมดาวน์โหลดฟรีแวร์ กำจัดไวรัส การสร้างเว็บด้วยตัวเอง.