1. Web технологи Сэдэв: Сургалтын цахим материал ашиглах Багш: Т.Алтантуяа. 2010 оны 09 сарын 03 ,

2. Зорилго: Microsoft Word програмын тусламжтайгаар сургалтын вэб сайт хийх, зохион байгуулах арга зүйтэй танилцах. Эзэмших чадвар: Сургалтын цахим материалыг бие даан сургалтанд ашиглах, дадлагажих, Боловсруулсан материалаа ашиглан хялбар вэб боловсруулах, Хэрэглээний програмын файлуудыг вэбийн төрөлд хөрвүүлэх, Сургалтын хэрэглэгдэхүүн бэлтгэхэд шаардлагатай мэдээллийн санг бүрдүүлж, вэб сайт зохион байгуулж, төлөвлөж сурах, Холбоос үүсгэх, вэб браузертай ажиллах, Вэб сайт зохион байгуулах аргачлал, төлөвлөлтийг сурах. Бид юу хийж сурах вэ? 8/1/2009 2

3. 5.1 Вэб технологи гэж юу вэ? Дасгал 1. Вэб хийхэдшаардлагатай өгөгдөл мэдээллийг бүрдүүлэх, нүүр хуудас үүсгэх. 5.2. Холбоос хийх төрлүүд Дадлага. “Монгол хувцас” сэдэвтэй вэб хийх. 8/1/2009 3 Сэдвийн агуулга

4. Тодорхой сэдвийн дагуу бэлтгэсэн текст, зураг, дуу авиа, хөдөлгөөнт дүрс, холбоостой төрөл бүрийн мэдээлэл бүхий хуудас байдлаар хадгалагдсан цахим баримт бичгийг вэб хуудас (Web Page) гэдэг. Тодорхой нэг сэдвийн дагуух өөр хоорондоо гипертекстээр холбогдсон вэб хуудсуудын цуглуулгыг вэб сайт (Web Site) гэж нэрлэдэг. Вэб сайтыг дуудахад хамгийн түрүүнд нээгдэх хуудсыг вэб сайтын нүүр хуудас (Home Page) гэж нэрлэдэг. Вэб сайт нь http://www........ бүтэц бүхий вэбийн URL (Uniform Resource Locator) хаягтай байдаг. 8/1/2009 4 Вэб технологи гэж юу вэ?

5. Нэг баримтан дотор байгаа онцолсон үг буюу зурган дээр дарахад задраад нэмэлт мэдээлэл гардаг бүтэцтэй баримтыг гипертекcтэн баримт гэж нэрлэдэг. Гипертекстэн баримт нь вэб сервер дээрээ бүтцээсээ хамааран HTML (*.html, *.htm, *.php) форматтай байна. HTML нь Hyper Text Markup Language буюу гипертекст бүрдүүлэх хэл гэсэн үг. Холбоос дээр хулганы заагуурыг байрлуулахад атгасан гарын хэлбэртэй () болж түүнд харгалзах нэмэлт мэдээллийн хаяг нь вэб браузер програмын төлөвийн мөрөнд (Status bar) харагдана. 8/1/2009 5 Гипертекстэн баримт, түүний формат (өргөтгөл)

6. Алхам 1. Вэб хуудас хийх бэлтгэл ажил. Вэб хийхийн тулд эхлээд төлөвлөх хэрэгтэй. Жишээ нь Процент бүлэг сэдвээр вэб хийхээр зорьсон бол түүний ерөнхий бүдүүвч, хар зураг гаргаж, түүнийхээ дагуу материалуудаа цуглуулна. Яг байшин барихтай адил үйл ажиллагаа явагдана. Өөрөөр хэлбэл хэнд зориулж барих, хэдэн давхар барих, яаж барих, юу ашиглах, хаана барих зэрэг нарийн технологийн дагуу хийгддэгтэй яг адил юм. 8/1/2009 6 Дасгал 1. Вэб хийх мэдээллийг бүрдүүлэх, нүүр хуудас үүсгэх

