Вебийн тухай 

Веб хэрхэн ажилладаг вэ? 

Мэдээж Интернетед вебийг үздэг ба үзүүлдэг гэсэн 2 тал бий. Үздэг нь гэвэл олон сая интернет хэрэглэгчид. Тэдэнд веб үзэхэд зориулагдсан тусгай прорамм буюу Веб браузер (web browser) хэрэгтэй. Хамгийн алдартай веб браузерууд гэвэл Internet Explorer, Netscape Navigator гэх мэт праграммуд байна. Үзүүлдэг нь гэвэл энэ талаар арай жоохон илүү юм мэддэг нөхөдүүд, тэдэнд Веб Сервер гэдэг программ хэрэг болно. Хамгийн алдартай веб сервер программ гэвэл Apache байна. 
Веб сервереес веб хуудас үзэхийн тулд хэрэглэгч тухайн веб хуудасны хаягийг буюу URL (Uniform Resourse Locator)-ийг браузертаа бичиж оруулж өгч болно, эсвэл өөр хуудсан дээр байгаа тухайн хуудасны холбоос (link) дээр гарах ёстой. URL гэхээр гайхаад байх явдалгүй. Ер нь интернетед байгаа бүх л юмны хаягийг гадаад хэлээр бол URL гэж нэрлэнэ. 
Та дараах зурган дээрээс Веб браузер ба Веб серверийн тухай ойлголтоо бататгаж өгч болно. 


За арай илүү нарийн ширийн зүйл гэвэл, хэрэглэгч ямар нэгэн веб хуудас үзэх хүсэлт тавихад, веб браузер нь тэр хуудас нь байгаа веб сервер лүү request for a page буюу тэр веб хуудасыг өгөөчээ гэсэн дохиог HTTP (Hypertext Transfer Protocol) гэдэг хэлээр явуулна. Тэр дохио нь дараах 3-н хэсгээс бүрдэнэ. 
 Request line. GET гэдэг коммандаар эхэлнэ. Ямар веб хуудас хэрэгтэй байгаагийнхаа хаягийг, мөн хэрэглэгчийн браузер нь HTTP-н ямар хувилбарыг ойлгох чадвартайг заасан хэсэг. 
 Request header. Энэ хэсэг дэхь мэдээлэл нь optional буюу сайн дурын шинж чанартай, жишээ нь ямар веб браузер хэрэглэж байгаа, он сар өдөр, хэрэв уг авахыг хүссэн хуудас нь нууц үг passport-р хамгаалагдсан бол зохих нууц үг нь гэх мэт мэдээллийг энэ хэсэгт явуулна. 
 Request body. Хэрэглэгч ямар нэгэн форм бөглөсөн буюу түүнтэй төстэй үйлдэл хийсэн бол тэр мэдээллүүд нь энэ хэсэгт орж сервер лүү явна, энэ хэсэг нь мөн л optional. 
Дараах зурган дээр HTTP 1.1 хувилбар ашиглан веб хуудас хүсэж байгаа дохиог харуулав. 
Веб сервер энэ хүсэлтийг нь хүлээж аваад, хариултыг нь бас л HTTP гэдэг хэлээр нь явуулна. Тэр хариулт нь дараах 3-н хэсгээс бүтнэ. Сүүлчийнх нь зайлшгүй шаардлагатай, эхний 2 нь optional. 
 Response status. Серверийн хэрэглэсэн HTTP хэлний хувилбарын дугаар, уг хүссэн хуудас нь олдсон эсэх талаарх код ( ж: 200 гэж байвал олдсон, 404 гэж байвал хүссэн хуудас нь явуулсан хаяган дээр байгаагүй г.м ), энэ кодныхоо текст хувилбар гэх мэт мэдээлийг энэ хэсэгт ирүүлнэ. 
 Response header. Энэ хэсэгт бас л сайн дурын шинж чанартай баахан мэдээлэл явуулна. 
 Response body. Хүссэн веб хуудас нь энд ирнэ. 
Дараах зурган дээр өмнөх зурганд үзүүлсэн веб авах хүсэлтэнд ирүүлж байгаа хариултыг үзүүлэв. 
Вебийн үндсэн ойлголт 
Веб хуудас гэж юу болох түүнийг хэрхэн хийх вэ гэдгийг ярихын өмнө бид дараах нэр томъёонуудын учрыг ойлгох хэрэгтэй. 

1. Веб хуудас ( Web Page ) 

Веб хуудсыг HTML (Hyper text markup language) хэлний тусламжтай хийдэг. Энэ нь ердийн текст HTML sourse code гэж нэрлэдэг (цаашид эх файл гэж нэрлэе). Энэхүү эх файл нь .htm болон .html өргөтгөлтэй байдаг. Веб хуудас хийхдээ DOS editor, Norton editor, Notepad, Write, MS word гэх мэт ердийн текст боловсруулах программыг ашиглаж болно. 
Веб хуудас хийхэд зориулагдсан Frontpage, CuteHTML, Flash, Dreamweaver, Adobe Golife, Hotdog, Netscape Composer гэх мэт программууд байдаг. 

