อินเทอร์เน็ต (Internet)

อินเทอร์เน็ต (Internet) หมายถึง เครือข่ายคอมพิวเตอร์นานาชาติ ที่มีสายตรงต่อไปยังสถาบัน หรือหน่วยงานต่าง ๆ เพื่ออำนวยความสะดวกให้แก่ผู้ใช้ทั่วโลก ผู้ใช้เครือข่ายนี้สามารถสื่อสารถึงกันได้ทางอีเมล สามารถสืบค้นข้อมูลและสารสนเทศ รวมทั้งคัดลอกแฟ้มข้อมูลและโปรแกรมมาใช้ได้ อย่างไรก็ตาม มีผู้เปรียบเทียบว่า ... อินเทอร์เน็ตเป็นเหมือนทางหลวงระหว่างประเทศแต่ละประเทศจะต้องมีถนนเข้ามาเชื่อมต่อเข้าไปในประเทศ กล่าวคือ จะต้องมีเครือข่ายภายในรับช่วงต่ออีกทอดหนึ่ง (เช่น เครือข่ายภายในมหาวิทยาลัย, องค์กร หรือเครือข่ายของผู้ให้บริการอินเทอร์เน็ต) มิฉะนั้นก็จะใช้ไม่ได้ผล

อินเทอร์เน็ต (Internet) คือ เครือข่ายนานาชาติ ที่เกิดจากเครือข่ายขนาดเล็กมากมาย รวมเป็นเครือข่ายเดียวทั้งโลก หรือเครือข่ายสื่อสาร ซึ่งเชื่อมโยงระหว่างคอมพิวเตอร์ทั้งหมด ที่ต้องการเข้ามาในเครือข่าย สำหรับคำว่า internet หากแยกศัพท์จะได้มา 2 คำ คือ คำว่า Inter หมายถึงระหว่างหรือท่ามกลาง และคำว่า Net มาจากคำว่า Network หรือเครือข่าย เมื่อนำความหมายของทั้ง 2 คำมารวมกัน จึงแปลว่า การเชื่อมต่อกันระหว่างเครือข่าย

อินเทอร์เน็ต (Internet) คือ เครือข่ายของเครือข่ายคอมพิวเตอร์ ระบบต่าง ๆ ที่เชื่อมโยงกัน มาจากคำว่า Inter Connection Network

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

 ความสำคัญของอินเทอร์เน็ต

ปัจจุบันอินเทอร์เน็ตมีความสำคัญต่อชีวิตประจำวันของคนเรา หลาย ๆ ด้าน ดังนี้

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

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

          - ด้านการบันเทิง เป็นการใช้เพื่อการพักผ่อนหย่อนใจ สันทนาการ การค้นหาวารสารต่าง ๆ ที่เรียกว่า Magazine Online รวมทั้งหนังสือพิมพ์และข่าวสารอื่น ๆ โดยมีภาพประกอบ ที่จอคอมพิวเตอร์เหมือนกับวารสาร ตามร้านหนังสือทั่ว ๆ ไป

สามารถฟังวิทยุผ่านระบบเครือข่ายอินเทอร์เน็ตได้ สามารถดึงข้อมูล (Download) ภาพยนตร์ตัวอย่างทั้งภาพยนตร์ใหม่ และเก่า มาดูได้

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

          - การประยุกต์ใช้เทคโนโลยีสารสนเทศที่ทันสมัย

          - การติดต่อสื่อสารที่สะดวก และรวดเร็ว           

          - แหล่งรวบรวมข้อมูลแหล่งใหญ่ที่สุดของโลก

การสื่อสารทางอินเทอร์เน็ตมีกี่แบบอะไรบ้าง

โดยทั่วไป มี 5 ประเภท ได้แก่

1. การใช้งานอินเตอร์เน็ตผ่าน Dial Up  เป็นการเชื่อมต่ออินเตอร์เน็ตที่เคยได้รับความนิยมในยุคแรก ๆ โดยใช้เครื่องคอมพิวเตอร์บุคคล กับสายโทรศัพท์บ้านที่เป็นสายตรงต่อเชื่อมเข้ากับโมเด็ม (Modem) ก็สามารถใช้งานอินเตอร์เน็ตได้แล้ว ผู้ใช้บริการอินเตอร์เน็ตต้องทำการติดต่อกับผู้ให้บริการเชื่อมต่ออินเตอร์เน็ตผ่านหมายเลขโทรศัพท์บ้าน โดยผู้ให้บริการเชื่อมต่ออินเตอร์เน็ตจะกำหนดชื่อผู้ใช้ (Username) และรหัสผ่าน (Password) มาให้เพื่อเข้าใช้บริการอินเตอร์เน็ต

2. การใช้งานอินเตอร์เน็ตผ่าน ISDN (Internet Services Digital Network) เป็นการเชื่อมต่อที่คล้ายกับแบบ Dial Up เพราะต้องใช้โทรศัพท์และโมเด็มในการเชื่อมต่อ ต่างกันตรงที่ระบบโทรศัพท์เป็นระบบความเร็วสูงที่ใช้เทคโนโลยีระบบดิจิตอล (Digital) และต้องใช้โมเด็มแบบ ISDN Modem ในการเชื่อมต่อ

3. การใช้งานอินเตอร์เน็ตผ่าน DSL (Digital Subscriber Line) เป็นเทคโนโลยีการเชื่อมต่ออินเทอร์เน็ตความเร็วสูงโดยใช้สายโทรศัพท์ธรรมดา ที่สามารถใช้อินเตอร์เน็ตและพูดผ่านสายโทรศัพท์ปกติได้ในเวลาเดียวกัน การเชื่อมต่อต้องใช้ DSL Modem ในการเชื่อมต่อ ต้องติดตั้ง Ethernet Adapter Card หรือ Lan Card ไว้ที่เครื่องคอมพิวเตอร์ที่ใช้ในการเชื่อมต่ออินเตอร์เน็ตด้วย

4.การใช้งานอินเตอร์เน็ตผ่าน Cable เป็นการเชื่อมต่ออินเทอร์เน็ตโดยผ่านสายสื่อสารเดียวกับ Cable TV จึงทำให้เราสามารถเชื่อมต่ออินเทอร์เน็ตไปพร้อม ๆ กับการดูทีวีได้ โดยต้องจัดหาอุปกรณ์เพิ่มเติม คือ ช้ Cable Modem เพื่อเชื่อมต่อ  ต้องติดตั้ง Ethernet Adapter Card หรือ Lan Card ไว้ที่เครื่องคอมพิวเตอร์ที่ใช้ในการเชื่อมต่ออินเตอร์เน็ตด้วย

5. การใช้งานอินเตอร์เน็ตผ่านดาวเทียม (Satellites) เป็นการเชื่อมต่ออินเทอร์เน็ตที่มีค่าใช้จ่ายค่อนข้างสูง ระบบที่ใช้กันอยู่ในปัจจุบันเรียกว่า Direct Broadcast Satellites หรือ DBS โดยผู้ใช้ต้องจัดหาอุปกรณ์เพิ่มเติม คือ จานดาวเทียมขนาด 18-21 นิ้ว เพื่อทำหน้าที่เป็นตัวรับสัญญาณจากดาวเทียม ใช้ Modem เพื่อเชื่อมต่อระบบอินเตอร์เน็ต