7. Хэнд: Хүүхдэд? Багшид? Хэдэн давхар: Хэр олон хуудастай байх? Яаж: Статик? Динамик? Юу ашиглах: Програм? Агуулга? Дизайн? Хаана: Монголд? Гадны сервер? Ямар:http://www.нэр.mn Арчилгаа: Хэн? Сурталчилгаа: Яаж? 8/1/2009 7 Төлөвлөлт

8. Алхам 2. Багшид зориулсан вэб хийцгээе. moduli5 хавтсанд web math дэд хавтас үүсгэнэ. Уг хавтсанд вэбэд орох бүх файлууд байх тул бүтцээсээ хамааран төлөвлөлтийн дагуу дэд хавтсууд үүсгэх шаардлагатай. Жишээ нь: images: байрлуулах бүх зургууд (*.jpg, *.gif) hutulbur: бүлэг сэдвийн болон ээлжит хичээлийн хөтөлбөрүүд hicheeluud:диаграмм, процент, хольц, масштаб hereglegdehuun: үзүүлэн, ТАРААЖ ӨГӨХ МАТЕРИАЛ unelgee/jishig daalgavar:дүн, тест, шалгалтын материал зэрэг файлуудыг хадгална. 8/1/2009 8 Дасгал 1. Вэб хийх мэдээллийг бүрдүүлэх, нүүр хуудас үүсгэх

9. 8/1/2009 9 Үүсгэх хавтаснууд Moduli5хавтсанд Web math dun Test-shalgalt daalgavar hicheeluud hutulbur hereglegdehuun unelgee images

10. Алхам 2. Хавтас бүрд тохирох файлуудыг хуулна. hutulbur: hutulbur-math.doc, hutulbur-mongol hel.doc hicheeluud: hereglegdehuun: dasgal1.ppt-dasgal4.ppt, moviemaker-ийн файл unelgee: daalgavar.doc, unelgee.doc Алхам 3. Нүүр хуудсыг үүсгэнэ. Нүүр хуудсан дээр мэдээллийг загварын дагуу оруулна. Толгойн хэсэгтвэб хуудасны нэр, лого, үндсэн цэс байрлуулна. Үндсэн цэсийг зураг болон бичвэр хэлбэрээр хуудасны дээд тал болон зүүн талд босоо багана хэлбэрээр байрлуулна. Үндсэн хэсэгтнүүр хуудсанд байрлах мэдээллийг оруулна. Хөл хэсэгт харилцах хаяг, утасны дугаар, факс оруулна. 8/1/2009 10

11. 8/1/2009 11 Нүүр хуудасны загвар Толгойн хэсэг Үндсэн хэсэг(их бие) Хөл хэсэг

12. 8/1/2009 12

13. Алхам 4. Файлыг вэб форматаар хадгална. Эхний файл нүүр хуудас байх бөгөөд түүний нэрийг index.htm нэрээр хадгална. Үүний тулд: Office Button товчийг дарж, нээгдэх жагсаалтаас Save As…командыг сонгоно. Нээгдэх Save as цонхныSave as type:талбараас Web pageтөрлийг сонгоно. Save in: талбарт вэб хадгалах хавтсыг заана. (Манай жишээн дээр moduli5хавтсанд web дэд хавтас үүсгэсэн байна) File name:талбарт файлын нэрийг indexгэж оруулаад Save товчийг дарна. 8/1/2009 13 Файлыг вэб форматаар хадгална.

14. 8/1/2009 14 Бусад файлыг үүсгэе. Алхам 5. Бусад файлыг үүсгэхийн тулд index файлын хөл, толгойн хэсгийн мэдээллийг ашиглаад зөвхөн их биеийн хэсгийг өөрчилнө. Үүний тулд index файлын нэрийг өөрчилж хадгалаад засвараа хийнэ. indexфайлыг нээж Save As…команд сонгоно. hutulburхавтсанд curriculumнэрээрхадгалая. Хавтас файл 2-ыг ялгахын тулд ингэж нэр өгснийг анхаар.  