2. Веб сайт (Web site) 

Веб сайт гэдэг нь тодорхой сэдвийн дагуу, гол хуудас (Home Page) бүхий .htm (l ) файлуудын цуглуулга юм. Өөрөөр хэлбэл, байгуулага, компани, хувь хүн өөрсдийн талаархи болон тодорхой зорилгоор зохион байгуулсан (хэлний сургалт, хүүхдүүдэд зориулсан, мэдээлэл солилцох гэх мэт). Веб хуудсуудын багц бөгөөд түүнийг URL хаягийн тусламжтайгаар хүлээн авч үзнэ. Энэ нь тухайн сайтын хувьд гол хуудасны хаяг байдаг. Жишээлбэл: Нээлттэй Мэдээлэл Төвийн тухай танилцахын тулд http://www.owc.org.mn/ гэсэн хаягаар хандах бөгөөд гол хуудас нь http://www.owc.org.mn/index.html гэсэн хаягтай байна. 

3. Гол хуудас ( Home Page ) 

Гол хуудас нь Веб сайтыг дуудахад эхэлж нээгддэг Веб хуудас бөгөөд тухайн сайт дахь хуудсуудын гол зангилаа юм. Гол хуудсын файлын нэр нь ихэвчлэн index.html гэсэн нэртэй байх бөгөөд энэ нэрийг стандарт болгон хэрэглэдэг. 
Зураг 1. 
Зураг 1. Гол хуудас 

4. Веб браузер ( Web browser ) 

Веб хуудсыг үзэхэд зориулагдсан программыг Веб браузер хэмээн нэрлэдэг. Жишээлбэл: бидний түгээмэл хэрэглэдэг Netscape Navigator, Internet explorer программууд нь Веб браузер программ юм. 
 Эдгээр веб браузерууд Веб сайтуудыг интернетед веб хуудсуудыг хадгалаж байдаг Web Server-үүдтэй холбогдож, веб хуудсыг авах хүсэлт тавьж, улмаар уг хуудсыг таны компьютерт сүлжээгээр дамжуулан татаж авдаг. 
 Мөн web browser нь татаж авсан веб хуудсан дахь HTML tag буюу HTML sourse кодыг хөрвүүлж, уг хуудсыг зохиогчынх нь гаргахыг хүссэн өнгө, агуулга, загвараар дэлгэцэнд гардаг. 

5. Веб сервер (Web server) 

Веб сервер нь интернетед Веб сайтуудыг хадгалаж байдаг өндөр хүчин чадал бүхий тусгай компьютер юм. Веб серверийг асар олон лангуугаа бусдад түрээслүүлж байдаг үзэсгэлэн худалдааны байшинтай адилтгаж болно. Тэндээс нэг лангуу түрээслэн авч өөрийнхөө Веб сайтыг байрлуулахын тулд hosting charge буюу түрээсийн төлбөрийг төлөх хэрэгтэй болно. Нэгэнт ингэж тавьсан хуудсыг дэлхийн аль ч булангаас Интернетээр дамжуулан үзэх боломжтой. Харин байшингийн эзнийг host гэж нэрлэнэ. Ингээд өдөр бүр сая сая ийм Веб серверүүд хэдэн арван сая хэрэглэгчийн Веб браузерын хүссэн Веб хуудсыг дамжуулж байдаг асар том сүлжээг бид Интернет хэмээн нэрлэдэг. 

Веб хэрхэн дамждаг вэ? 

Веб бол Client/ Server зарчмаар ажилладаг (Зураг 2) хэрэглэгчийн хүсэлт (request), серверийн хариулт (response)-ын үндсэн систем юм. Хэрэглэгч Веб сайтын хаягийг браузер программын хаягийн мөр (Location bar)-д бичиж гарыг Enter товчлуур дээр дарснаар браузер программ нь Веб сервер лүү хүсэлтийг илгээдэг. Харин Веб сервер нь хариу болгож, HTML хуудсыг буцаадаг. 

Зураг 2. Client/Server зарчим 

Энэхүү хуудас нь доорх төрөлтэй байж болно. Үүнд: 
- Static HTML page ( статик хуудас ) 
- Dynamic HTML page ( динамик хуудас ) 
- Directory-listing page 

Статик хуудас ( Static HTML Page) 

