ขั้นตอนในการสร้างเว็บเพจ
1.สร้าง Folder สำหรับเก็บข้อมูล

    การทำงานในระบบคอมพิวเตอร์ ข้อมูลต่างๆ ไม่ว่าจะเป็นเอกสาร รูปภาพ เสียงเพลง จะถูกเก็บลงระบบคอมพิวเตอร์ในรูปแบบของ แฟ้มข้อมูลหรือที่เรียกกันว่า ไฟล์ (File) โดยไฟล์แต่ะละประเภทจะมีนามสกุล (Extension) ที่แตกต่างกันไป ตามลักษณะของข้อมูลและโปรแกรมที่สร้างข้อมูลนั้น เช่น
     -ไฟล์เอกสารที่พิมพ์ด้วยโปรแกรม Microsoft Word จะมีนามสกุลคือ .doc
     -ไฟล์รูปภาพอาจมีได้หลายนามสกุล แต่ประเภทของรูปภาพที่นิยมใช้ในการสร้างเว็บเพจคือ .jpg และ .gif
     -ไฟล์เสียงเพลง จะมีนามสกุลดังนี้ เช่น .mid , .wav หรือ .mp3 เป็นต้น
     -ไฟล์ข้อมูลเว็บเพจ จะมีได้หลายนามสกุล เช่น .htm , .html , .php , .asp
    แต่เว็บเพจที่สร้างด้วยโปรแกรม Notepad และเป็นนามสกุลมาตรฐานคือ .html ส่วนนามสกุลอื่น ๆ เช่น
.php หรือ .asp เป็นการสร้างโดยใช้ภาษาคอมพิวเตอร์อื่น ๆ แต่ในที่นี้เราจะใช้ภาษา  HTML  ในการสร้าง
เว็บเพจ ดังนั้นให้กำหนดนามสกุลเป็น .html


    การเก็บข้อมูลต่างๆ ในระบบคอมพิวเตอร์นั้นเพื่อความเป็นระเบียบ ความสะดวกในการทำงานและการค้นหาข้อมูล ควรสร้างโฟลเดอร์ (Folder) ขึ้นใหม่  โดยนิยมสร้างที่ี่ไดร์ฟ D: สำหรับนักเรียนที่ยังไม่มีความชำนาญในการสร้างโฟลเดอร์สามารถทำตามขั้นตอนต่อไปนี้


การสร้างโฟล์เดอร์ที่ไดร์ฟ D ทำได้ดังนี้
1.1 นำเมาส์ไปดัีบเบิ้ลคลิกที่
      สัญลักษณ์ My Computer
1.2 ดับเบิล์คลิกที่ไดร์ฟ D
1.3 คลิกขวาในพื้นที่หน้าต่าง ๆ
     ที่เป็นที่ว่างของไดร์ฟ D
1.4 คลิกที่รายการ New
1.5 เลื่อนเมาส์ไปคลิกที่รายการ
      Folder

1.6 พิมพ์ชื่อโฟลเดอร์ที่ต้องการ ตาม
ตัวอย่างนี้  คือ  HTML1 เมื่อพิมพ์ชื่อ
เสร็จ ให้กดปุ่ม  ENTER 1ครั้งจะได้
โฟลเดอร์ใหม่ชื่อว่า HTML1หลังจาก
นั้นควรเก็บข้อมูลทุกอย่าง เกี่ยวกับ
การสร้างเว็บเพจ ไม่ว่าจะเป็น รูปภาพ
ภาพพื้นหลัง เสียงเพลง หรือ แม้แต่
่ไฟล์เว็บเพจ ที่สร้างขึ้นด้วยภาษา
HTML ต้ัองนำมาเก็บรวมไว้ในโฟลเดอร์
เดียวกันนี้ทั้งหมด   เพื่อการทำงานต่าง ๆ
ของเว็บเพจจะได้ไม่มีข้อผิดพลาด

คลิกที่นี่ ครูจะสาธิตวิธีการทำงานให้ดู.... เมื่อดูจบแล้วคลิกปิดหน้าต่างด้วยนะครับ

 