15. Алхам 5. Файлыг дараах хэлбэртэй болгоод хадгал. Хөтөлбөр цэсийн өмнө |Нүүр|цэс нэмж оруулна. Босоо | зураасыг оруулахын тулд гарыг англи болгоод Back Space-ийн урд/доод талд байрлах босоо зураасыг бичнэ. 8/1/2009 15  

16. 8/1/2009 16 Алхам 6. Бусад файлыг энэ дарааллаар оруулна. hicheeluud хавтсанд hicheel, hereglegdehuun хавтсанд hereglegdehuun, unelgee хавтсанд unelgee файлуудыг тус тус үүсгэ.

17. 8/1/2009 17 Холбоос хийх төрлүүд 1. Нэг файлаас нөгөө файл руу шилжих холбоос. indexфайлыг нээж Хөтөлбөр цэсийг идэвхжүүлнэ.  Insert/Hyperlinkкоманд сонгоно. товчийг дарна.   

18. Insert Hyperlink цонхны Existing File or Web Pageхэсгийн сонгоод Current Folderхэсгийн Look in талбарт холбоос хийх замыг зааж өгнө. hutulbur.htm файлыг заана. ОК дарна. 8/1/2009 18    

19. 8/1/2009 19 Бүх холбоосыг хийсний дараа:

20. Вэб сайт руу шилжих холбоос. Харилцах хаяганд байрлах интернэтийн хаягийг сонгоод Insert Hyperlink цонхны Address талбарт вэб сайтын хаягийг http://www.itc.mn, http://www.msue.edu.mn, http://www.mycomputer.mn гэх зэргээр бүтнээр нь бичиж өгнө. Цахим шуудангийн хаяганд хийх холбоос. Хаягийн идэвхжүүлээд Insert Hyperlink цонхны Address талбарт mailto:info@msue.edu.mn, mailto:info@intec.mn гэх зэргээр хаягийг оруулаад ОК товчийг дарна. 8/1/2009 20

21. Зурганд хийх холбоос. Зургийг идэвхжүүлээд Insert Hyperlink цонхны Look in талбарт images хавтсыг сонгоод холбоос хийгдэх зургийн файлыг сонгоно. Хийсэн вэб хуудсыг браузер програм дээр дуудаж холбоос болон бусад мэдээллийг шалгана. Үүний тулд: Internet Explorer програмыг нээнэ. File/Open командаар Lesson хавтсанд буй index.htm файлыг нээнэ. Бусад хичээлийн хуудсуудыг хийж бэлэн болгоод холбоосыг гүйцэтгэнэ. 8/1/2009 21

22. 8/1/2009 22 Вэбийг ажиллуулах Холбоосуудыг хийж дуусгаад вэб браузер дээр ажиллуулж шалгана. Үүнийг preview хийх гэнэ.    

23. Монгол хувцас сэдвээр вэб хийнэ үү. Үүнд: moduli5-dadlaga хавтсанд байгаа mongolhuvtsas хавтасны файлуудыг ашиглаарай. 8/1/2009 23 Дадлага

24. 8/1/2009 24 Веб сервер суулгах Start/Control Panel/Add or Remove Programs (Windows XP-н CD шаардлагатай)

25. Start/Settings/Control Panel/Administrative Tools 8/1/2009 25 Веб сервер тохируулах

26. Default Web Site/Properties 8/1/2009 26 Веб сервер тохируулах

27. Home Directory-г тохируулж өгнө (fti-surtalt/module5/math web) 8/1/2009 27 Веб сервер тохируулах

28. Internet Explorer нээгээд дараах хаягыг бичнэ. http://localhost 8/1/2009 28 Шалгаж үзэх

29. 8/1/2009 29