Статик хуудас нь хэрэглэгчийн хүсэлтэнд зориулж урьдчилан бэлтгэсэн HTML хуудас 
(Веб хуудас) юм. Веб сервер энэхүү хуудсыг ямар нэгэн тусгай үйлдэл хийлгүйгээр шууд хэрэглэгч рүү явуулдаг. Харин хуудсыг үзэх хэрэглэгчийн хүсэлт нь URL хаяг, эсвэл URL хаяг руу заасан холболт байж болно. Жишээлбэл: http://www.company.com/home.htm хаяг серверрүү илгээгдэж сервер нь хариу (HTML хуудас) буцаана. Зураг 3.

Зураг 3. Хэрэглэгчийн хүсэлт болон серверийн хариу 

Динамик хуудас ( dynamic HTML page ) 

Динамик хуудас нь хэрэглэгчийн хүсэлтийн дагуу үүсгэддэг. Хэрэглэгч Веб браузер дээр text box, menu, check box зэргийг бөглөж, сонголт хийгээд тухайн form дээрх товчлуур дээр дарсанаар мэдээлэл сервер лүү илгээгддэг. Уг мэдээллийг сервер хүлээн авч өгөгдлийн санд хадгалах буюу script, application зэргээр боловсруулат хийгээд үр дүнг нь HTMLхуудсаар хэрэглэгч рүү илгээдэг. 

- HTML- Энэ нь Hyper TextMarkup Language гэсэн үгийн товчлол бөгөөд, ‘’Markup language’’ гэдэг нь уг хуудсыг ямар форматтай байхыг заадаг компьютерийн хэл гэсэн үг юм. ( бусад жишээ нь: XML, SGML ). Хэрэв та ердөө л хар цагаан өнгөтөй нэг л урт мөрөнд хамаг юмаа бичих хэрэгтэй бол танд энэ HTML-г хэрэглэх шаардлагагүй юм. Харин та текстынхээ фонт, өнгө, хэмжээг нь сольж, голлулсан гарчиг тавьж, хуудсандаа зураг багтаахыг хүсьвэл HTML энэ бүхнийг хийдэг компьютерийн хэл юм. 
- Web browser- Энэ нь Netscape Navigator, Internet Explorer гэх мэтийн компьютерийн программ бөгөөд дараах үндсэн зүйлсийг хийнэ. 
- Web server- Энэ нь интернетед веб хуудсуудыг хадгалж байдаг. Web browser-н хүсэлт тавьсаны дагуу хүссэн веб хуудасыг нь интернетеер илгээж байх үүрэгтэй өндөр хүчин чадал бүхий тусгай компьютерүүд юм. Үүнийг та ерөөсөө асар олон лангуутай тэднийгээ бусдад түрээсэлж байдаг үзэсгэлэн худалдааны байшинтай адилтган үзэж болно. Та тэндээс нь нэг лангуу түрээслэн авч өөрийнхөө веб хуудасыг тавихын тулд та түрээсийн төлбөр буюу hosting charge төлөх хэрэгтэй болно. Нэгэнт ингэж тавьсан хуудасыг дэлхийн аль ч булангаас интернетед холбогдсон хүн үзэх боломжтой. Харин энэ байшингийн эзнийг host гэж нэрлэнэ. Ингээд өдөр бүр сая сая ийм Web server-үүд хэдэн арван сая хэрэглэгчийн Web browser-н хүссэн веб хуудасыг нь дамжуулж байдаг асар том сүлжээг бид Интернет гэж нэрлэдэг. 

HTML хэл 

Эх кодыг үзэх нь 
Ихэнх компьютерын программуудын зохиогчынх нь бичсэн эх кодыг харах боломжгүй байдаг билээ. Харин веб хуудасны эх кодыг харах нь туйлын амархан бөгөөд жишээ нь яг одоо миний энэ хуудасны аль ч хэсэгт хулганыхаа баруун талын товчыг дараад гарч ирэх цэснээс View Sourse гэсэн сонголтыг хийвэл шинэ цонх гарч ирж та эх кодыг бүхлээр нь харах болно. Ямар ч гэсэн та тэр хуудаснаасаа энэ веб хуудасыг таны дэлгэцэн дээр гаргахад ямар ямар HTML коммандуудыг хэрэглэсэн байгааг харах бүрэн боломжтой юм. 

HTML хэлний тухай товчхон 

Веб хуудасыг HTML хэлний тусламжтай хийдэг тухай дээр дурьдсан билээ. HTML хэл нь script хэл бөгөөд ямар нэг хөрвүүлэт шаардлагагүй, дурын текст боловсруулах программ дээр бичиж болдог. Харин тухайн файлаа *html юмуу *htm форматтай хадгалах хэрэгтэй. Дараа нь уг файлаа Веб браузер программ дээр нээж ажиллуулах хэрэгтэй. 
HTML хэлний коммандуудыг TAG гэж нэрлэх ба TAG нь эхлэл ба төгсгөлөөс тогтоно. Эхлэл нь <…> хашилтан дотор, төгсгөл нь хашилтан дотор тус тус байрладаг. Гүйцэтгэх үйлдлээ эхлэл ба төгсгөлийн хооронд бичнэ. Жишээлбэл: хуудсанд гарчиг оруулахын тулд TITLE тагийг ашиглах бөгөөд дараах байдлаар бичнэ. 



