รายวิชา คอมพิวเตอร์ (การเขียนเว็บไซต์โดยใช้โปรแกรม Deramweaver  MX)

เรื่อง
 ความรู้พื้นฐานของการเขียนเว็บไซต  และภาษา Html

1. ความหมายและความสำคัญของ Internet

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

      เว็บไซต์ (Web site) เป็นที่เก็บเว็บเพจ เมื่อใดที่เราต้องการเปิดดูเว็บเพจ เราต้องใช้บราวเซอร์ดึงข้อมูล โดยบราวเซอร์จะทำการติดต่อกับเว็บไซต์นั้นเพื่อให้มีการโอนย้ายข้อมูลมาแสดงที่เครื่องของเรา โดยตัวเว็บบราวเซอร์จะมีความเข้าใจในภาษามาตรฐานของเว็บก็คือภาษา HTML และสามารถแปลงภาษา HTML ให้กลายเป็นหน้าเอกสารสวยงามให้เราชมได้ โปรแกรมบราวเซอร์ได้แก่ Internet Explorer, Netscape นอกจากนี้ยังมี Opera อีกด้วย

      เว็บเพจ (Web Page) คือ เอกสารที่เปิดดูในเวิลด์ไวด์เว็บ เราจะเรียกสั้นๆว่าเว็บเพจ ส่วนใหญ่
จะถูกสร้างขึ้นจากภาษาคอมพิวเตอร์ ที่เรียกว่า HTML (Hypertext Markup Language) ภาษา HTML นี้จะกำหนดรูปแบบและหน้าตาของเอกสาร เว็บที่ ปรากฏ บนหน้าจอ และเชื่อมต่อเว็บเพจกับข้อมูลอื่นๆ

      โฮมเพจ (Home Page) หากเรานำหนังสือเล่มหนึ่ง มาพิจารณาจะพบว่า หน้าปกหนังสือมีความสำคัญมาก เพราะจะต้องสื่อเนื้อหา หลักของหนังสือในรูปแบบที่ สะดุดตา และจูงใจคนให้เปิดอ่านถ้าเราเปรียบเว็บไซต์เป็น เสมือนกับหนังสือ ที่ประกอบด้วยเว็บเพจจำนวนมากนั้น โฮมเพจก็คือ เว็บเพจหน้าแรกที่มีหน้าที่คล้ายกับปกหนังสือนั่นเอง เมื่อเราเปิดดูโฮมเพจเราอาจจะพบ คำแนะนำการใช้งาน สรุปสิ่งที่น่าสนใจในเว็บไซต์ไปจนถึงหัวข้อที่เชื่อม ต่อไปยังเว็บเพจอื่น

2. ประโยชน์ของ Internet
      เราสามารถใช้อินเทอร์เน็ตได้หลายด้าน ขั้นกับลักษณะการใช้งานของเรา ซึ่งสามารถ
สรุปเป็นแนวทางดังนี้
      2.1 สื่อสารกับผู้อื่น
            เราสามารถใช้อินเทอร์เน็ตสื่อสารกับผู้อื่นได้ไม่ว่าจะอยู่ไกลเพียงใดก็ตาม ซึ่งนอก
จากการส่งเป็นจดหมายอิเลคทรอนิกส์ (E-Mail) การ์ดอวยพรที่มีเสียงและภาพเคลื่อนไหว หรืออาจใช้เสียง ภาพ และข้อความสื่อสารกันแบบทันทีได้ ซึ่งนอกจากจะติดต่อกับคนที่เรารู้จักอยู่แล้ว เราสามารถหาเพื่อนใหม่ในอินเทอร์เน็ต และแลกเปลี่ยนความคิดเห็นกับเขาได้ด้วยโปรแกรมสนทนาที่อยู่บนอินเทอร์เน็ตได้อีกด้วย
      2.2 แหล่งความรู้
            อินเทอร์เน็ตเป็นเหมือนแหล่งความรู้ที่มีข้อมูลมากมายที่เราสามารถนำมาใช้ได้ ซึ่ง
ไม่เป็นเพียงข้อความเท่านั้น แต่มีทั้งเสียง ภาพ ภาพยนตร์ แหล่งข่าวสารและความบันเทิง เราสามารถติดตามข่าวล่าสุด ดูหนังฟังเพลง และภาพยนต์ล่าสุด ไม่ว่าจากในประเทศหรือต่างประเทศได้
      2.3 จับจ่ายสินค้าและบริการ
            อินเทอร์เน็ตเป็นแหล่งจับจ่ายสินค้าและบริการมากมาย ซึ่งปัจจุบันมีบริษัทนับหมื่น
ที่ได้หันมาประชาสัมพันธ์ตัวเอง และให้บริการลูกค้าบนอินเทอร์เน็ตตลอด 24 ชั่วโมง เราสามารถขอข้อมูลสินค้าและเปรียบเทียบราคาสินค้าได้อย่างสะดวก และเมื่อชอบใจสินค้าใดก็สั่งซื้อทางอินเทอร์เน็ตได้เลย
      2.4 ศูนย์รวมสารพัดโปรแกรม และเกม
            ในอินเทอร์เน็ตมีโปรแกรมใช้งานและเกมมากมายที่เราสามารถนำมาใช้ได้ มีทั้ง
