งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

30 Aug 2011.

งานนำเสนอที่คล้ายกัน


งานนำเสนอเรื่อง: "30 Aug 2011."— ใบสำเนางานนำเสนอ:

1 30 Aug 2011

2 ภาพรวมการทำงานของระบบอินเตอร์เน็ต
การทำงานระหว่าง Web Server และ Web Client

3 การฝึกอบรม แยกเป็น 3 ระดับ คือ Content Editor Webmaster Administration
ผู้นำเข้าข้อมูล , ปรับปรุงข้อมูล Webmaster ดูแลโครงสร้างของ website ดูแล Template จัดการ user จัดการ Component และ Module Administration ดูแลระบบ content management system การ Backup ข้อมูล ดูแล Server

4 สำหรับคนที่มีพื้นฐานคอมพิวเตอร์เบื้องต้น
สนใจการออกแบบเว็บไซต์ มีความพยายามในการใช้งาน CMS ที่มีความสามารถหลากหลาย มีพื้นฐานคอมพิวเตอร์เบื้องต้น สามารถใช้งาน โปรแกรม Browser ทั่วไปได้ มีความสนใจการใช้งาน ซอฟแวร์บนเครือข่ายอินเทอร์เน็ต สนใจในการค้นคว้าหาความรู้เกี่ยวกับ คอมพิวเตอร์และเทคนิคต่าง ๆ ของเทคโนโลยี บนเครือข่ายอินเทอร์เน็ต ซึ่งที่ได้กล่าวมา เราจะเห็นได้ว่าไม่ว่าบุคคลใดก็ตาม ทั้งเคยออกแบบ เว็บไซต์และยังไม่เคยออกแบบเว็บไซต์แต่มีความสนใจในการ ออกแบบเว็บไซต์ และสนใจศึกษาค้นคว้าการทำงาน ของเว็บสำเร็จรูป เพื่อประหยัดเวลา และลดกระบวนการในการเขียนโปรแกรม ย่อม สามารถสร้างเว็บไซต์ตามเนื้อหาที่ตนสนใจได้ และสำเร็จในระยะเวลา อันสั้น

5 สำหรับคนที่มีพื้นฐานด้านการออกแบบเว็บไซต์
พื้นฐานการใช้งานคอมพิวเตอร์เบื้องต้น มีพื้นฐานด้านการออกแบบเว็บไซต์ พื้นฐานด้านการเขียนโปรแกรมแบบการประมวลผลบนเครื่องแม่ข่าย คำสั่งคอมพิวเตอร์ประเภท Unix หรือ ระบบปฏิบัติการ Open Source บุคคลที่มีทักษะข้างต้นจะสามารถเรียนรู้ ได้ค่อนข้างเร็วและสามารถ ปรับแต่งคุณสมบัติของ ในส่วนของโครงสร้างระบบได้ แต่ก็มิได้ หมายถึงว่าบุคคลทั่วไปไม่สามารถใช้งานได้ ซึ่งข้อดีของคือการ ออกแบบให้ง่ายต่อการใช้งาน

6 พัฒนาการของการทำ website
Static Text HTML HTML + JavaScript Flash WEB 2.0 XHTML+CSS FLEX Dynamic Client side JavaScript Flash Applet Server side CGI ASP PHP JAVA API Web service

7 ขั้นตอนการสร้างเว็บไซต์
กำหนดเนื้อหาของเว็บไซต์ ชื่อเว็บไซต์ (Topic) กลุ่มเป้าหมายของเว็บไซต์ (Target Audience) วัตถุประสงค์/เป้าหมายของเว็บไซต์ (Objective/Goal) เขียนผังโครงสร้างของเว็บไซต์ ออกแบบเว็บเพจ สร้างเว็บเพจ นำเว็บไซต์ไปไว้ที่ Web Server

8 ขั้นตอนการพัฒนาเว็บไซต์
Why ?? วัตถุประสงค์ในการจัดทำเว็บไซต์ Domain name ชื่อของเว็บไซต์ Web Content เนื้อหาของเว็บไซต์ Web Design รูปแบบของเว็บไซต์ Web Applications โปรแกรมเสริม Web Hosting พื้นที่จัดเก็บเว็บไซต์ Web Promotion การโปรโมทเว็บไซต์ Web Update การดูแลพัฒนาเว็บไซต์อย่างต่อเนื่อง

9 วัตถุประสงค์ในการจัดทำเว็บไซต์
Promote องค์กร สินค้า สินค้า และ บริการ E-Catalogue , Downloads ,Information E-Service Real-time [ ex. Money Transfer ] Online [ex. Order , Inventory Control] Offline [ex. Form Processing] Web Community Web board / Knowledge Base BLOG /Chat /Diary/ Directory / Search etc..

10 วัตถุประสงค์ของการจัดทำ website
เพื่อพัฒนาและบำรุงรักษาเว็บไซต์ ให้เป็นเว็บไซต์ที่มีระบบ ฐานข้อมูลที่มีคุณภาพ สามารถเรียกใช้และค้นหาข้อมูลสำหรับ งานด้านการบริหาร งานวิชาการและงานเผยแพร่ ประชาสัมพันธ์ ได้อย่างมีประสิทธิภาพ เพื่อส่งเสริม สนับสนุนให้มีการพัฒนาบุคลากรของกองแผนงาน ให้มีความรู้ความสามารถและทักษะในด้านการบริหารจัดการและ การพัฒนาเว็บไซต์ที่เป็นแหล่งรวมรวมงานด้านต่างประเทศของ กระทรวงศึกษาธิการได้อย่างมีประสิทธิภาพ

11 .com .co.th .co.jp .org .or.th .edu .ac.th .gov .go.th .mi .mi.th .net
ชื่อเว็บไซต์ .com .org .edu .gov .mi .net .tv .biz .name .info .euro .co.th co.jp .or.th .ac.th .go.th .mi.th .net.th .in.th