HTMLтагуудыг хэд хэдэн ангилалд оруулан авч үзэж болно. Үүнд: 
1. html basic- Веб хуудасны үндсэн тагууд 
2. html text- Текстэн мэдээлэлтэй харилцах тагууд 
3. html lists- Жагсаалт үүсгэх тагууд 
4. html images- Зурагтай ажиллах тагууд 
5. html links- Холбоос тагууд 
6. html backgrounds- Веб хуудасны дэвсгэрийг тохируулах тагууд 
7. html tables- Хүснэгттэй ажиллах тагууд 
8. html frames- frame-тэй ажиллах тагууд 
9. html forms- form, анкеттай ажиллах тагууд 
10. html metatags- Хайлтын ситем болон браузертай ажиллах тагууд 
11. html hexcolors- Өнгөтэй холбоотой тагууд 

Үндсэн HTML хэлний бүтэц нь толгойн хэсэг ба их биеийн хэсгээс тогтох ба HTML, HEAD, BODY гэсэн үндсэн 3-н тагийг агуулах бөгөөд дараах хэлбэртэй байна. Үүнд: 



… 

… 
…Их биеийн хэсэг 
… 



Энд: 
- …Таг нь Веб хуудасны эхлэл, төгсгөлийг, 
- …Таг нь толгойн хэсэг буюу Веб хуудасны гарчиг гэх мэтэлементүүдийг, 
- …Таг нь их биеийн хэсэг буюу HTML хэл дээр бичигдэж байгаа ихэнх sourse code агуулна. 
Тухайн тохиолдолд Веб хуудсанд ашиглагдсан Javascript, ActiveX Script гэх мэт бусад Script хэлний код HEAD таг дотор тодорхойлогдож болно. 
HTMLтагууд нь мөн параметр (option)-ууд агуулж болох ба энэ нь хуудсыг нэмэлт боломжуудаар хангаж өгдөг. 

HTML sourse код бичих 

Жишээ болгож нэгэн HTML хуудас үүсгэе. 

1. Start->Programs->Accessories->Notepad команд сонгож Notepad программыг санах ойд ачаална. 
2. Шинэ файл үүсгээд дараах HTML кодыг бичнэ. Зураг 4. 






Тавтай морилно уу? Энэ бол миний анхны веб хуудас?? 



Зураг 4. Notepad програмын цонх 
Энд дурдаж хэлэхэд та HTML коммандуудыг том жижиг үсгээр бичих, мөр мөрөөр бичих, эгнээ үүсгэх- энэ бүхэн бол ерөөсөө хамаагүй. Та яаж ч бичиж болно. Харин ингэж цэгцтэй бичвэл амар байх болно. 
3. File/save команд сонгоно. 
4. Нээгдэх Save харилцах цонхны save in талбарт хадгалагдах замаа зааж өгнө. Жишэлбэл: C:/My Web 
5. File name талбарт файлын нэр, өргөтгөлийг оруулна. Жишээлбэл: index.html 
6. Save товчлуур дээр дарна. 
7. Веб браузер программын цонхыг нээнэ. Жишээлбэл: Internet explorer
8. File/Open page (Open) команд сонгох буюу гарын Ctrl+O товчлуурууд дээр дарна. 
9. Нээгдэх Open харилцах цонхны look in талбарт хадгалсан файлынхаа замыг зааж өгнө. Манай тохиолдолд C:/My Web 
10. Файлынхаа нэрийг сонгон идэвхжүүлнэ. Манай тохиолдолд Index.html болно. 
11. Open товчлуур дээр дарна. Зураг 5. 



Зураг 5. Веб браузер программ дээр хуудсаа нээсэн байдал. 

Эндээс та 3-н зүйлийг харж байна: 

- Хуудасны гарчиг нь “ My home page” гэж байна. 
- Хуудасны “ бие “ буюу гол хэсэгт “Тавтай морилно уу! Энэ бол миний анхны веб хуудас !!” гэсэн текст байна. 
- Web browser-н “Adress” хаягын хэсэгт C:/My web/index.html гэсэн URL ( Uniform Resourse Locator- ихэвчлэн веб хуудасны хаягыг ингэж нэрлэнэ.)-г харж байна. Хэрвээ энэ веб хуудас интернетэд байсан бол URL нь http:/… иймэрхүү маягтай эхэлдэг билээ. 

Веб едитор ( Web editor ) программуудын тухай 

