Trace:
Differences
This shows you the differences between the selected revision and the current version of the page.
| oss:nvu:web-development 2008/12/11 14:20 | oss:nvu:web-development 2008/12/11 14:29 current | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | > [[oss:start|OSS & Freeware]] | + | > [[oss:start|OSS & Freeware]] > [[oss:nvu:start|NVU]] |
| ====== เตรียมการก่อนพัฒนาเว็บไซต์ ====== | ====== เตรียมการก่อนพัฒนาเว็บไซต์ ====== | ||
| Line 7: | Line 7: | ||
| ===== กำหนดโครงร่างของเว็บ ===== | ===== กำหนดโครงร่างของเว็บ ===== | ||
| - | การกำหนดโครงร่างของเว็บ เป็นขั้นตอนสำคัญขั้นแรกก็ว่าได้ เพราะเอกสารเว็บที่สร้างจะเพิ่มจำนวนเรื่อยๆ และมีจุดลิงก์ (Link) จำนวนมาก หากไม่มีการวางแผนไว้ก่อน จะทำให้ | + | การกำหนดโครงร่างของเว็บ เป็นขั้นตอนสำคัญขั้นแรกก็ว่าได้ เพราะเอกสารเว็บที่สร้างจะเพิ่มจำนวนเรื่อยๆ และมีจุดลิงก์ (Link) จำนวนมาก หากไม่มีการวางแผนไว้ก่อน จะทำให้การปรับปรุง แก้ไขเกิดปัญหาได้ ปัญหาที่ประสบแน่นอนคือ ลืมว่าไฟล์ที่เคยสร้างไว้แล้วมีชื่ออะไรบ้าง ซึ่งจะส่งผลให้การทำจุดลิงก์เกิดปัญหาตามไปด้วย เพราะไฟล์เหล่านี้อาจจะทิ้งช่วงเวลานาน จึงจะปรับปรุงอีกครั้ง วิธีการที่ดีที่สุดเพื่อป้องกันปัญหาดังกล่าว ควรวางแผนออกแบบเอกสารเว็บบนกระดาษ และกำหนดชื่อไฟล์ของเอกสารเว็บแต่ละไฟล์ จากขั้นตอนนี้จะทำให้ผู้พัฒนาสามารถมองเห็นภาพการไหล (Data Flow) ของเอกสารเว็บได้ชัดเจน และพิจารณาต่อได้ว่าเอกสารเว็บแต่ละไฟล์มีความสัมพันธ์กับเอกสารอื่นๆ อย่างไร และสัมพันธ์กับไฟล์เอกสารใดบ้าง |
| - | การปรับปรุง แก้ไขเกิดปัญหาได้ ปัญหาที่ประสบแน่นอนคือ ลืมว่าไฟล์ที่เคยสร้างไว้แล้ว | + | |
| - | มีชื่ออะไรบ้าง ซึ่งจะส่งผลให้การทำจุดลิงก์เกิดปัญหาตามไปด้วย เพราะไฟล์เหล่านี้อาจจะ | + | |
| - | ทิ้งช่วงเวลานาน จึงจะปรับปรุงอีกครั้ง วิธีการที่ดีที่สุดเพื่อป้องกันปัญหาดังกล่าว ควรวางแผนออกแบบเอกสารเว็บบนกระดาษ และกำหนดชื่อไฟล์ของเอกสารเว็บแต่ละไฟล์ จากขั้นตอนนี้ | + | |
| - | จะทำให้ผู้พัฒนาสามารถมองเห็นภาพการไหล (Data Flow) ของเอกสารเว็บได้ชัดเจน และพิจารณาต่อได้ว่าเอกสารเว็บแต่ละไฟล์มีความสัมพันธ์กับเอกสารอื่นๆ อย่างไร และสัมพันธ์กับไฟล์เอกสารใดบ้าง | + | |
| เนื่องจากขั้นตอนนี้จะเกี่ยวข้องกับการการกำหนดชื่อไฟล์ และนามสกุลของไฟล์เอกสารเว็บ โดยเอกสารเว็บจะมีข้อกำหนดที่แตกต่างไปจากการกำหนดชื่อไฟล์ปกติทั่วไป คือ | เนื่องจากขั้นตอนนี้จะเกี่ยวข้องกับการการกำหนดชื่อไฟล์ และนามสกุลของไฟล์เอกสารเว็บ โดยเอกสารเว็บจะมีข้อกำหนดที่แตกต่างไปจากการกำหนดชื่อไฟล์ปกติทั่วไป คือ | ||
| Line 22: | Line 18: | ||
| * นามสกุลของเอกสารเว็บ มีสองรูปแบบ คือ .htm และ html ดังนั้นผู้พัฒนาควรสอบถามจาก Web Administrator ก่อนว่าเครื่องบริการเว็บที่ใช้เก็บเอกสารเว็บ รู้จักนามสกุลไฟล์รูปแบบใด หมายเหตุ แนะนำให้ใช้นามสกุลเป็น .html เพื่อให้เป็นมาตรฐานเดียวกัน | * นามสกุลของเอกสารเว็บ มีสองรูปแบบ คือ .htm และ html ดังนั้นผู้พัฒนาควรสอบถามจาก Web Administrator ก่อนว่าเครื่องบริการเว็บที่ใช้เก็บเอกสารเว็บ รู้จักนามสกุลไฟล์รูปแบบใด หมายเหตุ แนะนำให้ใช้นามสกุลเป็น .html เพื่อให้เป็นมาตรฐานเดียวกัน | ||
| - | นอกจากนี้ยังจะต้องพิจารณาถึงลักษณะหน้าเว็บ, ลักษณะของสีพื้น, สีอักษรและสีของ | + | นอกจากนี้ยังจะต้องพิจารณาถึงลักษณะหน้าเว็บ, ลักษณะของสีพื้น, สีอักษรและสีของจุดลิงก์ (Links) ด้วย โดยสามารถร่างหน้าเว็บคร่าวๆ เพื่อให้เห็นภาพโดยรวมก่อนสร้างงานจริง รวมทั้งการใช้สีของหน้าเว็บ ควรใช้สีที่อ่านง่าย สบายตา และมีลักษณะร่วมกันในทุกๆ หน้าเว็บไม่ควรเปลี่ยนสีพื้นให้ฉูดฉาด รวมทั้งศึกษาหน้าเว็บไซต์ที่มีการพัฒนาในเครือข่ายเพื่อเป็นแนวทางในการออกแบบ |
| - | จุดลิงก์ (Links) ด้วย โดยสามารถร่างหน้าเว็บคร่าวๆ เพื่อให้เห็นภาพโดยรวมก่อนสร้างงานจริง รวมทั้งการใช้สีของหน้าเว็บ ควรใช้สีที่อ่านง่าย สบายตา และมีลักษณะร่วมกันในทุกๆ หน้าเว็บ | + | |
| - | ไม่ควรเปลี่ยนสีพื้นให้ฉูดฉาด รวมทั้งศึกษาหน้าเว็บไซต์ที่มีการพัฒนาในเครือข่ายเพื่อเป็นแนวทางในการออกแบบ | + | |
| - | ขั้นตอนนี้สามารถทำได้ง่ายๆ โดยการเข้าไปยังเว็บไซต์ต่างๆ แล้วบันทึกข้อมูลเกี่ยวกับเว็บไซต์ที่ชอบ เช่น ลักษณะการออกแบบกราฟิก การจัดวางเนื้อหา (Layout) ข้อมูลเกี่ยวกับสีพื้น | + | ขั้นตอนนี้สามารถทำได้ง่ายๆ โดยการเข้าไปยังเว็บไซต์ต่างๆ แล้วบันทึกข้อมูลเกี่ยวกับเว็บไซต์ที่ชอบ เช่น ลักษณะการออกแบบกราฟิก การจัดวางเนื้อหา (Layout) ข้อมูลเกี่ยวกับสีพื้นสีกราฟิก สีตัวอักษร สีจุดลิงก์ต่างๆ นอกจากนี้ยังจำเป็นต้องอ่านข้อมูลเกี่ยวกับการพัฒนาเว็บไซต์จากแหล่งข้อมูลอื่นๆ ประกอบอย่างสม่ำเสมอ เนื่องจากเทคโนโลยีเว็บเป็นเทคโนโลยีที่เปลี่ยนแปลงอย่างรวดเร็ว |
| - | สีกราฟิก สีตัวอักษร สีจุดลิงก์ต่างๆ นอกจากนี้ยังจำเป็นต้องอ่านข้อมูลเกี่ยวกับการพัฒนาเว็บไซต์จากแหล่งข้อมูลอื่นๆ ประกอบอย่างสม่ำเสมอ เนื่องจากเทคโนโลยีเว็บเป็นเทคโนโลยีที่เปลี่ยนแปลงอย่างรวดเร็ว | + | |
| ===== กำหนดโฟลเดอร์ (Folder) ===== | ===== กำหนดโฟลเดอร์ (Folder) ===== | ||
| Line 39: | Line 32: | ||
| ===== สร้างเอกสารประกอบ ===== | ===== สร้างเอกสารประกอบ ===== | ||
| - | นอกจากภาพแล้ว อาจจะมีไฟล์ประกอบอื่นๆ เช่น Word, PowerPoint, PDF Document | + | นอกจากภาพแล้ว อาจจะมีไฟล์ประกอบอื่นๆ เช่น Word, PowerPoint, PDF Document ก็จะต้องเตรียมไว้ในโฟลเดอร์ที่สร้างไว้ให้พร้อม โดยอาจจะสร้างเป็นโฟลเดอร์เฉพาะของแต่ละไฟล์ฟอร์แมต |
| - | ก็จะต้องเตรียมไว้ในโฟลเดอร์ที่สร้างไว้ให้พร้อม โดยอาจจะสร้างเป็นโฟลเดอร์เฉพาะของแต่ละไฟล์ฟอร์แมต | + | |
| ===== เลือกเครื่องแม่ข่ายและเทคโนโลยี ===== | ===== เลือกเครื่องแม่ข่ายและเทคโนโลยี ===== | ||
| Line 47: | Line 39: | ||
| เครื่องแม่ข่ายที่ใช้ระบบปฏิบัติการใด เพราะหากเลือกผิดพลาด ก็จะทำให้เว็บนั้นมีปัญหาอีกมากมาย ดังนั้นการพิจารณาเลือกเครื่องแม่ข่าย และระบบปฏิบัติก่อนสร้างเว็บไซต์ จะช่วยให้เว็บไซต์นั้นไม่เกิดปัญหาตามมาทีหลัง เช่น รันโปรแกรมไม่ได้, มีปัญหาเรื่องการเรียกไฟล์ต่างๆ ซึ่งเป็นปัญหาที่นักพัฒนาเว็บมือใหม่เกือบทุกรายประสบ | เครื่องแม่ข่ายที่ใช้ระบบปฏิบัติการใด เพราะหากเลือกผิดพลาด ก็จะทำให้เว็บนั้นมีปัญหาอีกมากมาย ดังนั้นการพิจารณาเลือกเครื่องแม่ข่าย และระบบปฏิบัติก่อนสร้างเว็บไซต์ จะช่วยให้เว็บไซต์นั้นไม่เกิดปัญหาตามมาทีหลัง เช่น รันโปรแกรมไม่ได้, มีปัญหาเรื่องการเรียกไฟล์ต่างๆ ซึ่งเป็นปัญหาที่นักพัฒนาเว็บมือใหม่เกือบทุกรายประสบ | ||
| - | สร้างเอกสารเว็บ | ||
| - | จากที่กล่าวไว้ว่าไฟล์เอกสาร HTML เป็นไฟล์ข้อความปกติ (Text File) ดังนั้นเพื่อให้โปรแกรมเบราว์เซอร์ทราบว่าไฟล์เอกสารนี้เป็นไฟล์เฉพาะ สำหรับกำหนดรูปแบบการแสดงผล | + | ===== สร้างเอกสารเว็บ ===== |
| - | ผ่านอินเทอร์เน็ต จึงมีลักษณะเฉพาะของไฟล์เอกสารรูปแบบนี้คือ ในการจัดเก็บไฟล์ จะต้องกำหนดนามสกุล หรือส่วนขยายของไฟล์ (File Extension) เป็น .htm หรือ .html โดยข้อกำหนดเกี่ยวกับนามสกุลของไฟล์นี้ ขึ้นอยู่กับผู้บริหารเว็บ ดังนั้นก่อนสร้างเอกสาร HTML ควรสอบถามจากผู้บริหารเครือข่ายที่ท่านจะนำข้อมูลไปฝากไว้ก่อนว่าให้กำหนดนามสกุลของไฟล์อย่างไร | + | |
| + | จากที่กล่าวไว้ว่าไฟล์เอกสาร HTML เป็นไฟล์ข้อความปกติ (Text File) ดังนั้นเพื่อให้โปรแกรมเบราว์เซอร์ทราบว่าไฟล์เอกสารนี้เป็นไฟล์เฉพาะ สำหรับกำหนดรูปแบบการแสดงผลผ่านอินเทอร์เน็ต จึงมีลักษณะเฉพาะของไฟล์เอกสารรูปแบบนี้คือ ในการจัดเก็บไฟล์ จะต้องกำหนดนามสกุล หรือส่วนขยายของไฟล์ (File Extension) เป็น .htm หรือ .html โดยข้อกำหนดเกี่ยวกับนามสกุลของไฟล์นี้ ขึ้นอยู่กับผู้บริหารเว็บ ดังนั้นก่อนสร้างเอกสาร HTML ควรสอบถามจากผู้บริหารเครือข่ายที่ท่านจะนำข้อมูลไปฝากไว้ก่อนว่าให้กำหนดนามสกุลของไฟล์อย่างไร | ||
| นอกจากการกำหนดนามสกุลของไฟล์ ชื่อไฟล์ก็เป็นอีกส่วนหนึ่งที่ผู้พัฒนาต้องตระหนักด้วย เพราะผู้ให้บริการเผยแพร่ข้อมูล หรือผู้ดูแลระบบเครือข่าย อาจจะกำหนดชื่อไฟล์เอกสาร HTML แตกต่างกันออกไป | นอกจากการกำหนดนามสกุลของไฟล์ ชื่อไฟล์ก็เป็นอีกส่วนหนึ่งที่ผู้พัฒนาต้องตระหนักด้วย เพราะผู้ให้บริการเผยแพร่ข้อมูล หรือผู้ดูแลระบบเครือข่าย อาจจะกำหนดชื่อไฟล์เอกสาร HTML แตกต่างกันออกไป | ||
| - | การตั้งชื่อและนามสกุลของไฟล์ HTML เป็นภาษาไทย เป็นสิ่งที่ไม่ควรกระทำเป็น | + | การตั้งชื่อและนามสกุลของไฟล์ HTML เป็นภาษาไทย เป็นสิ่งที่ไม่ควรกระทำเป็นอย่างยิ่ง เพราะระบบปฏิบัติการหลายระบบไม่สนับสนุนภาษาไทย และควรใช้ตัวอักษรตัวพิมพ์เล็กในการกำหนดชื่อและนามสกุลของไฟล์ทุกครั้ง ป้องกันปัญหาการทำงานข้ามระบบปฏิบัติการ เนื่องจากระบบปฏิบัติการหลายระบบ โดยเฉพาะ UNIX จะเห็นตัวอักษรตัวพิมพ์ใหญ่ และตัวพิมพ์เล็กเป็นคนล่ะตัวกัน (Case-Sensitive) |
| - | อย่างยิ่ง เพราะระบบปฏิบัติการหลายระบบไม่สนับสนุนภาษาไทย และควรใช้ตัวอักษรตัวพิมพ์เล็กในการกำหนดชื่อและนามสกุลของไฟล์ทุกครั้ง ป้องกันปัญหาการทำงานข้ามระบบปฏิบัติการ เนื่องจากระบบปฏิบัติการหลายระบบ โดยเฉพาะ UNIX จะเห็นตัวอักษรตัวพิมพ์ใหญ่ และ | + | |
| - | ตัวพิมพ์เล็กเป็นคนล่ะตัวกัน (Case-Sensitive) | + | |
| ===== ตรวจสอบผลเอกสารเว็บ ===== | ===== ตรวจสอบผลเอกสารเว็บ ===== | ||
| Line 63: | Line 53: | ||
| ข้อที่ควรคำนึงถึงในการทำเว็บเชิงพาณิชย์ก็คือ ภาษา HTML เป็นภาษาที่ยังไม่ตาย ยังมีการพัฒนาชุดคำสั่งใหม่ๆ อยู่เรื่อยๆ ดังนั้นอย่าพยายามไล่ตามเทคโนโลยีใหม่ๆ เหล่านี้ ควรพัฒนาเว็บเพจที่สามารถเรียกดูได้จากเบราว์เซอร์หลายๆ รุ่น หลายค่าย ดีกว่ายึดค่ายใด ค่ายหนึ่ง หรือรุ่นใด รุ่นหนึ่ง มิฉะนั้นอาจจะทำให้พลาดจากลูกค้าบางกลุ่มไปได้ | ข้อที่ควรคำนึงถึงในการทำเว็บเชิงพาณิชย์ก็คือ ภาษา HTML เป็นภาษาที่ยังไม่ตาย ยังมีการพัฒนาชุดคำสั่งใหม่ๆ อยู่เรื่อยๆ ดังนั้นอย่าพยายามไล่ตามเทคโนโลยีใหม่ๆ เหล่านี้ ควรพัฒนาเว็บเพจที่สามารถเรียกดูได้จากเบราว์เซอร์หลายๆ รุ่น หลายค่าย ดีกว่ายึดค่ายใด ค่ายหนึ่ง หรือรุ่นใด รุ่นหนึ่ง มิฉะนั้นอาจจะทำให้พลาดจากลูกค้าบางกลุ่มไปได้ | ||
| - | ส่งข้อมูลขึ้นเครื่องบริการเว็บ (Server) | + | |
| + | ===== ส่งข้อมูลขึ้นเครื่องบริการเว็บ (Server) ===== | ||
| เมื่อได้พัฒนาเอกสารเว็บ และตรวจสอบผลได้ตามที่ต้องการแล้ว ก็สามารถโอนข้อมูลนั้นๆ ไปยังเครื่องบริการเว็บได้ โดยใช้โปรแกรมกลุ่มถ่ายโอนข้อมูล (FTP Software) เช่น FileZilla ก่อนโอนข้อมูล จะต้องขอสิทธิ์และพื้นที่จากผู้ดูแลระบบก่อนเสมอ และตลอดจนต้องสอบถามข้อมูลที่จำเป็นในการโอนข้อมูล เช่นชื่อบัญชีของผู้มีสิทธิ์ (Login Name / Account Name) รหัสผ่านของบัญชี (Password) เป็นต้น | เมื่อได้พัฒนาเอกสารเว็บ และตรวจสอบผลได้ตามที่ต้องการแล้ว ก็สามารถโอนข้อมูลนั้นๆ ไปยังเครื่องบริการเว็บได้ โดยใช้โปรแกรมกลุ่มถ่ายโอนข้อมูล (FTP Software) เช่น FileZilla ก่อนโอนข้อมูล จะต้องขอสิทธิ์และพื้นที่จากผู้ดูแลระบบก่อนเสมอ และตลอดจนต้องสอบถามข้อมูลที่จำเป็นในการโอนข้อมูล เช่นชื่อบัญชีของผู้มีสิทธิ์ (Login Name / Account Name) รหัสผ่านของบัญชี (Password) เป็นต้น | ||