12 Domain .TH แยกตามประเภทขององค์กร
co.th สำหรับการพาณิชย์และธุรกิจ ต้องเป็นองค์กรพาณิชย์ที่จด ทะเบียนในประเทศไทย หรือบริษัทต่างประเทศที่มีตัวแทนอยู่ ในประเทศไทย และตัวแทนนั้น ต้องจดทะเบียนในประเทศไทย และได้รับการโอนสิทธิ ในการลงทะเบียนโดเมนเนมจากบริษัท แม่ในต่างประเทศเป็นที่เรียบร้อย in.th สำหรับหน่วยงานทุกประเภท และบุคคลทั่วไป ac.th สำหรับสถาบันการศึกษา ต้องเป็นสถาบันการศึกษาที่จด ทะเบียนในประเทศไทย

13 Domain .TH แยกตามประเภทขององค์กร (ต่อ)
go.th สำหรับการใช้ของภาครัฐบาล เช่น กระทรวงหรือหน่วยงานรัฐบาล ต้องเป็นหน่วยงานของรัฐบาลไทย net.th สำหรับผู้ให้บริการเครือข่ายอินเทอร์เน็ต (ISP) ซึ่งได้รับอนุญาตให้ เปิดบริการจากการสื่อสารแห่งประเทศไทย (CAT) หรือผู้ได้รับสิทธิ์ ในการให้บริการจาก ISP โดยมีหนังสือยืนยันจาก ISP นั้น ๆ or.th สำหรับองค์กรที่ไม่แสวงผลกำไร mi.th สำหรับหน่วยงานทางทหาร

14 ชื่อเว็บไซต์ www.xxx.nida.ac.th legal.nida.ac.th www.legal.nida.ac.th
finance.nida.ac.th

15 การเขียนผังโครงสร้างของเว็บไซต์
รูปแบบของผังโครงสร้างของเว็บไซต์ (Website Map) แบบเชิงเส้น (Sequences) แบบลำดับชั้น (Hierarchies) แบบใยแมงมุม (Web)

16 การเขียนผังโครงสร้างของเว็บไซต์
แบบเชิงเส้น

17 การเขียนผังโครงสร้างของเว็บไซต์
แบบลำดับชั้น

18 การเขียนผังโครงสร้างของเว็บไซต์
แบบใยแมงมุม

19 โครงสร้างข้อมูล xxxxx.nida.ac.th
เกี่ยวกับกองแผน ประวัติ พันธกิจ วิสัยทัศน์ เจ้าหน้าที่ เอกสารเผยแพร่ กิจกรรม ติดต่อเรา