Веб едитор программыг гурван төрөл болгон ангилж болно. Үүнд: 
1. Text Editor- HTML хэлний командуудыг мэддэг тохиолдолд энэ төрлийн едиторыг ашиглаж болно. Өөрөөр хэлбэл Веб хуудасныхаа sourse кодыг текст файлтай ажиллаж байгаа мэтээр нэг бүрчлэн бичдэг. Жишээлбэл: хуудсанд зураг оруулахын тулд зураг оруулах таг болон уг зургынхаа замыг зааж өгдөг. Энэ нь тухайн хуудсыг браузер программ дээр нээхэд зургийг заасан байрлалд дуудан үзүүлдэг. Командаа алдаатай бичсэн тохиолдолд зураг харагдахгүй, хуудсанд дуудагдахгүй байж болно. Текст едитор программууд нь зураг оруулах, хүснэгт зурах гэх мэт зарим нэг командыг хуудсанд хялбархан оруулж болох хэрэгслэлээр хангасан байдаг. 
2. Toolbar editor- Энэ төрлийн едитор ашиглаж байгаа үед Веб хуудасыг Word программаар боловсруулсан зураг болон бусад объект бүхий баримттай ажиллаж байгаа мэтээр зохион байгуулах боломжтой учраас HTML хэлний командуудыг заавал мэддэг байх албагүй. Жишээлбэл: Веб хуудсан дээрээ командын хэрэглүүрийн тусламжтай зургийг оруулсан тохиолдолд едитор дээр тухайн зураг шууд харагдаж, HTML sourse дээр өөрчлөлт нь шууд бичигдсэн байдаг. Ийм төрлийн едиторуудын сул тал гэвэл sourse кодоо засварлах шаардлагатай үед өөр ямар нэгэн текст едитор ашигладаг явдал юм. 
3. Text & toolbar editor- Энэ төрлийн едитор программууд нь Веб хуудсаа командын хэрэглүүрийн тусламжтай зохион байгуулж шаардлагатай үед тухайн едитор программ дээрээ Веб хуудасныхаа sourse кодыг засварлаж болдог. 

Macromedia Dreamweaver MX 

Macromedia Dreamweaver программ нь Веб хуудас зохион байгуулахад зориулагдсан, хамгийн боловсронгуй аргуудыг багтаасан Веб едитор программ юм. Веб хуудас хийх гол үндэс болох HTML хэлийг Dreamweaver программ өөрөө боловсруулдаг онцлоготой. Өөрөөр хэлбэл Dreamweaver программ нь Text & Toolbar Editor программ бөгөөд динамик HTML хуудас зохион байгуулахад программын кодыг бичилгүйгээр бэлэн хэрэгслийг шууд оруулан ашиглах боломжийг олгодог. Түүнчлэн Dreamweaver программын Browser Targeting нь Веб хуудас, үйлдлийн систем болон браузер программ дээр гаргах алдаа болон бусад зүйлсийг хянан шалгах үйлдлийг гүйцэтгэдэг. Дэлхийн мэргэжлийн Веб мастеруудын 70 хувь нь Dreamweaver программыг хэрэглэдэг гэсэн тоо бий. 

Dreamweaver программыг санах ойд ачаалах 

Программыг дараах аргуудаар санах ойд ачаалж болно. Үүнд: 

Нэг: 
1. Start товчлуур дээр дарна. 
2. Нэгдэх Windows жагсаалтаас Programs бүлгийг сонгоно. 
3. Нээгдэх жагсаалтаас Macromedia бүлгийг сонгоно. 
4. Нээгдэх жагсаалтаас Macromedia Dreamweaver MX 2004 программыг сонгоно. 

Хоёр: 
Үндсэн дэлгэц дээрх Macromedia Dreamweaver программын тэмдэг дээр хос даралт хийнэ. 

Гурав: 
C:Program Files/Macromedia/Dreamweaver MX 2004 замаар Dreamweaver.exe файлыг нээнэ. 

Macromedia Dreamweaver програмаас гарах 

Доорх аргуудаар програмаас гарч болно. Үүнд: 
- File/ Exit команд сонгоно. 
- Alt+F4 товчлууруудыг дарна. 
- Цонхны дээд талд байрлах Macromedia Dreamweaver програмын цонхыг удирдах системийн цэсийн Close товчлуур дээр дарна. Зураг 1.
- Цонхны зүүн дээд талд байрлах Macromedia Dreamweaver програмын цонхыг удирдах системийн цэсэн дээр хос даралт хийнэ. 


Зураг 1. Цонхыг удирдах системийн цэс 

Програмын цонхны бүтэц 

Dreaweaver програмын үндсэн цонх нь Document Window цонх юм. Энэхүү цонхонд Веб хуудсыг нээж, засварладаг. Зураг 2. 

