การเชื่อมโยงเว็บเพจด้วย link
เว็บไซต์หนึ่งเว็บไซต์จะประกอบไปด้วยไฟล์(เว็บเพจ)มากมาย ประกอบกันเหมือนเป็นหนังสือหนึ่งเล่มที่ประกอบด้วยหน้ากระดาษมากมายหลายแผ่น เว็บไซต์ก็ใช่เดียวกันถ้าเรามีข้อมูลมากขึ้นเราก็จำเป็นจะต้องแบ่งหน้าเพื่อความสะดวกในการอ่าน เช่นเดียวกับหนังสือ
โดยที่การแบ่งหน้าของหนังสือนั้นใช้สารบัญบอกเลขหน้าที่เก็บข้อความนั้นไว้ แต่การทำเว็บไซต์ของเราจะใช้ link เป็นตัวแทนที่ใช้ในการเปิดไปยังหน้าต่างๆ ซึ่งในบทนี้เราจะลองสร้าง link ดู
ให้เราสร้างไฟล์มา 3 ไฟล์มีชื่อและ source code ดังนี้
1.index.html เป็นไฟล์ที่เทียบได้กับสารบัญของเว็บไซต์ของเรา ซึ่ง source code มีดังนี้
|
<html> <head> <title>ทดลองสร้าง link ให้กับเว็บไซต์</title> </head> <body> เว็บไซต์นี้ประกอบด้วย 3 เว็บเพจซึ่งคุณสามารถคลิกที่ link ข้างล่างเพื่ออ่านหน้าอื่นได้ <br> <a href = "page1.html">หน้า 1</a> <a href = "page2.html">หน้า 2</a> <br> <h1>คุณอยู่ที่ หน้าสารบัญ</h1> </body> </html> |
2.page1.html เป็นไฟล์ที่เทียบได้กับ หน้าที่ 1 ของหนังสือ
|
<html> <head> <title>ทดลองสร้าง link ให้กับเว็บไซต์</title> </head> <body> เว็บไซต์นี้ประกอบด้วย 3 เว็บเพจซึ่งคุณสามารถคลิกที่ link ข้างล่างเพื่ออ่านหน้าอื่นได้ <br> <a href = "index.html">หน้าสารบัญ</a> <a href = "page2.html">หน้า 2</a> <br> <h1>คุณอยู่ที่ หน้า 1</h1> </body> </html> |
3.page2.html เป็นไฟล์ที่เทียบได้กับ หน้าที่ 2 ของหนังสือ
|
<html> <head> <title>ทดลองสร้าง link ให้กับเว็บไซต์</title> </head> <body> เว็บไซต์นี้ประกอบด้วย 3 เว็บเพจซึ่งคุณสามารถคลิกที่ link ข้างล่างเพื่ออ่านหน้าอื่นได้ <br> <a href = "index.html">หน้าสารบัญ</a> <a href = "page1.html">หน้า 1</a> <br> <h1>คุณอยู่ที่ หน้า 2</h1> </body> </html> |
ให้เราลอง เปิดไฟล์ดูจะเห็นดังรูปด้านล่าง
จะเห็นได้ว่าไฟล์(เว็บเพจ)ของเรานั้นเชื่อมโยงกันหมด ซึ่งถือว่าเป็นสิ่งที่สำคัญมากในการทำเว็บไซต์ ให้คุณลองจินตนาการว่ากำลังอ่านหนังสือที่ไม่มีเลขบอกหน้าเลยสักหน้าคงลำบากไม่น้อยเมื่อคุณจะกลับมาอ่านหน้าเดิมอีกครั้งหรือต้องการอ่านเนื้อหาที่อยากรู้ก็ไม่สามารถเปิดหน้านั้นได้
ซึ่งในส่วนของเว็บไซต์นั้นเลวร้ายกว่ากว่าในหนังสือมาก เพราะคุณจะไม่มีทางรู้ได้เลยว่าเว็บไซต์นั้นประกอบด้วยไฟล์กี่ไฟล์ หรือมีกี่หน้าซึ่งจะเป็นสิ่งที่ลำบากแก่ผู้ใช้งานเว็บไซต์ของเรามาก
เราจะเห็นได้ว่ามี source code ใหม่เพิ่มขึ้นมาคือ
<a href = "index.html">หน้าสารบัญ</a> เป็นส่วนที่ใช้แสดง link ของเราซึ่งมีรายละเอียดดังนี้
<a href="ชื่อไฟล์ที่เราต้องการเปิดเมื่อคลิกที่ลิ้งค์นี้">ชื่อลิ้งค์ของเราที่แสดงใน web browser</a>
<h1>หน้า 1</h1> เป็นส่วนที่เปลี่ยนขนาดของข้อความของเราที่แสดงใน web browser ซึ่งเราสามารถลองเปลี่ยนขนาดโดยเปลี่ยนตัวเลขเป็น h2 , h3 ขนาดของตัวอักษรที่แสดงก็จะเปลี่ยนแปลง
สำหรับบทความนี้ก็จบลงแค่นี้ บทความต่อไปจะเป็นเรื่องของการแสดงเว็บไซต์ของคุณให้ชาวโลกได้เห็น
เกี่ยวกับบทความนี้
- ระดับความยาก : พื้นฐาน
- คะแนนของบทความนี้ : 8
- สร้างเมื่อ : 16-05-2010
- จำนวนครั้งที่เปิด : 10,767
- เนื้อหาที่เกี่ยวข้อง :
- -
คลิกที่ โดนใจ! เพื่อโหวตให้กับบทความนี้หากคิดว่าน่าสนใจ
บทความอื่นๆในหมวดลองทำเว็บไซต์ แบบง่ายๆ (8 เรื่อง)
การทำเว็บแบบง่ายๆ
บทความนี้เกี่ยวกับการทำเว็บไซต์เบื้องต้น โดยจะแนะนำในส่วนของ HTML และ TEXT EDITOR เหมาะสำหรับผู้เริ่มต้น
สร้างเมื่อ : 16-05-2010 10:09 | จำนวนครั้งที่เปิด : 28,945
การใส่รูปในเว็บเพจ
หลังจากที่เราลองทำเว็บเพจแบบง่ายๆซึ่งมีแต่ตัวหนังสืออย่างเดียว ในบทความนี้ก็จะลองใส่รูปในเว็บเพจของเราดูบ้าง ถ้าคุณยังไม่มีพื้นฐานในการทำเว็บไซต์แนะนำว่าให้อ่านบทความ การทำเว็บแบบง่ายๆ ดูก่อน
สร้างเมื่อ : 16-05-2010 10:03 | จำนวนครั้งที่เปิด : 16,529
การเชื่อมโยงเว็บเพจด้วย link
หลังจากที่เราลองทำเว็บไซต์กันแบบง่ายๆ กันแล้ว และลองใส่รูปดูแล้ว ซึ่งในความเป็นจริงนั้นเว็บไซต์นั้นไม่ได้ประกอบด้วยไฟล์เพียงไฟล์เดียว แต่เป็นการเชื่อมโยงระหว่างไฟล์ต่างๆ เข้าด้วยกันรวมเป็นเว็บไซต์หนึ่งเว็บ ซึ่งในบทความนี้เราจะมาลองเชื่อมโยงไฟล์ต่างๆด้วย link กัน
สร้างเมื่อ : 16-05-2010 10:02 | จำนวนครั้งที่เปิด : 10,767
แสดงเว็บเพจที่คุณทำให้โลกได้เห็น
3 บทความที่ผ่านมาเราได้ลองทำเว็บเพจกันดูแล้ว มาถึงในบทความนี้จะเป็นการเผยแพร่เว็บเพจของเราให้คนอื่นได้เห็น ซึ่งก็ต้องพึ่งพาเจ้า web server ให้ช่วยซะแล้วในงานนี้
สร้างเมื่อ : 16-05-2010 9:58 | จำนวนครั้งที่เปิด : 9,758
สรุปการทำเว็บไซต์
เนื้อหาในบทนี้จะเป็นการสรุปการทำเว็บไซต์แบบคร่าวๆ เพื่อให้สามารถนึกภาพในการทำเว็บไซต์ได้
สร้างเมื่อ : 16-05-2010 9:12 | จำนวนครั้งที่เปิด : 5,706
ข้อแนะนำในการทำเว็บไซต์
ในหมวดนี้ เป็นข้อแนะนำในการทำเว็บที่ดี และเป็นเรื่องพื้นฐานที่ควรรู้
สร้างเมื่อ : 16-05-2010 9:13 | จำนวนครั้งที่เปิด : 5,128
การบีบอัดไฟล์รูป
ถึงแม้ว่ารูปจะมีข้อดีมากมาย แต่ถ้าเรามีรูปในเว็บเพจมากเกินไป หรือไฟล์รูปที่ใหญ่เกินไปจะทำให้เว็บไซต์ของเราแสดงผลได้ช้ามาก ในหัวข้อนี้จะกล่าวถึงเครื่องมือที่ใช้ในการบีบอัดไฟล์รูปให้เล็กลงโดยไม่ โดยภาพไม่เสียความชัดเจนไป
สร้างเมื่อ : 16-05-2010 9:30 | จำนวนครั้งที่เปิด : 6,254
การใช้งาน FTP ผ่าน My computer ของ window
เนื้อหาบทนี้จะสอนการอัพไฟล์ขึ้นบน web server โดยทำผ่าน My computer ในเครื่องที่เป็น window โดยไม่ต้องมีโปรแกรม FTP ในเครื่องเลย
สร้างเมื่อ : 16-05-2010 9:07 | จำนวนครั้งที่เปิด : 5,644
