นายแทม ดอทคอม
 
 วันอังคารที่ 7 ตุลาคม 2557 เวลา 18:38 น.

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

พัฒนาแอพและเว็บไซต์ ›› HTML
ผู้เขียน :

คุยกับนายแทม


คำค้น :

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

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

เอาหละครับ มาดูว่า "ถ้าจะปั้นเว็บไซต์เองตั้งแต่ลงมือขุดดิน ต้องมีความรู้ด้านใดบ้าง ?" ผมขอเขียนคร่าว ๆ นะครับ เพื่อเป็นแนวทางให้ ใครอยากรู้ลึกลงไป ติดต่อหาผมได้ครับที่ facebook : https://www.facebook.com/naitamupdate

ภาษาและฐานข้อมูล

1) HTML เป็นพื้นฐานแรกสุดเลยที่คุณต้องรู้ เพราะมันคือตัวบอกว่า เว็บคุณมีโครงสร้างอย่างไร และ มีอะไรบ้าง เช่น มีความกว้างเท่าไหร่ มีตารางอะไร มีเนื้อหาปรากฏตรงไหน มีรูปตรงไหน

2) CSS เป็นสิ่งที่นำ HTML มาออกแบบว่าจะให้มันแสดงผลอย่างไร เช่น มีความกว้างอย่างไร มีตารางขอบเต็ม หรือ เส้นประ หรือ สีอย่างไร มีเนื้อหาแสดงผลแบบหนังสือพิมพ์ หรือ แบบนิตยสาร หรือ แบบข้อความล้วน

กล่าว คือ HTML เป็นตัวบอกว่า เว็บคุณมีอะไรบ้าง แต่ CSS เป็นตัวบอกว่า คุณจะออกแบบสิ่งที่คุณมีให้มีหน้าตาอย่างไร

3) PHP / ASP เป็นภาษาที่เพิ่มความสามารถให้ HTML ให้มากขึ้น ในด้านการโต้ตอบกับผู้ใช้ เช่น แสดงผลจากฐานข้อมูลแบบทันที , ลดทอนเวลาในการแก้ไขเว็บเพจ คุณเลือกเรียนรู้ตัวใด ตัวหนึ่งก็ได้ครับ คือ PHP หรือ ASP ก็พอ แล้วเอาให้เก่งในทางนั้นไปเลย ทั้ง 2 ตัว ยากง่ายไม่ต่างกัน ขึ้นกับความถนัดของบุคคลครับ

กล่าว คือ HTML เป็น โครงสร้างบ้านที่ลงปูนแน่นหนา จะรื้อบ้านที ก็ต้องใช้เวลา แต่ PHP / ASP เป็น โครงสร้างแบบประกอบแยกส่วนได้ ไม่พอใจตรงนี้ ก็รื้อเฉพาะจุดเล็ก ๆ แต่ได้ผลเหมือนกับรื้อบ้านทั้งหลัง

4) DataBase คือ ฐานข้อมูล ซึ่งมีหลากหลายมากครับ ที่นิยมกัน ก็คือ mySQL ครับ ความยากง่ายก็ไม่ต่างกัน และ ต้องใช้ร่วมกับ ข้อ 1-3 เพื่อการแสดงผลเว็บไซต์แบบมืออาชีพ

กล่าว คือ HTML เปรียบเทียบได้กับ การทำรายงานด้วยการเขียนลงกระดาษ A4 ไป 10 หน้าแล้ว แล้วพบว่า คุณเขียนอ้างอิงผิด 20 จุดในรายงานกระดาษทั้ง 10 แผ่น คุณต้องแก้ไขทีละจุด และ อาจถึงขั้นต้องทำใหม่

แต่ PHP/ASP + Database เปรียบเทียบได้กับ การทำรายงานด้วยการพิมพ์ลง Microsoft Word จะทำให้คุณแก้ไขแค่ 1 จุด แล้วที่เหลืออีก 19 จุดที่ผิดพลาด ก็ได้รับการแก้ไขโดยอัตโนมัติ

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

กล่าว คือ ข้อ 1-4 ช่วยให้คุณออกจากบ้านไปซื้อของที่ห้าง และ เดินทางกลับมาบ้าน แล้วก็พบว่า ลืมซื้อของไปชิ้นหนึ่ง คุณก็ต้องออกจากบ้านไปอีกครั้ง และ เดินทางกลับบ้านอีกรอบ .. ซึ่งเสียเวลามาก

แต่ JavaScript คือ โทรศัพท์มือถือ ที่คุณโทรไปสั่งของที่ห้างและให้เขาเอามาส่งให้ถึงบ้านได้เลย

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

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

 

ซอฟแวร์

1) Web Designer คือ โปรแกรมช่วยกำหนดโครงสร้างภาษา HTML แบบคุณเห็นอย่างไร โปรแกรมจะสร้าง HTML ให้ตามนั้น โดยอัตโนมัติ เช่น Dream Weaver