Програмын үндсэн хэрэгслэлүүд 
- insert bar 
- Panel group 
- Property inspector бүлгүүдэд агуулагддаг. 

insert bar 
Document Toolbar 
Document window Panel groups 




Tag selector Property inspector 




Зураг 2. Macromedia Dreamweaver програмын Document Window үндсэн цонх. 

2. Insert bar 

Insert bar нь хүснэгт, зураг, давхарга гэх мэт объектуудыг оруулах командуудыг агуулдаг. Зураг 3 
Зураг 3. Insert bar 
Insert bar хэрэглүүрийг Window/Inser ( Ctrl+F2 ) командыг сонгон нээх ба хаана. Insert bar бүлгээс объект оруулахдаа шаардлагатай хэсгүүд рүү орж хэрэглүүр дээрх объектийн дүрс бүхий товчлуур дээр дарах буюу чирэх даралтаар Document window цонхонд шаардлагатай байрлалд оруулна. Зарим объектийг оруулахдаа объектийн тохируулгыг хийх , тухайн объектийг хуудсанд холбох байдлаар оруулах шаардлага гардаг бөгөөд ийм объектуудыг оруулахад object insertion харилцах цонх нээгдэнэ. Уг харилцах цонхонд объеътын тохиргоог хийх замаар оруулна. Жишээлбэл: хуудасны зохих байрлалд зургийн файлын байрлалыг зааж өгөх замаар зургыг оруулдаг. Хуудасны зураг байрлах байрлалд курсорыг байрлуулж Object palette хэрэглүүрийн Insert image товчлуур дээр дарж, нээгдэх Select image sourse харилцах цонхонд зургын файлын замыг зааж өгсөнөөр оруулна. 
Object palette хэрэглүүр нь үндсэн зургаан хэсэг командуудаас тогтоно. Үүнд: 
1. Common 
2. Layout 
3. Forms 
4. Text 
5. HTML Зураг 4. Pop up menu цэс 
6. Application 
7. Flash elements 
8. favorites 
Командуудын хооронд insert bar хэрэглүүрийн дээд хэсэгт орших pop up menu цэсний тусламжтайгаар шилжинэ. Зураг 4. 

Common- зураг, хүснэгт, давхарга гэх мэт түгээмэл хэрэглэгддэг объектуудыг оруулах командуудыг агуулна. 
Characters – copyright symbol, curved quotation marks, trademark symbols зэрэг тусгай тэмдэгтүүдийг оруулах командуудыг агуулна. Эдгээр тэмдэгт нь Netscape navigator 3,4 болон Internet explorer 3,4 хувилбар бүхий браузерт ашиглагдах боломжгүй. 
Forms- form үүсгэх болон түүний элементүүдийг агуулсан командууд. 
Frames- түгээмэл хэрэглэгддэг frameset бүтцийг оруулах командууд. 
Head META, KEYWORDS, BASE таг зэрэг HEAD елементүүдийг нэмэх товчлуурууд, 
Invisibles- хуудсанд харагдахгүй байх anchor гэх мэт объектуудыг үүсгэх, оруулахад зориулагдсан товчлуурууд. Эдгээр объектуудын хуудсан дахь байрлалын харагдах эсэхийг Document window цонхны Choose View/Invisible Elements командаар тохируулна. 

3.Сайттай ажиллах 

Веб сайт нь агуулга, зорилго, загвар бүхий өөр хоорондоо холбоотой хуудсуудаас тогтдог. Ихэнх веб загварууд нь уялдаа холбоо бүхий сайтуудаас бүрдэх бөгөөд ижил төрлийн хуудсуудын нэгдэл биш байдаг. Dreamweaver програм дээр салангид хуудсуудаас гадна сайт үүсгэн зохион байгуулах боломжтой. 
Сайттай ажиллахын тулд Files Panel цонхны Files хэсгээс үүсгэсэн сайтын жагсаалтаас сонголт хийнэ. Энэхүү цонх нь сайт үүсгэх, шинээр хавтас болон .html файл үүсгэх, устгах, нээх, сервертэй холбогдох боломжийг олгоно. 
Зураг 12: 

Зураг 5. Site Window цонх. 

3.1 Сайт үүсгэх 

1. Локаль сайт 

