ดาวน์โหลดงานนำเสนอ
งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ
1
การพัฒนาเว็บไซต์ ในงานธุรกิจ
2
หัวข้อการบรรยาย พื้นฐานการทำงานของเว็บไซต์
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต การพัฒนาเว็บไซต์
3
1. พื้นฐาน การทำงานของเว็บไซต์
4
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
เว็บเทคโนโลยี (Web Technology) คือ บริการหนึ่งในรูปแบบต่างๆของการให้บริการของอินเตอร์เน็ต สำหรับผู้พัฒนาเว็บ หรือผู้ที่ต้องการเขียนโปรแกรมเพื่อติดต่อสื่อสารผ่านเว็บ หรือ อินเตอร์เน็ต แล้วจะต้องรู้และเข้าใจเรื่องเกี่ยวกับโปรโตคอล (Protocal)
7
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
โปรโตคอล เป็นเพียงข้อตกลงกันระหว่าง 2 ฝ่ายที่ให้เครื่องคอมพิวเตอร์ สามารถสื่อสารกันได้อย่างถูกต้อง และราบรื่นมากที่สุด การใช้บริการเว็บจะทำงานภายใต้ โปรโตคอล HTTP โดยโปรโตคอลจะเป็นตัวกำหนดวิธีการส่งข้อมูลหรือไฟล์ ระหว่างเครื่องคอมพิวเตอร์ที่เป็น Client และ Server รวมถึงการกำหนด กฏระเบียบในการติดต่อด้วย เราจะใช้โปรแกรมประเภท Browser เป็นตัวช่วยในการติดต่อสื่อสารได้ง่ายขึ้น
8
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
อินเทอร์เน็ต หมายถึง ลักษณะของการเชื่อมต่อของเครือข่ายคอมพิวเตอร์ทั้งเล็กและใหญ่จำนวนมากเข้าด้วยกัน โดยมีข้อกำหนดว่าทุกเครือข่ายที่เชื่อมต่อถึงกัน จะต้องอยู่ภายใต้มาตรฐานของการเชื่อมต่อ(โปรโตคอล) ที่ถูกสร้างขึ้นมาเพื่อใช้งานบนเครือข่ายแบบนี้โดยเฉพาะ ซึ่งเรียกว่า TCP/IP
9
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
10
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
จากมาตรฐานการเชื่อมต่อกันนี้เอง จึงมีผลทำให้เครือข่ายคอมพิวเตอร์สามารถติดต่อสื่อสารแลกเปลี่ยนข้อมูลระหว่างกันได้อย่างรวดเร็วมีประสิทธิภาพ และไม่มีขีดจำกัดทางด้านเวลาและสถานที่
11
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
โปรโตคอล HTTP (Hypertext Transfer Protocol) เป็นโปรโตคอลที่ใช้ในการกระจายและทำงานร่วมกันของข้อมูลที่ในอยู่ในรูปสื่อที่สามารถเชื่อมโยงถึงกันได้ เนื่องจากโปรโตคอล HTTP สามารที่จะใช้ในการรับส่งข้อมูลที่เป็นข้อความ รูป ภาพ หรือภาพเคลื่อนไหวได้ จึงทำให้แหล่งข้อมูลส่วนใหญ่ใน WWW อนุญาตให้เข้าถึงได้โดยผ่านโปรโตคอล HTTP
12
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
WWW (World Wide Web) อาจเรียกสั้นๆ ว่า เว็บ เปรียบเสมือนเป็นห้องสมุดขนาดใหญ่ที่รวบรวมข้อมูลที่มากที่สุดในโลกก็ว่าได้ สามารถค้นหาข้อมูลที่ต้องการได้เกือบทุกอย่างจากบริการเว็บ
13
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
ข้อมูลในเว็บจะอยู่ในรูปแบบที่เรียกว่า Hypertext และทำการเชื่อมโยง (Links) ข้อความหรือ รูปภาพ เข้ากับเอกสารอื่นๆ อย่างเป็นอิสระต่อกัน
14
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
ภาพหรือข้อความที่แสดงบนหน้าจอจะแสดงได้ทีละหน้า ซึ่งเรียกว่า เพจ (Page) หรืออาจมีการเชื่อมโยงด้วยการลิงค์ (Links) เพื่อค้นหาข้อมูลจากอีกเพจหนึ่งที่อยู่ห่างออกไปไกลๆได้
15
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
เว็บไซต์ เปรียบเหมือนเว็บเป็นห้องสมุดขนาดใหญ่ เว็บไซต์จะเปรียบเสมือนหนังสือหนึ่งเล่มในห้องสมุดนั้น สามารถเลือกหยิบหนังสือเล่มใดก็ได้ในห้องสมุดเว็บขึ้นมาอ่าน โดยระบุชื่อหนังสือในลักษณะที่เรียกว่า URL(อ่านว่า ยู อาร์ แอล) เช่น เว็บไซต์ของมหาวิทยาลัยราชภัฏลำปางมี URL หรือมีชื่อเป็น หรือเว็บไซต์ของสาขาเทคโนโลยีคอมพิวเตอร์อุตสาหกรรมมีชื่อว่า เป็นต้น
16
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
เว็บเพจ (Web Page) และโฮมเพจ (Home Page) ถ้าเว็บไซต์ คือ หนังสือหนึ่งเล่ม เว็บเพจก็คือ หน้ากระดาษต่างๆ ที่บรรจุเนื้อหาในหนังสือเล่มนั้นส่วน โฮมเพจ คือ ปกหน้าของหนังสือ ปกติแล้วเมื่อเริ่มเปิดโปรแกรม Web Browser โปรแกรมจะนำเข้าสู่หน้าแรกของเว็บใดเว็บหนึ่งให้โดยอัตโนมัติ หน้าแรกนั้นจะถือว่าเป็นโฮมเพจด้วยเช่นเดียวกัน สามารถเปลี่ยนโฮมเพจของโปรแกรม Web Browser ที่ใช้อยู่นี้ให้ไปยังเว็บไซต์ใดก่อนก็ได้
17
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
เว็บเพจ (Web Page) และโฮมเพจ (Home Page)
18
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
โปรแกรมเว็บบราวเซอร์ (Web Browser) การแสดงผลข้อมูลต่างๆ บนอินเทอร์เน็ตในรูปของ HTML ไม่สามารถที่จะแสดงผลข้อมูลออกมาโดยตรงได้ จะต้องใช้โปรแกรมเว็บบราวเซอร์เป็นตัวกลางที่จะทำหน้าที่แปลงคำสั่งก่อนแล้วแสดงผลคำสั่งให้ออกมาเป็นรูปภาพ เสียง และข้อมูลต่างๆ บราวเซอร์ที่ผู้ใช้นิยมใช้กันก็จะมีโปรแกรม Internet Explorer และ Netscape Navigator
19
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
โปรแกรมเว็บบราวเซอร์ (Web Browser)
20
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
DNS-Domain Name System คือ ระบบการตั้งชื่อบนอินเทอร์เน็ต ทรัพยากรบนอินเทอร์เน็ต โดยเฉพาะเครื่องคอมพิวเตอร์ที่ต่ออยู่นั้นต้องมีหมายเลขประจำเครื่อง ซึ่งหมายเลขนี้เรียกว่า IP โดยการที่จะจดจำหมายเลขประจำเครื่องนั้นทำได้ยาก จึงมีวิธีการตั้งชื่อให้จดจำและใช้งานง่าย ระบบชื่อจึงถูกกำหนดให้เป็นมาตรฐาน โดยแบ่งตามลำดับขั้นตามสภาพภูมิศาสตร์ เป็นประเทศ ประเภทขององค์กร และชื่อองค์กร เช่น th คือ ชื่อประเทศไทย ac คือ ประเภทองค์กร bu คือ ชื่อองค์กร
21
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
Domain ที่นิยมใช้กันอยู่ในปัจจุบัน เช่น .com = กลุ่มธุรกิจการค้า (Commercial) .edu = กลุ่มการศึกษา (Education) .gov = กลุ่มองค์กรรัฐบาล (Government)
22
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
ความหมายของ Sub Domain เช่น .co = องค์การธุรกิจ (Commercial) .ac = สถาบันการศึกษา (Academic) .go = หน่วยงานรัฐบาล (Government) .or = องค์กรอื่น ๆ (Organizations)
23
ความรู้เบื้องต้นการใช้งานอินเทอร์เน็ต
Domain Name ชื่อย่อของประเทศ เช่น .th = Thailand .hk = Hong Kong .jp = Japan .sg = Singapore
24
2. การพัฒนาเว็บไซต์
25
วิธีสร้างเว็บไซต์ สร้างเว็บไซด์ด้วย Web Hosting
สร้างเว็บไซด์ด้วยโปรแกรมกราฟิก สร้างเว็บไซด์ด้วยภาษา HTML และ JavaScript
26
ขนาดหน้าของเว็บเพจ ขนาดหน้าของเว็บเพจที่นิยมใช้ในปัจจุบันมี 2 ขนาด คือ
ขนาด 800X600 pixels จะสามารถแสดงหน้าเว็บได้ครบถ้วนกับหน้าจอที่มีขนาด 15 นิ้วขึ้นไป ขนาด 800X600 pixels เป็นขนาดของหน้าเว็บเพจที่นิยมมากที่สุดในปัจจุบัน เพราะสามารถแสดงข้อมูลของเว็บได้มากขึ้นและง่ายต่อการออกแบบด้วย
27
พื้นที่ของเว็บเพจ การจัดสรรพื้นที่ของเว็บเพจสามารถทำได้หลายรูปแบบ แต่ที่นิยมใช้กันจริงๆจะมีอยู่ 3 แบบ คือ การแบ่งแบบอิสระ การแบ่ง 2 ส่วน การแบ่ง 3 ส่วน
28
ส่วนประกอบของเว็บ
29
ส่วนประกอบของเว็บ โลโก้ (Logo)
30
ส่วนประกอบของเว็บ ส่วนหัวของเว็บเพจ (Page Header)
31
ส่วนประกอบของเว็บ เมนูหลัก (Link Menu)
32
ส่วนประกอบของเว็บ ส่วนที่ใช้แสดงเนื้อหาของเว็บ (Page Body)
33
ส่วนประกอบของเว็บ ส่วนล่างสุดของเล็บไซด์ (Page Footer)
34
ส่วนประกอบของเว็บ ช่องทางการโฆษณาของเว็บไซด์ (Banner)
35
2. ขั้นตอน ในการพัฒนาเว็บไซต์
36
เทคโนโลยีเว็บ เมื่อโลกของเราเข้าสู่ยุคเทคโนโลยีจึงมีการเปลี่ยนแปลง การพัฒนาก็ย่อมเกิดขึ้น " Internet " ก็เช่นกันที่พัฒนาจาก Web 1.0 เป็น Web เราจะเห็นว่าโลกของ " Internet " มีความก้าวหน้าและพัฒนาไปอย่างรวดเร็วมากๆ ซึ่งเราจะมาดูกันว่าการวิวัฒนาการของ Web เป็นยังไง
37
เทคโนโลยีเว็บ Web 1.0 การสื่อสารแบบทางเดียว ของ เจ้าของเว็บไซต์นั้นๆ เป็นผู้ดูแลค่อยๆนำข้อมูลใหม่ๆ ไปนำเสนอนั้นเอง หรือ การสื่อสารแบบทางเดียว ที่เราเรียกกันว่า One Way Communication ก็ได้
38
เทคโนโลยีเว็บ Web 2.0 เป็นT wo Way Communication เป็นเรื่องของการแบ่งปันความรู้ซึ่งกันและกันอย่างแท้จริง
39
เทคโนโลยีเว็บ Web 3.0 ได้โดยการเอาข้อมูลต่างๆ ที่มีอยู่มาจัดให้อยู่ในรูปแบบ Metadata
40
เทคโนโลยีเว็บ Web 4.0 "A Symbiotic web" คือเว็บไซต์ที่ทำงานแบบ Artificial Intelligence (AI) ที่ฉลาดมากยิ่งขึ้น
41
ขั้นตอนในการพัฒนาเว็บไซต์
เตรียมเนื้อหาที่จะนำเสนอ ก่อนอื่นต้องมีเป้าหมายก่อนว่าจะทำเว็บไซต์เกี่ยวกับเรื่องอะไรและเนื้อหาต่างๆ มีอะไรบ้าง แล้วจัดเตรียมสิ่งต่างๆ ซึ่งหมายถึง ข้อความ, ภาพประกอบ, เสียง และอื่น ๆ
42
ขั้นตอนในการพัฒนาเว็บไซต์
ออกแบบหน้าตาของเว็บไซต์ ว่าต้องการให้มีลักษณะเป็นอย่างไร เช่น จะมีการแบ่งเฟรมหรือไม่ สี ของ Background และตัวอักษรเป็นสีอะไร จะจัดวางอะไรไว้ตรงส่วนไหน จะมี Link ที่ใดบ้างและแต่ละ Link เชื่อมโยงไปหาส่วนใด เป็นต้น
43
ขั้นตอนในการพัฒนาเว็บไซต์
ออกแบบหน้าตาของเว็บไซต์
44
ขั้นตอนในการพัฒนาเว็บไซต์
ออกแบบหน้าตาของเว็บไซต์
45
ขั้นตอนในการพัฒนาเว็บไซต์
ออกแบบหน้าตาของเว็บไซต์
46
ขั้นตอนในการพัฒนาเว็บไซต์
เขียนและทดสอบ ลงมือเขียนโดยใช้โปรแกรมสำหรับเขียนเว็บไซต์ แล้วทำการทดสอบการแสดงผลและ Link ต่างๆ ว่าเชื่อมโยงได้ถูกต้องหรือไม่ ในขั้นตอนนี้ถ้ามีปริมาณข้อมูลมากและมีการเชื่อมโยงที่ซับซ้อนก็จะใช้เวลาค่อนข้างมากเพราะต้องคอยปรับแก้อยู่เรื่อย ๆ
47
ขั้นตอนในการพัฒนาเว็บไซต์
ลงทะเบียนชื่อเว็บไซต์และจัดหาพื้นที่เก็บข้อมูล สำหรับการสร้างเว็บไซต์ของอาจารย์จะมีชื่อเว็บไซต์ตามตัวอย่างดังนี้ Login: suchada จะมีชื่อเว็บไซต์ว่า เนื้อที่ในการจัดทำเว็บไซต์จะมีพื้นที่ 10 MB
48
ขั้นตอนในการพัฒนาเว็บไซต์
นำเว็บไซต์ที่สร้างขึ้น Upload ขึ้น Server และตรวจสอบความเรียบร้อย คือ การคัดลอกข้อมูล จากเครื่องของเราไปเก็บไว้ในเครื่อง Server ซึ่งการคัดลอกนี้เรียกว่า Upload โดยใช้โปรแกรมสำหรับการUpload เช่น โปรแกรม WinSCP, CuteFtp, WS_FTP (โปรแกรม Dreamweaver มีความสามารถนี้อยู่แล้ว)
49
ขั้นตอนในการพัฒนาเว็บไซต์
ประกาศให้โลกรับรู้ เมื่อตรวจสอบความเรียบร้อยแล้ว ก็ถึงคราวที่จะชักชวนให้ผู้คนมาชมเว็บไซต์ โดยประชาสัมพันธ์ผ่านทางสื่อต่างๆ เช่น แลก Link กับเว็บไซต์อื่นๆ ฝากข้อความชักชวนไว้ตามกระดานข่าวต่างๆ หรือจะเพิ่มชื่อเว็บไซต์ให้กับแหล่งรวมข้อมูลบนอินเทอร์เน็ตอย่าง yahoo หรือ google
50
ข้อแนะนำในการทำเว็บไซต์
สามารถดูเว็บไซต์ได้ในหลายบราวเซอร์ การทำเว็บไซต์ควรจะทำเพื่อให้สามารถดูได้จากทุกๆ Version ของ Software ต่างๆ ไม่ว่าจะเป็น Netscape, Communicator, Internet Explorer หรือ อื่นๆ การทำให้ทุกคนดูได้นี้ ถือว่าเป็นการขยายฐานของผู้เข้าเยี่ยมชม
51
ข้อแนะนำในการทำเว็บไซต์
ตัวอักษร, ฉากหลัง และ สี สำหรับรูปแบบที่นิยมใช้คือ ตัวอักษรสีดำ บนฉากหลังขาว ถ้าต้องการกำหนดประเภทของตัวอักษรควรใช้ที่เป็นสากลนิยม เช่น ในกรณีภาษาอังกฤษ อาจใช้ Arial หรือTimes News Roman เป็นต้น ส่วนภาษาไทย อาจใช้ MS Sans Serif การเลือกใช้ตัวอักษรภาษาไทยนั้นต้องระวังเป็นพิเศษเพราะในกรณีที่เครื่องผู้เยี่ยมชมไม่มีตัวอักษรนั้นๆ อาจทำให้ผู้เข้าเยี่ยมชมไม่สามารถอ่านตัวอักษรได้เลย
52
ข้อแนะนำในการทำเว็บไซต์
ส่วนประกอบที่ขาดไม่ได้ของเว็บไซต์ เช่น หัวข้อที่เกี่ยวกับผู้จัดทำ อาจเป็นประวัติความเป็นมา และ/หรือ ข้อมูลปัจจุบัน (About us) เหล่านี้ช่วยเพิ่มความน่าเชื่อถือให้กับผู้เข้าเยี่ยมชม และเพิ่มเติมเกี่ยวกับแถบนำทาง Search Sitemap และยังมีหัวข้ออื่นๆ อีก เช่น ข้อเสนอแนะ (Feedback) คำถามที่ถูกถามบ่อย (FAQ - Frequently Asked Questions)
งานนำเสนอที่คล้ายกัน
© 2024 SlidePlayer.in.th Inc.
All rights reserved.