Templates by BIGtheme NET
หน้าแรก / การสร้างเว็บไซต์ / 4. ลงมือสร้างและทดสอบ

4. ลงมือสร้างและทดสอบ

การเขียนเว็บเพจด้วย HTML, CSS, XHTML และการทดสอบการใช้งาน

4 ลงมือสร้างเว็บไซต์และทดสอบ

หลังจากที่วางแผนงานว่าจะสร้างเว็บไซต์เกี่ยวกับอะไร มีจุดประสงค์อย่างไรในการจัดทำ จะมีหน้าเนื้อหาอะไรบ้าง และได้ออกแบบหน้าตาเว็บเพจแล้ว ก็มาถึงขั้นตอนลงมือสร้างแล้วนะคะ แต่ก่อนที่จะลงมือสร้างเว็บไซต์ อยากให้รู้จักกับหัวข้อต่างๆ ต่อไปนี้ก่อนค่ะ 4.1 รูปแบบของเว็บไซต์ 4.2 เรียนรู้ภาษาโปรแกรม ที่ใช้ในการสร้างเว็บไซต์ 4.3 โปรแกรมช่วยงาน ที่ใช้ในการสร้างเว็บไซต์ 4.4 ลงมือสร้างเว็บไซต์ (Case Study) คลิกอ่านเรื่องถัดไป ที่ด้านล่างต่อเลยค่ะ

อ่านต่อ »

4.1 รูปแบบของเว็บไซต์

รูปแบบของเว็บไซต์แบ่งได้เป็น 2 รูปแบบหลักๆ คือ 1. Static Website หมายถึง เว็บไซต์ที่สร้างด้วยภาษา HTML ธรรมดา และบันทึกเป็นไฟล์นามสกุล .html    เนื้อหาข้อความ รูปภาพในหน้าเว็บเพจนั้นจะเป็นไปตามที่เราเขียนกำหนดไว้ เมื่อมีผู้เรียกดูหน้าเว็บเพจนั้น  Web Server ก็จะส่งไฟล์นั้นไปให้ยังเครื่องที่ร้องขอ และแสดงผลออกทางโปรแกรมเว็บเบราเซอร์บนเครื่องของผู้ชมนั้น Static Website เหมาะกับเว็บไซต์ที่มีขนาดไม่ใหญ่ จำนวนหน้าเว็บเพจไม่มาก ไม่มีการเปลี่ยนแปลงข้อมูลบ่อยๆ  และไม่มีการติดต่อฐานข้อมูล ถ้าเราจะสร้างเว็บรูปแบบนี้ สามารถทำได้ไม่ยาก โดยต้องศึกษาเรื่องการเขียนเว็บเพจด้วย HTML ก่อน ข้อดีของเว็บรูปแบบนี้ คือ เราสามารถกำหนดรูปแบบการตกแต่ง และเนื้อหา ของแต่ละหน้าได้ตามต้องการ  แต่ก็ควรควบคุมสไตล์ของแต่ละหน้าให้เหมือนกันด้วย อย่าให้หน้าใดโดดจนคิดว่าเป็นคนละเว็บไซต์กัน ส่วนข้อเสีย ก็คือ การแก้ไขเปลี่ยนแปลงยุ่งยาก จะต้องแก้ไขกับไฟล์หน้าเว็บเพจนั้นๆ เมื่อแก้ไขแล้ว ก็ต้อง Upload ไฟล์นั้นขึ้นไป Web Server ใหม่ทุกครั้ง  และเว็บรูปแบบนี้จะไม่สามารถใช้งานฐานข้อมูลได้ ...

อ่านต่อ »

4.2 ภาษาโปรแกรมที่ใช้ในการสร้างเว็บไซต์

เรามาถึงขั้นตอนลงมือสร้างเว็บเพจแต่ละหน้าแล้ว แต่คาดว่าหลายๆ คนอาจจะยังขาดทักษะด้านการเขียนโปรแกรมอยู่  แต่ไม่ต้องตกใจไปค่ะ ค่อยๆ ศึกษากันไป . ภาษาโปรแกรมที่ใช้ในการพัฒนาเว็บไซต์ โดยพื้นฐาน ได้แก่ 1. HTML (ย่อมาจาก Hyper Text Markup Language) เป็นภาษาที่ใช้สำหรับสร้างเว็บเพจ มีโครงสร้างประกอบไปด้วย tag และ attribute ต่างๆ ที่ใช้ในการควบคุมการแสดงผลของข้อความ รูปภาพ หรือวัตถุอื่น ๆ     ภาษา HTML นั้นเป็นภาษาประเภท Markup ไม่จัดเป็นภาษาประเภท Programming  สามารถที่จะเรียนรู้ได้ง่าย 2. CSS (ย่อมาจาก Cascading Style Sheets) เป็นภาษาที่มีรูปแบบการเขียน Syntax ที่เฉพาะ ถูกกำหนดขึ้นเพื่อใช้เสริมภาษา HTML ให้สามารถจัดรูปแบบการแสดงผลให้กับเอกสาร HTML ได้สมบูรณ์แบบมากขึ้น 3. XHTML ...