โปรแกรมประเภท Freeware ที่เรานำมาใช้ได้ฟรี หรือโปรแกรมประเภทแชร์แวร์ ที่ให้เราทดลองใช้งานก่อนและซื้อมาใช้จริงหลังหมดเวลาทดลอง
3. รู้จักกับ Html และโครงสร้าง Html พื้นฐาน
      เอกสารที่เราเปิดดูในเว็บเพจซึ่งส่วนใหญ่จะถูกสร้างขึ้นจากภาษาคอมพิวเตอร์ที่เรียกว่า
HTML ซึ่งจะกำหนดรูปแบบและหน้าตาของเว็บเพจที่ปรากฏบนหน้าจอและส่วนที่เชื่อมต่อกับเว็บเพจอื่น
      3.1 รู้จักกับภาษา Html
            HTML ย่อมาจากคำว่า Hypertext Markup Language เป็นภาษาหลักที่ใช้ใน
การแสดงผลบนเว็บบราวเซอร์ในอินเทอร์เน็ต โดยเราสามารถนำเสนอข้อมูลที่มีทั้งตัวอักษร ภาพ เสียง ภาพยนตร์ ก็เหมือนๆกับการเขียนโปรแกรมทั่วๆไปที่จะต้องมีการกําหนดค่าต่างๆไว้ ทั้งการจะแสดงรูปภาพหรืออะไรสักอย่างบน Browse ก็ต้องกําหนดคําสั่งต่างๆให้ด้วยโดยมากแล้วจะเขียนขึ้นมาจากโปรแกรม Notepad หรือ Word แล้วเมื่อเขียนเสร็จก็เซฟให้เป็นไฟล์ HTML
          ภาษา HTML แบ่งออกเป็น 2 ส่วนคือ ส่วนที่เป็นข้อความทั่วๆ ไป และส่วนที่เป็นคำสั่งที่ใช้ในการกำหนดรูปแบบของข้อความที่แสดง ซึ่งเราเรียกว่า แท็ก (Tag) โดยคำสั่ง HTML จะอยู่ในเครื่องหมาย < และ > และส่วนจบจะต้องมีเครื่องหมาย Slash (/) ดังนี้
<คำสั่ง> ข้อความ </คำสั่ง>
       3.2 โครงสร้าง HTML พื้นฐาน
โครงสร้างของภาษา HTML แบ่งออกได้เป็น 4 ส่วนหลัก ดังนี้
<html>
      <head>
            <title>Ohhhhh Natcity!!!</title>
      </head>
      <body bgcolor="#FFFFFF"> --- ช่วงนี้คือโค้ดที่แทรกมาเพื้อกําหนดสีของ Background
ส่วนที่มีเนื้อหา และข้อมูลเกี่ยวกับ ภาพ Link ที่ปรากฏในเว็บเพจ
      </body>
</html>

      ส่วนโค้ดที่แทรกลงในช่วง<body>...</body>จะมาปรากฎบนหน้าเว็บเพจ ส่วนภาษาอื่นๆไม่ว่าจะเป็น DHTMl, XML, Java Script, Java Applet, ASP หรือแม้แต่ CGI ต่างก็ต้องมาแทรกโค้ดเอาไว้ในช่วง <head> ไม่ก็ <body> กันทั้งนั้น สําหรับคนที่ต้องการจะศึกษาโค้ด HTML เอาเองเวลาเยี่ยมชมเว็บไซต์ ก็สามารถดูโค้ดของเค้าได้โดยการคลิ๊กที่ View แล้วเลือก
Source มันก็จะแสดงโค้ดทั้งหลายทั้งปวงของเว็บนั้นขึ้นมาให้ดู แต่ตอนนี้เรามี Dreamweaver อยู่แล้วก็คงไม่ต้องศึกษากันมากก็ได้ แต่หากใครอยากศึกษาดูก็ไม่เป็นไรแต่ขอบอกไว้อย่างนึงเมื่อคุณต้องการใส่ลูกเล่นอะไร คุณก็ต้องเป็นผู้แทรกโค้ดเอาเอง
แนะนำคำสั่งภาษา HTML เพิ่มเติม
      <BR> ขึ้นบรรทัดใหม่
      <P> ขึ้นย่อหน้าใหม่
      <HR> ขีดเส้นคั่นบรรทัด
      <FORT COLOR> ใส่สีให้กับตัวอักษร
      <FORT SIZE> เพิ่มขนาดให้กับตัวอักษร
      <CENTER> จัดข้อความให้อยู่กึ่งกลาง
      <IMG SRC> แทรกรูปภาพลงในโฮมเพจ
      <A HREF="http://www.yahoo.com">YAHOO</A> เชื่อมโยงข้อมูลไปยังโฮมเพจอื่น ๆ ฯลฯ