เขียนโฮมเพจ ภาคปฎิบัติ


	เขียนโฮมเพจ ภาคปฎิบัติ

เว็บเพจสำรอง (Backup Webpages) : thaiall.com | lampang.thcity.com
ปรับปรุง : 2548-02-25 ()

บทเรียน ONLINE : การเขียน Homepage ด้วย HTML [ เริ่มเขียน HOMEPAGE ภาคปฏิบัติ ]

สิ่งที่ต้องเตรียมในการเขียน Homepage ด้วย HTML
เริ่มเขียน Homepage หน้าแรก
เริ่มเขียน Homepage หน้าที่สอง และใช้คำสั่ง BR
ไปเปิดใน Browser เพื่อดูผล
thai.net คือ homepage ฟรี เพื่อคนไทย
แบบฝึกหัด

สิ่งที่ต้องเตรียมในการเขียน Homepage ด้วย HTML

1. หาโปรแกรม Editor ที่ใช้ได้ง่าย เช่น Notepad หรือ Editplus หรือ Editor on web	สำหรับ สร้างแฟ้ม htm หรือ html ในเครื่องของเรา
2. หาโปรแกรม Browser เช่น Netscape หรือ Internet Explorer	สำหรับ เปิดแฟ้ม htm ในเครื่องของเรา ขึ้นมาดูว่าเขียนไปหน้าตา เป็นอย่างไร
3. เลือกแหล่งให้บริการ Homepage ฟรีสักที่หนึ่ง เช่น geocities , freeservers , tripod , hypermart , xoom , 50megs , angelfire เป็นต้น	สำหรับ จัดเก็บ homepage ของเรา ส่วนใหญ่ให้ฟรีแต่จะขอติด banner ใน homepage ที่เราสร้าง
4. เตรียมโปรแกรม FTP เจ๋ง ๆ สักตัว เช่น wsftppro หรือ cute_ftp หรือ ftp ใน windows ก็มี	สำหรับ ส่งแฟ้ม htm หรือ gif หรือ jpg เข้าไปเก็บใน server ที่ขอฟรีไว้ เพื่อให้ถูกเปิดได้จากทั่วโลก

เริ่มเขียน Homepage หน้าแรก
เพียงแต่ใช้ editor สร้างแฟ้มให้ได้นามสกุล htm เก็บใว้ในห้องที่เป็นส่วนตัวสักหน่อย ก็เรียบร้อย
เช่น สร้างแฟ้มแรกชื่อ xx.htm เก็บไว้ที่ c:\home\xx.htm ต่อไปสร้างแฟ้มใดก็ให้เก็บเข้าห้องชือ่ home ให้หมด
คำสั่ง HTML จะเป็นตัวเล็ก หรือตัวใหญ่ก็ได้ ไม่แตกต่าง แต่ที่ต่อไปจะเขียนตัวใหญ่ ก็เพื่อจะได้เห็นชัด ๆ

ส่วนนี้นำไปเขียนใน editor	ส่วนนี้เป็นคำอธิบาย อ่านเฉย ๆ
<HTML>	ประกาศว่าต่อไปจะเป็น HTML แล้วนะ
<HEAD>	กำหนดให้เริ่มต้นส่วน HEAD
<TITLE>คำนี้จะไปแสดงที่แท่งบนสุด</TITLE>	สั่งให้ TITLE แสดงตัวอักษรที่ต้องการ
</HEAD>	กำหนดให้สิ้นสุดส่วนของ HEAD
<BODY>	กำหนดให้เริ่มต้นส่วน BODY
นี่เป็น homepage แรกของฉัน	ข้อความที่แสดงในส่วนของ browser
</BODY>	กำหนดให้สิ้นสุดส่วน BODY
<HTML>	ประกาศว่าต่อไปจะเป็นสิ้นสุดคำสั่ง HTML

ปัจจุบันเขียน Homepage ไม่ต้องมีให้ครบ ก็ใช้ได้ เพราะ Browser พยายามจะเข้าใจ ถึงแม้จะพิมพ์ไม่ครบ
ตัวอย่างข้างล่างนี้เหมือนข้างบน ให้ผลเหมือนกัน แต่เขียนสั้นกว่า แต่เขียนให้ครบไว้ก่อน ย่อมดีกว่า

<TITLE>คำนี้จะไปแสดงที่แท่งบนสุด</TITLE>	สั่งให้ TITLE แสดงตัวอักษรที่ต้องการ
<BODY>	กำหนดให้เริ่มต้นส่วน BODY
นี่เป็น homepage แรกของฉัน	ข้อความที่แสดงในส่วนของ browser
</BODY>	กำหนดให้สิ้นสุดส่วน BODY

เริ่มเขียน Homepage หน้าที่สอง
หน้านี้จะเสริมการใช้คำสั่ง BR เข้ามา เพื่อควบคุมการแสดงผลของตัวอักษร
โดยปกติ html จะไม่สนใจการตัดบรรทัด ด้วยการกดปุ่ม enter แต่จะมองว่า บรรทัดที่ต่างกัน คือ ช่องไฟเท่านั้น
ดังนั้น ถ้าต้องการให้ข้อความใน html อยู่กันคนละบรรทัดต้องใช้คำสั่ง <BR>

