ใบความรู้ที่ 1.1
เรื่องความรู้พื้นฐานก่อนสร้างเว็บไซต์

เว็บไซต์เผยแพร่ทางอินเทอร์เน็ตได้อย่างไร
การที่เว็บไซต์สามารถเผยแพร่ผ่านเครือข่ายอินเทอร์เน็ตให้นักท่องเว็บเข้าไปเปิดดูได้นั้น  องค์ประกอบของการเผยแพร่เว็บไซต์ประกอบด้วยส่วนสำคัญ  4  ส่วน  คือ
      1    เว็บเพจ (Web Page) คือ ไฟล์ HTML ของหน้าเว็บที่คุณสร้างขึ้นนั่นเอง
      2    บราวเซอร์ (Browser) คือ โปรแกรมที่คุณใช้ในการเปิดไฟล์ HTML(หรือเปิดหน้าเว็บเพจ) เช่น โปรแกรม Internet Explorer หรือ Netscape Navigator
      3    เครือข่ายอินเทอร์เน็ต (Internet) คือ เครือข่ายที่ใช้ในการส่งผ่านเว็บเพจและข้อมูล   ต่าง ๆ ระหว่างเครื่องคอมพิวเตอร์ที่เชื่อมต่อกันอยู่ในเครือข่าย
      4    เว็บเซิร์ฟเวอร์ (Web Server) คือ เครื่องคอมพิวเตอร์ที่ติดตั้งโปรแกรมสำหรับทำหน้าที่เก็บไฟล์ของเว็บไซต์ต่าง ๆ เอาไว้ และให้บริการ เมื่อมีการร้อง
ขอเพื่อเปิดดู
อินเทอร์เน็ตและบริการ
อินเทอร์เน็ตเป็นเครือข่ายที่เกิดจากการนำเครื่องคอมพิวเตอร์มาเชื่อมต่อเข้าหากันโดย      การทำงานหรือติดต่อสื่อสารระหว่างแต่ละเครื่องในเครือข่ายอินเทอร์เน็ตจะต้องกระทำผ่านโปรโตคอล (Protocol) โดยโปรโตคอลเป็นกฎหรือข้อกำหนดที่ใช้เป็นมาตรฐานในการติดต่อสื่อสารระหว่างเครื่องคอมพิวเตอร์บนระบบเครือข่าย เช่น ถ้าต้องการส่งไฟล์จากเครื่องของคุณขึ้นไปบนเซิร์ฟเวอร์ (Server) จะต้องทำตามกฎหรือข้อกำหนดของโปรโตคอล FTP หรือ         การติดต่อสื่อสารในระบบเครือข่ายอินเทอร์เน็ตจะต้องทำการกฎหรือข้อกำหนดของโปรโตคอล    TCP/IP เป็นต้น
อินเทอร์เน็ตถือกำหนดขึ้นในปี ค.ศ. 1969 โดยเริ่มมาจากเครือข่ายที่ชื่อ Arpanet ซึ่งเป็นเครือข่ายทดลองของกระทรวงกลาโหมของสหรัฐอเมริกา ที่เชื่อมต่อระหว่างเครื่องคอมพิวเตอร์ของกระทรวงกับศูนย์ปฏิบัติการของมหาวิทยาลัยต่าง ๆ ในสหรัฐอเมริกา ต่อมาได้รับความสนใจมากขึ้นเรื่อย ๆ ระบบจึงเติบโตขึ้นอย่างไม่มีขีดจำกัด จนกลายมาเป็นระบบอินเทอร์เน็ตในปัจจุบัน
บริการบนอินเทอร์เน็ต
สิ่งที่อินเทอร์เน็ตได้รับความนิยมมากที่สุดคือ ประโยชน์และบริการที่มีอยู่มากมายซึ่งบริการทั้งหมดบนอินเทอร์เน็ตสามารถแบ่งได้  2 กลุ่มคือ บริการด้านการสื่อสารและแลกเปลี่ยนข้อมูลและบริการค้นหาข้อมูล โดยบริการสำคัญบนอินเทอร์เน็ตแสดงได้ดังนี้
      1.   จดหมายอิเล็กทอร์นิกส์(E-mail)
      2.   กระดานข่าวอิเล็กทรอนิกส์(Usenet)
      3.   โอนถ่ายข้อมูลระหว่างเครื่อง(FTP)
      4.   สนทนาผ่านระบบออนไลน์(IRC)
      5.   World Wide Web (WWW)