20 Web Hosting Web hosting
คือพื้นที่บน Computer (Server) ที่จัดเก็บ Website โดย Computer เชื่อมโยงกับระบบ Internet ตลอดเวลา วิธีการเลือก ประเภทและประสิทธิภาพของ Computer [คำนวณจากปริมาณ user ที่ใช้งานพร้อมกัน Concurrent User] ความเร็วของ network ที่เชื่อมกับ Internet ขนาดความจุของพื้นที่ (mailbox size * #user) + Web Content +DataBase + log file ระบบที่รองรับ เช่น Database และ Web Program

21 Server Dell Server CPU 2 x Quad Core 3.2 GHz cache size : 6 MB
Ram 32 GB Hard disk 500 GB

22 รายละเอียดของซอฟท์แวร์ที่ได้ติดตั้งบนเครื่องแม่ข่าย
ประเภทของซอฟท์แวร์ (Software Type) ชื่อทางการค้า (ฺBrand name) รุ่น (Version) ผู้ผลิต ( Manufacturer) ประเภทของลิขสิทธิ์ (License Type) เงื่อนไขลิขสิทธิ์ (License Agreement) ซอฟท์แวร์ระบบ (Operation System) Debian 3.1 Release GNU License Free/Opensource ระบบฐานข้อมูล ( Database ) Mysql 4.0 Mysql AB Mysql License ระบบ Web server (Web server ) Apache 2.0.54 Apache Foundation Apache License ระบบอีเมล์หลัก (Mail Server) Emix4 4.5 University of Cambridge (Mail Anti Virus) ClamAV 0.84 ClamAV.net GPL License Free/Opensourec (Mail Anti Spam) Spamassassin 3.0.3 (Mail Management) Vexim 2.0.1 Virtual Exim Development Team Virtual Exim License ระบบเช็คอีเมล์ผ่าน Web ( Webmail Application ) Horde IMP Turba 3.0.4 4.0.3 2.0.2 Horde Project ระบบจัดการข้อมูล (Content Management System ) Joomla 1.57

23 Web Applications ระบบจัดการเว็บไซต์ ( Content Management System)
ข้อมูลหน่วยงานและผู้บริหาร (Address Book) ข้อมูลเว็บไซต์ที่น่าสนใจ (Add Link) ข้อมูลประชาสัมพันธ์และข่าวสาร (News) ข้อมูลแสดงความคิดเห็น (Web board) ข้อมูลสำหรับการดาวน์โหลด (Download Management)

24 Web Applications ข้อมูลสมุดเยี่ยมชม (Guest book)
ข้อมูลสำรวจความคิดเห็น/สถิติการใช้ (Poll) ข้อมูลรูปภาพ (Image Gallery) จำนวนผู้เยี่ยมชม ( Counter) สถิตการเข้าชม (Web Statistic)

25 Web Promotion Online Banner Search Engine Web Directory Web board
Spam ไม่ควรทำ Off line Medias Books Events

26 การจัดการดูแลเว็บไซต์
ปรับปรุง เนื้อหาและรูปภาพ ตอบ และ คำถามต่างๆ ใน web board นำเข้าเอกสารและข้อมูลต่างๆ หน้าที่ใคร ??? ที่มาของข้อมูล ใครเป็นผู้จัดทำ ?? พนักงานสามารถ แก้ไข ข้อมูล website ได้เอง ?? วิธีการระบบรองรับต่างๆ ?? จ้างบุคคลภายนอกดูแล ??

27 HTML โครงสร้างพื้นฐานของ HTML
<head>…</head> เป็นส่วนกำหนดรายละเอียดหัวเอกสาร HTML กำหนดชื่อเว็บเพจ โดยใช้แท็ก <title>…</title> ความยาวไม่เกิน 64 ตัวอักษร กำหนดรูปแบบของข้อความและเลเอาต์ในหน้าเว็บเพจ เรียกว่า สไตล์ชีต การแทรกหรือใส่สคริปต์โปรแกรม เช่น JavaScript <body>…</body> เป็นส่วนของเนื้อหาเว็บเพจ

28 HTML จุดอ่อนของ HTML รูปแบบของภาษา HTML ไร้มาตรฐานที่แน่นอน ตรวจสอบและหาจุดผิดยาก

29 การสร้างเอกสาร XHTML ข้อดีของ XHTML

30 การสร้างเอกสาร XHTML การกำหนด DOCTYPE (Document Type Definition: DTD) เป็นการกำหนดชนิดของเอกสาร ซึ่งจะมีผลต่อรูปแบบ และ คุณสมบัติการทำงานของแท็กที่จะใช้ในเอกสารหน้านั้น XHTML 1.0 Transitional เป็นการกำหนดรูปแบบให้กับเว็บเพจที่กำลังเริ่มเปลี่ยนมาใช้ XHTML เพื่อให้สามารถใช้แท็กและแอททริบิวท์ที่ยกเลิกไปแล้วได้ รองรับการแสดงผลที่ไม่สนับสนุน Cascading Style Sheet (CSS) XHTML 1.0 Strict จะไม่สนับสนุนการแสดงผลแอททริบิวท์ที่ถูกตัดหรือยกเลิกใช้งาน รองรับการแสดงผลที่สนับสนุน Cascading Style Sheet (CSS) ได้เท่านั้น

31 การสร้างเอกสาร XHTML กฎเกณฑ์พื้นฐานในการเขียนภาษา XHTML
XHTML 1.0 Frameset เป็นการกำหนดรูปแบบให้กับเว็บเพจที่มีการใช้เฟรม กฎเกณฑ์พื้นฐานในการเขียนภาษา XHTML ต้องมีแท็กพื้นฐานครบถ้วน การเรียงลำดับแท็กที่ซ้อนกัน จะต้องมีการเรียงลำดับการเปิดปิดแท็กให้ ถูกต้อง แท็กและแอททริบิวท์ทุกตัวเขียนด้วยตัวพิมพ์เล็กเสมอ ทุกแท็กเปิดต้องมีแท็กปิด ต้องกำหนดค่าแอททริบิวท์ในเครื่องหมาย “…” เสมอ แท็กที่มีแอททริบิวท์ name ให้เปลี่ยนมาใช้แอททริบิวท์ id แทน

32 การสร้างเอกสาร XHTML ใช้สำหรับตรวจสอบความถูกต้องของเอกสาร XHTML ว่าเป็นไปตาม Standard ที่กำหนดไว้ ใช้สำหรับการใส่รายละเอียดของเอกสาร ใช้สำหรับกำหนด Title ของเว็บเพจ ใช้สำหรับการใส่เนื้อหาของเอกสาร

33 การสร้างเอกสาร XHTML <html> …</html> ใช้เพื่อกำหนดว่าเอกสารนี้มีการใช้ภาษา html <head> …</head> ใช้กำหนดส่วนหัวของเอกสาร ให้ รายละเอียดของเอกสาร ข้อความในส่วนนี้จะไม่แสดงบน Web Browser <title>…</title> ใช้กำหนดชื่อของเอกสาร xhtml โดยจะต้อง อยู่ในส่วนของ <head>…</head> ข้อความที่อยู่ในส่วนนี้จะ แสดงใน Title bar ของ Web Browser <body>…</body> ใช้ใส่เนื้อหาของเอกสาร ข้อความในส่วน นี้จะแสดงบน Web browser

34 การสร้างเอกสาร XHTML การใช้ meta tag
meta tag จะใช้สำหรับการใส่รายละเอียดเกี่ยวกับเอกสาร ดังนั้นเราใส่คำสำคัญ (Keyword) และ คำบรรยาย (Description) ของเว็บเพจที่เราสร้างขึ้นได้ <head> <meta name=“keywords” content=“worasit, homepage, dpu, faculty of information technology” <meta name=“description” content=“worasit’s homepage, worasit choochaiwattana personal page ”> </head>

35 การจัดรูปแบบข้อความในเอกสารด้วย Tag ต่าง ๆ
การใช้ Headline ใช้สำหรับการแสดงข้อความที่เป็นหัวข้อหลักของเอกสาร <hx> … </hx> โดยที่ x= 1- 6 <h1> … </h1> จะมีขนาดใหญ่สุด และ <h6> … </h6> การใช้เส้นคั่นหน้า (Horizontal rule) ใช้สำหรับสร้างเส้นคั่นหน้า <hr />

36 การจัดรูปแบบข้อความในเอกสารด้วย Tag ต่าง ๆ
การขึ้นบรรทัดใหม่ โดยปกติแล้วข้อความที่พิมพ์ระหว่าง <body>…</body> จะแสดงผลติดต่อกันไป แม้ว่าเราจะพิมพ์ในบรรทัดใหม่แล้วก็ตาม หากเราต้องการขึ้นบรรทัดใหม่ต้องใช้ <br /> การจัด paragraph ใช้เพื่อให้มีการเว้นช่องว่างระหว่าง paragraph ให้สวยงามมากขึ้น <p> … </p>

37 การจัดรูปแบบตัวอักษร
การจัดรูปแบบตัวอักษรแบบต่าง ๆ <b> … </b> จะแสดงผลลัพธ์เป็นตัวหนา <i> … </i> จะแสดงผลลัพธ์เป็นตัวเอียง <u> … </u> จะแสดงผลลัพธ์เป็นตัวขีดเส้นใต้ <sup> … </sup> จะแสดงผลลัพธ์เป็นตัวยก <sub> … </sub> จะแสดงผลลัพธ์เป็นตัวห้อย

38 การจัดรูปแบบข้อความในเอกสารด้วย Tag ต่าง ๆ
การแบ่งส่วนของข้อความในเอกสารด้วย <div> เป็นการแบ่งส่วนของข้อความเท่านั้น ไม่มีการเว้นระยะระหว่างส่วนของข้อความ เหมือนกับการใช้ <p> … </p> <div> … </div>

39 ทำความรู้จัก CMS CMS ย่อมาจาก Content Management System เป็นโปรแกรม บริหารจัดการเนื้อหาเว็บไซต์แบบสำเร็จรูปที่แจกให้ใช้ฟรีและมี นักพัฒนาเว็บไซต์มากมายทั่วโลกนำไปใช้ในการสร้างเว็บไซต์ โดย CMS จะช่วยให้เจ้าของเว็บไซต์สามารถกำหนดหน้าตา (Template) และ เพิ่มลดเมนู โมดูล คอมโพแนนต่างๆ ตลอดจนสามารถเพิ่มเนื้อหาอย่าง ต่อเนื่องในเว็บไซต์ได้โดยง่าย

40

41 Web Content Management System (CMS)
CMS ถูกนำมาใช้ราวช่วงปี ค.ศ โดย CNET เป็นผู้ริเริ่มใช้ระบบดังกล่าวเป็นรายแรก ในยุคแรก CMS ถูกนำมาจัดการพวกเอกสาร เช่น ข่าวประจำวัน บทความ สารคดีอื่นๆ ที่ใช้เผยแพร่ผ่านทางเว็บไซต์ ต่อมา CMS เป็นที่นิยมใช้ในองค์กรขนาดเล็กและเว็บไซต์ส่วนบุคคล อีกทั้งยังมีทีมพัฒนาเกิดขึ้นอีกเป็นจำนวนมาก ซึ่งมีทั้งแบบเปิดและแบบปิด สำหรับ CMS ที่เป็นแบบเปิดนั้น มีเงื่อนไขว่า ใครก็สามารถดาวน์โหลดและนำไปใช้โดยไม่มีค่าใช้จ่ายใดๆ ขณะเดียวกัน CMS ระบบปิดจะต้องเสียค่าใช้จ่าย ให้กับเจ้าของลิขสิทธิ์เสียก่อนจึงนำไปใช้งานได้ ซึ่ง CMS ระบบปิดจะมีราคาตั้งแต่ไม่กี่พันจนถึงหลักล้าน

42 Web Content Management System (CMS)
CMS เป็นซอฟต์แวร์ที่ใช้จัดการเนี้อหาบนเว็บไซต์ โดยโครงสร้างของ CMS ประกอบด้วย ส่วนควบคุม ส่วนจักการเนื้อหา เช่น รูปภาพ สื่อมัลติมีเดีย เป็นต้น CMS สามารถสร้างเอกสารสำหรับเผยแพร่ต่อสาธารณะในปริมาณมากๆ ได้ และ CMS ยังเหมาะแก่การเก็บข้อมูล การควบคุม การกระจายข้อมูลระดับอุตสาหกรรม เช่น ข่าว บทความ เอกสารคู่มือออนไลน์ เอกสารด้านเทคนิค คำแนะนำการขาย เอกสารด้านการตลาด เช่น โบรชัวร์สินค้า

43 Web Content Management System (CMS)
สามารถนำเอกสารและชิ้นส่วนมัลติมีเดียเข้ามาจัดการ สามารถกำหนดให้ผู้ใช้ทุกคนสามารถแสดงตนหรือทำตามข้อบังคับในการจัดการเนื้อหา สามารถกำหนดกฎระเบียบและความรับผิดชอบในแต่ละหมวด สามารถตรวจสอบเนื้อหาข้อคิดเห็น คำเตือนจากสมาชิกหรือผู้ใช้งาน สามารถกําหนดหนาตา (Template) เพิ่มลดเมนู และโมดูลตางๆ ที่ใชงานในเว็บไซตไดโดยงาย สามารถนำไปประยุกต์ใช้ในองค์กรขนาดใหญ่ และระบบนี้เอื้อต่อการกำหนดรูปแบบการแสดงผล เช่น สีสัน ตัวอักษร หรือ การแสดงผลอื่นๆ ที่เกี่ยวข้องกับเนี้อหา

44 Web Content Management System (CMS)
บล็อก (Blog) คือ ส่วนที่ใช้เชื่อมโยงกับเว็บเพจต่างๆ โดยปกติบล็อกจะอยู่ตำแหน่งด้านซ้ายมือหรือขวามือของหน้าเว็บเพจ โมดูล (Module) คือ ส่วนทีใช้จัดการรูปแบบเนื้อหาบนเว็บไซต์ เช่น โมดูลจัดการบทความ โมดูลจัดการ FAQ โมดูลสมาชิก เป็นต้น ธีม (Theme) คือ กราฟิกของเว็บไซต์ ใช้ควบคุมคุณสมบัติทุกเว็บเพจ เช่น สี หรือแบบตัวอักษรและขนาด เป็นต้น

45 นักพัฒนาเว็บไซต์จะได้อะไรจาก CMS
ในอดีตการสร้างเว็บไซต์เป็นงานที่ค่อนข้างยากพอสมควรผู้ที่จะสร้าง เว็บไซต์ได้ต้องฝึกเขียนภาษา HTML ซึ่งเป็นภาษารากฐานในการ สร้างเว็บไซต์เสียก่อน แต่ในปัจจุบันมีเครื่องมือช่วยสร้างเว็บไซต์ สำเร็จรูปมากมายให้เลือกใช้ ไม่ว่าจะเป็น

46 FrontPage

47 Dreamweaver

48 NetObject Fusion Namo Web Editor

49 ซึ่งซอฟต์แวร์เหล่านี้ช่วยให้สร้างเว็บได้รวดเร็วขึ้น แต่การใช้ทูลเหล่านี้ก็ยังมีปัญหาอยู่หลายเรื่อง ไม่ว่าจะเป็นปัญหาด้านลิขสิทธิ์ ปัญหาการพัฒนาให้เป็นไดนามิกเว็บ (เว็บที่สามารถโต้ตอบการทำงานกับผู้ชมได้) กล่าวคือ ผู้พัฒนาเว็บจำเป็นต้องอาศัยการฝึกฝนนานพอสมควรจึงจะเป็นนักพัฒนาเว็บมืออาชีพได้

50 Web Content Management System (CMS)
ประโยชน์ของ CMS คือ การจัดการเนื้อหาบนเว็บไซต์อย่างง่ายดาย ช่วยให้สามารถจัดการควบคุมเนื้อหาจำนวนมาก โดยแสดงผลในรูปแบบที่ง่ายต่อการเข้าถึง และง่ายต่อการแก้ไขของผู้ดูแลเว็บไซต์ ซึ่งลักษณะสำคัญของ CMS ก็คือ การใช้จัดการเอกสาร การทดสอบ การแก้ไข การกำหนดขอบเขตเวลา ประโยชน์ของการใช้งาน CMS สรุปได้ดังนี้ มีเทมเพลทให้ใช้งาน – CMS จะแสดงแม่แบบของเอกสารหรือเทมเพลทให้โดยอัตโนมัติ นอกจากนั้นยังสามารถทำการเปลี่ยนแปลงเทมเพลทได้ มีความง่ายในการแก้ไขเนื้อหา และสามารถทดลองเผยแพร่เนื้อหาก่อนที่จะเผยแพร่จริงให้ผู้อื่นได้อ่าน เช่น ทดสอบการจัดคอลัมน์ การจัดเรียงรูปภาพ ตารางและตัวอักษร ก่อนเผยแพร่ใช้งานจริง

51 Web Content Management System (CMS)
การอัพเกรด CMS รองรับการเปลี่ยนแปลงทั้งระบบ รูปแบบการจัดการเนี้อหา ด้วยการอัพเกรดเวอร์ชันใหม่ของ CMS นั้น ๆ จัดลำดับการจัดการ สามารถจัดการกับเนื้อหาที่สมาชิกหรือคอลัมนิสต์ส่งเข้ามาได้อย่างกึ่งอัตโนมัติ จัดการเอกสารได้อย่างง่ายดาย CMS ใช้การจัดการเอกสารแบบกำหนดรอบเวลา ทั้งช่วงเวลาเริ่มต้นและช่วงเวลาสิ้นสุดของการเผยแพร่ชิ้นงาน ทำให้สามารถกำหนดรอบเวลาเผยแพร่งานแต่ละชิ้นได้อย่างอิสระ 

52 Web Content Management System (CMS)
ผู้ใช้งานไม่จำเป็นต้องมีความรู้เรื่องการทำเว็บไซต์ เพียงแค่เคยใช้งานอินเทอร์เน็ต ก็สามารถมีเว็บไซต์เป็นของตัวเองได้ ไม่เสียเวลาในการพัฒนาเว็บไซต์ ไม่เสียเงินจำนวนมาก ง่ายต่อการดูแล เพราะมีระบบจัดการทุกอย่างให้เราหมด มีระบบจัดการที่เราสามารถหามาใส่เพิ่มได้มากมาย อย่างเช่น ระบบแกลลอรี่, ฟอรัม, กระดานสนทนา , ระบบจัดการเอกสาร ฯลฯ สามารถเปลี่ยนหน้าตาเว็บไซต์ได้ง่ายๆ เพียงแค่โหลดทีม (Theme) ของ CMS นั้นๆ มีผู้ที่สามารถให้ความรู้ และคำปรึกษาด้านนี้กับเราได้อย่างมากมาย ในอินเตอร์เน็ต และมีชุมชนผู้ใช้ CMS เป็นจำนวนมาก

53 Web Content Management System (CMS)
PostNuke, PHP-Nuke, MyPHPNuke, Mambo, eNvolution, MD-Pro, XOOPs, OpenCMS, Plone, JBoss, Drupal,Joomla,Typo

54 Web Content Management System (CMS)
1. ดาวน์โหลด - ดาวน์โหลด CMS ในที่นี้แนะนำ มองหาลิงก์ download หลังจากดาวน์โหลด Joomla! เสร็จแล้ว ให้ดาวน์โหลดโปรแกรม AppServ จาก เพื่อทำการติดตั้งซอฟต์แวร์ในการจำลองเครื่องคอมพิวเตอร์ของเราให้เป็น Web Server

55 Web Content Management System (CMS)
2. ติดตั้ง - ขั้นแรกให้ติดตั้งโปรแกรม AppServ ลงในเครื่องคอมพิวเตอร์ (ทดสอบให้ Web Server ทำงานให้เรียบร้อยก่อน) จากนั้นให้ติดตั้ง CMS ต่อในภายหลัง 3. ทดสอบการทำงาน - ให้ทดสอบการทำงานของ CMS และ AppServ พร้อมแก้ไขสิ่งที่บกพร่อง 4. ปรับแต่ง - ทดสอบการเพิ่มเนื้อหาตามต้องการ  

56 ทางเลือกของนักพัฒนาเว็บไซต์
Joomla! ทางเลือกของนักพัฒนาเว็บไซต์

57 Joomla vs Wordpress ‘If Joomla! is Linux, then WordPress is Mac OS X. WordPress might offer only 90% of the features of Joomla!, but in most cases WordPress is both easier to use and faster to get up and running.’

58 รู้จักกับ รู้จักกับ Joomla!
Joomla! (อ่านออกเสียงว่า "จูมล่า") เป็นซอฟต์แวร์สร้างเว็บไซต์สำเร็จรูปจัดเป็น CMS โดยมีลิขสิทธิ์เป็นโอเพ่นซอร์ส ทุกคนทั่วโลกสามารถนำไปใช้งานได้โดยไม่เสียค่าใช้จ่าย มีระบบจัดการรูปแบบและเนื้อหาของเว็บไซต์ที่ดี มีเว็บไซต์อย่างเป็นทางการ คือ Joomla! สามารถประยุกต์ใช้ตามรูปแบบที่ต้องการได้ง่าย สามารถนำมาจัดทำเว็บไซด์ได้ในหลายๆ รูป เช่น เว็บท่า เว็บ Blog เว็บ e-Commerce Joomla! ใช้งานง่าย ไม่ซับซ้อน เหมาะสมตั้งแต่ ผู้ที่ยังไม่มีประสบการณ์พัฒนาเว็บไซต์ ไปจนถึงผู้พัฒนาเว็บไซด์มืออาชีพ Joomla! มีรูปแบบในการจัดทำ Package ทำให้สามารถติดตั้งหรือถอดถอนการติดตั้งได้โดยง่าย

59 Joomla! Joomla! ถูกพัฒนาด้วย PHP , MySQL โดยใช้เทคนิคในการเขียนโปรแกรมขั้นสูง ภายใต้มาตรฐาน XHTML สามารถทำงานได้หลายแพลตฟอร์ม ซึ่งรองรับ PHP และ MySQL

60 คุณสมบัติของ Joomla! + Licensed under the GNU/GPL.
+ ใช้ง่ายหลังจากติดตั้งแล้ว เพียงมีเว็บบราวเซอร์ก็สามารถใช้งานได้ + Inline WYSIWYG content editors + มีเทมเพลตพื้นฐานสำหรับการจัดการเว็บ + มีโมดูลและคอมโพแนน บิวต์อินมาให้ + ระบบป้อนข้อมูลข่าวที่ปรับแต่งได้ง่ายมาก + RSS Syndicated News + Banner Management System + News flashes

61 + Mass mailing to registered users
+ Web link Manager + System Statistics + Built in Administrator Help System + Easy administration of site wide images + Content Archiving + Content Versioning + Automatic publishing and expiration support of content + Metadata Support + Integrated search engine + Support for over 20 languages + Template management system + Package management system for modules and components + ยืดหยุ่น ใช้ได้กับเว็บเซิร์ฟเวอร์ทุกระบบที่รองรับ PHP และ MySQL

62 เราสามารถใช้ Joomla! กับเว็บไซต์ได้หลากหลายประเภท เช่น
เว็บท่า (Portals) เว็บไซต์เชิงพาณิชย์ (Commercial Website) เว็บไซต์ที่ใช้ในองค์กร (Intranet Websites) เว็บไซต์ที่ไม่แสวงหากำไร (Non-Profit Websites) เว็บไซต์ส่วนตัว (Personal Websites)

63 ความต้องการระบบสำหรับ Joomla!
1.ระบบปฏิบัติการ Linux Mac OS Windows

64 2.โปรแกรมที่ต้องติดตั้งเพิ่ม
Apache web server PHP Server-side Scripting language MySQL Database Server

65 รู้จักกับ รู้จักกับ Joomla!
Joomla! เป็น CMS ที่มีเครือข่ายของผู้พัฒนามากกว่า 1,000 คนทั่วโลก ทั้งหมด จะพัฒนาแยกอิสระหลายส่วน เช่น คอมโพเนนต์ โมดูล และ แมมบอท ซึ่งในแต่ละแพ็กเกจสามารถนำมาติดตั้งเพื่ออัพเกรดได้ ตามวัตถุประสงค์ของผู้ใช้งาน

66 รู้จักกับ การประยุกต์ใช้ Joomla!
เว็บไดเรกทอรี เช่น รวมรายชื่อเว็บไซต์ รายชื่อ บุคคล หรือ ข้อมูลเฉพาะที่มีรายการมากๆ เว็บจัดการกับเอกสาร เช่น เอกสารออนไลน์ คู่มือทางเทคนิค หรือ FAQ บทความ รีวิวต่างๆ เว็บแกลอรีรูปภาพและมัลติมีเดีย เช่น แสดงรูปภาพเกี่ยวกับสัตว์ คน สิ่งของ เฟอร์นิเจอร์ รถยนต์ ของสะสม เว็บไซต์ด้านอีคอมเมิร์ซ เช่น ขายสินค้า การเก็บเงิน เว็บปฎิทินออนไลน์ เช่น แสดงวันเวลาของแต่ละโซนทั่วโลก เว็บบล็อก เช่น เผยแพร่ประวัติส่วนตัว เรื่องประจำวัน เรื่องที่น่าประทับใจ หรือ ข้อเรียกร้องต่อสาธารณชน

67 Joomla! version 1.0.x

68 Joomla! version 1.5.x

69 Joomla! version 1.6.x ( End of Life August 2011 )
Joomla! version 1.7 ( End of Life Feb 2012 )

70 สำหรับคนที่มีพื้นฐานคอมพิวเตอร์เบื้องต้น
สนใจการออกแบบเว็บไซต์ มีความพยายามในการใช้งาน CMS ที่มีความสามารถหลากหลาย มีพื้นฐานคอมพิวเตอร์เบื้องต้น สามารถใช้งาน โปรแกรม Browser ทั่วไปได้ มีความสนใจการใช้งาน ซอฟแวร์บนเครือข่ายอินเทอร์เน็ต สนใจในการค้นคว้าหาความรู้เกี่ยวกับ คอมพิวเตอร์และเทคนิคต่าง ๆ ของเทคโนโลยี บนเครือข่ายอินเทอร์เน็ต ซึ่งที่ได้กล่าวมา เราจะเห็นได้ว่าไม่ว่าบุคคลใดก็ตาม ทั้งเคยออกแบบ เว็บไซต์และยังไม่เคยออกแบบเว็บไซต์แต่มีความสนใจในการ ออกแบบเว็บไซต์ และสนใจศึกษาค้นคว้าการทำงาน ของเว็บสำเร็จรูป เพื่อประหยัดเวลา และลดกระบวนการในการเขียนโปรแกรม ย่อม สามารถสร้างเว็บไซต์ตามเนื้อหาที่ตนสนใจได้ และสำเร็จในระยะเวลา อันสั้น

71 สำหรับคนที่มีพื้นฐานด้านการออกแบบเว็บไซต์
พื้นฐานการใช้งานคอมพิวเตอร์เบื้องต้น มีพื้นฐานด้านการออกแบบเว็บไซต์ พื้นฐานด้านการเขียนโปรแกรมแบบการประมวลผลบนเครื่องแม่ข่าย คำสั่งคอมพิวเตอร์ประเภท Unix หรือ ระบบปฏิบัติการ Open Source บุคคลที่มีทักษะข้างต้นจะสามารถเรียนรู้ ได้ค่อนข้างเร็วและสามารถ ปรับแต่งคุณสมบัติของ ในส่วนของโครงสร้างระบบได้ แต่ก็มิได้ หมายถึงว่าบุคคลทั่วไปไม่สามารถใช้งานได้ ซึ่งข้อดีของคือการ ออกแบบให้ง่ายต่อการใช้งาน

72 แนวคิดของ Joomla! ตำแหน่ง Super Administrator จะมีอำนาจสูงสุดในเว็บไซต์ของ Joomla! มีหน้าที่หลัก คือ เริ่มจากการสร้างชื่อแอ็คเคาน์ระดับ Admin, Manager โดย Admin จะมีอำนาจในการจัดการข้อมูลเว็บไซต์รองจาก Super Administrator เช่น การกำหนด อนุญาตให้สมาชิกแต่ละคนทำอะไรบนหน้าเว็บเพจได้บ้าง รวมทั้งสร้างแอ็คเคาน์ในผู้ใช้ระดับอื่นๆ ได้อีกด้วย(ผู้ดูแลระบบหรือ Admin กับ Super Administrator อาจเป็นคนเดียวกันหรือคนละคนก็ได้ แต่ในด้านการจัดการเว็บไซต์จะนิยมเรียกกันว่า "เว็บมาสเตอร์" ซึ่งเป็นใครก็ได้ที่ดูและเว็บไซต์ หาข้อมูล อัพเดรดข่าวสาร แก้ไข ข้อผิดพลาดและปัญหาของระบบ) สรุปคือ บนเว็บไซต์ใดๆ Super Administrator สามารถควบคุมเว็บไซต์ได้ทั้งหมด สามารถแก้ไขเทมเพลท คอมโพเนนต์ โมดูลและอื่นๆ ตามที่ต้องการ

73 การจัดการ User ใน Joomla!
เว็บไซต์ที่สร้างด้วย Joomla! จะเกี่ยวข้องกับผู้ใช้หรือ User 2 กลุ่ม คือ Guests คือผู้เข้าเยี่ยมชมเว็บไซต์ที่ไม่ได้สมาชิก ซึ่งผู้ที่เป็น Guests จะใช้งานเว็บไซต์ได้ไม่เต็มที่ ทั้งนี้ Super Admin หรือ เว็บมาสเตอร์ จะเป็นผู้กำหนดสิทธิ์ในการใช้งานส่วนต่างๆ บนเว็บไซต์ เช่นการดูข้อมูลในบางส่วนของเว็บไซต์จะไม่สามรถเข้าถึงได้ Registered คือผู้เข้าเยี่ยมชมที่ลงทะเบียนไว้กับทางเว็บไซต์ ซึ่งมีขอบเขตการใช้งานที่กว้างกว่า guests โดยผู้ใช้จะต้องลงทะเบียนสมัครกับทางเว็บไซต์ จากนั้นเมื่อเข้าชมเว็บไซต์จะต้องทำการป้อนชื่อและรหัสผ่านเพื่อพิสูจน์ตัวตนก่อนเข้าใช้งานเว็บไซต์ แต่ถ้าไม่ได้ทำการล็อกอิน ขอบเขตการทำงานก็จะถือว่าเป็นเพียง Guests เท่านั้น นอกจากนี้ Joomla! ยังแบ่งกลุ่มผู้ใช้ที่เป็น Registered ออก เป็น 2 กลุ่ม คือ Front-end และ Back-end

74 การจัดการ User ใน Joomla!
ผู้ใช้กลุ่ม Front-End ผู้ใช้กลุ่มนี้จะมีสิทธิพิเศษในการเข้าใช้งานสูงกว่ากลุ่ม Guests ซึ่งรวมถึงสามารถสร้างและเผยแพร่ข้อมูลบนเว็บไซต์ได้ โดย Joomla! มีชุดคำสั่งที่เตรียมไว้ให้สมาชิกในการเผยแพร่ข้อมูลของตัวเองได้ และสามารถจัดการคอนเท็นต์ได้ตามขอบเขตที่เว็บมาสเตอร์กำหนด โดยแบ่งเป็น 4 ระดับ คือ Registered, Author, Editor และ, Publisher

75 การจัดการ User ใน Joomla!
ผู้ใช้กลุ่ม Front-End ระดับผู้ใช้ ขอบเขตและหน้าที่ Registered เป็นสมาชิกระดับพี้นฐานไม่สามารถสร้าง หรือแก้ไขเอกสารบนเว็บไซต์ได้ จะทำได้เฉพาะการดูข้อมูลและรับข่าวสารเว็บไซต์เท่านั้น ส่วนเว็บบอร์ดที่ใช้แสดงความคิดเห็นบางแห่งจะทำได้เฉพาะผู้ที่เป็น Registered ทั้งนี้ขึ้นอยู่นโยบายของเว็บไซต์แห่งนั้นด้วย Author เป็นผู้เขียนคอนเท็นต์ สามารถกำหนดการแสดงเนื้อหาและวันเวลาในการเผยแพร่ข้อมูล Editor เป็นผู้ตรวจสอบเนื้อหาของ Author ทั้งนี้ Author และ Editor อาจเป็นคนเดียวกันก็ได้ Publisher เป็นผู้รับผิดชอบการเผยแพร่ะข้อมูลระดับสูงสุด ซึ่ง Publisher จะมีอำนาจระดับสูงกว่า Author และ Editor

76 การจัดการ User ใน Joomla!
ผู้ใช้กลุ่ม Back-End ผู้ใช้กลุ่มนี้เป็นกลุ่มที่เกี่ยวข้องกับระบบต่างๆ บนเว็บไซต์ ซึ่งแบ่งออกเป็น 3ระดับ คือ Manager, Admin, และ Super Admin ซึ่งในการจัดการข้อมูลสำคัญของระบบจะใช้ผู้ใช้ระดับ Admin และ Super Admin เป็นผู้จัดการ ระดับผู้ใช้ ขอบเขตและหน้าที่ Manager     เป็นผู้รับหน้าที่คล้ายกับกับ Publisher สามารถเข้าถึงพาเนล ของ admin และจัดการว่าเป็นผู้ช่วย Admin สามารถลบข้อมูลบางส่วนแก้ไขเทมเพลท แต่ไม่สามารถแก้ไขช้อมูลเฉพาะของกลุ่มผู้ใช้ Administrator เป็นผู้มีหน้าที่หลักในการดูและระบบ สามารถเปลี่ยนแปลงเทมเพลท แก้ไขข้อมูลของผู้ใช้ระดับทั่วไป ยกเว้นระดับ Super Admin Super Administrator          เป็นผู้มีอำนาจสูงสุดในการจัดการเว็บไซต์ การเพิ่มหรือลดจำนวนผู้ใช้ในระดับต่างๆ ทั้ง Back-end, Front-end  รวมถึงข้อมูลภายในเว็บไซต์ Super Admin สามารถเข้าถึงได้ทั้งหมด

77 ขั้นตอนการใช้ joomla Login สร้าง Section สร้าง Category สร้าง Article
ใส่เนื้อหา จัดการเนื้อหา สร้าง menu จัดการ template จัดการ Module จัดการ Component

78 Article สร้าง Article จัดการ Article ใส่เนื้อหา การทำ link
ข้อความ HTML รูปภาพ Multimedia (Flash , Sound , VDO , Applet) File การทำ link จัดการ Article การเรียงลำดับ แสดงในหน้าแรก การตั้งเวลาการแสดง Option ต่างๆ

79 Menu การจัดการ menu สร้างกลุ่ม menu สร้างเมนุแต่ละประเภท เรียงเมนู
เพิ่ม menu ใน module การวางตำแหน่ง module

80 การ Login >>> การล็อกอินทางด้านหลัง (Backend Login)

81 การ Login >>> การล็อกอินทางด้านหน้า (Frontend Login)

82 Control panel

83 โครงสร้างของเนื้อหา Section หมวดหมู่ของบทความ Category ประเภทของบทความ Article บทความ

84 โครงสร้างของเนื้อหา >>> Web ห้องเก็บเอกสาร อาจมีหลาย ๆ ตู้
>Sectionบทความ : ตู้เก็บเอกสารแต่ละตู้ในห้องเอกสาร >Category ประเภทบทความ : ลิ้นชักของตู้เอกสาร >Article บทความ : เอกสารในตู้เอกสาร

85 >>> website สงขลา.คอม
>> บทความ (Section) >> ประวัติ (Category) >> ความเป็นมาของสงขลา (Article) >> สถานที่ท่องเที่ยว (Category) >> แหลมสมิหลา(Article) >> เกาะหนู เกาะแมว (Article) >> บุคคลสำคัญ (Category) >> .....

86 (หมวดหมู่บทความ : Section Manager)
การจัดการข้อมูล (หมวดหมู่บทความ : Section Manager) เป็นการจัดการโครงสร้างเนื้อหาที่อยู่สูงสุดของจูมล่า

87 (ประเภทบทความ : Category Manager)
การจัดการข้อมูล (ประเภทบทความ : Category Manager) เป็นระดับโครงสร้างของเนื้อหาเว็บไซต์ของจูมล่า เช่นเดียวกับหมวดหมู่บทความ โดยมีลำดับรองลงมาจากหมวดหมู่บทความระดับ

88 (บทความ : Article Manager)
การจัดการข้อมูล (บทความ : Article Manager) เป็นการทำงานกับตัวเนื้อหาจริง ๆ ของเว็บไซต์ เนื้อหาสามารถเปิดขึ้นมาอ่านได้จริง ไม่ได้เป็นเพียงแค่โครงสร้างเหมือนกับหมวดหมู่และประเภทของบทความ

89 (บทความ : Article Manager)
การจัดการข้อมูล (บทความ : Article Manager) การเขียนข้อมูลมี 2 แบบ - เขียนโดย WYSIWYG (What you see is What you get Edit) - เขียนโดย HTML

90 (บทความ : Article Manager)
- เขียนโดย WYSIWYG (What you see is What you get Edit)

91 (บทความ : Article Manager)
- เขียนโดย HTML

92 WYSIWYG (What you see is What you get)
RTE (Rich Text Editor)

93 การจัดการเมนู

94 Work Shop Work Shop #1 สร้าง Section และ Category
สร้าง Section = “ Section_username” สร้าง Category = “ Category1_username” >> ภายใต้ Section_username สร้าง Category = “ Category2_username” >> ภายใต้ Section_username

95 Work Shop Work Shop #2 สร้าง Article
สร้าง new Article :ตั้งชื่อตาม username ใน Section > category > News สร้าง content [Text] {P11} ใส่ Text และ Image ใส่ Image จาก Web อื่นๆ ใส่ Link ทั้ง Text และ Image ไปยัง หน้า ใส่ Keyword และ Description ตั้งเวลาการแสดงผล ทั้ง วันเริ่มและวันหมดอายุ {p16} , แสดงไว้ในหน้าแรก

96 Work Shop Work Shop #3 การจัดการ Menu
สร้างกล่อง Menu ชื่อว่า “ เมนู_user ” สร้าง Menu ตั้งชื่อหัวข้อ “submenu_user” ทำการ Link ไปยัง Article ที่ได้สร้างไว้ (แบบไม่ต้องเปิด window ใหม่) สร้าง Menu ตั้งชื่อหัวข้อ “link_user” ทำการ Link ไปยัง web google.com (แบบ new window )

97 Work Shop Work Shop #4 การจัดการ Menu (ต่อ)
ทำการย้ายเมนูที่ได้สร้างมารวมกันไว้ใน กล่องเมนู ”กล่องรวม” เมื่อย้ายมาครบทุกคนแล้วให้…. (ทำที่ละคน) ทำการเรียงเมนู ให้เรียงเมนูตามหมายเลข username

98 Work Shop Work Shop #5 การจัดการ front page
จัดให้แสดง บรรทัดละ 1 เรือง จัดให้แสงง บรรทัดละ 2 เรื่อง

99 Work Shop Work Shop #6 การจัดการ Poll
ทำการสร้าง Poll ขึ้นมา ตั้งให้ vote ได้ วันละครั้งเท่านั้น กำหนด module ให้แสดงเฉพาะหน้าแรก

100 Work Shop Work Shop #4 การจัดการ Banner ทำการสร้าง Banner ขึ้นมา
กำหนด module ในตำแหน่ง Left โดยแสดงทุกหน้า

101 Work Shop Work Shop #7 การจัดการ module
ย้าย Menu จาก Left >> ไป Right สลับตำแหน่ง Menu ภายใน module right สร้าง Menu ตั้งชื่อหัวข้อ “link_user” ทำการ Link ไปยัง web google.com (แบบ new window ) ตั้งเวลาการแสดงผล ทั้ง วันเริ่มและวันหมดอายุ {p16} , แสดงไว้ในหน้าแรก


ดาวน์โหลด ppt 30 Aug 2011.

งานนำเสนอที่คล้ายกัน


Ads by Google