หน่วยที่ 1-1 อินเ่ทอร์เน็ตและโครงสร้างภาษา HTML (เนื้อหาบทเีรียน)

ความรู้เบื้องต้นเกี่ยวกับอินเทอร์เน็ต

อินเทอร์เน็ต

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

                  ระบบอินเทอร์เน็ต ช่วยให้สามารถเคลื่อนย้ายข่าวสารข้อมูลจากที่หนึ่งไปยังอีกที่หนึ่งได้ โดยไม่จำกัดระยะทาง และสามารถส่งข้อมูลได้หลายรูปแบบ ทั้งข้อความ 
ตัวหนังสือ ภาพ และเสียง โดยอาศัยเครือข่ายโทรคมนาคมเป็นตัวเชื่อมเครือข่าย ภายใต้มาตรฐานการเชื่อมโยงเดียวกันคือ TCP/IP (Transmission Control 
Protocol / Internet Protocol) เพื่อให้คอมพิวเตอร์ทุกเครื่องในอินเทอร์เน็ตสามารถสื่อสารระหว่างกันได้

ภาพแสดงร ะบบการสื่อสารกับการเชื่อมต่ออินเทอร์เน็ต

       2) เว็บไซต์ (Web Site) 
                  เว็บไซต์ คือ แหล่งที่เก็บรวบรวมข้อมูลเอกสารและสื่อประสมต่าง ๆ (รูปภาพ,เสียง,ข้อความ) ของแต่ละบริษัทหน่วยงาน หรือบุคคลโดยเรียกเอกสารต่าง ๆ
เหล่านั้นว่า Web Page และเรียก WebPage หน้าแรกของแต่ละ Web site ว่า Home Page ซึ่งเจ้าของจะเป็นผู้ดูแลรักษาและปรับปรุงข้อมูลเอง
โดยเจ้าของเว็บไซต์ดังกล่าวอาจจะเป็นองค์กรของรัฐหรือเอกชน หรือเว็บไซต์ส่วนบุคคลก็ได้

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

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

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

        6) HyperText Markup Language (HTML) 
                 เป็นภาษามาตราฐานที่ใช้ในการสร้างเว็บเพจ (Web Page) ซึ่งสามารถ กำหนดการเชื่อมต่อไปยังเว็บเพจ (Web Page) ต่าง ๆ ได้ โดยใช้ Hyper Text
Links นั่นเอง

        7) เว็บเบราเซอร์ (Web Browser)
                  เป็นโปรแกรมทีใช้ในการท่องโลก World Wide Web เพื่อดูข้อมูลข่าวสารต่างๆ บนอินเตอร์เน็ต หรือกล่าวได้ว่าเบราเซอร์ เป็นโปรแกรมใช้เปิดดูเว็บเพจ
นั่นเอง มีหลายโปรแกรมที่นิยมใช้ในปัจจุบันได้แก่ Microsoft Internet Explorer,Netscape Navigator

        8) โปรโตคอล (Protocol) 
                 โปรโตคอล คือ ระเบียบ วิธีการหรือภาษาที่ใช้ในการติดต่อสื่อสารระหว่าง เครื่องคอมพิวเตอร์ต่างๆ ที่อยู่ในระบบ ซึ่งในอินเตอร์เน็ตนั้นมีอยู่ด้วยกัน
หลายโปรโตคอล (Protocol) ได้แก่ 
             8.1) Transmission Control Protocol / Internet Protocol (TCP/IP)TC/IP ประกอบด้วย 2 โปรโตคอล คือ TCP และ IP โดยที่ 
                     8.1.1) TCP ทำหน้าที่ส่งข้อมูลจากเครื่องของเราไปยังอินเตอร์เน็ต 
                     8.1.2) IP เป็นโปรโตคอลที่ใช้สื่อสารกันบนอินเตอร์เน็ต TCP/IP เป็นโปรโตคอลมาตราฐานที่ใช้ติดต่อกันบนอินเตอร์เน็ต 
                                HyperText Transfer Protocol (HTTP) ใช้สำหรับการส่งเอกสารHyperText ที่ถูกเขียนด้วยภาษา HTML จากเครื่องหนึ่งไปแสดง
บนเว็บเบราเซอร์ในคอมพิวเตอร์อีกเครื่องหนึ่ง 
             8.2) File Transfer Protocol (FTP)โปรโตคอลนี้จะใช้สำหรับการถ่ายโอนไฟล์ระหว่างเครื่องคอมพิวเตอร์เท่านั้น 
             8.3) Post Office Protocol (POP3)โปรโตคอล สำหรับสื่อสารกับ Mail Server เพื่อรับข้อมูลหรือรับ E-mail จาก Mail Server 
             8.4) Simple Mail Transfer Protocol (SMTP)โปรโตคอล สำหรับสื่อสารกับ Mail Server เพื่อส่งข้อมูลหรือส่ง E-Mail จาก Mail Server 