จะสร้างเว็บควรรู้จักคำเหล่านี้
      1.   เว็บไซต์ (Website) คือ ทุกสิ่งทุกอย่างที่ประกอบขึ้นมาเป็นเว็บของคุณหมายถึงเว็บเพจทุกหน้า รูปทุกรูปที่นำเข้ามาใช้  ไฟล์เสียง รูปเคลื่อไหวและส่วนประกอบอื่น ๆ ที่นำมาใช้
      2.  เว็บเพจ (Web Page) คือ เว็บหนึ่งหน้า ที่คุณเห็นผ่านบราวเซอร์ ซึ่งก็คือ ไฟล์ HTML ไฟล์ที่แสดงผลบนบราวเซอร์  ถ้าจะเปรียบเทียบเว็บเพจก็คือ
หนังสือหน้าหนึ่งในเล่มนั่นเอง
      3.   โฮมเพจ (Homepage) คือ เว็บเพจหน้าแรกของเว็บไซต์ หรือเปรียบเทียบได้กับหน้าปกของหนังสือ
      4.   URL คือ มาตรฐานในการกำหนดที่อยู่ของเว็บไซต์ในเครือข่ายอินเทอร์เน็ตหรือเรียกอีกอย่างหนึ่งว่า ที่อยู่ของเว็บไซต์ (Internet Address)
      5.   บราวเซอร์ (Browser) คือ โปรแกรมที่ใช้แสดงเว็บเพจ เป็นเสมือนเครื่องมือที่ใช้ใน    การแปลภาษาHTML
      6.   HTML คือ ภาษามาตรฐานที่ใช้ในการสร้างเว็บเพจ เพื่อนำไปแสดงผลบนบราวเซอร์
      7.   FTP  คือ โปรโตคอลหรือมาตรฐานรูปแบบหนึ่งที่ใช้ในการรับ – ส่งข้อมูลระหว่างเครื่อง

คอมพิวเตอร์ผ่านเครือข่ายอินเทอร์เน็ต
8.   เว็บเซิร์ฟเวอร์ (Web Server) คือ เครื่องคอมพิวเตอร์เครื่องหนึ่งในเครือข่ายอินเทอร์เน็ตทำหน้าที่เก็บรวบรวมเว็บไซต์ต่าง ๆ เอาไว้ เพื่อให้ผู้ชมสามารถเข้ามาเปิดดูเว็บไซต์นั้นได้
9.   ชื่อโดเมน (Domain name) คือ ชื่อที่ใช้อ้างอิงถึงเว็บไซต์แทน IP Address เพื่อให้จดจำได้ง่าย โดยรูปแบบของโดเมนประกอบด้วย ชื่อ.รหัสโดเมน เช่น kapook.com

ตัวอย่างรหัสโดเมนแต่ละชนิดซึ่งมีความหมายต่อไปนี้

รหัสโดเมน

ใช้สำหรับ

ตัวอย่าง

com

กลุ่มการค้าและเว็บไซต์ทั่วไป

sun.com, pantip.com

edu

สถาบันการศึกษา

thoburi.edu

gov

หน่วยงานของรัฐบาล

nasa.gov

mil

หน่วยงานทางการทหาร

army.mil

net

หน่วยงานเกี่ยวกับเครือข่าย

isp.net

org

หน่วยงานที่ไม่หวังผลกำไร

unesco.org

co.th

บริษัทที่จดทะเบียนในประเทศไทย

provision.co.th

        ภาพที่ 1.1 รหัสโดเมนแต่ละชนิด
        ที่มา :  นิติยา  อินทรวงค์ (2556)
วางแผนงานในการสร้างเว็บไซต์
สำหรับแผนงานในการสร้างเว็บไซต์แบ่งได้เป็น 3 เฟส โดยแต่ละเฟสก็จะมีขั้นตอนย่อยอยู่ภายใน ดังนี้

  1. สร้างแปลนของเว็บไซต์
    1. สำรวจความต้องการและสร้าง Site map
    2. หาข้อมูล (เนื้อหา + ภาพ)
    3.  หาชื่อโดเมน
  2. ออกแบบและลงมือสร้าง
    1. ออกแบบและตกแต่งเว็บ
    2. สร้างเว็บไซต์ตามที่ออกแบบ
  3. เผยแพร่และโปรโมทเว็บไซต์
         1.  เผยแพร่สู่อินเทอร์เน็ต (Upload)
         2. โปรโมทเว็บไซต์ให้เป็นที่รู้จัก

