Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Website

2,266 views

Published on

คำศัพท์พื้นฐานเกี่ยวกับการสร้างเว็บไซต์

Published in: Education
  • Be the first to comment

Website

  1. 1. ความรู้พื้นฐานเกี่ยวกับการสร้างเว็บไซต์ รวบรวมโดย ครูลัดดา เพ็ชสังฆาต โรงเรียนพระบางวิทยา
  2. 2. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ Internet คือ ระบบเครือข่ายคอมพิวเตอร์ที่ใหญ่ที่สุดในโลกเกิดจากการเชื่อมโยง ของคอมพิวเตอร์หลายล้านเครื่องที่กระจายอยู่ตามที่ต่างๆ ในโลก อินเตอร์เน็ตเป็นแหล่งที่รวมของข้อมูลมหาศาลและเป็นช่องทางติดต่อสื่อสาร เพื่อแลกเปลี่ยนข้อมูลที่สะดวกและรวดเร็วบริการยอดนิยมบนอินเตอร์เน็ต ได้แก่ เว็บเพจ (www) อีเมล์ และ Instant Messageing เช่น MSN Messenger, Yahoo Messenger, ICQ เป็นต้น www (World Wide Web) เป็นบริการข้อมูล โดยข้อมูลของ www จะอยู่ในรูปเอกสารแบบ Hypertext ซึ่งภายในเอกสารจะมีจุดเชื่อมโยง (link) ไปยังเอกสารอื่นๆ ที่เกี่ยวข้อง เอกสารต่างๆ ที่เชื่อมโยงกันเหมือนใยแมงมุม เป็นที่มาของคาว่า Web. HTTP เป็นโปรโตคอลสาหรับเปิดดูข้อมูลจาก www เรียกใช้งานได้โดยระบุ http:// และตามด้วย URL ในช่องกรอก Address ด้านบนของโปรแกรมเว็บบราวเซอร์
  3. 3. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) URL (Uniform Resource Locator) คือ ข้อความที่บอกตาแหน่งของข้อมูล ใน Internet ไม่ว่าจะเป็น Web page, File ประเภทต่างๆ เช่น รูปภาพ เสียง URL ประกอบด้วย โปรโตคอล + domain name + (directory ที่เก็บไฟล์) ชื่อไฟล์ เช่น http://www.phrabang.ac.th/index.php http://www.phrabang.ac.th/images/law.pdf
  4. 4. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Domain Name ชื่อที่ถูกตั้งขึ้นเพื่อใช้ในการระบุถึงเว็บไซต์ใดๆ เช่น เว็บไซต์ของโรงเรียนพระบางวิทยา มีชื่อโดเมนเนม ว่า phrabang.ac.th ชื่อโดเมนจะแบ่งออกเป็นระดับชั้น โดยอาจจะเป็น 2 ระดับ หรือ 3ระดับ ก็ได้ โดยแต่ละระดับจะถูกคั่นด้วยเครื่องหมายจุด เช่น kapook.com = ชื่อโดเมนแบบ 2 ระดับ phrabang.ac.th = ชื่อโดเมนแบบ 3 ระดับ
  5. 5. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Domain Name ส่วนแรก จะหมายถึงชื่อองค์กร ส่วนที่สอง จะเป็นส่วนขยายบอกประเภทของ องค์กร เช่น เป็นองค์กรของเอกชน หรือองค์กรของรัฐบาล ส่วนที่สาม จะเป็นส่วนขยายบอก ประเทศที่เครื่องคอมพิวเตอร์นั้นตังอยู่ ้เช่น google co th | | | ชื่อองค์กร ส่วนขยายบอกประเภทขององค์กร ส่วนขยายบอกประเทศตัวอย่างส่วนขยายประเภทขององค์กร com หรือ co หมายถึง องค์กรของเอกชน (Commercial organization) edu หรือ ac หมายถึง สถาบันการศึกษา (Education organization) gov หรือ go หมายถึง องค์กรของรัฐ (Government organization) org หรือ or หมายถึง องค์กรที่ไม่แสวงผลกาไร (Non-commercial organization) mil หรือ mi หมายถึง องค์กรทางทหาร (Military organization) net หมายถึง องค์กรให้บริการเครือข่าย (Network organization)
  6. 6. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Domain Name ตัวอย่างส่วนขยายบอกประเทศ at หมายถึง ออสเตรเลีย ca หมายถึง แคนาดา de หมายถึง เยอรมนี es หมายถึง สเปน fr หมายถึง ฝรั่งเศส it หมายถึง อิตาลี jp หมายถึง ญี่ปุ่น th หมายถึง ไทย uk หมายถึง อังกฤษ us หมายถึง สหรัฐอเมริกา
  7. 7. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Webpage คือ หน้าเอกสารของบริการ www ที่อยู่ในรูปแบบ HTML ภายใน ประกอบด้วยข้อความ ภาพ ลิงค์ Web page แต่ละหน้าจะเชื่อมโยงกัน เพื่อให้เรา เรียกดูเอกสารหน้าอื่นๆ ที่เกี่ยวข้องได้อย่างสะดวก ไม่ต้องระบุ URL เองทุกครั้ง Homepage คือ Web page หน้าแรกที่ผู้ใช้เห็นเมื่อเข้ามายัง Web site มักถูก ออกแบบให้โดดเด่น น่าสนใจ และมีลิงค์เชื่อมโยงไปเว็บเพจหน้าอื่นๆ Website คือ Web page หลายๆ หน้าที่มีเนื้อหาเกี่ยวข้องกัน ประกอบเข้าด้วยกัน
  8. 8. โครงสร้างเว็บไซต์ เว็บไซต์ (Web site) โฮมเพจ (Home page) เว็บเพจ(Web page)
  9. 9. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Web browser คือ โปรแกรมสาหรับเรียกดูเว็บเพจ โดยจะแปลคาสั่ง HTML แล้วประมวลผลเพื่อแสดงผลออกมาเป็น Web page เช่น Internet Explorer (IE), Mozilla Firefox, Safari, Opera, และ Netscape Navigator เป็นต้น Web server คือ เครื่องคอมพิวเตอร์ที่ทาหน้าที่ให้บริการข้อมูลใน www ซึ่งเก็บ Web page และโปรแกรมจัดการบริการ เมื่อผู้ใช้ต้องการดู Web page ที่อยู่ใน เครื่อง Server ก็จะใช้ Web browser เรียกขอข้อมูลโดยระบุที่อยู่ของข้อมูลใน ลักษณะที่เรียกว่า URL
  10. 10. ศัพท์เบื้องต้นเกี่ยวกับเว็บไซต์ (ต่อ) Upload คือ การส่งข้อมูลจากเครื่องของเราไปยัง Web Server เมื่อเราสร้าง Web page แต่ละหน้าแล้ว ต้องส่งข้อมูลไปเก็บไว้ที่ Web Server ที่เป็นเครื่องคอมพิวเตอร์ที่ให้บริการข้อมูล www โดยอาศัยโปรแกรม FTP Download หมายถึง การดึงข้อมูลจากคอมพิวเตอร์อีกเครื่องหนึ่งซึ่งเป็นต้นทาง มาเก็บไว้ยังเครื่องของเรา โดยผ่านเครือข่ายคอมพิวเตอร์ Search engine เป็นเครื่องมือหรือโปรแกรมในการค้นหาเว็บต่างๆ โดยมีการ เก็บ รายชื่อเว็บไซต์ และข้อมูลที่เกี่ยวข้องต่างๆ ของเว็บไซต์ และนามาจัดเก็บ ไว้ใน server เพื่อให้สามารถค้นหาและแสดงผลได้สะดวกรวดเร็ว เช่น google.com, yahoo.com, bing.com, altavista.com, sanook.com เป็นต้น
  11. 11. ภาษามาตรฐานที่ใช้ในการสร้างเว็บเพจ HTML (Hypertext Markup Language) คือ ภาษามาตรฐานที่ใช้ในการสร้าง เว็บเพจ เพื่อนาไปแสดงผลในโปรแกรม Web browser เอกสารเว็บเพจจะมี นามสกุลเป็น .htm หรือ .html ตัวอย่าง code ภาษา HTML เพื่อสร้างหน้าเว็บเพจ <html> <head> <title>หัวเว็บเพจ</title> </head> <body> พื้นที่การสร้างเว็บเพจด้วย HTML </body> </html>
  12. 12. รูปแบบของเว็บไซต์1. Static Website หมายถึง เว็บไซต์ที่สร้างด้วยภาษา HTML ธรรมดา และบันทึกเป็นไฟล์นามสกุล .htmlเนื้อหาข้อความ รูปภาพในหน้าเว็บเพจนั้นจะเป็นไปตามที่เราเขียนกาหนดไว้ Static Website เหมาะกับเว็บไซต์ที่มีขนาดไม่ใหญ่ จานวนหน้าเว็บเพจไม่มากไม่มีการเปลี่ยนแปลงข้อมูลบ่อยๆ และไม่มีการติดต่อฐานข้อมูล2. Dynamic Website หมายถึง เว็บไซต์ที่หน้าเว็บเพจสามารถเปลี่ยนแปลงข้อมูลเองได้ โดยไม่ต้องเขียนแต่ละหน้าเว็บเพจเอง เช่น กระดานข่าว (Webboard), ระบบสืบค้นข้อมูล เว็บไซต์รูปแบบนี้จะถูกสร้างด้วยภาษา Script แบบ Server Side Scriptเช่น PHP, ASP, ASP.Net, JSP และอื่นๆ ไฟล์เอกสารที่ได้จะมีนามสกุล .php,.asp เป็นต้น และมักจะมีการติดต่อกับฐานข้อมูลเพื่อบันทึกข้อมูลลงในฐานข้อมูลหรือนาข้อมูลจากฐานข้อมูลขึ้นมาแสดงผลเป็นหน้าเว็บเพจ
  13. 13. ส่วนประกอบของหน้าเว็บเพจแบ่งเป็น 3 ส่วน ส่วนหัวของหน้า (Page Header) ส่วนของเนื้อหา (Page Body) ส่วนท้ายกระดาษ (Page Footer)
  14. 14. ส่วนประกอบของหน้าเว็บเพจ1. ส่วนหัว (Page Header) จะอยู่บริเวณบนสุดของหน้าเว็บเพจ เป็นส่วนที่แสดงชื่อ เว็บไซต์ โลโก้ แบนเนอร์โฆษณาลิงก์สาหรับข้ามไปยังหน้าเว็บอื่น
  15. 15. ส่วนประกอบของหน้าเว็บเพจ2. ส่วนเนื้อหา (Page Body) จะอยู่บริเวณตอนกลางของหน้าเว็บเพจ ซึ่งเป็นส่วน ที่แสดงเนื้อหาภายในหน้าเว็บเพจนั้น โดยประกอบด้วยข้อความ ข้อมูล ภาพเคลื่อนไหว เป็นต้น
  16. 16. ส่วนประกอบของหน้าเว็บเพจ3. ส่วนท้าย (Page Footer) จะอยู่บริเวณด้านล่างสุดของหน้าเว็บเพจ ส่วนมากใช้สาหรับลิงก์ข้อความสั้น ๆ เข้าใจง่าย หรือจะมีชื่อเจ้าของเว็บไซต์ อีเมลแอดเดรสของผู้ดูแลเว็บไซต์สาหรับติดต่อกับทางเว็บไซต์
  17. 17. ขั้นตอนการพัฒนาเว็บไซต์1. กาหนดเป้าหมายและวางแผนงาน 1.1 กาหนดเป้าหมายของเว็บไซต์ 1.2 กาหนดกลุ่มผู้ชมเป้าหมาย 1.3 กาหนดขอบเขตเนื้อหา และรวบรวมข้อมูลเนื้อหา 1.4 เตรียมเครื่องมืออุปกรณ์ที่จาเป็น 1.5 เตรียมทักษะและบุคลากร 1.6 ประมาณการค่าใช้จ่าย2. เลือก Web hosting และจด Domain name 2.1 Web hosting คืออะไร 2.2 หลักการเลือก Web hosing 2.3 การจด Domain name 2.4 การตั้งชื่อ Domain name ที่ดี
  18. 18. ขั้นตอนการพัฒนาเว็บไซต์3 ออกแบบเว็บไซต์ 3.1 การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design) 3.2 การออกแบบระบบเนวิเกชั่น (Site Navigation Design) 3.3 การออกแบบเว็บเพจ (Page Design)4 ลงมือสร้างและทดสอบ 4.1 รูปแบบของเว็บไซต์ 4.2 ภาษาโปรแกรมที่ใช้ในการสร้างเว็บไซต์ 4.3 โปรแกรมที่ใช้ในการสร้างเว็บไซต์ 4.4 ลงมือสร้างเว็บไซต์5. ประชาสัมพันธ์ให้เว็บไซต์เป็นที่รู้จัก6. ดูแล และพัฒนาอย่างต่อเนื่อง ที่มา : http://www.enjoyday.net/build-website-step.html
  19. 19. แหล่งอ้างอิงhttp://www.art2bdesign.comhttp://courseware.bodin.ac.th/http://www.krirk.ac.th/ ขอบพระคุณอย่างสูง Daowruang Srihathai [ Benchamaratrangsarit School ]

×