ให้แก่ผู้รับ

         9) Uniform Resource Locator (URL) 
                   เป็นรูปแบบการระบุตำแหน่งหรือที่อยู่ของ Resource ต่าง ๆ บนอินเตอร์เน็ตซึ่ง Resource ในที่นี้หมายถึงไฟล์หรือเอกสารต่างๆ โดย URL แบ่งได้เป็น 
3 ส่วนย่อย ๆ ดังนี้ 
               9.1)  Protocol สำหรับระบุถึงโปรโตคอลที่ใช้ในการสื่อสารของเว็บไซต์ 
               9.2)  Domain Name ชื่อของเครื่องคอมพิวเตอร์ที่เก็บไฟล์ 
               9.3)  File Locate ส่วนนี้สำหรับระบุตำแหน่งของไฟล์ที่อยู่ในเว็บไซต์แบ่งได้เป็น 2 ส่วนคือ 
                             9.3.1) Path ระบุถึง Directory ที่เก็บไฟล์ที่ใช้ในเว็บไซต์ของเรา 
                             9.3.2) File Name ชื่อของไฟล์ที่อ้างถึง

         10) Domain Name 
                   โดเมนเนม หมายถึง ชื่อที่ใช้ประกาศความเป็นตัวตนบนโลกอินเทอร์เน็ต โดยจะต้องมีการจดทะเบียนโดเมนเนมบนอินเทอร์เน็ต ซึ่งสามารถจดทะเบียนได้จาก
เว็บไซต์ที่ให้บริการด้านการจดทะเบียน เช่น ถ้าเป็นพวก .th การจดทะเบียนที่ www.thnic.co.th ปัจจุบันสามารถกำหนดชื่อโดเมนเป็นภาษาไทยได้

         11) E-Commerce (Elertronic Commerce) 
                    คือ การทำธุรกรรม อะไรก็ได้โดยใช้สื่ออินเทอร์เน็ต

           12) Download
                     คือการย้ายข้อมูลของคอมพิวเตอร์ที่ไกลออกไปมาไว้ที่เครื่องคอมพิวเตอร์ท้องถิ่น (Local) โดยทั่วไปหมายถึง การรับข้อมูลจากคอมพิวเตอร์เครื่องอื่น
ที่อยู่ห่างไกลออกไป มาเครื่องอีกเครื่องหนึ่ง หรือเครื่องที่เรากำลังใช้งานอยู่ ซึ่งตรงข้ามกับ Upload

           13) Upload
                      เป็นการส่งข้อมูลจากเครื่องคอมพิวเตอร์เครื่องหนึ่งไปยังคอมพิวเตอร์อีกเครื่องหนึ่งที่อยู่ห่างไกลออกไป หรือเป็นการส่งข้อมูลจากเครื่องคอมพิวเตอร์ที่เรา
กำลังใช้งานอยู่ไปยังคอมพิวเตอร์เครื่องอื่นในระบบอินเทอร์เน็ต

โครงสร้างของภาษา HTML

HTML ย่อมาจาก Hyper Text Markup Language เป็นโปรแกรมภาษาประเภทหนึ่งสำหรับแสดงข้อความต่าง ๆ ในรูปแบบข้อความ รูปภาพ หรือภาพ เคลื่อนไหว ฯลฯ และสามารถเชื่อมโยงข้อมูลไปยังเอกสารอื่นได้ที่มีความสามารถสูงเหนือกว่าเอกสารทั่วไป เพราะสามารถเปิดดูข้อความภายในได้ ทำได้โดยการใส่คำสั่งลงไป ในเอกสาร ซึ่งเรียกว่า แท็ก (TAG) และการนำเอกสารมาแสดงบนหน้าจอภาพในระบบอินเทอร์เน็ตได้ โดยไม่ผ่านการแปลโปรแกรม (Compile) เอกสารก่อน สามารถเรียก ดูผลได้บนอินเทอร์เน็ตได้บนโปรแกรมเบราเซอร์ได้เลย เช่น โปรแกรม Internet Explorer, Mozilla Firefox, Opera, Netscape เป็นต้น

