Local Info
a.
Site name: Sayt nomi: café Townsend bo‟lsin.
b.
Local root folder: café_townsend papkangiz joylashgan joyni
ko‟rsating.
c.
Default images folder: rasmlar joylashgan papka manzili.
d.
Links relative to: Dosument da tursin.
e.
HTTP address: Hozirsha bo‟sh tura tursin, qandoq bo‟lsa shundoq
turadi.
f.
Cache: Enable cache.
g.
Ohirida OK ni bosing.
Remote Info, Testing Server, va hokazolarga hozirsha tegmay turamiz.
3.
OK bosganingizda ushbu oynacha chiqadi va keyin Done ni bosing.
4.
Files
paneli
Dreamweaver
Dokumentingizning o‟ng
tarafida
quyidagicha ko‟rinishda ochiladi.
Endi qilishimiz kerak bo‟lgan narsa bu vebsayt yaratishni boshlashdir. Yodingizda
bo‟lsin vebsaytlar asosan jadvallar ichiga yasaladi (HTML darslarida o‟tganmiz).
Demak vebsayt yaratishdan oldin vebsaytimiz qanday strukturada joylashishini biror
qog‟ozga chizib chiqishimiz kerak. Keyin unga qarab jadval tuzamiz. Darhol
Dreamweaver ni ochib vebsayt tuzib ketilavermaydi. Keyin tayyor bo‟lgan
jadvalimizning har hil qismlariga har hil ma‟lumotlarni o‟rnatishimiz kerak bo‟ladi. Biz
quyida ko‟rsatilingan vebsaytni yaratishni boshlaymiz.
1→ Buning uchun birinshi navbatda yangi HTML dokument ochamiz va uni index
deb saqlab qo‟yamiz.
a.
File > New → Basis page > HTML
b.
File > Save As
c.
File name: index deb yozsangiz bo‟lgani (index.html) kerak emas.
d.
Ohirida Save.
2→ Keyin Title: bo‟limiga Café Townsend deb yozing. Vaqti vaqti bilin o‟zingizni
bilib klaviatura yordamida (Ctrl+s) dokumentingizni saqlab boring.
bu
rasmdagi ushbu yulduzcha dokumentga so‟nggi o‟zgartirish kiritilgandan buyon
saqlanmadi, degan ma‟noni beradi.
3→ Yuqorida takidlaganimdek endi navbat Jadval tuzishga. Jadvalni 2 hil yo‟l
bilan tuzishimiz mumkindir.
Birinshisi:
dagi birinchi rasmga bosish
orqali. Ikkishisi: Menyu qatoridan Insert > Table orqali.
Jadvalni 3 ta qatorga 1 ta ustun qilib quyidagicha belgilab olamiz. Umumiy
kengligini esa 700 piksel qilib olamiz
a.
Rows: jadval qatorlari soni 3 ta
b.
Columns: jadval ustunlari soni 1 ta
c.
Table width: Umumiy kengligini esa 700 piksel.
d.
Qolganlarini o‟zgartirmaymiz.
e.
Header: None da tursin
f.
OK
4→ Sizda ushbu ko‟rinishdagi jadval tuziladi. O‟zingizni vebsaytingizni
yaratayotganingizda biron qator yoki ustun ortiqcha yoki kam bo‟lib qolsa, o‟chirib
yoki qo‟shishingiz mumkindir.
Agar kursoringiz jadval ishida tursa yashil shiziqlar bilan, har bir ustunlar kengligi
va jadvalning umumiy kengligi ko‟rinib turadi. Quyidagi misolda (tuzishingiz shart
emas) 700 umumiy jadvalning kengligi, 140, 230, 330 lar esa ustunlar kengligidir.
O‟lchamlar piksel yoki foiz da bo‟lishi mumkin. Kursorni jadvaldan tashqariga
chiqarsingiz sichqonchani jadvalning o‟ng tamoniga tashqariga bosish orqali, bu
o‟lcham ko‟rsatkichlari yo‟qoladi. Bu ko‟rsatkichlar shunchaki sizga eslatma sifatidadir.
Agar hohlasangiz bunday eslatmani o‟chirib qo‟yishingiz mumkindir. Uning uchun siz
Menyudan View > Visual Aids > Table Widths ga bosishingiz kerak bo‟ladi.
5→ Kursorni jadvaldan tashqariga sichqonchani jadvalning o‟ng tamoniga bosish
orqali chiqaring, klaviaturadan hech qanday tugmani bosmagan holda. Yana bitta
ikkinchi jadvalni tuzamiz. Bu gal 1 ta qator, 3 ta ustun qilib belgilaymiz. Va qolgan
o‟lchamlarni o‟zgartirmaymiz. OK bosing.
6→ Kursorni jadvaldan tashqariga sichqonchani jadvalning o‟ng tamoniga bosish
orqali chiqaring, klaviaturadan hech qanday tugmani bosmagan holda. Yana bitta
uchunchi jadvalni tuzamiz. Endi esa 1 ta qator, 1 ta ustun qilib belgilaymiz. Va qolgan
o‟lchamlarni o‟zgartirmaymiz. OK bosing.
Sizni umumuy hama jadvalingiz ushbu ko‟rinishga egadir.
7→ Endi vaqtinchalik jadvalimizni o‟lchamlarini belgilashni osonlashtirish
maqsadida cell padding va cell spacing joylashtiramiz. Uning uchun shunshaki:
View > Table Mode > Expanded Tables Mode (F6)
yoki quyidagi qatordan Expanded ga bosamiz.
Va quyidagi natijani olamiz. Biroq o‟lchamlarni joylab bo‟lgach oldingi Standard
Mode ga qaytishimizga to‟g‟ri keladi.
8→ Kursorni yuqoridan eng birinchi qator ichiga joylagan holda, eng
quyidagi
bo‟limidan “H” ya‟ni height (balandlik)ni 90 (piksel) qilib
belgilaymiz.
9→ Kursorni yuqoridan ikkinсhi qator iсhiga joylagan holda, eng quyidagi
bo‟limidan “H” ya‟ni height (balandlik)ni 166 (piksel) qilib
belgilaymiz.
10→ Kursorni yuqoridan uсhinсhi qator ishiga joylagan holda, eng
quyidagi
bo‟limidan “H” ya‟ni height (balandlik)ni 24 (piksel) qilib
belgilaymiz. Sрu bilan birinсhi jadvalimiz o‟lсhamlari tugaydi.
Birinсhi Jadvalimizning o‟lсhamlari o‟rnatilganidan so‟ng umumiy
ko‟rinishi quyidagiсhadir.
11→ Endi ikkinchi jadvalimizning o‟lсhamlarini kiritamiz. Kursorni
сhapdan birinсhi ustun ishiga joylagan holda, eng quyidagi
bo‟limidan “W” ya‟ni width (kenglik)ni 140 (piksel) qilib belgilaymiz.
12→Ikkinchi va uchunchi ustunlar uchun ham W ni 230 va 330 qilib mos
ravishda belgilab olamiz. Va bizda umumiy jadvalimiz quyidagicha ko‟rinishga
ega bo‟lishi kerak bo‟ladi. H uchun hech qanday o‟lcham kiritmaymiz chunki
keyinchalik bu kataklar ichiga joylashtiradigan ma‟lumotlarimizga qarab jadval
balandligi o‟zgarishi mumkindir.
13→ So‟nggi jadvalimizning esa (H)ni 24 (pixel) qilib belgilab olamiz.
Eng so‟nggida jami jadvallarimizning umumiy ko‟rinishi quyidagicha
bo‟lishi kerak bo‟ladi.
14→ Keyin Boshida ta‟kidlaganim Standard Mode ga qaytishimiz kerak
bo‟ladi. Uning uchun ikki hil uslubni qo‟llashimiz kerak bo‟ladi.
Birinchisi: Menyu qatoridan View > Table Mode > Standard Mode
Ikkinchisi:
joydan
Standard
tugmachasiga
bosishimizdur. Va
Standard
holatga
o‟tkazganingizdan so‟ng dokumentingizni saqlang.
Image Placeholder va Rang berish
Vebsite yaratishimizda eng yuqori qatorda odatda biror rasm yoki
animatsiya bo‟lishi kerak bo‟ladi. Hatto uni oldindan yaratmagan bo‟lsangiz
ham u uchun joy ajratib
qo‟yishingiz kerak, va u joy odatda image placeholder (rasm joyi deb
nomlanadi) bo‟ladi.
1→ Jadvalimizning eng yuqori qatoriga kursorni joylagan holda
dokumentimizning Menyu qismidan Insert > Image Objects > Image Placeholder
ga kiramiz.
2→Undan so‟ng quyidagi oynacha chiqib keladi va uni quyidagicha
to‟ldirishimiz kerak bo‟ladi.
a.
Name: banner_graphic
b.
Width: 700
c.
Height: 90
d.
Color: #993300
e.
Alternative text: esa bo‟sh qola tursin.
f.
Va ohirida OK
3→Endigi qilishimiz kerak bo‟lgan ish, bu jadvalimizning ba‟zi
kataklariga rang berib chiqishimizdir. Uning uchun birinchi navbatda uch
ustunlik jadvalimizning birinchi ustuniga kursorni joylaymiz.
4→Biz shu holda umumiy katakni tanlashimiz kerak bo‟ladi, uning uchun
ishlash panelimizning quyi qismidagi belgisini tanlashimiz kerak bo‟ladi
5→ Dokumentimizning eng quyi qismidagi Properties bo‟limidan
background color (bg) dan #993300 rangini tanlang va Enter ni bosing. U
qiyidagich ko‟rinishga ega bo‟lishi kerak bo‟ladi.
6→ Endi esa ikkinchi ustunni tanlashimiz kerak bo‟ladi va u uchun biz
yana kursorni katak ichiga joylaymiz va | | 