ส่วนนี้นำไปเขียนใน editor	ส่วนนี้เป็นคำอธิบาย อ่านเฉย ๆ
<HTML>	ประกาศว่าต่อไปจะเป็น HTML แล้วนะ
<HEAD>	กำหนดให้เริ่มต้นส่วน HEAD
<TITLE>คำนี้จะไปแสดงที่แท่งบนสุด</TITLE>	สั่งให้ TITLE แสดงตัวอักษรที่ต้องการ
</HEAD>	กำหนดให้สิ้นสุดส่วนของ HEAD
<BODY>	กำหนดให้เริ่มต้นส่วน BODY
บรรทัดแรก<br>	ข้อความที่แสดงในส่วนของ browser
บรรทัดที่สอง<br>	ข้อความที่แสดงในส่วนของ browser
บรรทัดที่สาม	ข้อความที่แสดงในส่วนของ browser
นะจ๊ะ<br>	ข้อความที่แสดงในส่วนของ browser
บรรทัดที่สี่<br>บรรทัดที่ห้า	ข้อความที่แสดงในส่วนของ browser
</BODY>	กำหนดให้สิ้นสุดส่วน BODY
<HTML>	ประกาศว่าต่อไปจะเป็นสิ้นสุดคำสั่ง HTML

ไปเปิดใน Browser เพื่อดูผล

เมื่อ save แฟ้มที่สร้างไว้ด้วยชื่อ xx.htm ในห้อง c:\home\ เรียบร้อยแล้ว
ก็เปิด browser ขึ้นมาแล้ว พิมพ์ในช่อง location หรือช่อง open ว่า c:\home\xx.htm
หากไม่พอใจก็กลับไปแก้ไข โดยไม่ปิดหน้าต่างใด แต่ใช้ minimize
เมื่อกลับไปแก้ไข ให้ save ทุกครั้งก่อนกลับมาที่ browser
เมื่อกลับมาที่ browser แล้วให้ กดปุ่ม refresh หรือ reload จึงจะเห็นผลการแก้ไข
การใช้โปรแกรม ftp ได้เขียนไว้เป็นบทเรียน Hompage upload ด้วย FTP แต่การจอง homepage จากผู้ให้บริการฟรี จะไม่ขอกล่าวถึง เพราะมีรายละเอียดมาก เปลี่ยนแปลงตลอดเวลา และที่สำคัญ ผู้ให้บริการแต่ละรายมีลักษณะการขอจอง และการให้บริการที่แตกต่างกัน ซึ่งท่านสามารถทำความเข้าใจได้ไม่ยาก เพราะผู้ให้บริการ มีความต้องการที่จะให้อยู่แล้ว ไม่ได้คิดที่จะทำเป็นค่ายกลให้ผู้ใช้บริการงง แต่อย่างใด ดังนั้นต้องใจเย็น ๆ ในการใช้บริการ แล้วท่านจะได้สิ่งที่เขามีให้

thai.net คือ homepage ฟรี เพื่อคนไทย

เปิด homepage ที่ thai.net
เข้าขอ homepage ฟรี Join us
ส่วนบริการสมาชิก Member area

homepage ฟรี ที่ geocities.com
hoempage ฟรี ที่ freeservers.com หรือ 8m.com
hoempage ฟรี ที่ hypermart.net

บางเว็บจะขอแล้วได้ทันที แต่หลายเว็บจะส่งรหัสยืนยันไปให้ผู้ขอ ทาง E-Mail แล้วให้เรานำรหัสยืนยัน ไปกรอกในที่ๆ กำหนดอีกครั้ง จึงจะเริ่มใช้บริการได้ homepage ฟรีได้

แบบฝึกหัด

ให้ลอกตัวอย่าง homepage หน้าที่สองลงไปใน editor ที่ท่านถนัด
ให้นำ homepage ที่พิมพ์ จัดเก็บเป็นชื่อ aa.htm ไว้ใน drive c ของท่าน ในห้อง c:\test\
ใช้ browser ที่ท่านชื่นชอบ เปิดแฟ้ม aa.htm ขึ้นมาดู
ให้กลับไปแก้ไขนิดหน่อย แล้วเปิดดูอีกครั้งว่าเห็นผลการแก้ไขหรือไม่
ไปขอจอง homepage ฟรีสักแห่งหนึ่ง เช่น www.freeservers.com หรือ thai.net เป็นต้น
ส่งแฟ้ม aa.htm เข้าไปใน server ที่ให้บริการ homepage ฟรี แล้วลองเรียกขึ้นมาดู
ถ้าเห็นผลถูกต้อง ตามที่เปลี่ยนแปลง ถือว่าผ่านบทนี้ แล้วจึงเริ่มศึกษาบทใหม่

[ Editor on web for HTML ]