การเขียนเว็บไซต์เบื้องต้น วันนี้ผมจะมาสอนการเขียนเว็บไซต์เบื้องต้น แต่ก่อนจะเริ่มสอน เราต้องมีความรู้เบื้องต้นกับเว็บไซต์ซักหน่อย เว็บไซต์มีมากมายและหลากหลาย ทั้งเว็บขนาดใหญ่ เขียนเว็ปไซต์ เช่น Facebok และเว็บไซต์ทั่วไป 

เขียนเว็ปไซต์

อินเตอร์เน็ต เป็นเครือข่ายการติดต่อสื่อสารขนาดยักษ์

ที่ครอบคลุมทั่วประเทศและทั่วโลก เขียนเว็ปไซต์ โดยผู้ใช้บริการจะใช้เครื่องคอมพิวเตอร์เป็นเครื่องเชื่อมต่อในการสื่อสารและเเลกเปลี่ยนข้อมูล เช่น ข้อความ ภาพ เสียง ไฟล์งานและอื่น ๆ ผ่านระบบเวิลด์ ไวด์ เว็บ (World Wide Web)

เวิลด์ ไวด์ เว็บ (World Wide Web) หรือ เว็บ (web) คือพื้นที่ที่เก็บข้อมูลข่าวสารที่เชื่อมต่อกันทางอินเตอร์เน็ต โดยกำหนด URL

เว็บไซต์ประกอบด้วย 3 ส่วนหลัก ได้แก่ 
• URL (Uniform Resource Locator) เป็นระบบมาตราญานที่ใช้กำหนด ตำแหน่งที่อยู่ (Address) ของไฟล์หรือเว็บไซต์บนอินเตอร์เน็ต เช่น URL ของทรูปลูกปัญญา http://www.trueplookpanya.com
• HTTP (HyperText Transfer Protocol) เป็นโปโตคอลสำหรับเปิดดูข้อมูลจาก www เรียกใช้งานโดยระบุ http:// และตามด้วย URL ในช่องกรอก Adress บนเว็บบราว์เซอร์
• HTML (HyperText Markup Lauguage) เป็นภาษาที่ออกแบบมาเพื่อใช้ในการสร้างเว็บ 

เว็บบราวเซอร์ (Web Browser) คือโปรแกรมที่ใช้สำหรับเปิดเว็บไซต์ เช่น Google Chrome IE และอื่น ๆ 

หลังจากที่อธิบายเบื้องต้นเกี่ยวกับเว็บไซต์และอินเตอร์เน็ตไปแล้ว เราก็จะมาดูกันว่าในการเขียนเว็บไซต์เนี่ย ต้องมีอะไรบ้าง โดยโปรแกรมที่ใช้ในการเขียนเว็บไซต์ก็มีมากมาย ไม่ว่าจะเป็น Adobe Dreamweaver Atom และอื่น ๆ แต่โปรแกรมที่เราจะใช้กันคือ Notepad เป็นโปรแกรมไว้สำหรับบันทึกข้อความต่าง ๆ เ

รื่องราว สามารถเปิดดูได้ตลอดเวลา เขียนเว็ปไซต์ แต่ก็สามารถใช้การฝึกเขียนโปรแกรมได้เหมือนกัน โดยเราจะใช้ Notepad ในการเขียนเว็บไซต์กันและภาษาที่ใช้ในการเขียนเว็บไซต์ก็จะมี HTML และ CSS

นี่ก็จะเป็นหน้าตาของ Notepad หากใครหาไม่เจอก็ให้คลิกขวาที่หน้า Dektop แล้วเลือก >สร้าง >notepad หรือเอกสารข้อความ 
หลังจากสร้างเสร็จจะมีหน้าตาแบบนี้

หน้าตามันจะดูโล่ง ๆ เพื่อให้ง่ายในการเขียน Code จากนั้นเราจะมาโหลด Sublime Text กันนะครับผม (โหลดก็ได้ ไม่โหลดก็ได้ตามสะดวกเด้ออ อิอิ) ดาวน์โหลดได้ที่นี่เลย https://www.sublimetext.com/3 

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

<!DOCTYPE html> เป็นส่วนระบุเวอร์ชั่นของภาษา HTMLl จะใส่ไว้ส่วนบนสุดเสมอ
<html> ไว้สำหรับใส่ส่วนประกอบต่างๆของ เอกสาร HTML
<head> เป็นส่วนที่ใช้บอกรายละเอียดเกี่ยวกับเว็บเพจที่เราสร้าง เช่น <meta charset=”utf-8″> เป็นการกำหนดว่าให้แสดงตัวอักษรเป็นเว็บเพจนี้เป็นภาษาไทย หากเราไม่ใส่ส่วนนี้มันก็จะไม่สามรถแสดงผลเป็นภาษาไทย
<title>WebPage<title> เป็นชื่อที่จะปรากฎตรงด้านบนในแท็บของเว็บไซต์
</head>
<body>”เป็นส่วนเนื้อหาที่จะให้มันเเสดงผลออกมา”</body> เป็นส่วนเนื้อหาที่จะให้มันเเสดงผลออกมา
</html>
ถ้าหากเขียนกันเสร็จแล้วละก็ลองเปิดดูกันเลย โดย คลิกขวาที่ไฟล์> เปิดด้วย> เลือกบราวเซอร์ที่จะเปิดได้เลย จะได้ลักษณะหน้าตาแบบนี้ มีคำว่า “เป็นส่วนเนื้อหาที่จะให้มันเเสดงผลออกมา” ซึ่งก็คือข้อความที่เราพิมลงใน tag ของ body นั่นเอง เป็นไงครับ หลักการง่าย ๆ ใช่มั้ยล่ะ 

งั้นเราจะเขียน WebPage เขียนเว็ปไซต์ ข้อมูลส่วนตัวกันดีกว่าา เน้อะ ><  มาเริ่มกันเลยยย โดยการเขียน WebPage ของเรานั้น จะใช้ HTML และ CSS เพื่อให้ง่ายต่อการเขียน มาเริ่มกันเลยเราใช้ CSS ใน HTML เลย