การสื่อสารบนอินเตอร์เน็ต

การสื่อสารทางอินเตอร์เน็ตสามารถทำได้หลายทางด้วยกัน ดังนี้

1.จดหมายอิเล็กทรอนิกส์ (E-mail)

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

2.การสืบค้นข้อมูลแบบเครือข่ายใยแมงมุม (World Wide Web: www.)

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

การที่จะเข้าไปอ่านข้อมูลเหล่านี้ได้ ผู้ใช้จะต้องมี Web Browser ซึ่งนิยมใช้กันในขณะนี้ได้แก่ Netscape Navigator และ Internet Explorer ปัจจุบันได้มีการประยุกต์กิจกรรมอื่นไว้ภายใน World Wide Web ด้วย อาทิ การโฆษณากิจกรรม รวมถึงความบันเทิงต่างๆ เช่น การดูหนังฟังเพลง และชมรายการต่างๆ ทางสถานีโทรทัศน์ เช่น www.google.com , www.hotmail.com , www.gmail.com 

3.การโอนย้ายข้อมูล (File Transfer Protocol: FTP)

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

การเข้าไปขอถ่ายโอนข้อมูลนั้น ผู้ใช้ต้องทราบชื่อเครื่องที่ตั้งเป็น FTP Server และสิทธิที่ได้รับอนุญาตให้เข้าทำ FTP

4.การแลกเปลี่ยนข่าวสาร (Usenet)

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

5.การเข้าใช้เครื่องระยะไกล (Telenet)

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

6.การสนทนาผ่านเครือข่าย (Talk หรือ Chat)

เป็นการติดต่อสื่อสารแบบ 2 ทาง คือ สามารถสื่อสารโต้ตอบกันได้ทันทีเหมือนการใช้โทรศัพท์ สามารถทำได้ทั้งแบบ Text-based และ Voice-based โปรแกรมที่นิยมใช้คือ Talk ซึ่งเป็นการพิมพ์โต้ตอบระหว่างคนสองคน Internet phone เป็นการคุยกันด้วยเสียงแบบเดียวกับโทรศัพท์ และ IRC (Internet Relay Chat)

7.บริการส่งข้อความทางอินเตอร์เน็ต

เป็นการส่งข้อความในรูปแบบของข้อความสั้นๆ (Short Message) ผ่านเครือข่ายอินเตอร์เน็ตให้ส่งสัญญาณไปยังอุปกรณ์สื่อสารประเภทไร้สาย ได้แก่ โทรศัพท์เคลื่อนที่ หรือเพจเจอร์ เป็นต้น

8.Remote Login

เป็นบริการที่ผู้ใช้สามารถติดต่อผ่าน Telenet เข้ากับคอมพิวเตอร์ที่อยู่ห่างไกล และคอมพิวเตอร์นั้นค้นหาสารสนเทศ แหล่งบริการสารสนเทศ เช่น รายการบัตรของห้องสมุด (Online Public Access Catalog: OPAC) ซึ่งเป็นฐานข้อมูลทรัพยากรสารสนเทศที่ห้องสมุดแต่ละแห่งทั่วโลกจัดทำขึ้น และเชื่อมต่อเข้ากับระบบเครือข่าย

โครงสร้างของเว็บไซต์ (Websites)

โครงสร้างของเว็บไซต์ (Website Structure) เป็นการจัดการข้อมูล รวมถึงส่วนประกอบทั้งหมดของเว็บไซต์ ว่าเราจะแสดงข้อมูลและองค์ประกอบต่างๆ ไว้ในหน้าไหนบ้าง เช่น เว็บไซต์มีทั้งหมดกี่หน้า แต่ละหน้ามีรายละเอียดข้อมูลอะไรบ้าง และมีการเชื่อมโยงแต่ละหน้าอย่างไรบ้าง หรือพูดได้ว่าเป็นการทำ “แผนผังเว็บไซต์ (Sitemap)” นั่นเอง

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

โครงสร้างของเว็บไซต์ประกอบไปด้วย 4 รูปแบบใหญ่ๆ ได้ดังนี้

1.1 โครงสร้างแบบเรียงลำดับ (Sequential Structure)

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

1.2 โครงสร้างแบบลำดับขั้น (Hierarchical Structure)

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

1.3 โครงสร้างแบบตาราง (Grid Structure)

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

1.4 โครงสร้างแบบใยแมงมุม (Web Structure)

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

รูปแบบเว็บไซต์ (Websites)

รูปแบบของเว็บไซต์หลักๆ เลยแบ่งออกเป็น 2 รูปแบบดังนี้

2.1 Static website

Static website เป็นเว็บไซต์ที่สร้างขึ้นด้วยภาษา HTML ธรรมดา และมีขนาดเล็ก จำนวนเพจไม่เยอะ การเปลี่ยนแปลงข้อมูลหน้าเว็บเพจไม่บ่อยนัก โดยส่วนมากมักจะบันทึกเพจเป็นไฟล์นามสกุล .html ตัวอย่างเช่น เว็บไซต์องค์กร บริษัท (Corporate website) นั่นเอง

2.2 Dynamic website

Dynamic website เป็นเว็บไซต์ที่มีการเปลี่ยนแปลงหรืออัพเดทข้อมูลบ่อยๆ ปริมาณของข้อมูลมีค่อนข้างเยอะ ซึ่งอาจมีระบบหลังบ้านเพื่ออัปเดตข้อมูลส่วน Body ทำให้ง่ายต่อการอัพเดทข้อมูลโดยที่ไม่ต้องแก้ไขที่ไฟล์ .html เอง ตัวอย่าง Dynamic website เช่น เว็บไซต์ข่าวสารอัพเดท เว็บบล็อก ร้านค้าออนไลน์ เป็นต้น

เว็บเพจ เว็บไซต์ โฮมเพจ แตกต่างกันอย่างไร

3.1 เว็บเพจ (Web Page)

เว็บเพจ คือ หน้าข้อมูลต่างๆ ที่อยู่ในรูปของ HTML เป็นการแสดงผลในรูปแบบของเว็บเพียงหน้าเดียวเท่านั้น โดยใช้ HTML , CSS, และ jQuery โดยทั้งหมดนี้ทำให้เกิดเป็น 1 หน้า Web Page เช่น หน้า Home Page 1 หน้า เราจะเรียกมันว่า Web Page

3.2 เว็บไซต์ (Web Site)

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

3.3 โฮมเพจ (Home Page)

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

ตัวอย่างเว็บหน้าHomepage

สรุป Web Page คือหน้า HTML 1 หน้า Website คือการนำ Web Page หลายๆ หน้ามารวมกัน Homepage คือหน้าหลักของเว็บไซต์ มีทั้งเมนู และเนื้อหา

ส่วนประกอบของเว็บเพจ

ส่วนประกอบของหน้าเว็บเพจ แบ่งออกเป็น 3 ส่วนหลัก ๆ คือ

4.1 ส่วนหัวของหน้า (Page Header)

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

- โลโก้ (Logo) เป็นสิ่งที่เว็บไซต์ควรจะมีและทำให้เว็บของเรามีความน่าเชื่อถือ

