การทำเว็บแบบง่ายๆ
บทความนี้เราจะมาลองทำเว็บไซต์กัน โดยการทำเว็บไซต์ใน
บทความนี้จะเป็นแบบพื้นฐานเพื่อให้คุณได้เข้าใจถึงการทำงานของ
เว็บไซต์ ซึ่งเราจะใช้โปรแกรม notepad ซึ่งจะมีอยู่ในทุกเครื่องที่ใช้
ระบบ window
โปรแกรม notepad เป็นโปรแกรมที่อยู่ในประเภท Text
editor ใช้ในการแก้ไขข้อความ มีความสำคัญมากในการทำเว็บไซต์
เพราะจริงๆแล้วเว็บไซต์ที่เราเห็นว่ามีหน้าตาสวยงาม มีรูปภาพ หรือมี
การเคลื่อนไหวต่างๆ ซึ่งจริงๆแล้วตัวเว็บไซต์นั้นก็ประกอบด้วย ตัว
หนังสือมากมายรวมกันอยู่เป็นไฟล์(เราจะเรียกว่าเว็บเพจ) แต่มีการ
ถูกแปลงที่เครื่องของคุณให้เป็นรูป หรือหน้าตาตามที่เราเห็น
ซึ่งในบทนี้เรามาลองทำเว็บเพจดู ขั้นตอนตามนี้
ซึ่งในบทนี้เรามาลองทำเว็บเพจดู ขั้นตอนตามนี้
1.ให้คุณเปิดโปรแกรม Notepad ขึ้นมา โดยไปที่ All programs >
Accessories > Notepad
ซึ่งโปรแกรม notepad จะมีหน้าตาแบบนี้
2. ให้คุณพิมพ์ข้อความต่อไปนี้ ใน notepad
| <html> <head> <title>ทดลองทำเว็บไซต์แบบง่ายๆ</title> </head> <body> Hellomyweb นี่คือเว็บไซต์แรกของฉัน </body> </html> |
ข้อความที่คุณพิมพ์ไปนั้นเราเรียกว่า SOURCE CODE เป็นภาษา
คอมพิวเตอร์ เรียกว่าภาษา HTML ซึ่งใช้ในการจัดหน้าของเว็บเพจ
คุณสามารถศึกษารายละเอียดของภาษา html ได้ที่หัวข้อของ html
เมื่อพิมพ์เสร็จแล้วให้เราเลือก save as จะมีหน้าต่างออกมา ให้เราใส่
เมื่อพิมพ์เสร็จแล้วให้เราเลือก save as จะมีหน้าต่างออกมา ให้เราใส่
ชื่อไฟล์เป็น index.html และเลือกชนิดไฟล์ (save as type) เป็น
แบบ All files จากนั้นก็ save ไฟล์
เราจะได้ไฟล์มาดังรูปข้างล่าง ให้เราคลิกเพื่อเปิดไฟล์ index.html
เราก็จะเห็นเว็บไซต์แรกของเรา ซึ่งจะถูกเปิดโดยโปรแกรม internet
explorer (ต่อไปนี้เราจะเรียกว่า Web Browser)
จากรูปจะบรรยายการทำงานของ html ที่เขียนเอาไว้ ซึ่งจะเห็นว่าตัว
หนังสือที่อยู่ใน <title>....</title> จะแสดงที่ส่วนหัวของโปรแกรม
internet explorer และในส่วนของ <body>....</body> จะแสดง
ในส่วนแสดงผลของโปรแกรม
เราก็ได้เห็นเว็บไซต์ที่เราทำเองไปแล้ว ซึ่งในบางเครื่องที่ลองทำเว็บ
อาจมีปัญหาได้ เราจะมาลองดูว่าจะแก้ปัญหาอย่างไร
1.เปิดไฟล์ไม่ได้ ให้เราลองเปิดโดยวิธีนี้แทน
1.เปิดไฟล์ไม่ได้ ให้เราลองเปิดโดยวิธีนี้แทน
เปิดโปรแกรม internet explorer ไปที่ file > open > browse
เลือกไฟล์ที่ เรา save และกดที่ open
2.เปิดแล้วเป็นภาษาต่างดาว อ่านไม่ออก จากรูปให้เราไปที่
file > view > encoding > thai
หลังจากที่เราลองเขียน source code ไปแล้ว เราจะลองไปดู
เว็บไซต์อื่นกันบ้างว่าเค้าเขียน source code กันอย่างไร ซึ่งการดู
source code ของเว็บไซต์อื่นก็ทำได้โดย คลิกขวาที่เว็บที่เรากำลังดู
อยู่ เลือก view source
เราอาจจะเห็นว่าทำไมเว็บอื่น source code เยอะมาก ซึ่งเราก็ไม่ต้อง
ตกใจครับจริงแล้ว source code พวกนี้เราไม่ได้ใช้ notepad เขียน
เพราะจะลำบากในการเขียนมากแต่ที่ในบทความนี้ให้ใช้ notepad
เพราะเป็นโปรแกรมที่มีอยู่ในทุกเครื่อง จริงแล้วเราจะใช้โปรแกรม
ช่วยเขียน เช่น DREAMWEAVER , HTML - KIT , EDIT PLUS
เป็นต้น ซึ่งในบทความต่อไปจะเป็นการลองใส่รูปในเว็บไซต์เพื่อเพิ่ม
สีสันในเว็บของเรา
ที่มา : http://www.hellomyweb.com/index.php/main/content
ไม่มีความคิดเห็น:
แสดงความคิดเห็น