โครงสร้างของเอกสาร HTML ในเว็บเพจหนึ่งๆ ประกอบด้วยส่วนสำคัญอยู่ 3 ส่วนคือ              1. ส่วนประกาศ ที่กำหนดให้บราวเซอร์ทราบว่าเป็นแฟ้มข้อมูลชนิด HTML ซึ่งจะมีแท็ก  <html> ... </html> กำกับอยู่ที่จุดเริ่มต้นและจุดสิ้นสุดของแฟ้มข้อมูล              2 . ส่วนหัวเรื่อง (HEAD) เป็นส่วนที่กำหนดให้ข้อความแสดงชื่อเว็บเพจนั้นๆ ไปปรากฏที่ส่วนแถบชื่อของบราวเซอร์ และเก็บแท็กพิเศษอื่น ๆ ซึ่งจะมีแท็ก <head> ... </head> กำกับอยู่              3. ส่วนเนื้อหา (BODY)  เป็นส่วนที่แสดงเนื้อหาของเว็บเพจทั้งหมดซึ่งประกอบด้วยประกอบด้วยแท็กต่างๆ เพื่อให้การแสดงผลมีความสวยงามสะดุดตา เช่น  ข้อความ ตาราง รูปภาพ กราฟิกต่าง ๆ สีของตัวอักษร สีพื้น เป็นต้น ภาพแสดงโครงสร้างภาษา HTML

ตัวอย่างเว็บเพจ

การใช้โปรแกรม Notepad Notepad จัดเป็นโปรแกรมประเภท Text Editor สามารถสร้างไฟล์หรือเขียนภาษา HTML ได้ และ Notepad นี้เป็น โปรแกรม ที่นิยมใช้ในการเขียน โฮมเพจ สามารถใช้งานได้ง่าย และเป็นโปรแกรมที่ติดตั้งมาพร้อมกับระบบ Windows              การเรียกใช้งานโปรแกรม Notepad สามารถทำได้ดังนี้                       คลิกที่ Start --> เลือก Programs --> เลือก Accessories --> เลือก Notpad

ภาพแสดงขั้นตอนการเข้าสู่โปรแกรม Notepad             เมื่อทำการเรียกใช้โปรแกรม Notepad จะปรากฎหน้าจอภาพ ดังรูป      ภาพแสดงหน้าจอภาพของโปรแกรม Notepad            โปรแกรม Notepad บางครั้งขนาดตัวอักษรจะเล็กเกินไปหรือใหญ่เกินไป และรูปแบบตัวอักษรอ่านยาก อักษรบางรูปแบบไม่สามารถพิมพ์ภาษาไทยได้ การปรับขนาด และรูปแบบตัวอักษร สามารถทำได้ดังนี้            1. เลือกคำสั่ง Format แล้วคลิ๊กที่คำสั่ง Font..            2. ทำการเลือก Font และ Size ตามต้องการ  ดังภาพ

1. การบันทึกแฟ้ม HTML                       ในการบันทึกแฟ้มเอกสารของภาษา HTML จะต้องใส่นามสกุลเป็น .htm   หรือ html จะเป็นตัวพิมพ์เล็กหรือพิมพ์ใหญ่ก็ได้ มีขั้นตอนการบันทึก ดังนี้                            1) คลิกที่เมนู File                             2) เลื่อนเมาส์มาที่ Save                             3) ในช่อง Save in ให้ทำการเลือกไดรฟ์และโฟล์เดอร์ที่จะบันทึก                            4) ในช่อง File name ให้พิมพ์ชื่อไฟล์พร้อมนามสกุล .htm หรือ .html                             5) คลิกที่ปุ่ม Save                      ดังภาพ ภาพแสดงขั้นตอนการบันทึกแฟ้ม HTML

2. การเปิดแฟ้ม HTML                          เป็นการนำแฟ้มมาทำการแก้ไข เปลี่ยนแปลง หรือเพิ่มข้อมูลลงไป ซึ่งการเปิดแฟ้มของโปรแกรม Notepad จะเหมือนกับโปรแกรมอื่น ๆ เช่น  Microsoft Word, Microsoft Excel ฯลฯ แต่จะต้องบอกประเภทของแฟ้มก่อน ซึ่งมีขั้นตอน ดังนี้                            1) คลิกที่เมนู File                             2) เลื่อนเมาส์มาที่ Open                             3) ในช่อง Save in ให้ทำการเลือกไดรฟ์และโฟล์เดอร์ที่จะเปิดแฟ้ม                            4) ในช่อง File of type ให้เลือกประเภท All Files                              5) คลิกไฟล์ที่ต้องการเปิด                             6) คลิกที่ปุ่ม Open                ดังภาพ ภาพแสดงขั้นตอนการเปิดแฟ้ม HTML

ขอบคุณที่มาจาก http://www.kty.ac.th/html/index.html