- ชื่อเว็บไซต์

- เมนูหลักหรือลิงค์ (Navigation Bar) เป็นจุดเชื่อมโยงไปสู่เนื้อหาของเว็บไซต์

4.2 ส่วนของเนื้อหา (Page Body)

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

4.3 ส่วนท้ายของหน้า (Page Footer)

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

การออกแบบเว็บไซต์

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

ซึ่งเมื่อก่อนไม่มี Library อย่าง jQuery มาให้เราใช้เหมือนปัจจุบัน นักออกแบบจะต้องใช้ Program ที่ชื่อ Macromedia Flash เพื่อสร้างวิดีโอมาใช้ในงานเว็บเท่านั้น

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

5.1 การออกแบบเว็บไซต์ให้เรียบง่าย เข้าใจง่าย

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

5.2 สร้างความโดดเด่นให้ ความเป็นเอกลักษณ์

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

5.3 เมนู หรือ Navigation ที่ใช้งานง่าย

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

5.4 คุณภาพของเว็บไซต์

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

5.5 ความถูกต้องและอัพเดทอยู่เสมอ

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

5.6 ความทันสมัยและสะดวกในการเข้าชมเว็บไซต์

ปัจจุบันการเข้าชมเว็บไซต์เป็นเรื่องง่าย เข้าถึงได้สะดวกมากขึ้นไม่ว่าคุณจะอยู่ที่ไหนก็สามารถเข้าชมเว็บไซต์ได้อย่างสะดวกมากขึ้นไม่ว่าจะเป็นการเข้าจากเครื่อง Notebook, Tablet หรือ Mobile เรียกได้ว่าสะดวกมากๆ แต่ความทันสมัยของการออกแบบเว็บไซต์ก็เป็นสิ่งสำคัญอย่างหลีกเลี่ยงไม่ได้ อย่างเช่นการออกแบบเว็บไซต์ให้เข้ากับทุก Platform หรือที่เรียกว่า “Responsive” เว็บไซต์นั่นเอง

5.7 Call to Action ที่สะดวกและใช้งานง่าย

นับว่าเป็นเรื่องที่สำคัญไม่น้อยสำหรับการออกแบบเว็บไซต์ เพราะช่องทางการติดต่อเป็นเรื่องที่สำคัญและจำเป็นมากๆ ไม่ว่าจะเป็น ชื่อ ที่อยู่ เบอรโทรศัพท์ อีเมล แผนที่ Social network หรือแม่กระทั่งแบบฟอร์มการติดต่อที่ง่ายต่อการติดต่อก็สำคัญเช่นกัน

5.8 การเลือกใช้สี (Color), ฟอนต์ (Font), รูปภาพ (Picture)

การเลือกสี, ฟอนต์ และรูปภาพ เพื่อบ่งบอกอารมณ์และ Mood & Tone ให้เข้ากับธุรกิจขององค์กร บริษัทก็เป็นสิ่งสำคัญ

เครื่องมือหรือโปรแกรมที่ใช้ในการเขียนโค้ด

6.1 Notepad

ถ้าใครที่ใช้ Windows จะมีโปรแกรมที่ชื่อว่า Notepad เป็นโปรแกรมพื้นฐาน ใช้สำหรับเขียนภาษา HTML หรือภาษาอื่นๆ ได้ ข้อเสียของ Notepad คือคำสั่งหรือการเขียนโค้ดต่างๆ จะต้องเขียนขึ้นเองเท่านั้น เพราะไม่มีฟังก์ชั่นอะไรให้เลือกใช้เลย

6.2 Visual Studio Code

Visual Studio Code เป็นโปรแกรม Text Editor ยอดนิยมที่พัฒนาขึ้นจากโปรเจค Open-source โดย Microsoft เป็น Text Editors ตัวหนึ่งที่เราใช้ประจำเพราะใช้งานง่าย สะดวก มีฟังก์ชั่นให้เลือกใช้เยอะ รองรับการเขียนได้หลายภาษา โดยโปรแกรมนี้เป็นโปรแกรมที่เราแนะนำให้ใช้ในการเรียนเขียนเว็บไซต์ไปด้วยกัน เพราะสามารถ Download มาใช้งานได้ฟรี 

6.3 Sublime Text

Sublime Text เป็น Text Editor ที่มีความสามารถสูงที่ใช้ในการเขียนโค้ด สนับสนุนการใช้งานได้หลายภาษา เหมาะกับผู้ที่เริ่มการเขียนโค้ดได้เลย เพราะเว็บ Editor ที่ทำงานได้เร็ว รวมถึงมีฟังก์ชั่นอื่นๆ ให้ใช้ได้หลากหลายเช่นเดียวกัน สามารถ Download มาใช้งานได้ฟรี

6.4 Adobe Dreamweaver

Adobe Dreamweaver หรือชื่อเดิมคือ แมโครมีเดีย ดรีมวีฟเวอร์ (Macromedia Dreamweaver) เป็นโปรแกรมที่ช่วยในการสร้างเว็บไซต์ เหมาะสมสำหรับมือใหม่ที่ต้องการเรียนรู้และเริ่มต้นทำเว็บไซต์ เพราะเป็นโปรแกรมที่มีเครื่องมืออำนวยความสะดวกในการสร้างเว็บไซต์ที่ง่าย

สรุป

Xampp คืออะไร ?