การสร้างแปลนของเว็บไซต์
        การสร้างแปลนของเว็บไซต์นั้นเป็นตัวบอกว่าเว็บไซต์นั้นจะมีทั้งหมดกี่หน้า การเชื่อมโยงระหว่างแต่ละหน้าเป็นอย่างไร  ภายในหน้านั้นมีรายละเอียดเป็นอย่างไรบ้าง  โดยการสร้างแปลนของเว็บไซต์มีอยู่ 2 ขั้นตอนคือ การสำรวจความต้องการ และการสร้าง Site map  ดังนี้
        1.   สำรวจความต้องการ 
             เพื่อหาจุดมุ่งหมายในการจัดทำเว็บไซต์ ดังนั้นเราต้องตอบคำถามทั้ง 4 ข้อนี้ให้ได้
             1.  เพื่ออะไร
             2.  จุดเด่นและจุดด้อยของเว็บ
             3.  จุดเด่นและจุดด้อยของเว็บใกล้เคียง
             4.  เพื่อใคร

       2.   สร้าง Site map
เมื่อสรุปความต้องการที่ชัดเจนได้แล้ว  ขั้นตอนต่อไปคือ การเขียนแบบร่างออกมาว่าเว็บไซต์ของคุณจะมีกี่หน้า  การเชื่อมโยงระหว่างแต่ละหน้าเป็นอย่างไร  ซึ่งทั้งหมดนี้เรียกรวมกันว่า Site map

 

     
        ภาพที่ 1.2 สร้าง Site map
        ที่มา :  นิติยา  อินทรวงค์ (2556)

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

หาชื่อโดเมนที่คิดว่าเหมาะ
หลักการที่สำคัญในการตั้งชื่อโดเมนมีดังนี้
        1.   ควรสื่อถึงวัตถุประสงค์ของเว็บไซต์
        2.   สะกดและจดจำได้ง่าย
        3.   ไม่ซ้ำกับคนอื่น

ออกแบบและลงมือสร้าง
ตามหลักในการสร้างเว็บนั้นก่อนจะลงมือสร้างจริง  มักจะมีการทำเว็บจำลองหรือที่เรียกว่าmock up ขึ้นมาก่อน  เพื่อดูว่าสวยงามเหมาะสม หรือต้องการแก้ไขปรับปรุงส่วนไหน  โดยต้องสร้าง mock up ทุกหน้าเว็บเพจที่วาดไว้ใน Site map  ในการสร้าง mock up มี  2  วิธี ดังนี้
        1.   วาดในกระดาษ วิธีนี้ง่ายข้อดีคือสร้าง mock up ได้รวดเร็ว แก้ไขเพิ่มเติมสิ่งที่ต้องการง่ายข้อเสียคือกำหนดการวงองค์ประกอบต่าง ๆ ในเว็บเพจได้แค่คร่าว ๆ เท่านั้น
        2.  ออกแบบผ่านโปรแกรมกราฟิกเป็นวิธีมาตรฐานของมืออาชีพ โดยโปรแกรมที่นิยมใช้ใน การออกแบบ mock up ก็คือ Photoshop และ Firework
