พิชญาภรณ์ แก้วสามสี: ขั้นตอนการสร้างเว็บไซต์

เว็บไซต์ต้องประกอบด้วย 3 ส่วนใหญ่ๆคือ

1. โปรแกรมที่ใช้ในการเขียนเว็บไซต์ เช่น Notepad/Editplus สามารถเขียนเป็นภาษา HTML CSS, PHP, ASP, Perl, C/C++, Java

แนวทางการเขียนเว็บไซต์นั้นสามารถเขียนได้หลายภาษา ใช้ได้หลายโปรแกรมแล้วแต่ความชำนาญและความสะดวก ไม่มีโปรแกรมไหนที่สร้างเว็บไซต์ได้ดีที่สุด สมบูรณ์ที่สุด แต่มันขึ้นอยู่ที่ความเหมาะสมและการใช้งาน กับการทำเว็บมากกว่า

2. ตั้งชื่อเว็บไซต์ หรื่อการจดโดเมนเนม การจดโดเมนเนมทำให้คนรู้จักชื่อเว็บไซต์ของเรา โดเมนเนมส่วนใหญ่สามารถหาซื้อได้หรือจดตามเว็บไซต์ที่รับจดซึ่งมีอยู่ทั่วไป และในปัจจุบันสามารถจดโดเมนเนมเป็นภาษาไทยได้แล้ว ซึ่งเมื่อได้ชื่อแล้วก็ต้องหา “.” ตามหลังโดเมนเนม ดังนี้

.com เป็นนามสกุลที่นิยมมากที่สุด เนื่องจากสั้นและจำได้ง่าย เหมาะสำหรับองค์กรธุรกิจ หรือ เว็บไซต์ทุกประเภท แต่ชื่อที่จะสามารถจดทะเบียนได้นั้นมีน้อยมากแล้ว เพราะชื่อดีๆส่วนใหญ่ถูกจดทะเบียนหมดแล้ว

.net แสดงถึง เว็บไซต์ที่เกี่ยวกับระบบเครือข่าย Internet

.org เป็นนามสกุล ที่เหมาะสำหรับองค์กรทุกประเภทที่ไม่มุ่งหวังผลกำไร เช่น หน่วยงานราชการ มูลนิธิ เป็นต้น

.biz เป็นนามสกุล ที่จะมาแทนที่ .com เหมาะสำหรับองค์กรธุรกิจ หรือ เว็บไซต์ทุกประเภท กำลังได้รับความนิยมเป็นอย่างมากในต่างประเทศ

.info เป็นนามสกุลที่เหมาะสำหรับองค์กร หรือ เว็บไซต์ที่ให้ข้อมูลประชาสัมพันธ์ ข่าวสาร ทุกประเภท

.th จะเป็นการบอกว่า เว็บไซต์ที่จดทะเบียนDomainภายใต้ .th นี้เป็นองค์กรที่อยู่ภายในประเทศไทย ซึ่งประกอบด้วย

.in.th เหมาะสำหรับ บุคคลทั่วไป หรือหน่วยงานในประเทศไทย

.co.th เหมาะสำหรับองค์กรธุรกิจที่ได้จดทะเบียนเป็นนิติบุคคลภายในประเทศไทย

.ac.th เหมาะสำหรับเว็บไซต์ที่เป็นสถาบันการศึกษาของประเทศไทย

.go.th เหมาะสำหรับองค์กร หรือหน่วยงานของรัฐบาลไทย

.or.th นามสกุลนี้จะเหมือนกับ .go.th แต่ต่างกันตรงที่บอกว่าเป็นองค์กร หรือหน่วยงานที่ไม่หวังผลกำไรในประเทศไทย

.mi.th เหมาะสำหรับหน่วยงานทหารในประเทศไทย

3. หาที่อยู่ให้กับเว็บไซต์ คือการหาเช่า Hosting การเช่าHosting จึงถือเป็นส่วนสำคัญที่ทำให้Websiteของเรามีตัวตนอยู่จริงๆ ปกติราคาค่าเช่าHosting มักคิดเป็นรายปีเหมือนกับการต่ออายุชื่อของโดเมน

ขั้นตอนการทำเว็บ

1. เปิดโปรแกรม Notepad

2. พิมพ์ Source code ลงใน Notepad ซึ่ง Source code เป็นภาษาคอมพิวเตอร์ เรียกว่า ภาษา HTML ซึ่งใช้ในการจัดหน้าของเว็บเพจ เมื่อพิมพ์เสร็จแล้วให้ save as ใสชื่อไฟล์เป็น (ชื่อไฟล์).html และเลือก save as type เป็น All flies จากนั้นก็ save ไฟล์