2.สร้างเว็บเพจ ด้วยการเขียนภาษา HTML ลงในโปรแกรม Text Editor
(ในที่นี้เราจะใช้โปรแกรม Notepad)
       โปรแกรม Notepad เป็นโปรแกรมที่มีอยู่ในเครื่องคอมพิวเตอร์ทุกเครื่องเป็นโปรแกรมพื้นฐานการเรียกใช้งานทำดังนี้

การเรียกใช้งานโปรกรม Notepad
2.1 คลิกที่ปุ่ม Start บน Task Bar
2.2 เลื่อนเมาส์ไปชี้ที่    รายการเมนู Programs
และเลื่อนเมาส์ไปชี้ที่รายการเมนู Accessories
2.3 เลื่อนเมาส์ไปชี้ที่รายการเมนู Notepad
2.4 โปรแกรม Notepad จะปรากฎขึ้นมาที่
      จอภาพหลังจากนั้นสามารถพิมพ์คำสั่งใน
      ภาษา HTML ตามโครงสร้างของภาษา
      HTML ลงในหน้าต่างของโปรแกรมเพื่อ
      สร้างเว็บเพจต่อไป
2.5 เมื่อพิมพ์คำสั่งตามโครงสร้างของ
  ภาษา HTML เสร็จแล้วให้ทำการจัดเก็บ
  โดย จัดเก็บไปยังไดร์ฟ   D: ในโฟล์เดอร์
  HTML1 ที่เรา สร้างขึ้นที่ ไดร์ฟ D โดย
  การคลิกเมาส์ที่ แถบเมนู รายการ File
  และคลิกที่เมนู Save

2.6 การเลือกรายการ  Save   จะให้ตั้ง
  ชื่อไฟล์    ครั้งแรกครั้งเดียว หากมีการ
  แก้ไข แล้วทำการจัดเก็บ ในครั้งต่อไป
  ด้วยการเลือก Save  เครื่องจะจัดเก็บ
  โดยการทับชื่อเดิมจะไม่มีการให้ตั้งชื่อ
  ไฟล์ ถ้าหากต้องการจัดเก็บในชื่ออื่น ๆ
  ให้เลือกรายการ Save As แืทน หาก
  ตั้งชื่อซ้ำกับชื่อเดิมที่มีอยู่ ระบบจะถาม
  ให้ยืนยันว่าจะจัดเก็บทัีบข้อมูลเก่าหรือไม่

           เมื่อเข้ามาสู่หน้าต่างการจัดเก็บ
ข้อมูลให้เลือกโฟลเดอร์ที่ต้องการ จัดเก็บ
ก่อนดังภาพ
2.7    ให้ตั้งชื่อไฟล์เว็บเพจที่เราสร้างขึ้น
   โดยให้พิมพ์นามสกุลของไฟล์ลงไปด้วย
   โดยพิมพ์  .html   ต่อท้ายชื่อไฟล์และ
   คลิกปุ่ม Save ดังภาพ ในที่นี้จะตั้งชื่อ
   เว็บเพจว่า MyWeb1.html
คลิกที่นี่ ครูจะสาธิตวิธีการทำงานให้ดู.... เมื่อดูจบแล้วคลิกปิดหน้าต่างด้วยนะครับ

3.ทดสอบผลการทำงานด้วยโปรแกรม Web Browser
      เมื่อทำการสร้างเว็บเพจด้วยภาษา HTML และทำการจัดเก็บไฟล์ดังกล่าวแล้ว ให้ทดสอบผลการทำงานได้โดยการ
ใช้โปรแกรม Web Browser แสดงผลการทำงานดังกล่าว ในที่นี้เราจะใช้โปรแกรม Internet Explorer

การเรียกใช้งานโปรแกรม Internet Explorer
3.1 ดับเบิิ้ลคลิกเพื่อเรียกใช้งานโปรแกรม
       Internet Explorer
3.2 คลิกเมาส์ที่รายการเมนู File
       และคลิกเมาส์ที่ รายการ Open
3.3 คลิกปุ่ม Browse...
3.4 เลือกไดร์ฟ D: และโฟล์เดอร์ HTML1
      ที่เก็บไฟล์ MyWeb1.html หลังจากนั้น
      ให้คลิกเลือกชื่อไฟล์เว็บเพจที่เราสร้างไว้
      แล้วคลิก Open