2) Code Editor คือ โปรแกรมในการเขียนภาษาเบื้องหลังของเว็บเพจ เช่น CSS / PHP / ASP / JavaScript รวมถึง HTML ด้วย (ซึ่ง Web Editor ก็ทำได้ แต่ Code Editor จะออกแบบมาเพื่อการแก้ไขระดับ Code ให้ทำงานได้ง่ายกว่า) เช่น EditPlus / Note++

3) FTP Client คือ โปรแกรมติดต่อกับ Host เพื่อนำไฟล์เว็บเพจที่เราทำบนเครื่องคอมพิวเตอร์ของเรา ไปไว้บน Host ผ่านโปรโตคอล FTP

4) Graphic Designer คือ โปรแกรมออกแบบ ตกแต่ง รูปภาพประกอบเว็บไซต์ ที่นิยมกันก็ คือ CS (เสียเงิน) และ ของฟรีเกือบเทียบเท่า CS คือ Gimp

 

ฮาร์ดแวร์

ผมไม่ลงลึกในส่วนนี้มาก ขอเขียนรวม ๆ เลย คือ คอมพิวเตอร์ต้องมีสเปคได้มาตรฐานการทำงาน ซึ่งคอมพิวเตอร์ หรือ notebook ในท้องตลาดราคา 15,000 บาท ตั้งแต่ปี 2013 เป็นต้นมา ก็ถือว่า มากพอสำหรับรันซอฟแวร์ทุกตัวได้แล้วหละครับ
 

Domain และ Hosting

Domain คือ ชื่อเว็บไซต์ ซึ่งมีค่าใช้จ่ายรายปี ปีละ 200 บาท หรือ ถ้าชื่อเว็บไซต์ดีดี เช่น book.com อาจตกปีละ 100,000 บาท ได้เลย ซึ่งแน่นอนว่า ไม่ต้องกังวลไปครับ เพราะชื่อดีดีพวกนี้ ถูกจับจองไปหมดแล้ว

ที่สำคัญ คือ "ชื่อเว็บไซต์พร้อมนามสกุล" จะมีได้เพียงชื่อเดียวบนเครือข่ายอินเทอร์เน็ต ซ้ำกันไม่ได้ เช่น คุณอยากได้ชื่อ book.com แต่มีคนจับจองไปแล้ว แต่คุณสามารถจดทะเบียน book.net / book.cc / book.co.th ได้ ถ้ามันว่างอยู่

การจดทะเบียนก็จดแบบออนไลน์กับผู้ให้บริการผ่านเว็บไซต์ได้ซึ่งมีมากมายครับ

Hosting คือ คอมพิวเตอร์ที่ทำงานเป็นแม่ข่าย ซึ่งมีประสิทธิภาพสูงในการทำงานตลอดเวลา 24 ชั่วโมง ทุกวัน ซึ่งคอมพิวเตอร์พวกนี้จะอยู่ที่ ศุนย์ข้อมูลกลาง ที่ผู้ให้บริการรายใหญ่ ๆ ตั้งขึ้นมา เรียกว่า Data Center ที่นิยมกัน เช่น ตึก กสท. (CAT Datacenter) ที่บางรัก

แต่บริษัทใหญ่ ๆ มักจะตั้ง คอมพิวเตอร์แม่ข่าย ไว้ที่ตึกของตัวเอง เช่น IBM , Facebook ฯลฯ ซึ่งไม่ได้เปิดให้คนภายนอกเข้ามาขอแบ่งพื้นที่ใช้งาน

ดังนั้น คุณต้องเช่า Hosting กับผู้ให้บริการผ่านเว็บไซต์ต่าง ๆ (ซึ่งมักจะมีให้พร้อมกับการจดทะเบียน Domain Name) ซึ่งค่าเช่าก็มีราคาตั้งแต่เดือนละ 90 บาท ถึง 10,000 บาท ขึ้นกับสเปคของความต้องการใช้งานครับ

 

Network

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

ภาษาที่คอมพิวเตอร์คุยกันในเครือข่ายพื้นฐานเรียกว่า โปรโตคอล (Protocal)

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

แต่ภาษากลางในโลกคอมพิวเตอร์ก็มีหลายชนิด แต่ละชนิดใช้คุยกันตามหน้าที่ เช่น http , https , ftp เป็นต้น

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

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

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

หมวดหลัก
พัฒนาแอพและเว็บไซต์


หมวดย่อย
 
นายแทม นายแทม ดอทคอม ™ 2007 - 2020
อนุญาตให้คัดลอกเนื้อหา ยกเว้นเพื่อการค้า

 นายแทม ดอทคอม |  นายแทม ดอทคอม
 นายแทม ดอทคอม |  @naitam

โดย ห้างหุ้นส่วนสามัญ นายแทม เว็บดีไซน์
ปณจ. 26 หางดง เชียงใหม่ 50230
052-081830