อ่านต่อ »

4.3 โปรแกรมสำหรับใช้งานในการสร้างเว็บไซต์

โปรแกรมสำหรับใช้งานในการสร้างเว็บไซต์ที่จำเป็น ได้แก่ 1. โปรแกรมสำหรับพัฒนาเขียนเว็บเพจ สำหรับตัวที่แนะนำคือ EditPlus กับ Adobe Dreamweaver กรณีที่เราออกแบบเว็บไซต์และเขียนเว็บเพจแต่ละหน้าเอง แนะนำให้ใช้ Adobe Dreamweaver ค่ะ ก่อนใช้งานโปรแกรม Adobe Dreamweaver เราจะต้องมีความรู้พื้นฐานภาษา HTML ก่อนนะคะ ไม่งั้นงงแย่ เว็บไซต์ที่สอนการใช้งานโปรแกรม Adobe Dreamweaver CS3 (ณ ตอนนี้ โปรแกรม Adobe มาถึงเวอร์ชั่น CS4 แล้วค่ะ) ลองเข้าไปศึกษาได้ค่ะ http://www.bloggang.com/viewdiary.php?id=tutorcat&month=12-2007&date=12&group=1&gblog=1 ส่วนกรณีที่เราใช้โปรแกรมเว็บไซต์สำเร็จรูปอื่นๆ เช่น WordPress, Joomla ที่จะต้องมีการแก้ไขไฟล์บางไฟล์ และเราไม่มีความรู้ทางการเขียนโปรแกรมเลย อาจจะแค่โปรแกรม Text Editor ง่ายๆ อย่าง EditPlus เปิดโปรแกรมเร็วดี ไม่หนักเครื่องด้วยค่ะ download โปรแกรม EditPlus ...

อ่านต่อ »

4.4 ลงมือสร้างเว็บไซต์

สำหรับตัวอย่างการสร้างเว็บไซต์ที่ enjoyday วางแผนไว้ว่าจะนำเสนอนั้น บางส่วนอยู่ระหว่างการจัดทำ แบ่งเป็น 1. การสร้าง Blog โดยใช้โปรแกรมเว็บสำเร็จรูป CMS : WordPress ตัวอย่างเว็บ Blog : enjoyday.net นี่แหละค่ะ « บทความเรื่อง การสร้าง Blog ด้วย WordPress » 2. การสร้างเว็บไซต์ โดยใช้โปรแกรมเว็บสำเร็จรูป CMS : Joomla ตัวอย่างเว็บไซต์ : enjoychinese.net เป็นเว็บสอนภาษาจีน (อีกเว็บไซต์หนึ่งของผู้เขียนเองค่ะ) « บทความเรื่อง การสร้างเว็บไซต์ด้วย Joomla! » 3. การสร้างเว็บไซต์แบบเขียนหน้าเว็บเพจเองโดยใช้ HTML, CSS, XHTML แบบนี้จะเหมาะกับเว็บไซต์ที่มีจำนวนหน้าเว็บเพจไม่มาก ที่ไม่มีการเปลี่ยนแปลงบ่อยๆ ตัวอย่างเว็บไซต์ #1 : ...

อ่านต่อ »

สร้างเว็บไซต์แบบมืออาชีพในพริบตาด้วย Web CMS

ในบทความก่อนๆ มีการกล่าวถึง Web CMS อยู่หลายครั้ง ในบทความนี้เราจะได้ทำความรู้จักกับ Web CMS  แบบจริงๆ จังสักที… ปัจจุบันมีเว็บไซต์เกิดขึ้นใหม่มากมาย เนื่องจากผู้สร้างเว็บสมัยนี้ไม่จำเป็นต้องเรียนรู้การเขียนโปรแกรมภาษา HTML หรือภาษา script ต่างๆ เช่น PHP, ASP, JavaScript เหมือนสมัยก่อน ก็สามารถใช้ Web CMS ในการสร้างเว็บไซต์ขึ้นได้อย่างง่ายดาย โดยใช้เวลาไม่กี่นาที แถมหน้าตาเว็บที่ได้ก็ยังเหมือนมืออาชีพทำอีกด้วย !! Web CMS คืออะไร ? Web CMS (Web Content Management System) คือ software ระบบจัดการเนื้อหาเว็บไซต์ หรือ เว็บไซต์สำเร็จรูป (ซึ่งเป็นคำเรียกให้มือใหม่เข้าใจง่าย) ถูกออกแบบมาให้ใช้งานได้ง่าย ตั้งแต่การติดตั้ง การสร้างและการจัดการดูแลเนื้อหา เหมาะสำหรับผู้ที่ไม่มีพื้นฐานด้านการเขียนโปรแกรม (หรือจะมี ก็ไม่ว่ากันค่ะ) ...

อ่านต่อ »