Page 52 - การสร้างเว็บไซต์

14.กำรสร้ำงเว็บไซต์ด้วยภำษำ HTML 15.กำรสร้ำงหน้ำโฮมเพจ

็
สิ่งแรกที่เรำจะต้องเข้ำใจในกำรท�ำเว็บไชต์ คือ โครงสร้ำงของไฟล์ซึ่งจะเปนที่เกบไฟส์ทั้งหมด
็
็
ู
ทั้งรปภำพและไฟล์เอกสำรต่ำงๆ ที่อยู่ในเว็บไชต์ ควรจะถูกรวมอยู่ใน Folder เดียวกัน เพ่อให้ง่ำย ส�ำหรับหน้ำโฮมเพจจะเปนหน้ำแรกของเว็บไซต์ ซึ่งจะตั้งชื่อว่ำ :index.html โดยมีรปแบบและ
ื
ู
้
ื
ในกำรค้นหำ กำรเรียกใช้ กำรลิงก์ และกำรจัดเกบข้อมล ส�ำหรับชื่อไฟล์นั้นควรเปนภำษำอังกฤษทุกไฟล์ รำยละเอียดของเนอหำ
็
ู
็
ื
้
ี
ส�ำหรับในหนังสือเล่มนจะสร้ำงโครงสร้ำงไฟส์ของเว็บไซต์ ดังน ี ้ สำมำรถดำวน์โหลดโค้ดโปรแกรมได้ที่http:/c.mc.ac.thเพ่อน�ำโปรแกรมมำใช้ในกำรทด
ี
็
็
- โฟลเดอร์ที่เกบเว็บไชด์ซึ่งเปนโฟลเดอร์หลักให้มชื่อว่ำ html ใช้เกบไฟล์ต่ำงๆ ลองและศึกษำกำรท�ำงำนของโปรแกรมส�ำหรับกำรออกแบบส่วนต่ำงๆ ของโฮมเพจนั้น ได้มกำร
็
ี
ึ
้
็
ู
ี
ึ
็
- โฟลเดอร์ที่เกบรปภำหซึ่งระอยู่ภำยในโฟลเดอร์ html อีกทีหน่ง ให้มชื่อว่ำ imges ซึ่งจะใช้เกบ วำงโครงร่ำงซึ่งได้มีกำรสร้ำงโครงร่ำงขนมำโดยให้มีชื่อในทุกๆส่วนซึ่งจะท�ำให้ง่ำยต่อกำรวำงอิลิเมน
ี
ื
่
็
ู
รปภำพและสื่อต่ำงๆ ต์ต่ำงๆให้เปนไปตำมต้องกำรและสำมำรน�ำไปเขยน CSS ได้ เม่อออกแบบต�ำแหนงในกำรวำงข้อ
็
ิ
มลต่ำงๆของโฮมเพจแล้วต่อไปกจะเริมเขยนตัวควบคุมกำรแสดงผลของเว็บเพจ โดยเปดโปรแกรม
ู
ี
็
ื
ึ
้
ี
็
็
็
ื
็
เม่อสร้ำงโฟลเดอร์ส�ำหรับกบไฟล์ต่ำงๆ ของเว็บไชต์เสรจแล้ว ขั้นต่อไปกจะเปนกำรสร้ำงเว็บเพจ Notrpad++ ขนมำแล้วสร้ำงไฟล์ไหม่เพอเขยน CSS โดยใช้ชื่อว่ำ syle.css และเกบไฟไว้ที่โฟลเดอร์
็
ื
ี
็
ี
็
้
ี
ี
ี
โดยกำรเขยนจำกภำษำ HTML ซึ่งจะต้องม Editor ที่ใช้เขยน ในหนังสือเล่มนจะใช้โปรถกรม Nokpad+ เม่อเขยน CSS เสรจแล้ว ต่อไปกจะเปนกำรสร้ำงเว็บเพจโดยกำรเขยนด้วยภำษำ HTML ซึง
ี
็
็
ื
ี
็
็
+ซึ่งสำมำรถดำวน์โหลดจำกอินเทอร์เนตเปนโปรแกรมฟริไม่เสียค�ำใช้จ่ำย โดยสำมำรถเลือกดำวน์โหลด ยังใข้โปรแกรม Notepad++ เปนโปรแกรมหรือเปนอิติเตอร์ส�ำหรับเขยนเหมอนเดิม โดย กำรสร้ำง
้
ี
ึ
้
้
ี
ี
็
ได้ จำกเว็บไซต์ http//notepad-ples-plas ang/ ไปที่เมน Downbad แล้วเลือกโปรแกรมNotrpad++ ร่น ไฟล์ใหม่ขนมำอีก 1 ไฟส์ โดยให้ไฟส์นมชื่อว่ำ index htm! สำเหตุที่ใช้ชื่อนเพรำะว่ำต้องกำรให้เปนหน้ำ
ู
ุ
็
้
ี
็
ี
็
็
ุ
ื
ิ
ส่ำสดมำใช้งำน เม่อดำวน์โหลดมำแล้วกท�ำกำรติคตั้งลงที่เครื่องคอมพวเตอร์ให้เรจเรียบร้อย เมอคิคตั้ง แรกของโฮมเพจซึ่งทุกครั้งที่มคนเข้ำมำดูเว็บไซต์หน้ำนกจะถูกเรียกมำแสดงเปนหน้ำแรก ก่อนที่จะลิง
ื
ี
็
ี
็
ิ
้
ี
ุ
เสรจแล้วกเริ่มใช้งำนได้ทันที ชนดของไฟล์ในหนังสือนจะใช้เปนนำมสกล html เพรำะสร้ำงมำจำกภำษำ กไปยังหน้ำต่อๆ ไปที่มกำรลิงก์ในเว็บไซต์ โดยสำมำรถเขยนได้ดังน ้ ี
็
็
็
็
็
ื
ี
ุ
็
็
ุ
HTML แต่ำสร้ำงมำจำกภำษำ PHP กจะเปนนำมสกล pp ซึงนำมสกลของไฟล์หรือชนดของไฟส์นั้น จะ เม่อเขยนโปรแกรม HTMLเสรจแล้วกทดสอบดูผลที่แสดงออกมำว่ำเปนไปตำมที่ได้ออกแบ
ิ
ิ
็
ื
็
็
็
้
ขนอยู่กับอย่ำงไรกใด้ แต่กควรจะสอดคล้องกับเนอหำในเพจนั้นๆ และต้องเปนภำษำอังกฤษเท่ำนั้น เช่น บไว้หรือไม่ โดยเปดที่โปรแกรมเบรำว์เซอร์ใดๆ กได้ เช่น IE, Chrome, Firefox เปนต้น ซึ่งเม่อรัน
ื
้
ึ
็
็
ถ้ำเปนน�ำหน้ำสร้ำงไฟล์มำจำกภำษำอะไรหรือไปรแกรมอะไร เม่อใด้ไฟล์แรกเปนindex.html แล้ว ไฟลืต่ ิ โปรแกรมแล้ว
ื
็
ี
ุ
ไปจะตั้งชื่อเว็บเพจเก่ยวกับบคลำกรอำจจะตั้งชื่อว่ำ perso.html กได้
็
48 49