Локаль сайт гэдэг нь зохион байгуулж байгаа веб сайтын дотоод хадгалах төхөөрөмж дээр байрлаж байгаа байрлал юм. Өөрөөр хэлбэл зохион байгуулах Веб сайтаа өөрийн хатуу диск дээр нэр өгч, хавтас болгон хадгалдаг. Энэхүү хавтасаа Local Root Folder хэмээн нэрлэдэг. Local Root Folder нь өөрийн зохион байгуулж буй сайтдаа тусгайлан зааж өгсөн хавтас юм. Иймд Local Root Folder хавтсаар ямар нэгэн диск болон хэрэглээний програмын системийг хавтасыг зааж өгөхөөс зайлсхийх хэрэгтэй. Хамгийн зохимжтой зохион байгуулалтын арга нь хатуу диск дээрээ Веб сайтуудаа байрлуулах дурын хавтас үүсгээд тухайн үүсгэсэн хавтас дотроо Local Root Folder хавтсаа үүсгэх явдал юм. Энэ нь тухайн нэг Local Root Folder бүрт нэг сайт харгалзан ажиллахад хялбар болно. 

Локаль сайт үүсгэх 

1. Files Panel цонхны Files хэсгээс Manage sites… (edit sites…) командыг сонгоно. 
2. Нээгдэх Manage sites… (edit sites…) харилцах цонхноос New…командын товчлуурыг дарна. Зураг 6. 
3. Нээгдэх Site definition цонхны Local info хэсгийг сонгоод дараах үйлдлийг гүйцэтгэнэ. Зураг 7. 


Зураг 7. Site Definition цонхны Local Info хэсэг 

Зураг 6. Шинэ сайт үүсэх, хуучин сайтад засвар хийх 

 Site name талбарт сайтынхаа нэрийг оруулна. Энэхүү нэр нь Site цэсийн Open site гэсэн дэд цэсэнд харагдана. Сайтын нэрийг дурын байдлаар сонгож болно. 
 Local Root Folder талбарт локаль диск дээрх сайтынхаа файл, директоруудыг хадгалах хавтсаа зааж өгөх ба түүний ард орших хавтасны дүрс бүхий товчлуур дээр дарж, нээгдэх choose local folder харилцах цонхонд сонгох хавтсаа нээгээд select товчлуур дээр дарна. 
 Local Root Folder хавтаст файл шинээр оруулах тохиолдолд файлын жагсаалтыг автоматаар сэргээж дуудахдаа Refresh Local File List Automatically товчлуурыг идэвхжүүлнэ. Уг товчлуурыг идэвхгүй болговол Dreamweaver програмын файлтай ажиллах хурд нэмэгдэх бөгөөд харин Site цонх дахь локаль хэсгийн файлын жагсаалт автоматаар сэргээгдэхгүй. Site цонх дахь файлын жагсаалтыг сэргээх тохиолдолд Site цонхны Refresh товчлуур дээр дарна. Харин View/Refresh Local командыг сонговол зөвхөн Site цонх дахь локаль хэсгийн файлын жагсаалтыг сэргээж дуудна. 
 HTTP Adress талбарт бэлэн болгосон байгаа upload хийх URL хаягийг бичвэл Dreamweaver програм бодит хаягтай харьцуулж холбоосуудыг шалгана. Жишээлбэл: Интернет ба Мэдээлэл төвийн Веб сайтын хувьд http://www.intermedee.org.mn болно. 
 Cache товчлуур нь сайт удирдах ажил болон холбоосын хурдыг нэмэгдүүлэх зорилготой локаль кэшийг үүсгэх эсэхийг тодорхойлно. Уг товчлуурыг соноогүй тохиолдолд Dreamweaver програмаас энэхүү нөхцөлийг заах үгүйг лавлана. 
4. OK товчлуур дарна. 

2. Remote site 

Remote сайтыг локаль сүлжээний компьютер болон FTP сервертэй холбогдож ажиллах тохиолдолд ашигладаг. Remote сайт дээрх холбогдох хавтасаа Remote Root Folder хавтаст зааж өгдөг. Харин Remote host-той холбогдон ажиллахын тулд Интернетийн үйлчилгээ үзүүлэгч байгууллагаас хэрэглэгчийн хандах эрхийг авсан байх шаардлагатай. 

Remote сайт үүсгэх 

1. files panel цонхны files хэсгээс manage site… (edit sites…) командыг сонгоно. 
2. Нээгдэх manage sites… (edit sites…) харилцах цонхноос new… командын товчлуурыг дарна. Зураг 6. 
3. Нээгдэх site definition цонхны remote info хэсгийг сонгоод дараах үйлдлийг гүйцэтгэнэ. Зураг 7. 

