• xxx-xxxxxxx | xx-xxx-xxxx
  • admin@wess-design.com

วิธีสร้างเว็บไซต์ด้วย HTML ทำอย่างไร ?

HTML

วิธีสร้างเว็บไซต์ด้วย HTML ทำอย่างไร ?

โครงสร้างของ HTML ในการสร้างเว็บไซต์ จะประกอบด้วยคำสั่ง 2 ส่วน ได้แก่ ส่วน Head และส่วน Body สำหรับความง่ายของภาษา HTML นั้น คือ ไม่มีโครงสร้างอื่นใดเข้ามากำหนด นอกจากโครงสร้างพื้นฐานเท่านั้น โดย Web Browser สามารถเห็นทุกองค์ประกอบในโปรแกรม HTML อันเป็นส่วนเนื้อหาทั้งสิ้น ยกเว้นส่วน Head ต้องมีการกำหนด แยกออกไปโดยจะเขียนคำสั่งให้แสดงอย่างไรก็ได้ และ Web Browser ก็จะแสดงผล ออกมาตามถูกกำหนด ด้วยการใช้คำสั่งให้ตรงกับรหัสที่กำหนดเท่านั้น

มาสร้างเว็บไซต์ด้วย HTML กันเถอะ !

  • Tag ที่ใช้กับ HTML จะประกอบไปด้วยเครื่องหมายน้อยกว่า < , เขียนชื่อคำสั่ง ในส่วนของการ ปิดท้ายคำสั่งให้ใช้เครื่องหมายมากกว่า
  • โดย > มีหน้าที่ตกแต่งข้อความ
  • ตามปกติแล้ว คำสั่งของ HTML ส่วนใหญ่จะอยู่เป็นคู่ หากแต่ก็มีบางประการ ที่มีคำสั่งอยู่เพียงตัวเดียว โดยในแต่ละคำสั่ง ก็จะมีทั้งคำสั่งเปิดและปิด
  • โดยคำสั่งปิดจะมีรูปแบบเสมือนคำสั่งเปิด เพียงแต่จะเพิ่ม / นำหน้าคำสั่ง ปิด เพื่อให้ดูมีความแตกต่างเท่านั้น นอกจากนี้ ในคำสั่งเปิดบางคำสั่ง จะมีส่วนขยายอื่นผสมเข้ามาอยู่ด้วย
  • ในการเขียน ด้วยตัวอักษรเล็กหรือใหญ่ ไม่มีผลอะไร

สร้างเว็บไซต์ด้วยภาษา HTML อย่างง่ายๆ สำหรับมือใหม่

  • สร้าง Folder เพื่อใช้ในการเก็บแฟ้มเอกสาร ด้วยการคลิกขวาบริเวณพื้นที่ว่างของจอ เลือก New -> Folder แล้วจะตั้งชื่อ Folder อะไรก็ได้ตามใจคุณ
  • คลิกที่ Start
  • คลิกที่ Notepad

สำหรับวิธีการเขียน คุณจะต้องมีตัว Tag เพื่อครอบ html สัญลักษณ์ตัว Tag คือ < และ > ยกตัวอย่างให้เห็นภาพ เช่น <html> จะเขียนพิมพ์ใหญ่หรือพิมพ์เล็กก็ได้ ตามความถนัด ถ้าปราศจากการครอบ ก็จะไม่มีความหมายใดๆ ทั้งสิ้น

  • Tag เปิด คือ <html> ให้เขียนไว้ข้างบนสุด ในหน้ากระดาษ Notepad
  • Tag ปิด คือ </html> ให้เขียนไว้ล่างสุด ในหน้ากระดาษ Notepad

สำหรับเครื่องหมาย / ซึ่งต้องอยู่บริเวณด้านหน้าตัวอักษร มีความหมายว่าเป็น Tag ปิด เช่น </html></body> หมายความว่า นี่คือ จุดสิ้นสุดคำสั่งนี้ เป็นต้น

HTML-

โครงร่างที่อยู่ใน html สามารถแบ่งออกเป็น 3 ส่วน ได้แก่…

  • <head>…</head> ส่วน Head เช่น หัวข้อต่างๆ เป็นต้น
  • <title>…</title> ตัวที่เป็นหัวข้อใหญ่โดยจะอยู่ภายใน <head> เพียงอย่างเดียวเท่านั้น
  • <body>…</body>คือรายระเอียดหรือข้อมูลจำนวนมาก 3 คำสั่งนี้จะต้องอยู่ใน <html> เท่านั้น

ยกตัวอย่าง วิธีการเขียน ให้เข้าใจง่ายขึ้น

<html>

<head>;

<title>นี่คือ title บาร์</title>

</head>

<body>

แนะนำให้คุณ Copy ตัวอย่างทั้งหมดนี้ ไปวางไว้ใน Notepad แล้วทำการบันทึกไว้

</body>

</html>

วิธีบันทึกใน Notepad

  • เมื่อเขียนคำสั่งต่างๆ ลงใน Notepad เรียบร้อยแล้ว ให้คุณคลิกที่ File –> Save As
  • เก็บไว้ใน Folder ที่คุณสร้างไว้
  • Save as type เลือก All Files
  • โดย File name นามสกุลต้องลงท้ายด้วย .html ทุกครั้ง
  • บันทึกไว้ที่ All Files เป็นอันเสร็จ
admin