หรือแล้วแต่ถนัด ข้อดีคือกำหนดส่วนประกอบในเว็บเพจได้ชัดเจน ว่าอยู่ตำแหน่งไหน  มีขนาดเท่าไหร่  ข้อเสียคือต้องมีความรู้   ความชำนาญในการใช้โปรแกรมกราฟิก

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

  1. ข้อความและรูปภาพ ส่วนประกอบพื้นฐานที่สุดของเว็บเพจก็คือข้อความและรูปภาพซึ่ง พบเห็นได้ในทุกเว็บเพจ
  2. ลิงค์ข้อความ ลิงค์ (Link) คือ จุดที่คุณสามารถคลิกเพื่อเปิดเข้าไปยังเว็บเพจหน้าอื่นหรือเว็บไซต์อื่นได้ จุดสังเกตของลิกค์ข้อความก็คือ เมื่อคุณนำเมาส์ไปวางบนข้อความนั้น เคอร์เซอร์     ของเมาส์จะเปลี่ยนเป็นรูปมือ
  3. ลิงค์รูปภาพ ลิงค์รูปภาพ คือ รูปที่ทำหน้าที่เป็นลิงค์ เมื่อคลิกที่รูปจะเป็นการเชื่อมโยงไปยังเว็บเพจหน้าอื่นหรือเว็บไซต์อื่น จุดสังเกตของลิกค์รูปภาพก็คือ เมื่อคุณนำเมาส์ไปวางบนรูปภาพนั้น เคอร์เซอร์ของเมาส์จะเปลี่ยนเป็นรูปมือ
  4. Rollover Image คือ ลูกเล่นรูปแบบหนึ่งที่นำมาใช้ในเว็บเพจ โดยเป็นเทคนิคการใช้รูป 2 รูป มาแสดงผลที่ตำแหน่งเดียวกัน ก่อนนำเมาส์ไปวางที่ตำแหน่งนั้นจะเป็นรูปหนึ่ง แต่เมื่อนำเมาส์ไปวางบนตำแหน่งนั้นรูปจะเปลี่ยนเป็นอีกรูปหนึ่ง
  5. เมนู Pop up เป็นเมนูพิเศษโดยซ่อนรายการตัวเลือกเอาไว้ก่อนเมื่อคุณนำเมาส์ไปวางที่ปุ่มหรือรูปภาพที่เป็นส่วนหัวของเมนูรายการตัวเลือกที่ซ่อนเอา
    ไว้จึงจะปรากฏขึ้นมาเป็นลูกเล่นนิยมนำมาใช้เพื่อประหยัดพื้นที่แสดงรายการตัวเลือก

ส่วนประกอบหน้าเว็บเพจ
        โดยทั่วไปแล้ว หน้าเว็บเพจจะแบ่งออกเป็นส่วนหลัก ๆ ดังนี้คือ
 

        ภาพที่ 1.3 ส่วนประกอบหน้าเว็บเพจ
        ที่มา :  วัศพล โรจน์ประเสริฐสุดและคณะ  (2556)

        1.   ส่วนหัว (Page Header) อยู่ตอนบนสุดของหน้าเว็บเพจ เป็นบริเวณที่สำคัญที่สุด เนื่องจากผู้เข้าเยี่ยมชมเว็บไซต์จะมองเห็นก่อนบริเวณอื่น ส่วนใหญ่นิยมใช้วางโลโก้ ชื่อเว็บไซต์     ป้ายโฆษณา ลิงค์สำหรับการติดต่อ หรือลิงค์ที่สำคัญ และระบบนำทาง
        2.   ส่วนเนื้อหา (Page Body) อยู่ตอนกลางหน้าใช้แสดงเนื้อหาภายในเว็บเพจซึ่งอาจประกอบด้วย ข้อความภาพกราฟิก ตารางข้อมูล และอื่น ๆ บางครั้งเมนูหลักหรือเมนูเฉพาะกลุ่ม   อาจอยู่ในส่วนนี้ก็ได้ โดยมักวางไว้ด้านหน้าซ้ายมือสุดเนื่องจากผู้เข้าชมจะมองเห็นได้ง่าย
        3.   ส่วนท้าย (Page Footer) อยู่ด้านล่างสุดของหน้าเว็บเพจ ส่วนใหญ่จะนิยมใช้วางระบบ นำทางภายในเว็บไซต์แบบที่เป็นลิงค์ข้อความง่าย ๆ นอกจากนี้ก็อาจจะมีชื่อของเจ้าของเว็บไซต์ ข้อความแสดงลิขสิทธิ์ และอีเมล์แอดเดรส(E-mail Address) ของผู้ดูแลเว็บไซต์
        4.   แถบข้าง (Siide Bar) แถบข้างคือส่วนประกอบของ หน้าเว็บเพจ อาจอยู่ทางด้านซ้ายหรือขวาของเว็บเพจก็ได้ปัจจุบันจะนิยมออกแบบด้านข้างของหน้าเว็บเพจให้น่าสนใจเพื่อใช้วางป้ายโฆฆษณา (Bannner) หรือลิงค์แนะนำเกี่ยวกับบริการของเว็บไซต์ เป็นต้น

  เข้าสู่บทเรียนต่อไปคลิก