3.5     ถ้าหากไม่พบไฟล์เว็บเพจที่เราสร้าง
     ไว้ใน โฟล์เดอร์ ให้คลิกเลือกรายการใน
     Files of typeให้เป็น HTML File หรือ
     All File   จะพบไฟล์ข้อมูล ที่เราสร้างไว้
     ให้ดับเบิลคลิกที่ชื่อไฟล์ หรือ คลิก 1ครั้ง
     ที่ชื่อไฟล์  และไปคลิกที่ปุ่ม  Open อีก
     1 ครั้ง ก็ได้ ทำได้ 2 กรณี


3.6 จากนั้นจะปรากฏที่หน้าจอดังภาพ
      ให้คลิกที่ ปุ่ม OK
3.7 จะแสดงผลการทำงาน ในการสร้าง
      เว็บเพจ ด้วยภาษา HTML ออกทาง
      โปรแกรม Internet Explorer หาก
      มีการแสดงผลการทำงานที่ผิดพลาด
      ไม่ตรงกับความต้องการ   ให้กลับไป
      แก้ไข้ในโปรแกรม  Notepad ใหม่
      อีกครั้งและทำการจัดเก็บ    (Save)
      ทุกครั้งและใช้โปรแกรม   Internet
      Explorer เรียกดูผลการทำงานใหม่
      อีกครั้ง
คลิกเพื่อดูผลการทำงานในโปรแกรม Internet Explorer
คลิกที่นี่ ครูจะสาธิตวิธีการทำงานให้ดู... เมื่อดูจบแล้วคลิกปิดหน้าต่างด้วยนะครับ

ข้อควรจำ...!

ในการสร้างเว็บเพจสรุปขั้นตอนได้ดังนี้
        1.สร้างโฟล์เดอร์เพื่อเป็นที่เก็บข้อมูลต่าง ๆ
        2.สร้างเว็บเพจด้วยโปรแกรม Notepad และทำการจัดเก็บในโฟล์เดอร์ที่สร้างขึ้นในข้อ 1
        3.ดูผลลัพธ์จากการสร้างเว็บเพจ ให้เปิดโปรแกรม Internet Explorer และเปิดงานเว็บเพจที่สร้างขึ้น
            ในข้อ 2 ขึ้นมาดูผลการทำงาน

       หากพบข้อผิดพลาด ให้กลับไปเปิดโปรแกรม Notepad เพื่อเรียกงานเว็บเพจนั้นขึ้นมาแก้ไข และการแก้ไข
ต้องมีการจัดเก็บ (Save)  ทุกครั้ง หลังจากนั้นใช้โปรแกรม  Internet Explorer   เปิดงานที่แก้ไขแล้วขึ้นมาดู หาก
มีข้อผิดพลาดอีก ก็ให้ใช้โปรแกรม Notepad แก้ไข โดยจะเห็นว่าเราจะใช้โปรแกรมทั้งสองนี้คู่กัน เราไม่จำเป็นต้อง
ปิดโปรแกรม  เพราะระบบวินโดว์สามารถสลับหน้าต่างของโปรแกรมเพื่อสลับการใช้งานได้  และในการเิปิดดูผลลัพธ์
ผลลัพธ์การสร้างเว็บเพจในโปรแกรม   Internet Explorer   ถ้าหากเป็นงานเดิม     เราไม่จำเป็นต้องไปคลิกที่เมนู
File-open ก็ได้สามารถใช้คลิกเมาส์ที่ปุ่มรีเฟรส (Refresh) เพื่อให้เรียกงานเก่าที่แก้ไขแล้วขึ้นมาดูได้เลย

ปุ่มรีเฟรส (Refresh)

     ฉะนั้นจะเห็นว่า โปรแกรมทั้งสองคือ Notepad และ Internet Explorer จะทำงานคู่กันเสมอ คือ Notepad
ใช้สร้างเว็บเพจและแก้ไข ส่วนโปรแกรม Internet Explorer ใช้สำหรับดูผลการทำงานนั่นเอง