1. Нээгдэх Site definition цонхны Remote info хэсгийг сонгоно. 
2. Server Access цэсэнд дараах утгуудыг зааж өгнө. Үүнд: 
 None- сервер компьютерт сайтаа upload хийх боломжгүй буюу Remote сайт үүсгэхгүй тохиолдолд, 
 Local/ Network-Веб сервер нь сүлжээгээр холбогдон ажиллах боломжтой, эсвэл өөрийн локаль компьютерийг Веб сервер болгон ажиллах тохиолдолд. local/Network командыг сонгож, нээгдэх Remote folder талбарын ард орших хавтасны дүрс бүхий товчлуур дээр дарна. Нээгдэх Choose Remote Folder харилцах цонхонд сайтынхаа сервер дээр хадгалах хавтсаа сонгоод, Select товчлуур дээр дарна. Refresh Remote File List Automatically товчлуурыг идэвхжүүлснээр Remote Root Folder хавтаст файл нэмэх, устгах тохиолдолд Site цонх дахь Remote хэсэг дэхь файлын жагсаалтыг автоматаар сэргээж дууддаг. Энэ товчлуурыг идэвхгүй болговол Remote сайт дээр файл нэмсний дараа компьютерийн ажиллах хурд нэмэгдэх бөгөөд харин Site цонх дахь Remote хэсгийн файлын жагсаалт автоматаар сэргээгдэхгүй. (Site цонх дахь файлын жагсаалтыг сэргээх тохиолдолд Site цонхныхоо Refresh товчлуур дээр дардаг.) View/Refresh Remote командыг сонговол зөвхөн Site цонх дахь Remote хэсгийн файлын жагсаалтыг сэргээж дуудна. Зураг 8. 

Зураг 8. Server Access цэсний FTP утга 

 FTP- Веб сервер нь FTP ашиглан холбогдох тохиолдолд, FTP Host талбарт Веб сайтаа байрлуулах FTP серверийн нэрийг оруулна. Серверийн нэрийг оруулахдаа компьютерийн системийн Интернетийн бүтэн нэрийг бичих буюу протоколын нэр болон бүтэн нэрээс бусад нэмэлт текстийг орхино. Жишээлбэл: www.msue.edu.mn,msue.edu.mn гэж бичвэл буруу. Host Directory талбарт сервер дээрх сайт байрлуулах хавтсаа зааж өгнө. Login, Passport FTP серверт холбогдох хэрэглэгчийн нэр, нууц үгийг оруулаад Save товчлуурыг идэвхжүүлнэ. Зураг 9. 

3. OK товчлуур дээр дарна. 

ураг 9. Server Access цэсний FTP утга 

Веб сайтын бүтцийг харах 

Энэ нь тухайн Веб сайтын хувьд хуудсанд холбоос хийгдсэн үед холбогдсон html хуудсууд болон бусад холбоосуудыг харах боломжийг олгож холбоост засвар хийх, сайтыг ерөнхий зохион байгуулалтыг удирдахад дөхөм болдог. Сайтын бүтцийг харахын тулд: 

1. files panel цонхны files хэсгийн ард байрлах dropdown box-ыг нээнэ. 
2. map view командыг сонгож 
Remote сайтаас локаль сайтад файл/хавтас хуулах 
1. site цонхыг нээнэ. 
2. Remote сайт хэсгээс локаль сайтад хуулах файл болон хавтсаа сонгон идэвхжүүлнэ. 
3. Site/Get команд сонгох буюу командын хэрэгслээс Get товчлуур дээр дарна. 

Локаль сайтаас Remote сайтад файл/хавтас хуулах 
1. site цонхыг нээнэ. 
2. Хуулах файл болон хавтсаа сонгон идэвхжүүлнэ. 
3. Site/Put команд сонгох буюу командын хэрэгслээс Put товчлуур дээр дарна. 

Тайлбар: html төрлийн файлыг хуулах тохиолдолд тухайн файлтай холбогдсон бусад төрлийн (.gif,.swf гэх мэт) файлуудыг хамт хуулах эсэхийг лавласан Dependent Files цонх нээгдэх бөгөөд Yes товчлуурыг дарж, холбогдсон файлуудыг хамт хуулна. Зөвхөн .html файлыг хуулах тохиолдолд No товчлуурыг дарна. Зураг 12 
Зураг 12. Dependent Files харилцах цонх 

Файл/хавтас үүсгэх 

1. Site цонхыг нээнэ. 
2. Remote RootFolder хавтаст файл/хавтас үүсгэх тохиолдолд remote, local root folder хавтаст файл/хавтас үүсгэх шаардлагатай тохиолдолд local хэсгийг тус тус идэвхжүүлнэ. 
3. File/ New file (File/ New Folder) команд сонгоно. 
4. Файлынхаа (хавтасныхаа) нэрийг бичээд Enter товчлуур дээр дарна.


Файл нээх 

Файлыг доорх аргуудаар нээдэг. Үүнд: 
1-р арга: file/open команд сонгож, нээгдэх харилцах цонхонд шаардлагатай файлынхаа замыг заагаад Open товчлуур дээр дарна. Уг командаар Local Root Folder хавтасны гадна орших файлыг нээх боломжтой. 
2-р арга: Локаль сайт хэсгийн файлын жагсаалтаас нээх файлын нэр дээр хос даралт хийх буюу File/Open Selection команд сонгоно.