การทำเว็บแบบง่ายๆ
บทความนี้เราจะมาลองทำเว็บไซต์กัน โดยการทำเว็บไซต์ในบทความนี้จะเป็นแบบพื้นฐานเพื่อให้คุณได้เข้าใจถึงการทำงานของเว็บไซต์ ซึ่งเราจะใช้โปรแกรม 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 จะมีหน้าต่างออกมา ให้เราใส่ชื่อไฟล์เป็น index.html และเลือกชนิดไฟล์ (save as type) เป็นแบบ All files จากนั้นก็ save ไฟล์
เราจะได้ไฟล์มาดังรูปข้างล่าง ให้เราคลิกเพื่อเปิดไฟล์ index.html เราก็จะเห็นเว็บไซต์แรกของเรา ซึ่งจะถูกเปิดโดยโปรแกรม internet explorer (ต่อไปนี้เราจะเรียกว่า Web Browser)
จากรูปจะบรรยายการทำงานของ html ที่เขียนเอาไว้ ซึ่งจะเห็นว่าตัวหนังสือที่อยู่ใน <title>....</title> จะแสดงที่ส่วนหัวของโปรแกรม internet explorer และในส่วนของ <body>....</body> จะแสดงในส่วนแสดงผลของโปรแกรม
เราก็ได้เห็นเว็บไซต์ที่เราทำเองไปแล้ว ซึ่งในบางเครื่องที่ลองทำเว็บอาจมีปัญหาได้ เราจะมาลองดูว่าจะแก้ปัญหาอย่างไร
1.เปิดไฟล์ไม่ได้ ให้เราลองเปิดโดยวิธีนี้แทน
เปิดโปรแกรม internet explorer ไปที่ file > open > browse เลือกไฟล์ที่ เรา save และกดที่ open
2.เปิดแล้วเป็นภาษาต่างดาว อ่านไม่ออก จากรูปให้เราไปที่ file > view > encoding > thai
หลังจากที่เราลองเขียน sorce code ไปแล้ว เราจะลองไปดูเว็บไซต์อื่นกันบ้างว่าเค้าเขียน source code กันอย่างไร ซึ่งการดู sorce code ของเว็บไซต์อื่นก็ทำได้โดย คลิกขวาที่เว็บที่เรากำลังดูอยู่ เลือก view soure
เราอาจจะเห็นว่าทำไมเว็บอื่น soure code เยอะมาก ซึ่งเราก็ไม่ต้องตกใจครับจริงแล้ว source code พวกนี้เราไม่ได้ใช้ notepad เขียน เพราะจะลำบากในการเขียนมากแต่ที่ในบทความนี้ให้ใช้ notepad เพราะเป็นโปรแกรมที่มีอยู่ในทุกเครื่อง จริงแล้วเราจะใช้โปรแกรมช่วยเขียน เช่น DREAMWEAVER , HTML - KIT , EDIT PLUS เป็นต้น ซึ่งในบทความต่อไปจะเป็นการลองใส่รูปในเว็บไซต์เพื่อเพิ่มสีสันในเว็บของเรา
ถ้าสับสนระหว่างเว็บไซต์ เว็บเพจ โฮมเพจ ให้อ่านเนื้อหาในส่วนของ พื้นฐานการทำเว็บดู
เกี่ยวกับบทความนี้
- ระดับความยาก : พื้นฐาน
- คะแนนของบทความนี้ : 9
- สร้างเมื่อ : 16-05-2010
- จำนวนครั้งที่เปิด : 28,945
- เนื้อหาที่เกี่ยวข้อง :
- -
คลิกที่ ชอบจัง! เพื่อโหวตให้กับบทความนี้หากคิดว่าน่าสนใจ
บทความอื่นๆในหมวดลองทำเว็บไซต์ แบบง่ายๆ (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,765
แสดงเว็บเพจที่คุณทำให้โลกได้เห็น
3 บทความที่ผ่านมาเราได้ลองทำเว็บเพจกันดูแล้ว มาถึงในบทความนี้จะเป็นการเผยแพร่เว็บเพจของเราให้คนอื่นได้เห็น ซึ่งก็ต้องพึ่งพาเจ้า web server ให้ช่วยซะแล้วในงานนี้
สร้างเมื่อ : 16-05-2010 9:58 | จำนวนครั้งที่เปิด : 9,757
สรุปการทำเว็บไซต์
เนื้อหาในบทนี้จะเป็นการสรุปการทำเว็บไซต์แบบคร่าวๆ เพื่อให้สามารถนึกภาพในการทำเว็บไซต์ได้
สร้างเมื่อ : 16-05-2010 9:12 | จำนวนครั้งที่เปิด : 5,706
ข้อแนะนำในการทำเว็บไซต์
ในหมวดนี้ เป็นข้อแนะนำในการทำเว็บที่ดี และเป็นเรื่องพื้นฐานที่ควรรู้
สร้างเมื่อ : 16-05-2010 9:13 | จำนวนครั้งที่เปิด : 5,128
การบีบอัดไฟล์รูป
ถึงแม้ว่ารูปจะมีข้อดีมากมาย แต่ถ้าเรามีรูปในเว็บเพจมากเกินไป หรือไฟล์รูปที่ใหญ่เกินไปจะทำให้เว็บไซต์ของเราแสดงผลได้ช้ามาก ในหัวข้อนี้จะกล่าวถึงเครื่องมือที่ใช้ในการบีบอัดไฟล์รูปให้เล็กลงโดยไม่ โดยภาพไม่เสียความชัดเจนไป
สร้างเมื่อ : 16-05-2010 9:30 | จำนวนครั้งที่เปิด : 6,252
การใช้งาน FTP ผ่าน My computer ของ window
เนื้อหาบทนี้จะสอนการอัพไฟล์ขึ้นบน web server โดยทำผ่าน My computer ในเครื่องที่เป็น window โดยไม่ต้องมีโปรแกรม FTP ในเครื่องเลย
สร้างเมื่อ : 16-05-2010 9:07 | จำนวนครั้งที่เปิด : 5,643
