Professional Documents
Culture Documents
Dreamweaver Cs 4 TR
Dreamweaver Cs 4 TR
Kullanc El Kitab
NDEKLER
Dreamweaver Temelleri erik Eklemek Stil Sayfalar Oluturmak Balarla almak Resimlerle almak Tablolarla almak oklu Ortam Bileenlerini Kullanmak, Kullanc Etkileimi ve Ajax Bileenleri Formlarla almak ablonlar Siteyi Ynetmek 1 19 27 43 51 65 81 95 109 113
BLM
Dreamweaver Temelleri
Dreamweaver Temelleri Balang Sayfas Siteyi Gelitirmek zere Hazrlk Yapmak Yerel Bir Site Tanmlamak Yeni Bir Sayfa Oluturmak ve Kayt Etmek Dosya Adlandrma Standartlar Aralar ve Arayz Paneller Sayfaya Balk Atamak
Dreamweaver Temelleri
Dreamweaver CS4, Web sitelerinin oluturulmasn, ynetilmesini, bakmnn ve devamlln salanmasn mmkn klmak iin gl grsel tasarm aralaryla metin tabanl HTML dzenleme zelliklerini bir araya getirmitir. Yazlm, acemi kullanclarn Web sayfalar oluturmak iin gereken aralara kolayca ulamasn salarken, elle kod yazmaya alkn deneyimli kullanclara da gerektiinde dorudan kodla alma imkn salar. Bu esnek program, gelimi teknikleri eriilebilir ve kolay kullanlr hale getirir. Gl tasarm, kod ve etkileim zelliklerinin bir arada sunulmas hem acemiler, hem de deneyimli kullanclar iin saysz fayda salar. Adobe Dreamweaver CS4, pek ok Web gelitiricisinin tercih ettii bir aratr. Bir yandan kolayca eriilebilir ve standartlara uygun siteler hazrlama ihtiyalarna karlk verirken, dier yandan da mevcut ve gelimekte olan pek ok teknolojik zmle alma imkn salayan bir ortamda hem grsel tasarm, hem de kod dzenleme aralar sunar. Dreamweaver, retim srecini hzlandrr ve site ynetimi ve sitenin devamlln salamak iin gereken aralar sunar. Web gelitirme yazlmlar sektrnde lider olan Dreamweaver, Web siteleri oluturma ve bunlarn devamlln salama, ayrca srekli deien standartlar, yeni teknolojiler ve kullanc ihtiyalarn karlama konularndaki zorluklar amanza yardmc olmak iin ihtiya duyduunuz aralar salar
Balang Sayfas
Dreamweaver CS4 atktan sonra bir balang sayfas greceksiniz. Bu sayfada u aralar bulunmaktadr: En son alan belgelere ait hzl balantlar Farkl dosya tiplerinde yeni belgeler oluturmak iin kullanabileceiniz seenekler
Yeni bir sayfa oluturma ilemine baladnzda veya Balang Sayfasndaki dier seenekleri setiinizde Balang Sayfas kendiliinden kapanr.
1. Aama: Aratrma
Herhangi bir sayfa zerinde almaya balamadan nce kendinize ya da mterinize sitenizin hangi amalara hizmet edecei ve ne gibi ierikler barndrmas gerektirdii ile ilgili sorular sorun.
4. Aama: Test
Web sitesini tasarlama ilemini bitirdikten sonra, ziyaretilerin kullanmna sunmadan nce onu test etmek de ok nemlidir. En basit Web sitelerinin bile mantkl bir ekilde test edilmesi gerekir. rnein Web sitenizi, popler Web tarayclarnn hepsiyle test etmeniz gerekmektedir. Her ne kadar Windowsta kullanlan Microsoft Internet Explorer gnmzde en ok kullanlan tarayc olsa da, Mozilla Firefox, Opera ve Safarinin pazardaki paylar da azmsanmayacak ldedir. Internet Explorer gibi bir taraycnn bile, brakn Windows ve Macintosh srmleri arasndaki farklar, 5, 5.5 ve 6 srmleri arasnda ciddi farklar vardr. Farkl tarayclarn sayfalarnz grntleme ekillerindeki farklar dnda, her sayfay ve her balanty da test ettiinizden emin olmalsnz.
Temel ve Gelimi adndaki iki sekmesiyle birlikte Site Tanm iletiim kutusu alacaktr. Bu sekmeleri kullanarak bir site tanmlama ilemini nasl gerekletirmek istediinizi seebilirsiniz.
Temel, iletiim kutusunu atnzda varsaylan olarak grnen moddur ve ilem boyunca size adm adm yardmc olur. Gelimi modu, yaplandrmada kullanabileceiniz bir dizi ilave seenek ve ayar sunar. Temel modundaki aklayc metinler burada grntlenmez.
Bu uygulamada henz seili durumda deilse Temel sekmesine tklayn. Dreamweaver, Site Tanm iletiim kutusunun Temel sekmesinde Sitenizi nasl adlandrmak istersiniz? ifadesiyle sitenizin adnn ne olacan soracaktr. Site ad kutusuna Dreamweaver yazn ve leri dmesine tklayn. Anlalr ve mantkl isimler her bir siteyi dierlerinden kolayca ayrmanz salar ve birden fazla siteyle alrken bunlarn ynetimini kolaylatrr. Yerel kk klasrnde olduu gibi site ismi sadece sizin Dreamweavern tanmlanm siteler listesinde referans olarak kullanacanz bir aratr ve sitenizin kullanclar tarafndan grlmez. Dreamweaver, ColdFusion, ASP.NET, ASP, JSP, yada PHP gibi bir sunucu teknolojisi ile almak ister misiniz? ifadesiyle ColdFusion, ASP.NET, ASP, JSP ya da PHP gibi bir sunucu teknolojisiyle alp almayacanz soracaktr. Hayr, sunucu teknolojisi kullanmak istemiyorum seeneine ait radyo dmesine tklayarak bir sunucu teknolojisi kullanmak istemediinizi belirtin. leri dmesine tklayarak bir sonraki blme gein.
Makinemdeki yerel kopyalar dzenle sonra hazr olduunda sunucuya ykle (nerilen) seeneine tklayn. u anda makinenizdeki dosyalarla alacaksnz ve bir uzak sunucuya erimeniz gerekmiyor. Byle durumlarda bilgisayarnzda bulunan dosyalar dzenlersiniz.
leri dmesine tklayarak bir sonraki blme gein. Uzak sunucunuza nasl balanacanz soran Uzak sunucunuza nasl balanyorsunuz? sorusunun altndaki Yok seeneini iaretleyin. u anda yerel bir site zerinde alyorsunuz ve bir uzak sunucuya erimeniz gerekmiyor.
10
leri dmesine tklayarak bir sonraki blme gein. Yeni tanmladnz site bilgilerini gzden geirin ve iletiim kutusunun alt ksmndaki Bitti dmesine tklayn.
11
Dosya > Yeni komutunu sein. Yeni Belge iletiim kutusu alacaktr.
Alan pencereden HTML seeneini sein ve Olutur butonuna tklayarak HTML dokman oluturun.
12
Dosya > Kaydet seeneini seerek oluturduunuz dokman kayt edin. Sayfanz kaydetmek iin sayfann zerine metin ya da resim yerletirmeyi beklemeyin. Yeni belgeleri aar amaz sayfalarnz kaydedin. Dosyanz zamannda kaydettiyseniz, resim ya da baka medya elemanlar aktardnzda bu elemanlarn sitenizdeki konumlarn gsteren btn yollar dzgn olarak oluturulacaktr.
Eer belgenizi kaydetmezseniz, eklediiniz elemann konumunu sabit diskinize gre tanmlayan ve file:// eklinde balayan bir yol kullanlacaktr. Belgeyi kaydetmeden bir nesne eklemeye kalktnzda Dreamweaver bu eleman iin file:// eklinde bir yol kullanmas gerektiini belirterek sizi uyaracaktr. Bu file:// yollar uzak sunucularda almaz, nk dosyalarn bilgisayarnza zg konumlarn tanmlarlar.
13
Boluklar: Dosya isimlerinde asla boluk kullanmayn. Szckleri ayrmanz gerekiyorsa, boluun ilevini grmesi iin alt izgi veya tire karakterini kullann. Boluk karakteri kullandnzda sorun kabilir, nk tarayclar boluk karakterlerini %20 karakterleriyle deitirirler. zel karakterler: ?, %, *, > ya da / gibi zel karakterleri kullanmayn. Virgl kullanmayn. Saylar: Dosya isimlerinin en banda say kullanmaktan kann. Uzunluk: Klasr ve dosya isimlerinin olabildiince ksa olmasna gayret edin. Klasr isminin sayfaya erimek iin yazdnz URLin bir paras haline geldiini unutmayn.
Aralar ve Arayz
Web sayfas oluturma iinde daha fazla ilerlemeden nce Dreamweaver CS4 arabiriminde yer alan ve verimli bir ekilde Web siteleri oluturmanz salayan eitli aralar ve panelleri tanmanz gerekir. Tasarm ve kod yazma almalarnzn byk bir ksm belge penceresi iinde gerekleecektir. Bu alan sayfann gvde ksm olarak bilinir ve burada bir Web sayfasn oluturan eitli elemanlar ekleme, dzenleme ve silme ilemlerini yapabilirsiniz. Siz almaya devam ederken belge penceresi sayfanzn bir Web sayfasnda nasl grnecei hakknda yaklak olarak size bir fikir verir. Burada yaklak olarak bir fikir edinirsiniz, nk tarayclarn Web sayfalarn yorumlama ekilleri arasnda baz farklar vardr.
14
Dosya ismi balk ubuunda belirecektir (Windowsta dosya ad, belge penceresinin st ksmnda bir sekmede gsterilir). Varsaylan durumda bu sayfa balangta Belge ara ubuundaki Balk metin alannda gsterildii gibi Balksz-1 olarak adlandrlr. Grnm > Ara ubuklar komutu kullanlarak grnr ya da gizli hale getirilebilen Belge ara ubuunda eitli ilemlere kolayca eriebilmenizi salayan baz dmeler ve menler bulunur. Varsaylan durumda ara ubuu belge penceresinin bir parasdr. Windows kullanclar belge penceresinden ayrmak iin ara ubuunun sol kenarndaki tama noktasna (tutama) ift tklayabilir veya bunu srkleyebilirler. Bylece o da ayr bir panel halinde gelir. Dreamweaverda tane grnm modu mevcuttur: Tasarm, Kod ve Bl.
Bl modunda hem Tasarm grnm, hem de Kod grnm yer alr. Bu modlara ait dmeler Belge ara ubuunun sol tarafnda yer almaktadr. mleci bu dmelerin zerine getirip bir sre tutarak grnm modlarnn isimlerini grebilirsiniz. Burada Tasarm grnm modunu kullanmanz gerekiyor. Etkin dme vurgulu hale gelerek Dreamweavern sayfay o grnm modunda grntlediini gsterir. Belge penceresinin sol alt kesinde Etiket Seici dmesi bulunur. Etiket Seici daima <body> etiketinden balar ve hiyerarik olarak, o anda seili durumdaki elemana uygulanan HTML etiketlerini grntler. Etiket Seici, bu elemanlara karlk gelen HTML etiketlerinin araclyla kod hiyerarisinde hzl bir ekilde hareket ederek hangi elemanlarla altnz grmenizi ve dier elemanlar kolayca semenizi salar.
15
Ekle ara ubuu; resimler, tablolar, zel karakterler, formlar ve HTML gibi sayfanza ekleyebileceiniz pek ok nesne ya da eleman ierir. Bunlar tiplerine gre yedi gruba ayrlmtr: Ortak, Mizanpaj, Formlar, Data, Spry, Metin, Sk Kullanlanlar. Etkin grubun ismi mende grntlenir. Varsaylan durumda Ortak grubu etkindir. Meny kullanarak farkl bir nesne grubuna geebilirsiniz. Bu gruplardaki farkl nesnelerin ounun ilve aralar, seenekler ve ilikili dier nesnelerle birlikte kendi zel mens vardr ve bunlara kk siyah bir okla eriilir.
16
Sayfanzn altnda, kullandnz nesneler ve metinlerle ilgili zellikleri deitirebileceiniz zellikler panelini grebilirsiniz.
Paneller
Dreamweaverdaki panellerin byk bir ksm kenetlenmi bir halde, ilevlerine gre sekmeli pencereler eklinde panel gruplarnda yer alr. Varsaylan panel gruplar CSS, Uygulama, Etiket Denetimi ve Dosyalardr. Panellere bu gruplardan ya da Pencere mensnden eriebilirsiniz. Panel gruplar, en ok kullandnz panellere kolayca erimenizi ya da bunlar gizlemenizi mmkn klar. Kenetleme ilemi, ekran alann maksimum bykle getirmenizi ve ayn zamanda ihtiyacnz olan panellere abucak erimenizi salar. Her panel grubu, etkin paneli ve iindeki dier panellerin sekmelerini grntleyecek ekilde geniletilebilir ya da sadece grubun ad grnecek ekilde kltlebilir.
17
BLM
erik Eklemek
Metin Eklemek Satr Aras Eklemek Blnmez Boluk Eklemek Metni Hizalamak ve Madde mleri zel Karakterler Eklemek Sayfay nizleme ile Taraycda Grntlemek
19
eriin hiyerarisini ve yapsn gelitirmek, bir Web sitesi oluturma srecinde bir sonraki admdr. Yapy oluturarak ve aty kurarak sitenin temel bileeni olan ierii hazrlam olursunuz.
Metin Eklemek
Sayfaya metin eklemek iin birka farkl yntem bulunmaktadr. Metni oluturduunuz bo sayfa iine yazmak. Baka bir metin dzenliyicisinden kopyalayarak yaptrmak. TXT gibi dz metinleri Dreamweaver iinde amak
Herhangi bir metni Dreamweaver sayfasna eklediinizde ya da yazdnzda zellikler denetisi ile zelliklerini deitirebilirsiniz.
20
HTML alannda metnin HTML zelliklerini dzenleyebilirsiniz. Metninizin grsel zelliklerini dzenlemek iin CSS seeneini semelisiniz. Dreamweaver CS4 srmnden itibaren tm metin dzenlemeleri iin CSS tekniini kullanmaktadr.
21
Metinlerinizden madde imi oluturmak iin yine zellikler paneli HTML sekmesinde bulunan madde imi butonlarn kullanabilirsiniz.
HTML dokmanlarnda her bir paragraf bir madde imi olarak kabul edilmektedir. Eer madde imi iinde bir alt satra inmek isterseniz CTRL + ENTER tularna basmalsnz. Oluturduunuz madde imlerinin (numaral ya da numarasz) grnm deitirmek iin listenin iindeyken Format > Liste > zellikler seeneini sein.
22
23
24
Alan iletiim kutusundan istediiniz ikincil taraycy ekleyebilir yada var olan birincil tarayc ile ilgili deiiklikler yapabilirsiniz.
25
BLM
27
ascading Style Sheets (CSS) olarak adlandrlan stil sayfalar, metinler ve resimler gibi eitli elemanlarn Web sayfalarnzda nasl grneceini tanmlamanz salar. Cascading (basamakl) terimi, stillerin srasn ve ncelik dzeyini tanmlar. Stil (style), tek bir isimle tanmlanan bir dizi biimlendirme niteliidir. Bu da Web taraycsna bir eleman nasl grntlemesi gerektiini bildirir. HTML belgelerindeki stiller, biimlendirme, grnm ve yerleim dzeni zerinde geni bir kontrol imkn salar. Stillerden faydalanmann avantajn yle zetleyebiliriz: Bir stilin niteliklerinden birinde bir deiiklik yaptnzda, bu stil tarafndan kontrol edilen btn elemanlar otomatik olarak gncellenir (stili nasl oluturduunuza bal olarak tek bir belgede ya da btn site genelinde). Font, byklk ve renk gibi standart niteliklerden sadece CSS ile eriilebilen gelimi metin niteliklerine (satr aralklar [leading] gibi) kadar pek ok ayarda deiiklik yapabilirsiniz. Stil sayfalarn kullanarak rnein 1,25 cmlik kenar boluuna sahip bir paragraf oluturabilir, satrlarnn arasn 20 punto yapabilir ve metinde kullanlan fontun puntosunu 12 olarak ayarlayabilirsiniz. Byle bir eyi CSS olmadan yapamazsnz. Web tarayclarnn 4.0 ya da daha yeni srmleri CSS desteine sahiptir. Internet Explorer 3.0 baz stil niteliklerini tansa da eski Web tarayclar CSSi grmezden gelir. En iyi sonucu, srm 5.0 ve daha st versiyonu olan Web tarayclar verir. Bunlar pek ok zellii destekler. Tek bir sayfay biimlendirmek iin belgede saklanan bir dahili stili kullanabilirsiniz. eitli belgeleri birden fazla sayfada (ayn metin biimlendirme zelliklerini koruyacak ekilde) bir btn olarak kontrol etmek isterseniz bir harici stil sayfasndan da faydalanabilirsiniz. eitli belgelerin grnmn, ayn metin biimlendirme zelliklerini birden fazla sayfada koruyacak ekilde bir btn olarak kontrol etmek isterseniz bir harici stil sayfasndan da faydalanabilirsiniz. Bu stil sayfas Web sayfasnn dnda bulunur ve geerli sayfaya balanr. Byle durumlarda metinlerin ve sayfa yerleim dzeninin btn site iinde tutarl olmasn salamak en iyisidir. nk bu eler sayfadan sayfaya ciddi lde deiiklik gsterirse, ziyaretileriniz baka bir siteye getiklerini dnebilir. Stil sayfalarn kullanmann dier bir avantaj da, Web sayfalarnn ieriini biimlendirmeden ayr tutabilmeyi salamasdr. Sonu olarak bu, ieriinizin grnm zerinde daha hassas bir kontrol imkn salar ve Web sitenize ierik eklemek daha hzl ve daha az karmak bir ilem halini alr. erii bu ekilde izole etmek, sitenin gncellenmesi ve devamllnn salanmasn ok daha basit bir hale getirir. Web sayfalarnzn biimlendirme zelliklerini stil sayfalaryla kontrol ederek farkl platformlar ve Web tarayclar arasnda daha uyumlu sayfalar oluturabilirsiniz.
28
29
Alan iletiim penceresinde grnm alt mens iindeki arkaplan rengi alanndan kendi sayfanza zg bir renk seebilirsiniz. Burada semi olduunuz renk sayfanz iinde bir CSS olarak Dreamweaver tarafndan tanmlanacaktr.
30
Alan pencerede Grnm (CSS) seeneini seerek sayfanz iindeki metinlerin stil grnmlerini dzenleyebilirsiniz.
Bu seiminiz de sayfa iinde bir CSS olarak gzkecektir. Sayfanzn kod grnmne getiinizde yapm olduunuz seimlere gre aadaki gibi gzktn greceksiniz (Sizin seimleriniz farkl olabileceinden aadaki kodun aynsn gremeyebilirsiniz). <style> body { background-color: #003333; } body,td,th { font-family: Arial, Helvetica, sans-serif; }
</style> Yine ayn sayfa zellikleri penceresi iinde sayfanza ait font rengini de belirleyebilirsiniz.
31
Dhili Stiller
Dahili stiller sadece geerli belgede tanmlanan, kullanlan stillerdir. Sitenizdeki tek bir sayfa iin bir stil tanmlar oluturacaksanz dahili stilleri kullanabilirsiniz. Eer tanmladnz stilin siteniz iinde birden fazla sayfada kullanlmasn istiyorsanz, harici bir stil sayfas oluturmanz ve bu stil sayfasn ayn grnme sahip olmasn istediiniz her belgeye balamanz gerekir. Mmkn olan her yerde harici stil sayfalar kullanmanz tavsiye edilir. Harici stiller dier belgelerdeki stilleri kullanabilmenizi salad iin ok kullanldr. Ayrca, harici stiller iin kullanlan biimlendirme kodu ortak bir harici belgede sakland iin bu stil sayfasn kullanan Web sayfalar biimlendirme bilgilerini tekrar tekrar yklemek zorunda kalmaz. Bu da daha az kod kullanlmasn salar ve bylece sayfalar daha hzl yklenir. Bunlara ek olarak, hepsi ayn yerde bulunduu iin stillerin gncellenmesi de daha kolay olur.
Dahili stil oluturmak iin CSS panelinden yararlanacaz. Bu panel iinde hem dahili hem de harici stilleri bir arada grebilirsiniz. Bu panel ak deilse amak iin Pencere > CSS Stilleri seeneini sein.
32
CSS Styles panelinde, sayfa zelliklerini tanmladnzda oluturulan stillerin bir listesi bulunur. CSS panelinin altndaki yeni CSS kural butonuna basn. Karnza yeni stil oluturma penceresi kacaktr.
Dremaweaver iinde kullanabileceiniz 4 eit stil vardr. Bunlar Snf, Kimlik, Etiket ve Bileiktir.
33
Snf: Bu seici tipi, belirli bir elemana bal olmayan snflar yaratmanz salar. Tek bir snf pek ok farkl elemana uygulayabilirsiniz. Snflar, balarna konan nokta iaretiyle gsterilirler. Kimlik: Bu seici tipi IDler oluturmanz salar ve nemli bir istisna dnda snflara benzerler: IDler belirli bir eleman benzersiz bir ekilde tanmlama yntemi olarak sayfa bana sadece tek bir kez kullanlabilirler. Benzersiz yaplarndan tr IDler genellikle script yazma amacyla kullanlr ve bir diyez iaretiyle (#) gsterilirler. Etiket: Bu seici tipi, stil tarafndan yeniden tanmlanacak olan bir eleman olarak bir HTML etiketinin grsel zelliklerini belirlemenizi salar. Etiketin varsaylan grnm stil tarafndan deitirilir. Bileik: Bu seici tipi, zel etiket birleimleri iin kullanlan stiller oluturmanz salar (balamsal seiciler). Bu seici tipi ayrca IDler oluturmanz salar ve nemli bir istisna dnda snflara benzerler: IDler belirli bir eleman benzersiz bir ekilde tanmlama yntemi olarak sayfa bana sadece tek bir kez kullanlabilirler. Benzersiz yaplarndan tr IDler genellikle script yazma amacyla kullanlr ve bir diyez iaretiyle (#) gsterilirler. Snf tr bir stil oluturmak iin aadakileri yapn: Sadece dahili bir stil oluturacaksanz o zaman alan pencere iinde Sadece bu belge seeneini semelisiniz. Ad alanna bu stile vermek istediiniz ismi yazmalsnz. Yazm olduunuz ismin bana bir . nokta koyarak ismi yazabilirsiniz. Nokta iaretini koymasanz da Dreamweaver bunu sizin iin koyacaktr.
34
Tamam butonuna bastktan sonra alan pencerede bu stil ile ilgili zellikleri dzenleyebilirsiniz.
35
Dahili stil sayfanz harici bir stil olarak kayt etmek iin setiiniz stil zerinde sa tkladktan sonra CSS Kuraln ta... komutunun semeli ve ve Yeni bir stil sayfas... seeneini iaretlemelisiniz.
Bu aamadan sonra Dreamweaver size yeni stil sayfanz kayt edeceiniz yeri soracaktr. Harici stil sayfalarnz tutacanz en uygun yer siteniz altndaki CSS klasrnn iindir. Bu nedenle siteniz iinde oluturduunuz CSS klasrn kullanabilirsiniz.
36
Bu seenei setiinizde karnza yeni bir iletiim kutusu alacak ve sizden harici stil sayfanzn yerini soracaktr. Bu alan pencerede stil sayfanz setiinizde artk iindeki css tanmlarn sayfanz iinde de kullanabilirsiniz. Harici stil sayfalar ile alrken unutmamanz gereken ey, bu stillerde bir deiiklik yaptnzda buna bal olan tm sayfalardaki bu stilin grnm de deiecektir.
37
38
39
40
Oluturduunuz yeni stil, paragraf etiketleriyle biimlendirilen metnin grntlenme eklini yeniden tanmlayacaktr. Bileik Stil Hazrlamak Bileik stili kullanabileceiniz yerlerden biri sayfanzn iindeki balantlara efekt eklemektir. Bileik modu iinde hazr olarak tanmlanm 4 adet link seenei bulunmaktadr.
41
Bunlar: a:link Sayfa iinde daha nceden ziyaret edilmemi linklerin grnm ile ilgili grsel ayarlamalar yapabileceiniz tanmlama. a:hover Sayfa iindeki linklerin zerine geldiinizde nasl bir grnm alacan ayarlayabileceiniz tanmlama. a:active Eer ereveli sayfalar kullanyorsanz tklanm olan linkin nasl bir grnm alacan ayarlayabileceiniz tanmlama. a:visited Daha nce ziyaret edilmi bir linkin nasl bir grnm alacan ayarlayabileceiniz tanmlama.
BLM
Balarla almak
Balara Farkl Renk Atamak Onaltlk Tabanl Renk Kodlar Hipermetin Balantlar Oluturmak Sayfa inde Link Vermek E-Posta Balantlar Eklemek
43
enzersiz bir ara olan Web sitelerinin gc, metinleri ve resimleri dier belgelerle dorusal ya da sral olmayan balantlar araclyla balama becerilerinden ileri gelir. Web taraycs, balant olduklarn gstermek iin bu blgeleri vurgulayabilir (genellikle belirli bir renkle ya da altizgiyle). HTMLde balantlar iki paradan oluur: Kendisine balanlacak olan dosyann ad ve yolu (ya da URLi - Uniform Resource Locator) ile tklanabilir alan olarak grev yapan metin ya da resim. Kullanc bir balantya tkladnda Web taraycs bal belgeyi ykler. Baz Web tarayclarnda imle zerine geldiinde balantnn yolu, tarayc penceresinin durum alannda (pencerenin sol alt kesinde yer alr) grntlenir. Balantlar kullanclar dier HTML dosyalarna, resimlere ve dier medya dosyalarna indirilebilir, dosyalara ynlendirebilir.
Ba renklerini deitirmek iin Deitir > Sayfa zellikleri men nesnesini sein. Alan sayfa zelliklerinde Balar (CSS) baln sein.
44
Eer balant renklerini belirlemezseniz, sayfa kullancnn Web taraycsnda grntlendiinde taraycnn varsaylan ayarlar kullanlacaktr. Bu varsaylan ayarlar taraycdan taraycya farkllk gsterebilir. Sitenizin grnm zerinde almaya baladnzda sitenin renk dzenini bir btn olarak hesaba katmak en iyisi olacaktr. Sitenin tamamnda kullanlacak stillere ve renklere karar verirken balant renklerini deitirerek bu renklerin sayfalarnzda kullanlan dier renklerle uyumlu olmasn salayabilirsiniz. Balantlarn kolayca okunabilmesi iin, setiiniz renklerin arka planla ve dier elemanlarla kontrast oluturmas (ama uyumsuzluk yaratmamas) gerekir. Balantlar farkl durumlara sahiptir. rnein tklanan ve tklanmayan balantlarn durumu farkldr. Bir balantnn her durumu iin ayr grnm nitelikleri kullanabilirsiniz. Kullancnn davranna gre deien drt farkl balant durumu iin renk tanmlayabilirsiniz. Ba Rengi: Balantnn, zerine tklanmadan nceki yani balangtaki rengidir. Balantlar iin kullanlan standart Web taraycs rengi mavidir. Ziyaret Edilen Balar: Kullanc bir balantya tkladnda balantnn ald renktir. Tklanm bir balant iin kullanlan standart Web taraycs rengi mordur. Rollover Balar: Kullanc, imleci bir balantnn zerinde bir sre tuttuunda balantnn ald renktir. Bu, bir enin tklanabilir olduunu gsteren ikinci bir iaret olarak tanmlanabilir. Bu seenek bo braklrsa rollover kullanlmaz. Etkin Balar: mle zerindeyken farenin dmesine basldnda balantnn ald renktir. Etkin balantlardan, ziyaretiye ilgili balantya tklandn gsteren etkileimli bir iaret olarak faydalanlabilir. Bununla birlikte, kullanclarn Internet eriiminin hzlanmasyla etkin balantlarn eskisi kadar rabet grmediini hatrlatmak isterim. Bu seenek bo braklrsa etkinlik durumunu gstermek iin bir etkin renk kullanlmaz.
45
46
Yerel sitenizdeki bir baka sayfa ya da dosyaya balant oluturmak iin balant vereceiniz yazy iaretledikten sonra, zellikler panelinde, HTML sekmesine tklayn ve Ba metin kutusunun sandaki klasr iaretine tklayn ve sitenizin iinden ilgili dosyay sein.
Bu alana eer baka bir siteye link verecekseniz bu sitenin adresini banda http bulunarak yazmalsnz. (r: http://wwww.adobe.com) Eer sayfanzn yeni bir pencerede almasn istiyorsanz Hedef mensnden _blank seeneini semelisiniz. Kendi siteniz iinde baka bir dosyaya link verdiinizde, eer link verdiiniz dosyalar, iinde link bulunan sayfa ile ayn klasrdeyse, dier dosya ismini Ba alannda grrsnz. rnein index. hmtl dosyasnn iinden ayn klasrdeki iletisim.html dosyasna link veriyorsanz Ba penceresinde iletisim.html dosya ismini grrsnz. Eer bir klasr daha altta ise bu alanda rnein sayfalar/ iletisim.html yazsn grrsnz. Eer bir klasr stteyse ../iletisim.html yazsn grrsnz. Daha alt klasrlere gitmek iin yolunuz zerindeki tm klasr isimleri linkinizin iinde olmaldr. Eer daha ste gitmek istiyorsanz ktnz her st seviye iin linkinize ayr bir ../ eklemelisiniz . Sitenizin iinde yeni bir klasr oluturmak isterseniz Dosyalar panelindeki bo beyaz alanda sa butona basarak yeni klasr seeneini sein.
47
simli balant eklemek iin Ekle > Adl Balant seeneini sein. Alan pencerede yer imine bir isim verin.
Bu ismi kullanarak sayfa iinde link verebilirsiniz. simde boluk, noktalama iareti veya zel karakter (telif hakk sembol, diyez iareti vs gibi) kullanmayn. Ayn belgede ayn isme sahip birden fazla isimli yer imi asla kullanlmamaldr. Aksi takdirde Web taraycs kullancy doru yer imine gtremez. Sayfada, isimli yer imini gstermek iin sar bir simge belirecektir. Sayfada ilk belirdiinde bu simgeyi seebilirsiniz (seilen yer imi simgelerinin rengi maviye dner). Bu simge, Web taraycsnda grnmeyen bir elemandr. Adl balant simgesini gremiyorsanz Grnm > Grsel Yardmclar > Grnmez eler komutunu seerek grnmez elerin grndnden emin olun.
48
Sayfa iinde yer imlerini oluturduunuza gre onlara artk link verebilirsiniz. Sayfa iinde bir balantya tkladnzda gitmek istediiniz yere yer iminizi yerletiriniz. Balant vermek istediiniz metni iaretleyin ve Ba penceresine yer iminin adnn nne # iareti koyarak yer iminin adn yazn. rnein yer imi olarak bolum1 koyduysanz bu imi gitmek iin link alanna #bolum1 yazmalsnz.
49
BLM
Resimlerle almak
Resim Trleri Sayfalarnza Arkaplan Resmi Eklemek Sayfalarnza Resim Eklemek Dreamweaver inde Temel Resim Dzenleme lemleri Resim zellikleri Resimlere sim Atamak Varlklar Panelini Kullanarak Resim Eklemek Bir Resim Yer Tutucusu Eklemek Resim Dzenleme Tercihlerini Ayarlamak Resim Tabanl Balantlar Oluturmak Resim Haritas Oluturmak
51
esimler izleyicilerinizin dikkatini ekmede ve Web sitenizde vermeyi dndnz mesaj etkin bir ekilde iletmede nemli bir rol oynayabilir.
Adobe Dreamweaver CS4deki zellikler, sitenizde kullandnz resimler zerinde nemli lde kontrol imkn salar. Bylece resim zelliklerini Dreamweaver iinden hzl bir ekilde deitirebilir ve resimleri harici bir resim editrnde aabilirsiniz. Varlklar paneli, sitenizde kullandnz ya da kullanmanz gereken btn resimler iin kataloglar hazrlamanz salayarak resimlerin ynetimini basitletirir.
Resim Trleri
Web sitenizi gelitirirken sayfalarnzn iinde resimleri kullanarak etkiyi arttrabilirsiniz. Sayfalarnzn iinde kullanabileceiniz resim trleri aadakiler gibidir:
nternette en ok ve en yaygn ekilde kullanlan resim format GIF (Graphic Interchange Format) ve JPEGdir (Joint Photographic Experts Group). Resimleri Internette kullanmak zere kaydetme ilemi optimizasyon olarak adlandrlr ve Adobe Fireworks ya da Adobe Photoshop gibi bir resim editryle gerekletirilebilir. Bir resmi GIF olarak m yoksa JPEG olarak m kaydedeceinize karar verirken en yksek resim kalitesini ve olas en dk dosya boyutunu hedefleyin. Genel bir kural olarak, resimde dz renklerden oluan geni alanlar varsa ve renk harmanlar yoksa veya ok azsa GIF formatn kullann. GIFler metinlerde, vektr tabanl resimlerde, ayrca snrl renge ve ok kk boyutlara sahip resimlerde ok kullanldr. GIF resimleri maksimum 8-bit renk modu kullanlarak kaydedilebilir. Bu modda sadece 256 renk grntlenebilir. GIF dosyalar daha hzl yklenir, daha fazla optimizasyon seeneine sahiptir, ayrca saydamlk ve animasyonu destekler. GIF dosyalar iin .gif uzants kullanlr. Fotoraflarda ya da ton aral byk olan resimlerde JPEG formatn kullanmalsnz. JPEG format renk harmanlarn ok iyi grntleyebilir ve bir GIF resminin kesri kadarlk bir boyutta ok daha kaliteli fotografik resimler oluturabilirsiniz. JPEG formatnda resimler 24-bit modunda kaydedilir, btn renkler korunur ve fazlalk verilerin atld kaypl bir sktrma tipi kullanlr. JPEG kalitesi dtke, bahsettiimiz atlan verilerden dolay resme ait daha fazla bilgi kayb olur. JPEGlerin kaypl zelliinden dolay resmin kalitesini drmemek iin btn dzenleme ilemleri kaynak dosyas zerinde yaplmal ve tekrar JPEG olarak kaydedilmelidir. JPEG dosyalarnn uzants .jpgdir. nternette PNG (Portable Network Graphic) adnda nc bir format daha kullanlr.
52
PNG format, GIFin yerini almas iin tasarlanmtr; JPEG ve GIF formatlarnn zelliklerini birletirir. PNG dosyalar kaypszdr, GIF dosyalarndan daha iyi sktrr ve renk kontrol asndan daha fazla seenee sahiptir, ayrca JPG gibi btn renkleri koruyabilir ya da bir GIF dosyas gibi snrl sayda renk kullanabilir. PNG JPEGlerin yerini almas iin tasarlanmamtr. PNG, animasyon desteine sahip deildir ve eski Web tarayclar tarafndan desteklenmez. Dosya uzants .pngdir.
Alan iletiim kutusunda Arka plan grnts seeneinden uygun bir resmi seebilirsiniz. Bu seimi Grnm (CSS)
53
54
55
Alan iletiim kutusundan eklemek istediiniz resmi sein. Eer setiiniz resim sitenizin iinde deil de bilgisayarnzda baka bir yerde ise resmi setikten sonra Dreamweaver size bu dosyay sitenizin iine kopyalamay isteyip istemediinizi soracaktr. Bu soruya Evet olarak cevap vermeli ve dosyay sitenizin iindeki images klasr iine kayt etmelisiniz. Sonraki iletiim kutusunda karnza kan alanlardan Alternatif metin alanna bu resimle ilgili aklayc bir balk, uzun aklama blmne ise grme zrl ziyaretilerin sayfalarnz kolaylkla ekran okuyucu programlarla okuyabilmeleri iin aklama metnini yazabilirsiniz.
56
Dzenle: Harici bir resim dzenleme programn aar ve dzenlemek iin hazrlar En yiletir...:Resminizin KB cinsinden boyutunu optimize etmek iin optimizasyon penceresini aar. Krp: Baka bir dzenleme programna ihtiya duymakszn resimleri krpmanz salar. Parlaklk ve Kontrast: Resimlerinizin parlaklk ve kontrastlarn ayarlamanz salar. Keskinletir: Resimlerinizin keskinliini arttrr.
Resim zellikleri
Sayfalarnza eklediiniz resimlerin zelliklerini zellik panelini kullanarak dzenleyebilirsiniz.
G: Resmin genilii Y: Resmin ykseklii Kaynak: Resmin sabit diskiniz zerindeki yeri Ba: Resmin linki Alt: Resmin zerine gelindiinde kacak yaz D Boluk: Resmin altnda ve stndeki boluu Y Boluk: Resmin solunda ve sandaki boluu Hedef: Resmin linkinin hangi pencerede alaca Dk Kaynak: Resim yklenene kadar gsterilecek dk boyutlu versiyonu Kenarlk: Resmin ereve kalnln ifade etmektedir. Resminizin genilik yada yksekliini, G yada Y deerini veya resminizin kenar tutamalarndan tutarak boyutunu deitirdiinizde iki birim arasnda bir yenile ikonu kacaktr. Bu ikona tklayarak resmin orijinal boyutlarna dnmesini salayabilirsiniz.
57
Resmin boyutlarn bytrken kalitenin dtne dikkat edin. Resimler Web tarayclarnda ekran znrlnde (72 dpi) grntlenir. Bu znrlk deeri, resmi orijinalinden daha byk boyutlarda grntlemek iin yeterli deildir. Bu yzden, mmkn olan en kk dosya boyutunu elde etmek zere bir resim editrnde (Adobe Fireworks ya da Adobe Photoshop gibi) boyutlar ayarlamanz gerekecektir.
58
59
Grnt Yer Tutucu iletiim kutusu alacaktr. Bu pencere iinde gerekli deerleri girebilirsiniz.
60
61
62
Bu alandaki ekil aralarn seerek resminiz zerine resim alanlar izebilirsiniz. Resim alann izdikten sonra eriilebilirlikle ilgili bir uyar grntlenecektir.
Resim haritas resim zerinde belirecek ve zellikleri de zellikler denetisinden eriilebilir olacaktr.
Resmin bu blmnde, isimlerin etrafnda tutamalarla birlikte mavi-yeil renkli yar saydam bir alan belirecektir. zellikler denetisinde aktif alan zelliklerinin belirdiine dikkat edin. Dreamweaver, zellikler denetisindeki Ba metin alanna otomatik olarak bir bo balant (#) yerletirecektir. Yerine hemen bir balant yazmayacaksanz bu karakteri silmeyin. Bu karakter, ilgili alann tklanabilir olduunu gstermek iin bir yer tutucu olarak grev yapar. Oluturduunuz aktif alanlar kolayca dzenlenebilir. Bunlar istediiniz zaman yeniden boyutlandrabilir, tayabilir ya da silebilirsiniz. Resim haritasyla iiniz bittikten sonra areti Etkin Nokta Aracyla resmin zerinde aktif alan dnda baka bir yere tklayabilirsiniz. Resim zerinde resim alannn dnda farkl bir yere tkladnzda zellikler denetisindeki seenekler resim zelliklerini gsterecek ekilde deiecektir. Bir aktif alan tamak isterseniz imleci aktif alann iine yerletirin ve srkleyin. Aktif alan areti Etkin Nokta aracyla seildikten sonra ok tularn kullanarak da aktif alann konumunu ayarlayabilirsiniz. lemi gerekletirdikten sonra F12ye basarak sayfalarnz nizleyebilirsiniz.
63
BLM
Tablolarla almak
Tablo Oluturmak Harici Tablolar Aktarmak Tablo Hcrelerini Kopyalamak ve Yaptrmak Tablo Hcrelerini Semek ve Biimlendirmek Tablo zellikleri Hcre zellikleri Tablo eriini Sralamak Tabloda Satr yada Stnlar Silmek Tablolara Satr yada Stn Eklemek ie Tablolar Farkl Ekran znrlkleri in Uygun Boyutlar
65
ablolar, bilgileri dzenli bir ekilde sunmanz salar. Tablolarda yer alan satrlar (rows) ve stunlarn (columns) kesiimi hcreleri (cells) oluturur ve tablo ieriini bu hcrelere yerletirirsiniz. Hcreleri birletirerek daha byk hcreler elde edebilirsiniz. Tablolar, hesap tablolaryla sunulmas gereken sekmeli (tabular) verilerden resimler ve HTML metinlerinin kombinasyonlarndan oluan grsel tasarmlara kadar pek ok farkl tipte ierik sunmak iin kullanlabilir. Tablolar yerleim dzenini kontrol etmek iin kullanlabilir. erii tablo hcreleri iinde dzenleyerek nesneleri sayfa zerinde belirli konumlara yerletirebilir ve daha karmak grsel tasarmlar oluturabilirsiniz. Tablolar, tasarmclara ve gelitiricilere sitelerinin yerleim dzeni zerinde kontrol imkn salayan HTML elemanlarndan biridir.
Tablo Oluturmak
Bir tablonun tm ierii her zaman bir hcre iinde yer alr ve her tabloda bir ya da daha fazla hcre bulunur. Hcre (cell), bir satr (row) ve bir stunun (column) kesimesiyle oluan alana verilen isimdir. Bir tabloda en az bir satr ve bir stun olmaldr; bylece bir hcre elde edilir. Ekle ara ubuunda Mizanpaj kategorisini sein ve Standart mod dmesinin seili olduundan emin olun.
66
Varsaylan durumda Standart mod seenei etkin olmaldr. Etkin mod, vurgulu bir dmeyle gsterilir. Etkin tablo modu olarak Standart mod seili deilse, Standart dmesine tklayn.
Daha sonra ekleme noktanz sayfanzn iinde istediiniz bir noktaya koyarak yeni bir tablo eklemek iin Ekle panelindeki Mizanpaj modundaki yada Ortak modundaki Tablo dmesine tklayn.
67
Tablo Boyutu blmnde u seenekler yer alr: Satrlar: Tablodaki satrlarn saysn gsterir. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri 3tr. Stunlar: Stun saysn gsterir. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri 3tr Tablo Genilii: Piksel ya da Web taraycs penceresinin bir yzde deeri cinsinden tablo geniliidir. Piksel cinsinden tanmlanan tablolar metin ve resimlerin hassas bir ekilde yerletirilmesi asndan iyidir. Yzde cinsinden tanmlanan tablolar ise stunlarn orantlar asl geniliklerinden daha nemliyse ideal bir seenektir. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri 200 piksel olacaktr. Kenarlk Kalnl: Tablo kenarlnn geniliini (kalnln) gsterir. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri 1 olacaktr. Hcre Dolgusu: Hcre ierii ve hcre duvarlar arasndaki boluk miktarn gsterir. Bu seenei bo brakrsanz, varsaylan deer olan 1 piksel kullanlr. Byle bir boluk kullanmak istemiyorsanz metin alanna 0 (sfr) yazdnzdan emin olun. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri botur. Metin alannn sanda sz konusu boluu gstermek iin mavi rengin kullanld kk bir tablo resmi greceksiniz. Hcre Boluu: Tablo hcreleri arasndaki boluk miktardr (kenarlk buna dahil deildir). Bu seenei bo brakrsanz varsaylan deer olan 1 piksel kullanlr. Bunun iin herhangi bir boluk kullanmak istiyorsanz metin alanna 0 yazdnzdan emin olun. Daha nce bir tablo oluturmadysanz varsaylan Dreamweaver deeri botur. Metin alannn sanda sz konusu boluu gstermek iin mavi rengin kullanld kk bir tablo resmi greceksiniz.
68
Bu zellikleri daha sonra da deitirebilirsiniz. Belge penceresinde bir tablo seildiinde Tablo Boyutu blmndeki seeneklere zellikler denetisinden ulaabilirsiniz. Tablo iletiim kutusunu daha nce kullandysanz bu seeneklerin varsaylan deerleri farkl olabilir. Bu durumda varsaylan deerler bir tablo iin en son tanmladnz deerler olacaktr. stbilgi blm stbilgi iin drt farkl yerleim seenei ierir: Yok, Sol, st ve Her ikisi. stbilgi (header), ieriinizi etiketlemek iin kullandnz bir satr ya da stun baldr.
stbilgiler tasarm/yerleim tablolarndan (tasarm amacyla grsel elemanlarn dzenlenmesi ve yerletirilmesi iin kullanlan tablolar) ziyade ounlukla veri tablolar (hesap tablolar gibi ilev gren tablolar) iin kullanlr. Bir hcreyi (ya da hcreleri) stbilgiye dntren bu seenee zellikler denetisi araclyla da eriebilir ve istediiniz zaman zerinde deiiklik yapabilirsiniz. Sayfalarnzn ziyaretileriniz asndan eriilebilirlik durumunu srekli olarak dikkate almanz nemlidir. Eriilebilir sayfalar hazrlamann amac, olabildiince ok ziyareti iin (engelli olanlar da dahil olmak zere) ilevsel bir ierik oluturmaktr. Dreamweaver, Eriilebilirlik blm araclyla eriilebilirlik zelliklerini en batan itibaren dahil etmeyi ok kolay bir hale getirmektedir. Bu blmde u seenekler yer alr:
69
Resim Yazs: Siz bir tablo aklamas (caption) tanmladnzda bu aklama btn kullanclar tarafndan grlr ve tablonun stne, altna, soluna ya da sana hizalanabilir. Bu seenei bo brakrsanz herhangi bir tablo aklamas eklenmez. Bu seenek sadece Tablo iletiim kutusunda bulunur. Daha ileride bu zellii dahil etmek isterseniz, HTML kodunu dzenleyerek bunu gerekletirebilirsiniz. zet: Tablo zeti sayfada grntlenmez. Ekran okuyucular tarafndan okunur ve tablonun kullanlma amacn ve ieriini aklamak iin kullanlr. zet (summary), tablodaki materyali zl, aklayc ve olabildiince ksa bir ekilde tanmlamaldr. Tablonun ieriinin ne olduunu gstermelidir. Bu seenei bo brakrsanz zet dahil edilmez. Sayfada, belirlediiniz zelliklerle oluturulmu bir tablo belirecek ve otomatik olarak seili durumda olacaktr. Tablonun st ksmna bir tablo stbilgisi (ak renkli gri ubuk) eklendiine dikkat edin. Tablonun sol ve sa snrlarn gsteren yeil renkli dey izgiler bu ubuun iki yannda grntlenir.
70
ubuun st veya alt ksm boyunca, ortasnda tablonun genilik deeri yazan ve bir men oku bulunan yeil bir izginin uzandn greceksiniz. ubuun tabloya en yakn ksmnda bir dizi ksa yeil izgi yer almaktadr. Stunlarn geniliini gsteren bu izgilerin her biri kendi men okuna sahiptir. Siz tablonun dnda bir yere tkladnzda tablo stbilgisi kaybolur, tablo tekrar etkin duruma geldiinde ya da seildiinde yine belirir. Tablo stbilgisi, tablonun st ksmndaki ierii rtebilir. Eer tablo belgenizdeki ilk eyse, tablo stbilgisi tablonun alt ksmna eklenebilir. ubuun nerede grntleneceini kontrol edemezsiniz. Grnm > Grsel Yardmclar > Tablo Genilikleri komutunu seerek tablo stbilgisi grsel yardmcsn aabilir ya da kapatabilirsiniz.
71
Onay iareti sz konusu seenein etkin durumda olduunu gsterir. Eer yannda onay iareti yoksa seenek kapal durumda demektir. Tabloyla tablo aklamasn evreleyen ve alt ve sa yannda seim tutamalar bulunan siyah dz bir d hat (outline), tablonun seili durumda olduunu gsterir. ki satr ve drt stun, tablo aklamasn evrelemeyen gri bir kenarlkla gsterilir. Varsaylan Hcre Dolgusu deerinin uygulanmasndan dolay hcrelerin arasnda bir boluk grebilirsiniz. nk Hcre Boluu seenei bo braklmt. Siz yazp dier hcrelere gemeye devam ettike tablo metni sdrmak iin stunlarn geniliini otomatik olarak deitirebilir. Hcreler arasnda hareket etmek iin Tab tuunu ya da ok tularn kullanabilirsiniz. Tab tuu, sada yer alan bir sonraki hcreye ya da satrn en sonundayken alttaki satrn ilk hcresine (en soldaki hcre) gemek iin en hzl yntemdir. erii bulunan bir hcreye Tab tuunu kullanarak getiinizde o hcrenin ierii seili hale gelir. Eer tabloyu eklerken en st satr st bilgi satr olarak tanmladysanz iine yazdnz metinler koyu renkte ve ortalanm olarak karnza kacaktr. Tablonun dna tkladnzda stunlar genilikleri deierek hafife kayabilirler.
72
73
Tabloyu semek iin gri ubuk boyunca uzanan yeil renkli yatay tablo genilik izgisine de tklayabilirsiniz. Seildikten sonra tablonun etrafnda seim tutamalar belirir ve btn tabloyu siyah bir kenarlk evreler. Siyah kenarlk sadece bir ya da birden fazla hcrenin etrafn sarmaz, tm tabloyu kapsar.
Eer ekleme noktas tablonun iindeyse ve tablo seili durumda deilse Etiket Seicide <table> etiketinin yannda <tr> ve <td> etiketlerini de grebilirsiniz. <tr> etiketi, tablo satrn temsil eder. <td> etiketi tablo verisini temsil eder ve hcre olarak da bilinir. Bir <td> etiketini setiinizde ilgili hcre seili hale gelir ve zellikler denetisini kullanarak bu hcre zerinde deiiklik yapabilirsiniz. mle bir hcrenin iindeyken Ctrl+A klavye ksayolunu kullandnzda hcre seili hale gelir. Bu ksayolu ikinci kez kullandnzda tm tablo seilir.
74
Tablo zellikleri
Herhangi bir tabloyu setiinizde zellik denetisi iinde bu tablo ile ilgili zellikler belirecektir. Bu zellikler aadaki gibidir.
Tablo Kimlii: Tablonun baln girebileceiniz alandr. Bu alan sizin tablonuzu sayfa iinde esiz bir ekilde tanmlayabileceiniz alan belirler. Satrlar: Tablolarnzn satr saysn ayarlayabileceiniz alan. Stunlar: Tablolarnzn stun saysn ayarlayabileceiniz alan. G: Tablolarnzn geniliini ayarlayabileceiniz alan. Buradan tablo geniliinizi piksel yada yzde olarak ayarlayabilirsiniz. Hcre Dolgusu: Hcrelerinizin iindeki nesnelerle duvarlar arasndaki uzakln piksel olarak deeri. Hcre Boluu: Hcre aras boluklarnzn piksel olarak deeri. Hizala: Tablonuzun sayfanz iindeki yatay hizalamas Kenarlk: Tablolarnzn kenar kalnl. Bu kalnlk deeri, eer tablolarnz tasarm eleman olarak kullanyorsanz 0 olarak ayarlanmaldr.
Hcre zellikleri
Tablo zelliklerini dzenleyebileceiniz gibi, tablolarnzn her bir hcresinin yada oklu seim yaptysanz hepsinin zelliklerini de bir arada deitirebilirsiniz. Bunun iin zelliklerini deitirmek istediiniz hcreye tklamal veya birden fazla hcre iin bu ii yapacaksanz o hcreleri CTRL tuuna basarak semelisiniz.
Seilen hcreleri yaylmalar kullanarak birletir: Bu seenekle birbirine komu iki hcreyi birletirebilirsiniz. Seilen hcreleri satr yada stunlara bler: Bu seenek ile seilen hcreleri satr yada stunlara blebilirsiniz. Yatay: Hcre iindeki yatay hizalamay belirler. Dikey: Hcre iindeki dikey hizalamay belirler. Gen: Stnn geniliini belirler.
75
Yk: Satrn yksekliini belirler. Bg: Hcre arkaplan renginizi belirler. Burada vermi olduunuz deer tabloya vermi olduunuz arkaplan deerinin zerinde gzkr. Sarma Yok: Yazlarnzn tablo kldnde bir alt satra inmesini engeller. stbilgi: aretlendii hcrenin balk formatnda gzkmesini salar.
76
Bununla Srala: Sralamada temel alnacak stunu semek iin kullanabilirsiniz. Sralama: Stunu alfabetik olarak m yoksa saysal olarak m sralayacanz belirler. Bu seenein nemi, ierii saysal olan stunlarda ortaya kar. Bir ve iki basamakl saylarla numaralandrlm bir listeyi alfabetik olarak sralarsanz, normal bir saysal sralama yerine (1, 2, 3, 10, 20, 30 gibi) alfanmerik bir sralama elde edersiniz (1, 10, 2, 20, 3, 30 gibi). Sralama dzeni iin azalan (Adan Zye veya artan) seeneini iaretleyin (varsaylan). Sonra Bununla: Bu uygulamada bu seenei bo (varsaylan) brakn. Sonra Bununla ile farkl bir stunda ikincil bir sralama gerekletirebilirsiniz. Mendeki sralama seenekleri Bununla Sraladakilerle ayndr. Sralama ilk satr ierir: Bu seenekle ilk satrn sralamaya dahil edilip edilmeyeceini belirleyebilirsiniz. Eer ilk satr baka bir yere tanmamas gereken bir stbilgiyse bu onay kutusunu iaretlemeden brakn (varsaylan). st bilgi satrlarn srala: stbilgi satrlarn gster. Alt bilgi satrlarn srala: Altlk satrlarn gster. Sralama tamamlandktan sonra tm satr renklerini ayn ekilde koruyun: Bir satrn herhangi bir niteliini deitirdiyseniz, bu seenei iaretleyerek satrdaki ilgili niteliini eski deerine getirebilirsiniz. lk satrna belirli bir renk atanm olan bir tabloyu sraladnz farz edelim. Sralamadan sonra ilk satrdaki veriler ikinci satra kayar. Bu seenek iaretlendiinde verilerle birlikte renk de ikinci satra kayar. Eer bu seenek iaretli deilse renk ilk satrda kalr.
77
78
Eer ayn menden Satr veya Stun ekle seeneini iaretlerseniz aadaki gibi bir iletiim kutusu karnza kacaktr.
ie Tablolar
Tablolar tek bana kullanabileceiniz gibi ayn zamanda iie olacak ekilde de kullanabilirsiniz. Bu ilem ile tablolarnz sayfa tasarm iin daha gelikin olarak kullanabilirsiniz. Bu ilemi yapmak iin bir tablo ekledikten sonra tablonun iinde herhangi bir hcreye tklayarak farkl zelliklerde bir baka tablo daha ekleyebilirsiniz.
79
BLM
81
dobe Flash ve QuickTime filmleri gibi multimedya elemanlar, sitenizde sunduunuz ierii gelitirmenizde size yardmc olabilir. Bu elemanlar kullanarak sitenizin ziyaretilerine mesajnz iletmek zere sitenize animasyonlar ve videolar ekleyebilirsiniz.
82
Herhangi bir Flash animasyonunu sayfanza eklediinizde zellikler paneli aadaki gibi deiir.
Buradaki alanlar: Gen: Genilik Yk: Ykseklik Dosya: Dosyann sitenizdeki yeri Kaynak: Bu dosya iin orijinal FLA dosyanz varsa onun yeri Dzenle: Bu dosyann orijinal FLA dosyasn ap dzenlemeniz iin gerekli buton D Boluk: animasyonun sanda ve solunda verilecek dikey boluk Y Boluk: Animasyonun stnde ve altnda verilecek yatay boluk Kalite: Animasyonun hangi kalitede oynayaca. Bu ayar eer ziyaretilerinizin dk bilgisayar konfigrasyonlar olduunu dnyorsanz deitirin. Oynat/al: Animasyonu DW iinde nizlemek istiyorsanz gerekli buton Parametreler: Flash animasyonuna gndermek istediiniz parametreleri burada belirtebilirsiniz. Hizala: Flash animasyonunu etrafndaki baka bir nesneye gre hizalama seenei Wmode: Flashn grnm parametresi lek: Flash animasyonunun geniliinin %100 olmas durumunda bu boyuta gelirken eer deforme olmasn istemiyorsanz Kenarlk Yok seeneini, eer deforme olmasnda saknca yoksa Tam Sma seeneini seebilirsiniz.
83
Kullanc Etkileimi
Etkileim ve kullanc geribildirimi, Web sitelerinin nemli bileenleridir. Bunlar etkin bir ekilde kullanarak eitli avantajlar elde edebilirsiniz. Bu bileenleri kullanarak rnein ziyaretilerinizin sitenizin ieriini ve amacn daha iyi anlamalarna yardmc olabilir, sayfalarnzda dolamalarn kolaylatrabilir ve sitenizde gezmeyi onlar iin daha ho ve faydal bir deneyim haline getirebilirsiniz. Bir Web sitesine etkileim eklemenin pek ok yolu vardr. Etkileimli sayfalar oluturmak iin kullanabileceiniz birok araca rnek olarak dinamik ve veritaban destekli sayfalar, Adobe Flash ve QTVR (Quick Time Virtual Reality) verebiliriz. QTVR, 360 panoramik grnmleri ve etkileimli bileenleri destekleyen filmlerdir. Etkileimli Web siteleri oluturmak iin kullanlan aralarn en yaygn ve etkili olanlarndan biri (zellikle istemci tarafl scriptlerin yazlmasnda kullanlan) JavaScripttir. stemci tarafl scriptler, Web sayfalarnda bulunan ve tarayc tarafndan ilenen scriptlerdir. JSP (Java Server Page) tarafndan kullanlan scriptler de dahil olmak zere dier scriptler, sunucu tarafl scriptlerdir. Bunlar sunucu tarafndan ilenir ve kullancya gnderilir. Adobe Dreamweaver, standart JavaScript fonksiyonlarnn kullanlma srecini ve davranlarn kullanma sunarak basitletirir. Davranlar (behavior) Web sitenize kolaylkla dahil edebileceiniz nceden yazlm JavaScript kod rutinleridir. Davran, bir kullanc olayn (rnein imlecin Web taraycsndaki grafik tabanl bir dmenin zerine getirilmesi), bu olayn sonucu olarak gerekleen bir eylemle ya da bir dizi eylemle birletirir. Davranlar sayfalarnza etkileim eklemek, kullanclarn eylemlerine bal olarak geribildirim almalarn ve grdkleri bilgileri deitirmelerini ya da deitiremiyorlarsa kontrol etmelerini salamak iin kullanabilirsiniz. Dreamweaverda nceden tanmlanm bir dizi davran bulunmaktadr. lave davranlar ekleyerek Dreamweaver gelitirebilir ya da JavaScript konusunda yeterli bilgiye sahip iseniz kendi davranlarnz oluturabilirsiniz.
84
Web sitesindeki etkileim, zellikle kullanc asndan nemlidir. Bu, ziyareti ile Web sitesi arasnda gerekleen bir eydir. Etkileimin salanmas iin bir hareket ve bir yant gerekir; yani bu iki ynl bir iletiim srecidir. Sayfalarnza etkileim eklemeniz (yani ziyaretilerin eylemlerine sitenizin verecei yant belirlemeniz), sitenize yaplan ziyaretlerin karmaklk derecesini ve derinliini artrabilir. Ziyaretileri belirli eylemler gerekletirmeye ya da katlmda bulunmaya tevik eden Web siteleri, kullanc zerinde yaratlan etki asndan, kullancy pasif bir konumda tutan sitelere gre muhtemelen daha baarl ve ilevseldir ve aklda daha ok kalr. Dreamweaverda, hi HTML ya da JavaScript kodu kullanmadan rolloverlar oluturabilirsiniz. Rollover, Ekle ubuunun Ortak kategorisinde yer alan basit bir davrantr. Bu yntemi kullandnzda, davran Dreamweaver tarafndan oluturulur. Sayfanza Rollover resmi eklemek iin ncelikle Ekle panelindeki Ortak sekmesine tklayn. Bu panelde daha nce resim eklediiniz butona tklayn ve alan menden Rollover Grnts seeneini sein.
Dreamweaver, rollover oluturma ileminde bu iletiim kutusu araclyla size adm adm yardmc olur. Rollover oluturmak iin kullanacanz resimleri henz sayfaya yerletirmediyseniz bu yntemi kullanmay tercih edebilirsiniz, nk bu yntemle ayn anda hem resmi ekleyebilir, hem de bunu rollover olarak tanmlayabilirsiniz.
85
Bir rollover resmi eklemek iin ayrca Ekle > Grnt Nesneleri > Rollover Grnts komutunu seip yine ayn iletiim kutusunu kullanmanz da mmkndr.
Grnt ad blmne bir isim yazarak resmi adlandrabilirsiniz. Buraya bir isim yazmazsanz Dreamweaver resimleri kendisi adlandracaktr. Orijinal Grnt alanndaki Gzat... butonunu seerek orijinal resim olarak gzkecek resmi sein. Rollover Grnts, imle orijinal resmin zerine geldiinde deiecei ikincil halinin dosyasdr. Rollover grnty nceden ykle kutucuunu iaretlediinizde ikincil resim daha ona ihtiya olmadan sayfanzn iine n ykleme ile yklenir. Bylece kullanclarn resmin zerine geldiinde ikincil resmin kmas iin beklemesi engellenmi olunur. Alternatif metin, resimler iin kullandmz ALT alan ile ayn ilevi grmektedir. Tklandnda URLye git seenei ise resme verdiiniz linki gstermektedir.
86
Resme eklediiniz davranlar, Davranlar panelinde grlmektedir. Eer daha nceden eklenmi resimleriniz varsa onlara da rollover davrann ekleyebilirsiniz. Bunun iin yapmanz gereken rollover ekleyeceiniz resmi semek ve Davranlar panelini amak olacaktr. Daha sonra resminiz halen seili iken Davranlar panelinden + butonuna basarak, Grnt Deitir seeneini semelisiniz. Alan iletiim kutusunda setiiniz resim liste iinde seili olarak karnza gelecektir. Kayna buna ayarla seeneinin yanndaki Gzat... butonuna tklayarak yeni ikincil resminizi seebilirsiniz. Bu eklemi olduunuz davran da, resmi setiinizde, Davranlar panelinde gzkecektir. Bir davran silmeniz gerekirse, belge penceresinde davran ieren nesneyi ve Davranlar panelinde silmek istediiniz eylemi sein, sonra da Davranlar panelinin st ksmndaki eksi () iaretli dmeye tklayn. Bir davran, setikten sonra Backspace tuuna basarak da silebilirsiniz. Bir davran eklediinizde bu davrann ortaya kmas iin bir olayn meydana gelmesi gereklidir. rnein kullancnn imlecini bir resmin zerine gtrmesi yukarda anlattmz rollover ilemi iin gerekli bir olaydr. Bu tr olaylara bir tetikleyici olay yada tetik deriz. Rollover davrann eklediiniz resmi setiinizde Davranlar panelinde soldaki stunda bu ilemin gereklemesi iin gerekli tetikler grnmektedir. Rollover davran iin varsaylan tetik onMouseOver, yani farenin nesnenin zerine gitmesidir. Ancak isterseniz alan menden bu davran deitirebilirsiniz ve kendi almanza uygun baka bir tetik seebilirsiniz. Sayfanza bir davran eklediinizde bu davran ile ilgili javascript kodlar sayfanzn iine eklenir. Bylece amaladnz etkileim oluturulmu olur. Davranlar ekledikten sonra sayfanzn Kod grnmne dnerek davranlarla ilgili javascript kodlarn inceleyebilirsiniz.
87
88
Gezinti ara ubuu: Aralarnda Back (Geri), Forward (leri), Home (Giri) ve Reload (Yenile) dmelerinin de bulunduu tarayc dmeleri. Konum ara ubuu: Aralarnda location (konum) alannn da bulunduu tarayc seenekleri. Durum ubuu: Tarayc penceresinin alt ksmnda bulunan ve mesajlarn (kalan ykleme sresi ve balantlarla ilikili URLler gibi) grntlendii alandr. Men ubuu: Tarayc penceresinin (sadece Windowsta) File (Dosya), Edit (Dzenle), View (Grnm), Go (Git) ve Help (Yardm) gibi menlerin grnd alandr. Kullanclarn yeni pencerede gezinti imknna sahip olmalarn istiyorsanz bu seenei ayarlamanz gerekir. Eer bu seenei ayarlamazsanz, kullanclar yeni pencerede sadece pencereyi kapatma ya da minimum boyuta getirme seeneklerine sahip olurlar.
89
Gerektiinde kaydrma ubuklarn grntle: eriin grnr alann dna tamas durumunda kaydrma ubuklarnn grntlenmesi gerektiini belirtir. Bu seenei ayarlamadnz takdirde, kaydrma ubuklar grntlenmeyebilir. Bunun yannda Yeniden Boyutlandrma Tutamalar seeneinin etkinlii de kaldrlrsa, ziyaretiler ieriin pencerenin orijinal boyutlarna smayan ksmn hibir ekilde gremeyebilir. Eer durum byleyse, pencerenin sayfann ieriine uygun olacak ekilde boyutlandrldndan emin olmanz gerekir. Pencerenin ok kk ya da ok byk olmas ve kaydrma ubuklarnn bulunmamas ziyaretiler asndan sinir bozucu bir durumdur. Baz Web tarayclar bu ayar (yeniden boyutlandrma tutamalar ayaryla birlikte) dikkate almaz ve gerektiinde kullanr. Yeniden boyutlandrma tutamalar: Kullanclarn pencerenin boyutlarn, pencerenin sa alt kesini srkleyerek ya da sa st kedeki Maximize (Ekran Kapla) dmesine (Windowsta) veya boyutlandrma kutusuna (Macintoshta) tklayarak deitirebilmeleri gerektiini belirtir. Bu seenei ayarlamadnz takdirde, boyut deitirme kontrolleri genellikle kullanlamaz durumda olur ve kullanc pencerenin boyutlarn deitiremez. Pencere ismi: Yeni pencerenin ismidir. Yeni pencereyi balantlar iin hedef olarak tanmlamak ya da JavaScript ile kontrol etmek istiyorsanz, bu pencereyi adlandrmanz gerekir.
Ajax Eklentileri
Dreamweaver yeni srm ile birlikte kolay Ajax uygulamalar gelitirebileceiniz Spry Framework zellii ile gelmektedir. Spry, Adobe tarafndan dnya zerinde en ok kullanlan Ajax yntemlerinin iinden zenle seilmi bir koleksiyondur. Dreamweaver iinde gelen Spry aslnda bir JavaScript ktphanesidir. Ayn davranlar gibi size birka admda kolay olarak sayfalarnza Ajax kontrolleri eklemenizi salarlar. Spry Akordeonu, Spry Sekmeli Paneller, Spry Daraltlabilir Panel Spry ktphanesi iinde veri ile alabileceiniz zellikler olduu gibi grsel eler de bulunmaktadr. Bu grsel elerden herhangi birini eklemek iin yapmanz gereken Ekle panelindeki Spry grubunu amaktr.
90
Spry sekmesinde eklemek Spry Akordeonu butonuna tklayn. Dier grsel elerin kullanm da benzer ekildedir.
91
Bu butona bastnzda sayfanzn iine bir akordeon men eklenecektir. Bu men ile sayfalarnz iinde snflandrmak istediiniz alanlar alr kapanr bir men eklinde kullanabilirsiniz. Sayfanz Dosya > Kaydet seenei ile kayt ettiinizde Dreamweaver size bu eklentiyi ilk kez kullandnzda ilgili Javascript dosyalarn kopyalamanz gerektiini syleyecektir.
Bu pencerede Tamam seeneini sein. Bu dosyalar SpryAssets klasr altna yerletirilecektir. Bu dosyalar SpryAssets klasr altna yerletirilecektir. Sitenizi sunucunuza atarken, bu dosyalar atmay unutmayn.
92
Yukardaki resimde akordeon kontrol eklediinizde sayfann ieriini grmektesiniz. Yeni blmler eklemek iin Paneller balnn yanndaki + iaretine tklayabilir var olan bir blm silmek iin iaretine tklayabilirsiniz. Yukar ya da aa oklar ile blmlerin srasn deitirebilirsiniz. F12ye basarak dosyanz varsaylan taraycnzda nizleyebilirsiniz. Dier Spry grsel panelleri de ayn zelliklere sahiptir.
93
BLM
Formlarla almak
Formun Oluturulmas Form eriini Gruplamak Tek Satrl Metin Alanlar Eklemek Radyo Dmeleri Eklemek Onay Kutular Eklemek Liste ve Men eleri Eklemek ok Satrl Metin Alanlar Eklemek Buton Eklemek Gizli Alanlar Oluturmak
95
imi zaman Web sitenizi ziyaret eden insanlardan bilgi almanz gerekebilir. Bu bilgiler iinde insanlarn siteyle ilgili dnceleri, kullanc kayt verileri, anket cevaplar ve rn satn alma bilgileri (e-ticaret) saylabilir. Farkl tipte bilgiler toplamaktan ziyaretilerin siteyle etkileime girmesini salamaya kadar pek ok ileve sahip olan formlar, veri elde etmenizi salayan kullanc arabirimleridir. Formlarla ziyaretilerinizden belirli konularla ilgili bilgi alabilir ya da onlara geribildirim, soru ya da istek gnderme imkn tanyabilirsiniz. Ziyareti kayt ilemleri ve rn siparileri genellikle formlarla salanan bir ilevsellii gerektirir. Formlar veritabanlaryla ska kullanlr ve ziyaretilerin arama yapmalarn ve bir veritabanna dahil edilecek bilgileri gndermelerini salayabilir. Formlar alan (field) ad verilen ve ziyaretinin bilgi girdii baz bileenler ierir. Bu alanlarn arasnda metin alanlarn, radyo dmelerini, onay kutularn, menleri ya da listeleri sayabiliriz. Form verileri genellikle bir sunucu zerinde yer alan bir veritabanna, bir e-posta adresine ya da kendilerini ileyecek bir uygulamaya gnderilir. Formlarn ilenmesi, dinamik sayfalarn (bu sayfalar veritabanlar gibi dinamik ierik kaynaklarna erimek iin PHP, JSP, ColdFusion vb dilleri kullanrlar) ya da CGI (Common Gateway Interface) scriptlerinin kullanmyla gerekletirilir. CGI, formdaki verilerle sunucu arasnda iletiim balants olarak grev yapan standart bir protokoldr. Bu blmdeki konularn iinde veritaban yada bir sunucu ile iletiim olmadndan, sunucu eriimine ihtiya duymayacaksnz
Formun Oluturulmas
Bir sayfaya alanlar ve dmeler gibi elemanlar eklemeden nce bu elemanlar ierecek olan formu oluturmak gerekir. Form; alanlar, dmeler, menler ve ziyaretilerin bilgi girmek ya da seim yapmak iin kulland dier nesneler iin bir tayc grevi stlenir. Formlar ayrca gnderildiklerinde verilere ne olacan belirler. Form nesnelerinin alabilmesi iin mutlaka bir form ile evreli olmalar gereklidir. Bunun iin sayfanza ilk olarak form etiketini yada evreleyicisini eklemelisiniz. Sayfanzn iinde formunuzu ekleyeceiniz noktay sein. Form etiketleri blok elemanlar olduundan iinde bulunduklar erevenin (Bir tablo hcresi yada bir div etiketi veya sayfann tamam) tamamn doldururlar. Bu nedenle bir formu baka bir nesne ile yan yana koymak istiyorsanz iki nesneyi de bir evreleyicinin (tablo yada div etiketi) iine koymalsnz. Ekleme noktanza imlecinizi koyduktan sonra Ekle panelinin Formlar kategorisindeki Form dmesine tklayn.
96
Bu dme en soldaki dmedir. Bylece bir formu sayfanzn iine eklemi oldunuz. Bu eklediiniz sadece formun genel erevesidir. inde herhangi bir form eleman barndrmamaktadr.
97
Form tarafndan kaplanan alan, belge penceresinde krmz noktal izgilerle gsterilir. Bu alan kodda <form> ve </form> etiketleriyle tanmlanr. Sz konusu krmz izgiler sadece Dreamweaverda grntlenen grnmez elemanlardr. Sayfay bir Web taraycsnda atnzda form alann gsteren herhangi bir iaret gremezsiniz. Ayrca bu krmz izgileri tutup srkleyemezsiniz. Eer grnmez elemanlar etkin deilse bir mesaj kutusu belirecek ve formu gremeyeceinizi belirtecektir. OK dmesine tklayarak mesaj kutusunu kapatn ve Grnm > Grsel Yardmclar > Grnmez eler komutunu seerek formun krmz noktal snrlarn grntleyin. Eer grnmez elemanlar etkin durumdaysa bu uyar mesajn grmezsiniz. Dreamweavern Tercihler iletiim kutusunda yer alan Grnmez eler kategorisindeki Form Ayrc seeneinin de iaretli olmas gerekir. Bu seenek varsaylan durumda iaretlidir. Bir sayfaya birden fazla form yerletirebilirsiniz. Ancak HTMLde bir formu dier bir formun iine yerletiremezsiniz. Bu kstlamadan dolay Dreamweaver formlarn yanllkla i ie yerletirilmesini engeller. Bunu da bir formun dier formun iine yerletirilmesini imknsz klarak gerekletirir. Form ekleme seenei iptal edilmez, ama bir formu dier bir formun iine yerletirmeye kalktnzda bu ilem gereklemez. Form etiketlerinin baka bir forma elle eklenmesi durumunda Dreamweaver hatal etiketleri vurgulayarak dikkatinizi hatann bulunduu konuma eker. Eklemi olduunuz bir form erevesini ya da etiketini setiinizde zellikler denetisinde bu formun zellikleri gzkr.
Bu pencere iindeki form1 yerinde formunuzun ismini yazabilirsiniz. Eylem alan, formunuzun altndaki gnder butonuna (henz nasl ekleneceini sylemedik) basldnda sayfann hangi sayfaya ynleneceini sylediimiz yerdir. Bu alana genelde formunuzu ileyecek ve sunucu ile balantl bir dinamik sayfann adresini girersiniz. Ancak statik bir sayfa yaptnzda ve bir sunucu ile iletiiminiz yoksa buraya mailto:birisi@example.com gibi bir eposta adresi girerseniz, form ierikleri ziyaretinin bilgisayarndaki varsaylan eposta istemcisi aracl (Outlook, Outlook Express, Thunderbird, vb) ile gsterdiiniz eposta adresine gnderilir. Dreamweaver formlar iin genel tipte isimler oluturur. Siz her form oluturduunuzda bu formlarn isimleri saysal olarak otomatik bir ekilde artar (form1, form2, vb). Btn form isimlerinin benzersiz olmas ve ayrca zel karakter iermemesi gerekir. Form isimleri nemli tanmlayclardr (identifier); zellikle de bir sayfada birden fazla form varsa veya form araclyla istenen ya da toplanan bilgileri ieren bir veritaban kullanyorsanz. Form isimleri ayrca, JavaScript gibi script dilleri araclyla formlar kontrol etmek iin de kullanlr. Tablo, formun yerleim dzenini gelitirir. Tablo kullanmak, etiketlemek zere metin ya da resimlerin form alanlaryla hizalanmasn kolaylatrr. Bir formun iine bir tablo ya da bir tablonun iine bir form yerletirebilirsiniz. Ama burada sz konusu tablo, formu tamamen kapsamal ya da form tarafndan tamamen kapsanmaldr.
98
Fieldset iletiim kutusu alacaktr. ine balnz yazn ve Tamam tuuna basn. Bir alan kmesi, kullanabilecei btn alan kaplayacak kadar geniler. Formlarda olduu gibi alan kmesini bir tabloya veya bir tabloyu bir alan kmesine yerletirmek mmkndr. Ama tablo alan kmesini tamamen kapsamal ya da alan kmesi tarafndan tamamen kapsanmaldr. Vermi olduunuz alan bal form iinde gzkecek ve kullanclarnzn formunuzu kolay anlamas iin kullanlacaktr. Bu nedenle alanlarnza aklayc balklar verin.
99
Herhangi bir form nesnesi eklediinizde Eriilebilirlik zellikleri penceresi alabilir. Bu pencere formlarnzn eriilebilir olmas iin kullanabileceiniz zellikleri barndrr.
100
Bu pencerede ilgili alanlar doldurabilir yada ptal seeneine tklayarak devam edebilirsiniz. Eer Dreamweaver Girdi Etiketi Eriebilirlik Nitelikleri iletiim kutusunu otomatik olarak amazsa, form nesneleri iin eriilebilirlik zelliklerini etkinletirmeniz gerekebilir. Bunun iin Dzen > Tercihler komutunu sein. Eriebilirlik kategorisine gein ve Form nesneleri onay kutusunu iaretleyin.
101
Sonra da Tamam dmesine tklayn. Eer her seferinde bu iletiim kutusu ile uramak istemiyorsanz bu zellii kapatmak iin bu sefer ilgili alanlardaki iareti kaldrmanz yeterli olacaktr. Formunuza tek satrl metin alann ekledikten sonra ona ait zellikleri deitirebilirsiniz. Bunu yapabilmek iin metin kutusuna tkladktan sonra zellikler penceresi iinde zelliklerini belirleyin.
En soldaki kutucuk iinde yer alan textfield kelimesi yerine bu alan form iinde esiz (tekil) olarak niteleyecek bir ismi zel karakterler olmadan ve Trke karakterleri() kullanmadan yazn. Karakter alan bu metin kutusunun ayn anda ka karakteri gsterebileceini ayarladnz seenektir. Maks kar, bu metin kutusunun iinde en fazla ka karakter barndrabileceini belirttiiniz alandr. Bu alandaki rakam ile karakter alanndaki rakamlar birbirinden farkl olabilir. rnein bir metin kutusu ayn anda 10 karakter gsterebilirken, iinde en fazla 20 karakter bulundurabilir. Bu durumda bu alan dolduran ziyaretiler yazmaya devam ederken yazlar sola doru kayacaktr. Yazm seenei bu alann tek satrl m yoksa ok satrl m olacan setiiniz alandr. Burada ayn zamanda bu alan bir ifre alan olarak da gsterebileceiniz bir seenek bulunmaktadr. ifre seeneini seerseniz metin alannn iine yazlan yazlarn yerinde noktalar gzkecektir. Balang deeri, seenei ile bu alann, sayfa ilk yklendiinde hangi metinle dolacan seebilirsiniz.
102
Varsaylan durumda her grup (Radyo Grubu) en az iki radyo dmesi ierir. stediiniz kadar radyo dmesi ekleyebilir, silebilirsiniz. Girileri seip ok tularnn yardmyla listede yukarya ya da aaya doru tayarak girilerin sralamasn da deitirebilirsiniz. Bir form gnderildiinde buradaki deerler, sunucuda formu ileyen scripte gnderilir. Ziyaretinin hangi seenei iaretlediini anlayabilmek iin her bir radyo dmesine farkl bir deer verdiinizden emin olun.
103
Eer ziyaretinin sadece tek bir seenek iaretlemesini istiyorsanz, bundan sonraki uygulamada olduu gibi radyo dmelerinden faydalanrsnz. Onay kutusu eklemek iin Ekle ara ubuunun Formlar kategorisinde yer alan Onay kutusu dmesine tklayn.
104
Eklediiniz form nesnesine tkladnzda karnza bununla ilgili zellikler denetisi kacaktr.
Tr alannda bu form elemannn Men m Liste mi olacan seebilirsiniz. Liste olan nesneler ayn anda birden fazla ierii gsterebilirler ve bunlarn iinden birden fazlas ayn anda seilebilir. Ykseklik deeri eer tr olarak Listeyi seerseniz aktif olacaktr. okluya izin ver seenei de yine eer tr olarak Listeyi seerseniz aktif olacaktr. Liste deerleri butonu ile bu listenin iini dolduracak deerleri seebilirsiniz. Balangta seili seenei ile sayfanz yklendiinde formunuzun iinde balang olarak hangi deerin seili olduunu ayarlayabilirsiniz
105
ok satrl metin alanlar ile tek satrl metin olanlarnn zellikleri birbirine benzemektedir. ok satrl metin alanlarnda ek olarak Sar(wrap) seenei ve satr says seenei bulunmaktadr. Sar (wrap) mensndeki seenekler unlardr: Varsaylan(Default), Kapal(off), Sanal(virtual) ve Fiziksel(physical). Varsaylan seenei, taraycnn varsaylan ayarn kullanr. Yazm alannda ok Satrly iaretlediinizde otomatik olarak bu seenek ayarlanr. Kapal seenei, metnin blnerek bir sonraki satra gemesini engeller. Metin, siz Return ya da Enter tuuna basana kadar ayn satrda devam eder. Ziyareti yazarken metin grnebilir alann snrn atnda sola doru kayar. Sanal seenei, metni blerek bir sonraki satrdan devam etmesini salar. Ama szck sarma zellii, form gnderildii zaman verilere uygulanmaz. Fiziksel seenei, metni blerek bir sonraki satrdan devam etmesini salar ve szck sarma zellii, form gnderildiinde verilere uygulanr.
Buton Eklemek
Formlarda, biri form verisini gndermek (Gnder-Submit), dieri de formu temizlemek (TemizleReset) iin olmak zere genellikle iki dme kullanlr. Gnder(Submit) dmesi Web taraycsna veriyi gndermesi gerektiini bildirir. Temizle(Reset) dmesi ise sayfadaki alanlarda bulunan btn bilgileri siler. Temel arama ilevi iin oluturulan bir formda genellikle sadece tek bir Gnder(Submit) dmesi bulunur. Bu da ounlukla Ara ya da Git eklinde adlandrlr. Sayfanza bir buton eklemek iin yapmanz gereken imlecinizi formunuzun iinde uygun bir yere koyduktan sonra, formlar sekmesinden buton elemann eklemektir. Butonun ilev zelliklerini deitirebilirsiniz. Bir butonun Gnderme, silme yada grevsiz zelliinde olmasn ve iinde yazacak olan balk yazsn zellikler denetisinden ayarlayabilirsiniz.
106
Byle durumlarda Web taraycsnda grntlenmeyen gizli alanlardan faydalanabilirsiniz. Gizli alanlar (hidden fields) genellikle, formun ilenmesi iin (isim, sipari numaras ya da satlan rnle ilgili baka bir bilgi almak, form bir e-posta adresine gnderilecekse bir e-posta adresi ve konu bal eklemek, formu doldurduktan sonra ziyaretilerinizi ynlendirmek istediiniz bir sayfann URLsini dahil etmek, bilgileri bir formdan baka bir forma aktarmak ya da belirli alanlarn ziyareti tarafndan doldurulmasn salamak iin) belirli bilgiler gerektiinde sunucu tarafl scriptlerle birlikte kullanlr. Byle durumlarda gizli alanlarn ilenebilmesi iin sunucu tarafl scriptler (server side scripting) gerekir. Sunucu tarafl scriptlerin gerekmedii ya da kullanlamad durumlarda gizli alanlarla birlikte JavaScript de (istemci tarafl script olarak da bilinir) kullanlabilir. stemci tarafl script (client side scripting) kullanmnda scriptleri ziyaretinin Web taraycs (istemci) iler. Gizli alan eklemek iin Formlar sekmesinden gizli alan butonuna basmalsnz.
107
BLM
ablonlar
ablon Oluturmak Bir ablona Dzenlenebilir Alanlar Eklemek Belirli Bir ablonu Temel Alan Sayfalar Hazrlamak ablonda Deiiklik Yapmak
Blm 9 ablonlar
109
ablon (template), dier belgeleri oluturmak iin temel olarak kullanabileceiniz bir belgedir. ablon kullanlarak oluturulan her belge, bu ablonla ayn yerleim dzenini ve yapy kullanr. Bir ablon oluturulurken, bu ablonu temel alan belgelerde dzenlenebilir durumda olmas gereken alanlarn gsterilmesi gerekir. ablonun dier ksmlar kilitli durumdadr ve ebeveyn ablon tarafndan kontrol edilir. ablonlar, birden fazla sayfann yapsn ve ieriini gncellemek iin kullanlabilecek hzl bir yol sunmalar asndan ktphane elerine benzer. ster pek ok blmden oluan byk bir Web siteniz, ister ortak bir tasarm kullanan birden fazla sayfanz olsun, bir ablon oluturarak prodksiyon srecini hzlandrabilirsiniz. Bir ablon kullanrsanz, birka dakika iinde birden fazla sayfada deiiklik yaparak sitenizin grnmn deitirebilir ya da gncelleyebilirsiniz. Sitenin belirli bir blmn hazrlayan bir ekiple altnz durumlarda ablonlar ok faydal olur. Web tasarmcs bir ablon oluturabilir ve sayfann dzenlenebilecek olan ksmlarna yer tutucular ekleyebilir. Sayfann genel tasarm kilitli durumda kalr. Ekip yeleri, bir ablonu temel alp Adobe Dreamweaver ya da Adobe Contribute kullanarak sayfalar hazrlayabilir ve dzenleyebilirler. (Adobe Contribute, Web sitelerini oluturma konusunda ok az deneyime sahip olan ya da hi deneyimli olmayan ierik editrleri gibi teknik konularla ilgilenmeyen kullanclara ynelik bir programdr.) ablonlarn avantajlar iki durumda net olarak ortaya kar: Bir blm ya da sayfa grubunda ayn tasarmn ve yerleim dzeninin kullanlmas gereken durumlarda ya da sayfann grnmnn tasarmc tarafndan oluturulduu, ama sayfa ieriklerinin ierik editrleri tarafndan eklendii durumlarda.
ablon Oluturmak
ablonlar, sayfalarn yerleim dzenini ve tasarmn tanmlar. Bir ablon olutururken uygulamanz gereken ilk adm, genellikle sayfa tasarmnn hazrlanmasn ierir. ablonlarla tasarm yaparken ncelikli olarak bo bir HTML sayfas oluturmal ve bu sayfay ablon olarak kayt etmelisiniz (Dosya > ablon Olarak Kayt Et). Bu seenekten sonra karnza kan iletiim kutusundan ablonu kaydetmek istediiniz siteyi seebilirsiniz. Dreamweaver otomatik olarak ablona bir isim verecektir. Siz isterseniz bunu deitirebilirsiniz. ablonun ismini deitirmek istiyorsanz, yeni ismi Save As (Farkl Kaydet) metin alanna yazn. ablonun ismi sadece ekibiniz ve sizin iin bir referans niteliindedir. Bu ismi sitenizin ziyaretileri grmeyecektir. ablonlarnz iin mmkn olduu kadar aklayc isimler kullanmaya gayret edin. Kaydet dmesine tklayarak iletiim kutusunu kapatn. Dreamweaver Balantlar Gncelleyeyim mi? diye soran bir uyar kutusu grntlediinde Evet dmesine tklayn. Balantlarn gncellenmesi, Dreamweavern balantlara ve resimlere giden yollar doru olarak muhafaza etmesini salayacaktr. Artk ablonunuz sitenize eklendi ve .dwt uzantsyla Templates klasrne kaydedildi. Templates adnda bir klasr mevcut deilse, Dreamweaver bu klasr otomatik olarak ekler. Templates klasrn grmek iin, Dosyalar panelindeki Yenile (Refresh) dmesine tklamanz gerekebilir. Bu dosyay bir sonraki uygulamada kullanmak zere ak brakn.
110
Blm 9 ablonlar
Bir ablonun oluturulmasnda ikinci adm, bu ablon temel alnarak oluturulan belgelerde dzenlenebilir durumda olmas gereken alanlar tanmlamaktr. (Dzenlenebilir alanlar, belgenin ablon temel alnarak oluturulan sayfalardaki deitirilebilen blmleridir.) Kural olarak, bir ablondaki btn alanlar balangta kilitli durumdadr. ablonu kullanan sayfalardaki bilgileri deitirmek istiyorsanz, dzenlenebilir alanlar ya da blgeler oluturmanz gerekir. Birok Web sitesinde, bu blgeler genellikle ierik alanlardr. ablonda aka dzenlenebilir olarak tanmlanmayan her ey, ablonu temel alan sayfalarda kilitli durumdadr. Orijinal ablonu dzenlerken hem dzenleyebilir, hem de kilitli alanlarda deiiklik yapabilirsiniz; ama ablon kullanlarak hazrlanm olan bir sayfada sadece dzenlenebilir blgelerde deiiklik yapabilirsiniz. Bir ablona dzenlenebilir alan eklemek iin ablon iinde ierik gelitiriciler tarafndan dzenlenebilir alana imlecinizle tklamanz yada bu bir tablo yada hcre ise bu nesneyi semeniz gereklidir. Bu seimi yaptnz alan dzenelenebilir alan olarak atandnda ablondaki deiikliklerden etkilenmeyecektir. Sadece bu alann dndaki blgeler orijinal ablon deitiinde deiecektir. stediiniz alan setikten sonra yapmanz gereken Ortak sekmesinden ablonlar butonu altndaki Dzenlenebilir Blge butonuna basmaktr.
Bylece imlecinizin bulunduu yer yada tablo artk dzenlenebilir bir alan olarak kullanlacaktr. Dzenlenebilir alanlarnza anlaml bir isim verirseniz sonraki aamalarnzda iiniz kolay olacaktr. Dzenlenebilir alan balklar grnmez nesnelerdir yani ziyaretiler tarafndan grnmezler.
Blm 9 ablonlar
111
BLM
10
Siteyi Ynetmek
Dosyalar Panelini Kullanmak
113
ir Web sitesi gelitirme sreci genellikle planlama amasyla balar. Bu aamada siteyle ilgili genel fikri oluturur, site dosyalarn ve gezinti yapsn hazrlar, ierii toplar, ayrca sitenin grnmn ve ziyaretiler zerinde nasl bir etki yaratmak istediinizi tasarlarsnz. Bu hazrlk admlar genellikle Dreamweaverda almaya balamadan nce gerekleir. Planlama aamasn retim aamas takip eder. Web gelitirme srecinin hayat bileenlerinden biri olan site ynetimi, bir sitenin srekli olarak kullanlabilmesi asndan ok nemlidir. Dreamweaver, yerel kk klasrnzde ve uzak sunucuda bulunan site dosyalarnn devamlln salayarak Web sitenizi kolayca gncellemenizi ve kontrol etmenizi salayan pek ok ynetim arac sunar. Dreamweaver, dosyalarnz izlemek iin site tanmlarn kullanr ve burada devamllk salama ilemlerini (dosyalarn ve klasrlerin tanmas, eklenmesi, silinmesi gibi) gerekletirmek zere site aralarn kullandnzda gncellemelerin otomatik olarak yaplmasn salar. Bir ekibin i akn ynetmek, ekip almasn ve ibirlii abalarn koordine etmeye ynelik eitli aralarla gerekletirilebilir. Dreamweaver araclyla birden fazla Web sitesini ynetebilir, site ayarlarn ieriye ve darya aktarabilir, hatta site hazrlamak zorunda kalmadan sunucularla balant kurarak hzl aktarma ilemleri gerekletirebilirsiniz.
114
Yerel dosyalarnz Dosyalar panelinin sadaki blmesinde (Yerel Grnm) yer alr. Dosyalar panelini genilettikten sonra Geniletme/Toparlama dmesine tklayarak tekrar Dosyalar panel grubu haline getirebilirsiniz.
115
Bu aamada Dosyalar panel penceresinin sol blmesinde (Uzak Grnm) bir Yardm metni grntlenecektir. Bu metinde Web sunucunuzdaki mevcut dosyalar grebilmek iin bir uzak site tanmlamanz gerektii belirtilir. Blmelerin bykln, onlar ayran ubuu srkleyerek ayarlayabilirsiniz. Dosyalar panelindeki temel aralar, Dosyalar ara ubuu zerinde yer alr. Gster mens, tanmladnz btn siteleri grntler ve bilgisayarnzdaki dier dosyalara erime ve uzak sitelere hzl bir ekilde balanma imkn salar. Belirli bir siteyi amak iin menden ilgili siteyi semeniz yeterlidir. Uzak ana bilgisayara balanma dmesi, uzak siteye balanmanz ya da bu balanty kesmenizi salar. Henz bir uzak site tanmlamadnz iin bu dmeye tkladnzda Site Tanmlamas iletiim kutusu alr. Varsaylan durumda Dreamweaver bir uzak FTP sitesiyle kurulan balanty, 30 dakikadan fazla bo kalma durumunda keser. Yenile dmesi, beklediiniz eyi yapar. Yani yerel ve uzak dizin listelerini tazeler. Dosya listelerinde yaplan btn deiiklikler Yenile dmesine tklandktan sonra grntlenir. dmeden oluan grup, farkl grnm seenei sunar: Site Dosyalar, Test Sunucusu ve Site Elemi. Etkin grnm vurgulanr. Burada varsaylan grnm seenei Site Dosyalardr. Dosyalar Al dmesi, seili dosyay ya da dosyalar uzak siteden yerel klasrnze kopyalar. Bunu yaparken mevcut yerel kopyalar siler. Dosyalar Koy dmesi, seili dosyay ya da dosyalar yerel klasrden uzak siteye kopyalar. Bunu yaparken mevcut uzak kopyalar siler. Dosyalar Teslim Al dmesi, seili dosyay ya da dosyalar uzak sunucudan yerel klasrnze kopyalar. Bunu yaparken mevcut kopyalar siler. Dosya daha sonra sunucuda alnd (checked out) eklinde iaretlenir. Teslim Al/Teslim Et zellii Web sitesinde bir ekiple ibirlii iinde alrken ok faydal bir aratr. Bir dosyann bu ekilde iaretlenmesi durumunda Dreamweaver hi kimsenin bu dosyay dzenlemesine izin vermez. Teslim Al dmesi seili dosyay ya da dosyalar yerel klasrden uzak sunucuya kopyalar. Bunu yaparken mevcut uzak kopyalar siler. Uzak sunucudaki dosya dier elemanlar tarafndan dzenlenebilir. Dosyann yerel klasrnzde (genellikle bilgisayarnzda) bulunan kopyas salt okunur hale gelir ve siz onu almadka (Teslim Et) dzenlenemez. Senkronize Et seenei dosyalar yerel ve uzak klasr arasnda senkronize hale getirir. Men seenekleri olan Dosya, Dzen, Grnm ve Site, geniletilmi Dosyalar panelinin sa st kesindeki balam mensnde (Macintoshta) veya geniletilmi Dosyalar panelinin sol st tarafnda (Windowsta) yer alr. Balam mens hem Macintoshta, hem de Windowsta Files panelinin daraltlm grnmnde (Files panel grubunun sa st kesinde yer alr) bu menlere eriim salar. Dosyalar panelinde iken dosyalar bir klasrden dierine tadnzda Dreamweaver bu dosyalara olan linkleri otomatik olarak dzenlemek iin sizden izin ister. Bu durumda Gncelle seeneini seerek bu dzenleme iin izin vermelisiniz.
116
Daha nce bir yerel site oluturmutunuz. Bu, sabit diskinizde bulunan ve siteniz iin gereken btn klasrleri ve dosyalar ieren bir klasrd. Fakat kendi sitelerinizi gelitirirken, retim aamasn tamamladktan sonra Web sayfalarnzn ziyaretiler tarafndan grlebilmesi iin yerel dosyalarnz bir uzak siteye kopyalamanz gerekecektir. Uzak site genellikle hostunuz, Web yneticiniz ya da istemciniz tarafndan belirlenen bir sunucuda bulunur. Bu site ayrca yerel bir ada da bulunabilir. Siteyi bir canl sunucuya aktarmak (ideali, bu i iin sitenin bulunduu sunucuyu kullanmaktr) ve her eyin beklendii ekilde altn grmek iin bu siteyi test etmek iyi olacaktr. Siteyi farkl bir konuma aktardnz iin baz eylerin nceki konumda olduu gibi almama ihtimali her zaman mevcuttur. Bu tr sorunlarn olup olmadn, siteyi ziyaretilerin ya da siteyi grmesi istenen kiilerin kullanmna amadan nce belirlemek ve eer varsa bu sorunlar zmek en iyisidir. Site > Siteleri Ynet komutunu sein. Alan menden dzenleme yapmak istediiniz siteyi sein ve Dzenle butonuna basn. Alan pencerede gelimi seeneini sein. letiim kutusunun sol tarafndaki Kategori listesinden Uzak Bilgilerini sein. Site Tanmlamas iletiim kutusunun Uzak Bilgileri blmnde, Dreamweavera hangi uzak siteye balanmas gerektiini ve bu uzak sitenin niteliklerini bildirmek iin gereken bilgileri girersiniz. Geerli seenek Yok (None) tur. Burada eer sunucunuz yerel anzda ise yerel/A seeneini semelisiniz. Eer bir FTP sunucusuna balanacaksanz o zaman FTP seeneini semelisiniz. Aadaki admlarda uzak FTP (File Transfer Protocol) sitesini taklit etmek iin bir klasr oluturacaksnz. Bu ilem, bir uzak sunucuya erimek zorunda kalmadan Dosyalar Al ve Dosyalar Koy fonksiyonlaryla ilve site ynetimi fonksiyonlarn kullanmanz salar. FTP eriimi, uzak bir sitedeki dosyalar almak ya da bu siteye dosya gndermek iin sk kullanlan bir yntemdir. Bu blm tamamlarken bir uzak site eriiminiz olamayabilir. Bu yzden aadaki bilgiler sadece referans olmas amacyla verilmitir. Bu seenekleri doru olarak ayarlamak iin a yneticinize ya da sunucu firmanza bavurun. Aadaki seeneklere, Site Tanmlamas iletiim kutusunun Uzak Bilgiler blmndeki Eriim mensnden FTPyi seerek ulaabilirsiniz. FTP host: Web sunucunuzun host ad (adobe.com gibi). Ana Bilgisayar Dizini: Uzak sitede, ziyaretiler tarafndan grnen belgelerin sakland dizin (site root yani sitenin kk dizini olarak da bilinir. Oturum A ve ifre: Sunucudaki kullanc adnz ve ifreniz. Kaydet onay kutusunun iaretini kaldrrsanz, uzak siteye her balannzda sizden ifre girmeniz istenir. Pasif FTP Kullan: Bu seenei, bilgisayarnzla sunucu arasnda bir gvenlik varsa kullanrsnz. Bu seenek de varsaylan durumda iaretli deildir. Gvenlik Duvar: Bu seenei, uzak sunucuya bir gvenlik duvar arkasndan balanyorsanz kullanrsnz. Bu seenek de varsaylan durumda iaretli deildir. Gvenlik duvar ayarlar Dreamweavern Tercihler iletiim kutusunda bulunur. Gvenlik Duvar Ayarlar dmesine tklayarak buraya hemen ulaabilirsiniz.
117
Gvenli FTP Kullan (SFTP): Bu seenei, bir SFTP sunucunuz varsa kullanrsnz. SFTP sunucusu gvenli balantlar oluturmak iin ifreleme zelliini kullanr. Bu seenek de varsaylan durumda iaretli deildir. Bu balanty saladktan sonra sunucuya dosyalarnz atmak iin Yukar mavi oka (Dosyalar koy), sunucudan dosyalar almak iin ise aa yeil oka (dosyalar al) basmalsnz.