คำสั่งเริ่มต้น

รูปแบบ <HTML>.....</HTML>

คำสั่ง <HTML> เป็นคำสั่งเริ่มต้นในการเขียนโปรแกรม และ </HTML>เป็นคำสั่งจุดสิ้นสุดโปรแกรม

คำสั่งการทำหมายเหตุ

รูปแบบ

ข้อความที่อยู่ในคำสั่งจะปรากฎอยู่ในโปรแกรมแต่ไม่ถูกแสดง บนจอภาพ

ส่วนหัว

รูปแบบ <HEAD>.....</HEAD>

ใช้กำหนดข้อความ ในส่วนที่เป็น ชื่อเรื่อง ภายในคำสั่งนี้ จะมีคำสั่งย่อย อีกหนึ่งคำสั่ง คือ <TITLE>

กำหนดข้อความในไตเติลบาร์

รูปแบบ <TITLE>.....</TITLE>

เป็นส่วนแสดงชื่อของเอกสาร จะปรากฎ ขณะที่ไฟล์ HTML ทำงานอยู่ ข้อความ ที่กำหนด ในส่วนนี้ จะไม่ถูกนำไปแสดง ผลของ เว็บเบราเซอร์แต่จะปรากฎในส่วนของไตเติบาร์ (Title bar) ที่เป็นชื่อของวินโดว์ข้างบนไม่ควรให้ยา เกินไป เพียงให้รู้ว่าเว็บเพจที่กำลัง ใช้งานอยู่เกี่ยวข้องกับอะไร

ส่วนของเนื้อหา

รูปแบบ <BODY>.....</BODY>

ส่วนเนื้อหาของโปรแกรมจะเริ่มต้นด้วย คำสั่ง <BODY> และจบลงด้วย </BODY> ภายในคำสั่งนี้ คือ ส่วนที่จะ แสดงทางจอภาพ

การเติมสีสัน

AQUA
BULE
GRAY
LIME
NAVY
PURPLE
SILVER
WHITE (สีขาว)
BLACK
FUCHSIA
GREEN
MAROON
OLTVE
RED
TEAL
YELLOW

สีของพื้นฉากหลัง

รูปแบบ BGCOLOR=#สีที่ต้องการ

ตัวอย่าง <BODY BGCOLOR="#FF0000">

เราใช้ BGCOLOR=#สีที่ต้องการ ให้เป็นส่วนหนึ่งของ <BODY> ซึ่งจะทำให้เกิดสีตามที่เราเลือก ลักษณะเป็นฉากสีอยู่ข้างหลัง

สีของตัวอักษรบนเว็บ

รูปแบบ Text=#รหัสสี

ตัวอย่าง <BODY TEXT="#00FF00">

เรากำหนดเช่นเดียวกับการทำสีของพื้นฉากหลังโดยให้เป็นส่วน หนึ่งของ <BODY> แต่ในการใส่รหัสสีนั้นเราต้องดู ให้เหมาะสมกับฉากหลังด้วยเช่น <BODY TEXT="#00FF00"> ในการ ทำสีของ ตัวอักษรนี้สีจะปรากฏบนเว็บเบราเซอร์ เป็นสีเดียวตลอด

สีของตัวอักษรเฉพาะที่

รูปแบบ ...

ตัวอย่าง สีแดง

คำสั่งนี้เราใช้ในการเปลี่ยนสีของตัวอักษรในส่วนที่เราต้องการให้เกิดสีสันแตกต่างไปจากสีตัวอักษร อื่น ๆ เช่น สีแดงตัวหนังสือคำว่าสีแดงก็จะเป็นสีแดงตามที่เราต้องการทันที

สีของตัวอักษรที่เป็นจุดคลิกเมาส์

รูปแบบ LINK="#รหัสสี" ALINK="#รหัสสี" VLINK"#รหัสสี"

ตัวอย่าง <BODY BGCOLOR="000000" TEXT="#F0F0F0" LINK="#FFFF00" ALIGN="#0077FF" VLINK="#22AA22">

กำหนดอยู่ในส่วนของ BODY โดยกำหนดให้

LINK = สีของตัวอักษรก่อนมีการคลิก

ALIGN = สีของตัวอักษรขณะถูกคลิก

VLINK = สีของอักษรหลังจากคลิกแล้ว

ตัวอย่างรหัสสี