Xampp คืออะไร เป็นโปรแกรม Apache web server ไว้จำลอง web server เพื่อไว้ทดสอบ สคริปหรือเว็บไซต์ในเครื่องของเรา โดยที่ไม่ต้องเชื่อมต่ออินเตอร์เน็ตและไม่ต้องมีค่าใช้จ่ายใดๆ ง่ายต่อการติดตั้งและใช้งานโปรแกรม Xampp จะมาพร้อมกับ PHP ภาษาสำหรับพัฒนาเว็บแอพลิเคชั่นที่เป็นที่นิยม , MySQL ฐานข้อมูล, Apache จะทำหน้าที่เป็นเว็บ เซิร์ฟเวอร์,  Perl  อีกทั้งยังมาพร้อมกับ OpenSSL , phpMyadmin (ระบบบริหารฐานข้อมูลที่พัฒนาโดย PHP เพื่อใช้เชื่อมต่อไปยังฐานข้อมูล  สนับสนุนฐานข้อมูล MySQL และ SQLite  โปรแกรม Xampp จะอยู่ในรูปแบบของไฟล์ Zip, tar, 7z หรือ exe  โปรแกรม Xampp อยู่ภายใต้ใบอนุญาตของ  GNU General Public License แต่บางครั้งอาจจะมีการเปลี่ยนแปลงเรื่องของลิขสิทธิ์ในการใช้งาน จึงควรติดตามและตรวจสอบโปรแกรมด้วย

ส่วนของประกอบ XAMPP 

1. X =  โปรแกรม XAMPP รองรับการรันบนระบบปฏิบัติการต่างๆ เช่น Windows, Linux และ OS X 

2. A =  โปรแกรมสำหรับสร้างเว็บเซิร์ฟเวอร์ ทำงานบนโปรโตคอล HTTP 

3. M = MySQL (MariaDB)  โปรแกรมฐานข้อมูล ใช้สำหรับบริหารจัดการฐานข้อมูลบนเว็บไซต์ 

4. P = PHP  ภาษาคอมพิวเตอร์สำหรับพัฒนาเว็บไซต์ มีการประมวลผลทางฝั่ง Server 

5. P = Perl เป็นภาษาคอมพิวเตอร์ รองรับการพัฒนาโปรแกรมในลักษณะต่างๆ

โปรแกรม XAMPP สามารถใช้งานได้ 4 OS ได้แก่ 

1.Windows 

2. Linux  

3. Mac OS X 

4. Solaris สำหรับ Solaris 8 และ Solaris 9 

เวอร์ชั่นในปี 2022 โปรแกรม XAMPP เวอร์ชั่นล่าสุดคือ

• XAMPP for Windows เวอร์ชั่น 7.4.29, 8.0.19 & 8.1.6

สามารถใช้งานได้ Windows 2008, 2012, Vista, 7, 8 หรือเวอร์ชั่นที่ใหม่กว่า ไม่รองรับ Windows XP or 2003

• XAMPP for Linux เวอร์ชั่น 7.4.29, 8.0.19 & 8.1.6

 รองรับ Linux ทุกรุ่นส่วนใหญ่, including Debian, RedHat, CentOS, Ubuntu, Fedora, Gentoo, Arch, SUSE.

• XAMPP for OS X เวอร์ชั่น 7.4.29, 8.0.19, 8.1.6, 7.4.29, 8.0.19 & 8.1.6

 รองรับ Mac OS X 10.6 หรือ เวอร์ชั่นที่ใหม่กว่า

ในการใช้งานเบื้องต้นให้ดับเบิ้ลคลิ๊ก Xampp Control Panel Application แล้วทำการคลิ๊กปุ่ม start จากนั้นสามารถใช้งานได้ โดยเปิด Browser ขึ้นมาพิมพ์ localhost หรือ 127.0.0.1 

ข้อดีของ XMAPP 

สามารถติดตั้งเว็บเซิร์ฟเวอร์ได้อย่างง่ายดาย ประหยัดเวลาเนื่องจากไม่จำเป็นต้องติดตั้งและตั้งค่าโปรแกรมแต่ละตัวด้วยตนเอง 

สามารถดาวน์โหลดมาติดตั้ง และใช้งานได้ฟรี 

รองรับการทำงานบนระบบปฏิบัติการต่างๆ ที่หลากหลาย 

โปรแกรมทำงานได้ดี รองรับการสร้างเว็บเซิร์ฟเวอร์ได้อย่างมีประสิทธิภาพ 

โปรแกรมได้รับความนิยมใช้งานอย่างแพร่หลาย 

มีบทความ เอกสาร คู่มือ วิธีการปรับแต่ง และแก้ไขปัญหา เยอะ 

โปรแกรมมีเวอร์ชั่นต่างๆ ให้เลือกตามความเหมาะสมในการใช้งาน 

       โปรแกรมจำลองเว็บไซต์ก็ยังมีอีกหลายแบบ ไม่ว่าจะเป็น Appserv, Wamp เป็นต้น  สิ่งที่ควรพิจารณาเลือกใช้ในการเลือกคือเวอร์ชั่นของ Apache, PHP และ MySQL เนื่องจาก CMS แต่ละโปรแกรมนั้นมีความต้องการเวอร์ชั่นไม่เท่ากัน ก่อนใช้งานจึงต้องพิจารณาให้ดี ไม่ว่าจะเป็นในส่วนของระบบ หรือเวอร์ชั่นโปรแกรม เพื่อไม่ให้เกิดปัญหา หรือเกิดปัญหาในการใช้งานน้อยที่สุด เพื่อที่จะจำลองเว็บไซต์ได้โดยไม่มีปัญหา

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

 ข้อจำกัดด้านเทคนิค

- เครื่องคอมพิวเตอร์ควรมี RAM ไม่ต่ำกว่า 128 MB

- Harddisk มีพื้นที่มากกว่า 320 MB

- CPU ไม่กำหนดขั้นต่ำ

WordPress คืออะไร ?

WordPress (เวิร์ดเพรสส์) คือ โปรแกรมสำเร็จรูปที่ใช้สร้างและจัดการเนื้อหาเว็บไซต์ประเภท Contents Management System หรือเรียกย่อๆ ว่า “CMS” ซึ่งเขียนด้วยภาษา PHP และใช้ระบบจัดการฐานข้อมูล MySQL โดยมีส่วนประกอบหลักๆ คือ

• WordPress Core เป็นซอฟแวร์หลัก ใช้จัดการเว็บไซต์ เนื้อหาและบทความต่างๆ

• Theme เป็นส่วนที่กำหนดดีไซน์หรือรูปแบบการแสดงผล

• Plugin เป็นส่วนที่ช่วยเพิ่มความสามารถให้กับ WordPress เช่น ระบบสร้างหน้าเว็บไซต์ ระบบจัดการสินค้า

WordPress มีระบบจัดการบทความ หรือที่เรียกว่า “ระบบหลังบ้าน (Dashboard)” เอาไว้จัดการข้อมูลบนอินเตอร์เน็ต ทำให้ง่ายและสะดวกต่อการใช้งานมาก สามารถใช้สร้างและจัดการเนื้อหาเว็บไซต์ โดยใช้งานบนอินเตอร์เน็ตได้เลย ไม่จำเป็นต้องดาวน์โหลดโปรแกรมมาติดตั้งในเครื่อง และผู้ใช้ไม่ต้องเสียเวลาเขียนโค้ดเอง

รูปแบบของ WordPress

WordPress สามารถแบ่งได้เป็น 2 แบบ คือ

• WordPress.com

เป็นบริการเว็บไซต์ที่เหมาะสำหรับผู้ที่ต้องการมี Blog เป็นของตัวเองหรือผู้ที่เริ่มต้นทดลองใช้งานเว็บไซต์ เพราะเพียงแค่สมัครสมาชิกกับทาง WordPress.com ก็ใช้งานได้ฟรีทันที แต่จะมีความยืดหยุ่นน้อย ทั้ง Theme และ Plugin ไม่สามารถนำจากภายนอกมาติดตั้งได้ ส่วนชื่อของเว็บไซต์ จะสามารถใช้ได้ในรูปแบบซัพโดเมน คือ “ชื่อบล็อกของเรา.wordpress.com”

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

• WordPress.org

เป็นซอฟต์แวร์ที่ให้เราดาวน์โหลดได้ฟรี เพื่อมาติดตั้งที่ Hosting (ที่สำหรับเก็บข้อมูลของเว็บไซต์ไว้บนอินเตอร์เน็ต) สามารถนำไปสร้างเว็บไซต์ได้อย่างอิสระ ไม่ว่าจะเป็นการปรับแต่งหน้าเว็บ หรือการนำ Theme และ Plugin จากภายนอกมาติดตั้ง หรือการทำเว็บไซต์แบบ E-commerce ที่มีระบบตะกร้าสินค้า เป็นต้น

ปัจจุบันเว็บไซต์ส่วนใหญ่ก็ใช้ WordPress ในรูปแบบนี้ ทั้งนี้เราต้องเสียค่าใช้จ่ายอื่นๆ ต่างหาก ทั้งการจดชื่อโดเมนและการเช่า Hosting ซึ่งค่าบริการก็ขึ้นอยู่กับประสิทธิภาพของ Hosting รวมถึงค่าใช้จ่ายในการออกแบบเว็บไซต์ในกรณีที่เราไม่สามารถสร้างได้ด้วยตัวเอง แต่โดยส่วนใหญ่แล้วจะนิยมเลือกซื้อ Theme จากเว็บไซต์ Themeforest.net เพราะมีรูปแบบให้เลือกมากมายและมีราคาไม่สูงนัก ซึ่งขั้นตอนการติดตั้งและใช้งานก็ไม่ยุ่งยากจนเกินไป สามารถศึกษาและทำได้เองตามคู่มือจาก Theme ที่ซื้อมา

ข้อดีของ WordPress

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

• ประหยัดเวลาและค่าใช้จ่าย

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

• มีดีไซน์หน้าเว็บให้เลือกหลากหลาย

WordPress โดดเด่นกว่า CMS อื่นๆ ในเรื่องความสวยงาม เพราะมี Theme ที่หลากหลายและทันสมัย สามารถเลือกปรับใช้ให้เหมาะกับหน้าเว็บ เช่น เว็บไซต์บทความ เว็บไซต์องค์กร เว็บไซต์ขายสินค้าออนไลน์ ซึ่งมีทั้งแบบฟรีและเสียค่าใช้จ่าย

• มี Plugins ที่ช่วยเพิ่มประสิทธิภาพของเว็บ

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

• ทำ SEO ง่าย

SEO คือ การปรับแต่งเว็บไซต์ให้ติดอันดับที่ดีบนผลการค้นหาของ Search Engine อย่าง Google ซึ่งช่วยเพิ่มผู้เข้าชมเว็บไซต์ (อ่านเพิ่มเติมได้ที่ SEO (Search Engine Optimization) คือ?) โดย WordPress มีโครงสร้างที่รองรับกับการทำ SEO และยังมี Plugin ให้ปรับแต่งเว็บไซต์มากมายซึ่งมีส่วนช่วยในการทำ SEO ด้วยเหตุนี้เว็บไซต์ที่สร้างจาก WordPress จึงมีโอกาสติดอันดับที่ดีได้ง่ายขึ้น

• อัพเดทสะดวกและสม่ำเสมอ

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

• เป็นแหล่งรวมนักพัฒนา

WordPress เป็นโปรแกรมแบบโอเพนซอร์ซซอฟต์แวร์ (Open-source Software) ที่เปิดให้นำไปใช้งานและพัฒนาต่อได้อย่างอิสระ โดยมี Codex เป็นไกด์ไลน์ให้นักพัฒนา เพื่อศึกษาส่วนประกอบต่างๆ และสามารถนำข้อมูลนี้ไปสร้าง Theme หรือ Plugin ขึ้นมาเองได้ด้วย จึงเป็นโปรแกรมที่มั่นใจได้ว่าจะมีการพัฒนาตลอดเวลาแน่นอน

การจัดหน้าการทำงานของ Wordpress

1. การตั้งค่าหน้าแรกใน WordPress

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

การตั้งค่าหน้าแรกใน WordPress

สำหรับวิธีการตั้งค่าหน้าแรกหรือหน้า Homepage ใน WordPress นั้น สามารถทำได้ง่าย ๆ ขออธิบายเป็น 2 หัวข้อ ดังนี้

การตั้งค่าให้หน้าแรกแสดงบทความล่าสุด

ถ้าต้องการให้หน้าแรกหรือหน้า Homepage ของเราแสดงบทความล่าสุด ให้ทำดังนี้

1. คลิกเมนู Setting ที่ไซด์บาร์ด้านซ้ายมือ

2. คลิกเมนูย่อย Reading เพื่อเข้าสู่หน้า Reading Settings

3. ที่หัวข้อ Your homepage displays ให้ติ๊กเลือก Your latest posts เพื่อเลือแสดงบทความล่าสุด

4. ที่หัวข้อ Blog pages show at most ให้กำหนดจำนวนโพสต์ที่ต้องการให้แสดงในหน้าแรก

5. Syndication feeds show the most recent ให้ระบุจำนวนโพสต์ที่ต้องการให้แสดงที่หน้าฟีด

6. For each article in a feed, show ให้เลือกว่าแต่ละบทความจะให้โชว์อะไร ซึ่งสามารถเลือกได้ 2 ตัวเลือก คือ

6.1 Full text ให้โชว์ข้อความแบบเต็ม

6.2 Summary ให้โชว์ข้อความแบบย่อ

7. Search Engine Visibility ถ้าไม่ต้องการให้เสิร์ชเอ็นจินเข้ามาเก็บข้อมูลให้ติ๊กที่ตัวเลือก Discourage search engines…..

8. เมื่อตั้งค่าเสร็จเรียบร้อยแล้วให้คลิกปุ่ม Save Changes เพื่อบันทึกการตั้งค่า

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

การตั้งค่าให้หน้าแรกแสดงเพจตามที่กำหนด

ถ้าเราต้องการให้หน้าแรกหรือหน้าโฮมเพจของเราแสดงหน้าเพจหน้าใดหน้าหนึ่ง Static Page ให้เราสร้างหน้าเพจขึ้นมา 2 หน้า คือ 1. หน้าที่จะให้แสดงเป็นหน้าแรก 2. หน้าที่จะให้แสดงบทความ หลังจากนั้นทำตามขั้นตอนดังนี้

1. คลิกเมนู Setting ที่ไซด์บาร์ด้านซ้ายมือ

2. คลิกเมนูย่อย Reading เพื่อเข้าสู่หน้า Reading Settings

3. ที่หัวข้อ Your homepage displays ให้ติ๊กเลือก A static page เพื่อเลือกเพจสำหรับแสดงในหน้าแรก

4. ที่หัวข้อ Homepage ให้เลือกหน้าเพจที่ต้องการให้แสดงในหน้า Homepage

5. ที่หัวข้อ Posts page ให้คลิกเลือกหน้าเพจที่ต้องการให้แสดงบทความ

6. ที่หัวข้อ Blog pages show at most ให้กำหนดจำนวนโพสต์ที่ต้องการให้แสดงในหน้าแรก

7. Syndication feeds show the most recent ให้ระบุจำนวนโพสต์ที่ต้องการให้แสดงที่หน้าฟีด

8. For each article in a feed, show ให้เลือกว่าแต่ละบทความจะให้โชว์อะไร ซึ่งสามารถเลือกได้ 2 ตัวเลือก คือ

8.1 Full text ให้โชว์ข้อความแบบเต็ม

8.2 Summary ให้โชว์ข้อความแบบย่อ

9. Search Engine Visibility ถ้าไม่ต้องการให้เสิร์ชเอ็นจินเข้ามาเก็บข้อมูลให้ติ๊กที่ตัวเลือก Discourage search engines…..

10. เมื่อตั้งค่าเสร็จเรียบร้อยแล้วให้คลิกปุ่ม Save Changes เพื่อบันทึกการตั้งค่า

เมื่อเข้าไปดูในหน้าเว็บไซต์ของเราก็จะเห็นว่าหน้า Homepage แสดงหน้าเพจตามที่เรากำหนดไว้แล้ว

User Interface Design คืออะไร

    User Interface Design คือตัวกลางที่เชื่อมโยงผู้ใช้งาน (User) เข้ากับตัวเว็บไซต์ที่เขียนขึ้น แสดงผลออกมาแบบที่ผู้ใช้งานทั่วไปคุ้นเคย คอยดูแลเรื่องความสวยงาม เลือกฟ้อนต์ เลือกสี การวางเลย์เอาท์ เรียกได้ว่าเว็บไซต์สักหนึ่งเว็บไซต์จะสวยหรือไม่ขึ้นอยู่กับ User Interface Design ที่นักออกแบบทำการออกแบบขึ้นมาโดยนักออกแบบที่ทำหน้าที่นี้เรามักจะคุ้นเคยในตำแหน่งที่เรียกว่า UI Designer ซึ่งก็ย่อมาจาก User Interface Designer นั้นเอง และเรามักจะได้ยินคำอยู่ 2 คำคือ UX/UI Design คำ 2 คำนี้มักจะอยู่คู่กันเสมอโดยทั้ง 2 สิ่งนี้แท้จริงแล้วมีหน้าที่ต่างกันโดยสิ้นเชิง

   แล้วการออกแบบ UI (User Interface) แตกต่างกับ UX (User Experience) อย่างไร เชื่อว่าหลายคนจะเกิดคำถามขึ้นมาซึ่งทั้งสองส่วนนั้นมีความเชื่อมโยงกันถึงแม้จะเป็นคนละอย่างกัน สำหรับ UX (User Experience) เป็นเรื่องของหลักการ เกี่ยวกับความรู้สึกของผู้ใช้งานเป็นหลัก ทำอย่างไรให้ผู้ใช้งานใช้งานโปรแกรมได้ง่าย ทำอย่างไรให้โปรแกรมของเราไม่เกิดความสับสนที่ไม่ควรเกิดขึ้นที่กล่าวมาทั้งหมด UX จะรับหน้าที่แก้ไขปัญหานี้ แต่สำหรับ UI (User Interface) หน้าที่สำคัญที่สุดคือความสวยงามที่แสดงผลบนโปรแกรม จะออกแบบอย่างไรให้ผู้ใช้งานชื่นชอบ ออกแบบอย่างไรให้โปรแกรมอ่านง่าย ใช้งานได้ง่าย มีปุ่มกดที่สะดุดตาแบบที่ควรจะเป็น หรือทำอย่างไรให้โปรแกรมสามารถสื่อสารสิ่งที่บริษัทต้องการจะสื่อสารออกมาได้อย่างถูกต้อง เช่น โจทย์ของลูกค้าเราคือการทำโปรแกรมให้น่าเชื่อถือก็เป็นหน้าที่ของ UI ที่ต้องเลือกฟ้อนต์ สี รูปภาพที่สามารถแสดงความน่าเชื่อถือออกมาให้ได้

หน้าที่ของ User Interface Design ต้องทำอะไร

    User Interface Design ต้องสวยและใช้งานง่าย

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

ทำไม User Interface Design ถึงสำคัญ

เพราะการที่เราจะทำโปรแกรมหรือแอปพลิเคชันขึ้นมาใช้งานแค่การใช้งานง่ายอย่างเดียวไม่พอแต่โปรแกรมนั้นจะต้องมีหน้าตาที่สวยงามสามารถสื่อสารถึงองค์กรออกมาได้ด้วยทำให้ User Interface Design คือสิ่งสำคัญไม่แพ้ User Experience ที่ดีต่อผู้ใช้งาน ขั้นตอนการทำ User Interface Design นั้นครอบคลุมตั้งแต่การออกแบบเมนู (Menu) การจัดตำแหน่งของโลโก้ การออกแบบแบนเนอร์ (Banner) การออกแบบเลย์เอาท์ของโปรแกรมว่าจะมีข้อมูลอะไรบ้างอยู่ที่หน้าโปรแกรม ตลอดไปจนถึงการออกแบบโปรแกรมในรูปแบบของ Responsive ก็ล้วนเป็นส่วนหนึ่งของ User Interface Design ทั้งนั้น

User Interface Design ที่ดีเป็นอย่างไร

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

เข้าใจง่าย

การออกแบบจะต้องเข้าใจง่ายใช้งานได้ง่าย ไม่สร้างความสับสนให้กับผู้ใช้งาน ความง่ายของ UI จะช่วยให้ผู้ใช้งานที่ไม่มี Technology skills ที่สูงก็สามารถใช้งานโปรแกรมของเราได้อย่างไม่สับสน ความยากของนักออกแบบคือทำอย่างไรให้โปรแกรมนั้นสวยดูดีแต่ยังคงความง่ายในการใช้งาน

ออกแบบ Design System

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

วางเป้าหมาย

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

สีและฟ้อนต์ก็สำคัญ

การแทรกวิดีโอจาก YouTube ในบทความ

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

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

อย่างไรก็ตาม เรามีทางออกที่ดีกว่าในการแสดงวิดีโอในบทความของเรา นั่นก็คือ การอัพโหลดวิดีโอไว้ใน YouTube แล้วค่อยนำวิดีโอนั้นมาแสดงในบทความของเราผ่านบล็อกที่ชื่อว่า YouTube

การแทรกวิดีโอจาก YouTube ในบทความ

สำหรับวิธีการแทรกวิดีโอจาก YouTube ในบทความนั้นก็สามารถทำได้ง่าย ๆ ดังนี้

1. คลิกที่ปุ่ม Add Block 

2. พิมพ์คำค้นหาในช่อง Search for a block ด้วยคำว่า youtube

3. หรือคลิกที่กลุ่ม Embeds เพื่อให้แสดงบล็อกในกลุ่มออกมา

4. คลิกเลือกบล็อกที่ชื่อว่า YouTube

บล็อก YouTube จะถูกเพิ่มเข้ามาในบทความของเราทันที หลังจากนั้นให้ทำดังนี้

1. ที่ช่อง Enter URL to embed here… ให้กรอก URL ของวิดีโอจาก YouTube ลงไป

2. หลังจากนั้นคลิกที่ปุ่ม Embed

เพียงแค่นี้เราก็จะได้วิดีโอจาก YouTube มาแสดงในบทความของเราแล้วครับ

เราสามารถปร้บแต่งวิดีโอจาก YouTube ที่แทรกเข้ามาในบทความได้ดังนี้

1. จัดวิดีโอชิดซ้าย โดยให้ข้อความ (ถ้ามี) ล้อมรอบด้านบน ขวา และล่าง

2. จัดวิดีโอให้อยู่กึ่งกลาง โดยให้ข้อความ (ถ้ามี) อยู่ด้านบนและด้านล่าง

3. จัดวิดีโอชิดขวา โดยให้ข้อความ (ถ้ามี) ล้อมรอบด้านบน ซ้าย และล่าง

4. จัดให้วิดีโอมีความกว้างเต็มขนาดของบล็อก โดยให้ชิดชอบด้านซ้ายและขวา

5. จัดให้วิดีโอมีความกว้างเต็มความกว้างของบราวเซอร์

6. เปลี่ยนแปลงวิดีโอ

7. เขียนคำอธิบายใต้วิดีโอ Caption

นอกจากนี้เรายังสามารถตั้งค่าให้วิดีโอปรับขนาดตามสัดส่วนของหน้าจอที่แสดงผลในขณะนั้น ๆ ได้ด้วย โดยให้คลิกเปิดตัวเลือก Resize for smaller devices ที่หัวข้อ Media Settings

การแทรกโพสต์ชนิดอื่น ๆ ในบทความ

นอกจากวิดีโอจาก YouTube แล้ว เรายังสามารถฝังหรือแทรกโพสต์จาก Social Media ยอดนิยมอื่น ๆ ได้ด้วย เช่น โพสต์จาก Facebook, Twitter, Instagram, วิดีโอจาก Vimeo และอื่น ๆ อีกมากมาย โดยสามารถเลือกได้จากกลุ่ม Embeds

ส่วนลักษณะการใช้งานก็จะคล้าย ๆ กัน ตัวอย่างดังภาพด้านล่าง

การเผยแพร่เว็บไซต์

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

1. ติดตั้งปลั๊กอิน Duplicator เพื่อสร้างแพ็กเกจสำหรับติดตั้งเว็บไซต์

2. สร้างแพ็กเกจ (Package) เพื่อนำไปติดตั้งในโฮสต์จริง

3. อัพโหลดแพ็กเกจ (Package) ที่ได้สร้างไว้ ไปไว้ในโฮสต์จริงเพื่อติดตั้งต่อไป

4. สร้างฐานข้อมูลในโฮสต์จริงเพื่อรอรับข้อมูลเว็บไซต์ WordPress

5. ติดตั้งแพ็กเกจ (Package) ที่ได้สร้างไว้

1. ติดตั้งปลั๊กอิน Duplicator

Duplicator เป็นปลั๊กอินสำหรับก๊อปปี้เว็บไซต์ของเรามาสร้างเป็นแพ็กเกจเพื่อนำไปติดตั้งในโฮสต์จริงได้อย่างสะดวกสบาย สำหรับการติดตั้งปลั๊กอิน Duplicator มีขั้นตอนดังนี้

1. คลิกเมนู Plugins ที่ไซด์บาร์ด้านซ้ายมือ

2. คลิกปุ่ม Add New เพื่อติดตั้งปลั๊กอินใหม่

1. ที่หน้า Add Plugins ให้กรอกคีย์เวิร์ดที่ช่อง Search plugins… เป็น Duplicator เพื่อค้นหาปลั๊กอินตัวนี้

2. เมื่อเจอปลั๊กอิน Duplicator ให้คลิกปุ่ม Install Now เพื่อติดตั้งทันที

3. เมื่อติดตั้งเสร็จเรียบร้อยแล้วให้คลิกปุ่ม Activate เพื่อเปิดใช้งานปลั๊กอินทันที

2. การสร้างแพ็กเกจ (Package) สำหรับติดตั้งเว็บไซต์

เมื่อติดตั้งปลั๊กอิน Duplicator และเปิดใช้งานเป็นที่เรียบร้อยแล้ว ขั้นตอนต่อไปก็คือการสร้างแพ็กเกจ (Package) สำหรับติดตั้งเว็บไซต์ของเรา โดยมีขั้นตอนดังนี้

เลื่อนเมาส์ไปวางเหนื้อเมนู Duplicator ที่ไซด์บาร์ด้านซ้ายมือ (ถ้ายังไม่เปิดใช้งานปลั๊กอิน Duplicator จะไม่มีเมนูนี้)

• คลิกที่เมนูย่อย Packages

• ที่หน้า Packages ให้คลิกที่ปุ่ม Create New เพื่อสร้างแพ็กเกจใหม่

• คลิกปุ่ม Next เพื่อเข้าสู่ขั้นตอนต่อไปได้เลย

• ตัวปลั๊กอินจะทำการสแกนเว็บไซต์ ให้รอสักครู่

• คลิกปุ่ม Build เพื่อสร้างแพ็กเกจ

• รอสักครู่ระหว่างที่ปลั๊กอินกำลังสร้างแพ็กเกจ

• เมื่อสร้างแพ็กเกจเรียบร้อยแล้วจะมีปุ่มให้เราดาวน์โหลดแพ็กเกจและไฟล์ตัวติดตั้ง

• คลิกที่ปุ่ม Installer เพื่อดาวน์โหลดตัวติดตั้ง

• คลิกที่ปุ่ม Archive เพื่อดาวน์โหลดแพ็กเกจสำหรับติดตั้งเว็บไซต์

จะได้ไฟล์มา 2 ไฟล์ คือ

• ไฟล์แพ็กเกจสำหรับติดตั้งเว็บไซต์ซึ่งเป็นไฟล์นามสกุล .zip

• ไฟล์สำหรับติดตั้งแพ็กเกจ จะได้ไฟล์ชื่อ installer.php

3. การอัพโหลดแพ็กเกจและตัวติดตั้งไปไว้ในโฮสต์จริง

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

เมื่อติดตั้งโปรแกรม FileZilla Client เป็นที่เรียบร้อยแล้ว ให้เปิดโปรแกรมขึ้นมา หน้าตาโปรแกรมดังกล่าวจะเป็นประมาณนี้ครับ

• ฝั่งซ้ายมือนั่นคือส่วนสำหรับแสดงไฟล์และโฟลเดอร์ต่าง ๆ ที่เก็บอยู่ในเครื่อมคอมพิวเตอร์ของเราเอง

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

4. การใช้โปรแกรม FileZilla Client เชื่อมต่อกับเซิร์ฟเวอร์

ก่อนที่เราจะสามารถอัพโหลดไฟล์ไปยังเซิร์ฟเวอร์ได้นั้น เราต้องเชื่อมต่อกับเซิร์ฟเวอร์ให้ได้เสียก่อน โดยทำดังนี้ครับ

• ช่อง Host ให้กรอกชื่อโฮสต์ที่ต้องการเชื่อมต่อ (ถ้าไม่ทราบให้สอบถามจากผู้ให้บริการ)

• ช่อง Username ให้กรอกชื่อผู้ใช้สำหรับการเชื่อมต่อ (ถ้าไม่ทราบให้สอบถามจากผู้ให้บริการ)

• ช่อง Password ให้กรอกรหัสผ่านสำหรับการเข้าใช้งาน

• ช่อง Port ให้กรอกพอร์ด (Port) ที่ใช้เป็นช่องทางการสื่อสาร (ถ้าไม่ทราบให้สอบถามจากผู้ให้บริการ)

• คลิกปุ่ม Quickconnect เพื่อเชื่อมต่อทันที

ถ้าการเชื่อมต่อสำเร็จ เราจะพบกับโฟลเดอร์ต่าง ๆ ที่เก็บอยู่ในเซิร์ฟเวอร์ของเรา จากหน้าจอทางฝั่งขวา

ให้เปิดเข้าไปในโฟลเดอร์ที่ใช้เก็บเว็บไซต์ของเรา (ในที่นี้คือโฟลเดอร์ public_html) จะพบกับไฟล์และโฟลเดอร์ต่าง ๆ ดังภาพ

ไฟล์ที่ช่องด้านล่างนั้นถูกเก็บอยู่ในโฟลเดอร์ public_html ที่แสดงในช่องด้านบน ซึ่งไฟล์ทั้งหมดนี้เป็นไฟล์ที่ระบบสร้างมาให้ ในที่นี้ผมต้องการนำไฟล์ใหม่มาแทนที่ทั้งหมด ดังนั้นผมจะลบไฟล์ในโฟลเดอร์นี้ทิ้งให้หมดนะครับ ดังภาพด้านล่าง

ต่อไปเป็นขั้นตอนการอัพโหลดไฟล์แพ็กเกจและไฟล์ติดตั้งที่เราได้เตรียมเอาไว้ ให้ทำดังนี้

• คลิกเลือกเพื่อเปิดโฟลเดอร์ที่เก็บไฟล์แพ็กเกจและไฟล์ติดตั้ง ในที่นี้คือโฟลเดอร์ Downloads

• เลือกไฟล์แพ็กเกจและไฟล์ติดตั้ง

• คลิกขวาบนไฟล์ที่เลือกแล้วคลิก Upload

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

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

• คลิกขวาที่รูทโฟลเดอร์ public_html

• คลิกเมนู File permissions…

จะปรากฏส่วนให้เรากำหนดสิทธิ์ดังนี้

ให้ติ๊กเช็คบ๊อกหน้า Write ที่ Group permissions และ Public permission หรือแก้ตัวเลขในช่อง Numeric value ให้เป็น 777 ก็ได้เช่นกัน เสร็จแล้วคลิกปุ่ม OK

มาถึงตรงนี้ตัวติดตั้งแพ็กเกจของเราจะสามารถเขียนไฟล์ลงในรูทโฟลเดอร์ของเซิร์ฟเวอร์ได้แล้ว

5. การสร้างฐานข้อมูลเพื่อรองรับเว็บไซต์ WordPress

เนื่องจากเว็บไซต์ WordPress ต้องใช้ฐานข้อมูลเพื่อเก็บข้อมูลต่าง ๆ ของระบบ ดังนั้น เราจึงจำเป็นต้องสร้างฐานข้อมูลไว้รองรับเว็บไซต์ที่เราจะติดตั้งในเซิร์ฟเวอร์ในขั้นตอนต่อไป

อันดับแรกให้ล็อกอินเข้าสู่ Control Panel ของเซิร์ฟเวอร์ก่อน (รายละเอียด URL, Username, Password ตามที่ผู้ให้บริการให้มา) ในตัวอย่างเป็น DirectAdmin นะครับ

คลิกที่ MySQL Management

คลิก Create new Database เพื่อสร้างฐานข้อมูลใหม่

กำหนดรายละเอียดต่าง ๆ ดังนี้

1. ช่อง Database Name ให้ระบุชื่อฐานข้อมูล

2. ช่อง Database Username ให้ระบุชื่อผู้ใช้สำหรับเข้าใช้ฐานข้อมูล

3. ช่อง Username Password ให้ระบุรหัสผ่าน

4. ช่อง Confirm Password ให้ระบุรหัสผ่านอีกครั้ง

5. เสร็จแล้วคลิกปุ่ม Create เพื่อสร้างฐานข้อมูล

ถ้าไม่มีอะไรผิดพลาด คุณจะถูกพามาที่หน้าดังภาพด้านล่าง

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

6. การติดตั้งแพ็กเกจเพื่อติดตั้งเว็บไซต์ในโฮสต์จริง

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

ให้กรอก URL ของเว็บไซต์ของเรา ตามด้วย /installer.php เช่น ถ้าเว็บไซต์ของเราคือ http://www.kruchinz.com ให้กรอกดังนี้

http://www.kruchinz.com/installer.php

จะเข้าสู่หน้าสำหรับติดตั้งแพ็กเกจเว็บไซต์ของเรา

• ให้ติ๊กที่เช็คบ็อกซ์หน้า I have read and accept…

• หลังจากนั้นคลิกปุ่ม Next เพื่อเข้าสู่ขั้นตอนต่อไป

จะเข้าสู่ขั้นตอนการติดตั้งฐานข้อมูล ให้กรอกข้อมูลตามที่เราได้กรอกไว้ในขั้นตอนการสร้างฐานข้อมูล

• คลิกที่แท็บ Basic

• Action ให้เลือก Connect and Remove All Data

• Host ให้กรอกชื่อโฮสต์ (localhost)

• Database ให้กรอกชื่อฐานข้อมูล (ตามที่ได้กรอกไว้ตอนสร้างฐานข้อมูล)

• User ให้กรอก username (ตามที่ได้กรอกไว้ตอนสร้างฐานข้อมูล)

• Password ให้กรอกรหัสผ่าน (ตามที่ได้กรอกไว้ตอนสร้างฐานข้อมูล)

• คลิกปุ่ม Test Database เพื่อทดสอบการเชื่อมต่อฐานข้อมูล

• ถ้าไม่มีอะไรผิดพลาด ปุ่ม Test Database จะกลายเป็นสีเทา ปุ่ม Next จะกลายเป็นสีน้ำเงิน ให้คลิกปุ่ม Next

ระบบจะให้เรายืนยันการติดตั้ง

คลิกปุ่ม OK เพื่อยืนยันการติดตั้งได้เลย

จะเข้าสู่ขั้นตอนของการอัพเดทข้อมูล ให้คลิกปุ่ม Next ได้เลย

ขั้นตอนสุดท้าย ให้ติ๊กที่ Auto delete installer files after login (recommended) เพื่อให้ลบไฟล์ติดตั้งโดยอัตโนมัติหลังจาการล๊อกอินเข้าสู่ระบบ

คลิกปุ่ม Admin Login เพื่อล็อกอินเข้าสู่หน้า Dashboard

เข้าสู่หน้าจอ Login

กรอก Username และ Password (ชื่อผู้ใช้และรหัสผ่านของเว็บเดิมของเรานั่นแหละครับ) เสร็จแล้วคลิกปุ่ม Log In ได้เลย

เมื่อล็อกอินเข้าสู่ระบบครั้งแรก ระบบจะแจ้งให้ทราบว่า ไฟล์ติดตั้งต่าง ๆ (แพ็กเกจและตัวติดตั้งที่เราอัพโหลดเข้ามานั่นเอง) ได้ถูกลบทิ้งจนสิ้นซากแล้ว เหลือแต่ไฟล์เว็บเพียว ๆ ครับ

มาถึงตรงนี้ เว็บไซต์ของเราสามารถออนไลน์ในโลกกว้างได้แล้วครับ เมื่อเข้าไปยัง URL ของเว็บไซต์ของเราก็จะเห็นได้ว่า เว็บไซต์ของเราสามารถออนไลน์ได้และแสดงผลได้อย่างถูกต้อง

ก็เป็นอันว่าสิ้นสุดขั้นตอนของการอัพโหลดเว็บไซต์ขึ้นสู่เซิร์ฟเวอร์หรือโฮสติ้งแต่เพียงเท่านี้ครับ

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