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

15.การสร ้างหน้าโฮมเพจ
สรุป

่
่
้
็
็
ส�าหรับหน้าโยมเพจจะเปนหน้าแรกของเวบไซส์ ซึงจะตังชือว่า :index.html โดยมีรูปแบบและ cSS ย่อมาจากคาว่า cascading Style Sheer หรือเรียกว่าสั้นๆ ว่า สโตล์ซีต (Style Sheet)
�
้
รายละเอียดของเนอหา คือสีพื้นหลัง การกาหนดชนิดของตัวอักษร การจดวางข ้อความ เปนต ้น
ื
�
็
ั
่
่
�
สามารถดาวน์โหลดโค้ดโปรแกรมได้ทีhttp:/c.mc.ac.thเพือนาโปรแกรมมาใช ้ในการทด ภาษาที่ใช ้ ในการจดรูปแบบการแสดงผลของเอกสาร HTML เขน การใสสีให ้ข ้อความ การ
ั
้
�
ั
�
�
ลองและศึกษาการท�างานของโปรแกรมส�าหรับการออกแบบส่วนต่างๆ ของโฮมเพจนน ได้มีการวาง กาหนดในการกาหนดรูปแบบน้นจะใช ้ หลักการของการแยกเนื้อหาเอกสาร HTML ออกจากคา
ั
ั
�
้
่
่
่
โครงร่าง ซึงได้มีการสร ้างโครงร่างขึนมาโดยให้มีชือในทุกๆส่วนซึงจะท�าให้ง่ายต่อการวางอิไมนต์ สั่งกับเนื้อหาของเอกสาร ทาให ้ง่ายต่อการจดรูปแบบการแสดงผลลัทธ์ของเอกสาร HกMIL
ั
ั
ั
ต่างๆ ให้เปนไปตามต้องการและสามารนาไปเขียน CSS ได้ โดยเฉพาะที่ใช ้ ในการจดรูปแบบ ส�าหรบรูปแยบของการแสดงผลน้นจะอยู่ในส่วนของ Syle ซึ่ง
็
�
ี
จะไมขึ้นอยู่ถ ้หากในกรณที่มีการเปลี่ยนแปลงเนื้อหาเอกสาร แต่ต ้องการให ้รูปแบบเปนเหมือน
็
�
็
เติมก็ทาใด ้โดยแก ้เนื้อหาเพียงอย่างเดียว รูปแบบการแสดงผลเอกสาร HTML กจะเหมือนเดิม
่
็
่
เมือออกแบบต�าแหนงในการวางข้อมลต่างๆ ของโฮมเพจแล้ว ต่อไปกจะเริมเขียนตัวควบคุมการ cSS ถูกนามาใช ้ คร้งแรกใน HTML 40 เมื่อป ฟ.ศ. 2539 ในรูปแบบของ cSS Level l
ู
ี
ั
�
้
่
็
�
ิ
แสดงผลของเวบเพจ โดยเปดโปรแกรม Notrpad++ ขึนมาแล้วสร ้างไฟล์ไหมเพือเขียน CSS โดย Recommendations ซึ่งถูกกาหนดโดยองค์กร Warld Wide Web coasorlum หรือ W3c
่
่
�
�
็
ใช ้ชือว่า syle.css และเกบไฟไว้ทีโฟลเดอร ์ ประโยชน์ของ cSS คือ สามารถนามาใช ้ ร่วมกับเอกสารหลายไพได ้ กาหนดรูปแบบ
�
�
ั
ั
่
็
็
เมือเขียน CSS เสร็จแล้ว ต่อไปกจะเปนการสร ้างเวบเพจโดยการเขียนด้วยภาษา HTML คร้งเดียวก็มีผลกับการแสดงผลทั้งหมด ทาให ้เวลาแก ้ใขหรือปรบปรุงทาได ้สะดวก ไมต ้องไถ่
็
�
ซึงยังใข้โปรแกรม Notepad++ เปนโปรแกรมหรือเปนอิติเตอร ์ส�าหรับเขียนเหมือนเดิม โดย การ ตามแก ้ในต่างๆ ทั่วทั้งเอกสาร สามารถกาหนดรูปแบบการแสตงผลได ้ง่ายและสะดวก
็
็
็
ปจจุบัน cSS ได ้มีบทนาทส�าคัญเปนอย่ างมากส�าหรบการสร ้างเวบไซด์ด ้วยภาษา HTMI
ั
ั
็
่
้
้
่
่
้
สร ้างไฟล์ใหมขึนมาอีก 1 ไฟส์ โดยให้ไฟส์นมีชือว่า index htm! สาเหตุทีใช ้ชือนเพราะว่าต้องการ เปนคาสังที่ใช ้ คู่กับ HTML เพื่อใช ้ จดรูปแบบของเวยเพจและแก ้ไขเวบเพจได ้ง่ายขึ้น
่
ี
ี
ั
็
็
�
็
่
้
้ ่
็
็
ให้เปนหน้าแรกของโฮมเพจซึงทุกครังทีมีคนเข้ามาดูเวบไซต์หน้านกจะถูกเรียกมาแสดงเปนหน้า
ี
็
็
่
่
็
็
แรก ก่อนทีจะลิงกไปยังหน้าต่อๆ ไปทีมีการลิงก์ในเวบไซต์ โดยสามารถเขียนได้ดังน ี ้
่
่
่
็
เมือเขียนโปรแกรม HTMLเสร็จแล้วกทดสอบดูผลทีแสดงออกมาว่าเปนไปตามทีได้ออกแบบ
็
่
่
่
่
็
ิ
ไว้หรือไม โดยเปดทีโปรแกรมเบราว์เซอร ์ใดๆ กได้ เช่น IE, Chrome, Firefox เปนต้น ซึงเมือรัน
็
โปรแกรมแล้ว
44