A-PDF Split DEMO : Purchase from to remove the watermark. Resimlerle Çalışmak

Ebat: px
Şu sayfadan göstermeyi başlat:

Download "A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark. Resimlerle Çalışmak"

Transkript

1 A-PDF Split DEMO : Purchase from to remove the watermark 5 Resimlerle Çalışmak Resimler izleyicilerinizin dikkatini çekmede ve Web sitenizde vermeyi düşündüğünüz mesajı etkin bir şekilde iletmede önemli bir rol oynayabilir. Bu derste Yoga Sangha proje sitesi için oluşturduğunuz sayfalara çeşitli resimler ekleyeceksiniz. Süreç boyunca resimler için kullanılan farklı dosya formatlarını tanıyacak, CSS aracılığıyla resimlerin konumlarını nasıl kontrol edeceğinizi ve resim öğelerini metinlerle nasıl bir araya getireceğinizi öğreneceksiniz. Macromedia Dreamweaver 8 deki özellikler, sitenizde kullandığınız resimler üzerinde önemli ölçüde kontrol imkânı sağlar. Böylece resim özelliklerini Dreamweaver içinden hızlı bir şekilde değiştirebilir ve resimleri harici bir resim editöründe açabilirsiniz. Assets paneli, sitenizde kullandığınız ya da kullanmanız gereken bütün resimler için kataloglar hazırlamanızı sağlayarak resimlerin yönetimini basitleştirir. Bu derste sayfalarınıza metinlerle birlikte resim eklemeyi öğrenirken buradakine benzeyen bir sayfa oluşturacaksınız.

2 Bu dersin sonunda elde edilen çalışmayı görmek isterseniz, Lesson_05_Graphics klasöründeki Completed alt klasöründe yer alan index.html dosyasını açın. Neler Öğreneceksiniz? Bu derste şunları öğreneceksiniz: Resim formatlarını tanıyacak ve aralarındaki farkları göreceksiniz. Bir sayfaya çeşitli resimler ekleyeceksiniz Resimlerinizin özelliklerinde değişiklik yapacaksınız Bir sayfadaki resimlerin konumunu değiştireceksiniz Resimlerinize isim ve alt nitelikleri atayacaksınız Assets panelini kullanarak resimleri yöneteceksiniz Metnin belirli bir bölümünü bir resmin etrafına saracaksınız Resim yer tutucularını kullanacaksınız Temel resim düzenleme araçlarını kullanarak resimlerde ayarlamalar yapacaksınız Metinleri resimlere göre hizalayacaksınız Yaklaşık Süre Bu dersin tamamlanması yaklaşık 2 saat sürecektir. Ders Dosyaları Ortam Dosyaları: Lesson_05_Graphics/Images/green-studio.jpg Lesson_05_Graphics/Images/studio-om.jpg Lesson_05_Graphics/Images/teaching.jpg Lesson_05_Graphics/Images/ys_bkg_main.gif Lesson_05_Graphics/Images/yoga_sangha-title.jpg Başlangıç Dosyaları: Lesson_05_Graphics/index.html Lesson_05_Graphics/about/studio.html Tamamlanmış Proje: Lesson_05_Graphics/Completed/index.html 170 DERS 5

3 Bir Arka Plan Resmi Kullanmak Buradaki uygulamada, belirli bir sayfaya bir arka plan resmi ekleyeceksiniz. Arka plan resmi olarak sayfanızın üzerinde tarayıcı penceresinin genişliği ve yüksekliği boyunca tekrarlanarak döşenen küçük bir resim kullanabilirsiniz. Döşenmiş bir arka plan resminin sayfalarınızdaki kaydırma çubuklarının görüntüsü (ya da bunların olup olmaması) üzerinde herhangi bir etkisi yoktur. Ayrıca arka plan resmi olarak daha büyük resimler kullanabilir ve bunların yerleşimini, yatay olarak mı yoksa düşey olarak mı veya her iki şekilde de mi döşeneceklerini ya da döşenip döşenmeyeceklerini kontrol etmek için CSS ten (Cascading Style Sheets) faydalanabilirsiniz. Arka plan resimleri, CSS desteği olmayan eski Web tarayıcılarında otomatik olarak döşenirler. Sayfalarınız için hem bir arka plan rengi, hem de bir arka plan resmi tanımlayabilirsiniz. Yavaş bağlantılarda ya da eski yavaş Web tarayıcılarında önce arka plan rengi görüntülenebilir. Bu yüzden, bir arka plan resmi kullanmayı düşünüyor olsanız bile bu yaklaşımı kullanmak iyi bir fikirdir. Arka plan resmi yüklendikten sonra bu resim ekranda kamaya devam ederek arka plan renginin üzerini kaplar. Bu uygulamada, önceki derslerde öğrendiğiniz beceri ve teknikler kullanılarak oluşturulan XHTML dosyalarıyla çalışacaksınız. Fazladan uygulama yapmak isterseniz, başlangıç sayfalarını yol gösterici olarak kullanarak bu dosyaları yeniden oluşturabilirsiniz. 1. Lesson_05_Graphics klasöründeki index.html dosyasını açın. CSS Styles panelindeki All Rules listesini kullanarak sangha.css stil sayfasından body kuralını seçin ve panelin alt kısmında yer alan Edit Style düğmesine tıklayın. Edit Style düğmesi Bu index.html belgesi, önceki derste oluşturduğunuz sangha.css stil sayfasını kullanmaktadır. Bir arka plan resminin sitedeki diğer belgelerde de kullanılabilmesini Resİmlerle Çalışmak 171

4 sağlamak için ilgili stil sayfasının düzenlenmesi gerekir. body kuralı, belgenin içeriğinin bulunduğu <body> etiketini yeniden tanımlar. Eski siteler üzerinde çalışırken nitelikleri doğrudan <body> etiketinin içinde tanımlayan belgelerle karşılaşabilirsiniz. Arka plan ve bağlantı renklerini tanımlamak için kullanılan bu yöntem artık benimsenmemektedir ve bu yöntemin kullanılmasından kaçınarak şimdiki uygulamada göreceğiniz gibi stil sayfalarının kullanımı tercih edilmelidir. Page Properties iletişim kutusunu kullanarak bir arka plan resmini doğrudan tek bir sayfaya eklemeniz de mümkündür. Bu yöntemde, sadece uygulandığı belgede kullanılabilen bir dahili stil oluşturulur. Bunun için Modify > Page Properties komutunu ve ardından Appearance kategorisini seçin. Arka plan resminin yerini bulmak için Browse düğmesini kullanabilir ve arzu ederseniz bir yineleme (Repeat) yöntemi seçebilirsiniz. Page Properties iletişim kutusuna hızlı bir şekilde erişmek için Cmd+J (Macintosh ta) ya da Ctrl+J (Windows ta) klavye kısayolunu kullanın. Ayrıca doğrudan Appearance kısmını kullanarak sayfanın kenar boşluklarını da kontrol edebilirsiniz. Kenar boşluğu miktarının arka plan resmine bağlı olduğu durumlarda bu özellik işinize yarayabilir. Örneğin bu uygulamada üzerinde çalıştığınız belge için bir kenar boşluğu tanıyarak metnin sayfanın sol tarafındaki düşey çubuğun üstüne gelmesini engelleyebilirsiniz. Ayrıca body etiketinin margin niteliğini kullanarak sayfaların kenar boşluklarını harici stil sayfalarında da tanımlayabilirsiniz. 2. Background kategorisinde Background image metin alanının yanında bulunan Browse düğmesine tıklayın. Lesson_05_Graphics klasörünün Images alt klasöründe yer alan ys_bkg_main.gif resmini bulun. Bu resmi sayfanın arka planı olarak tanımlamak için Choose (Macintosh ta) ya da Select (Windows ta) düğmesine tıklayın. Background kategorisi otomatik olarak seçili durumda olabilir, çünkü body etiketine bir nitelik, yani soluk sarı arka plan rengi (#FFFFCC) zaten uygulanmış durumdadır. 172 DERS 5

5 Bir yol adı ya da yolun kendisi, ilgili dosyanın konumunu tanımlar. Şu anda Background image metin alanında ys_bkg_main.gif resmine giden yol görüntülenmektedir; bu yolun gösterdiği konum, sangha.css belgesine göre tanımlanmıştır. Bir arka plan resmini eklerken dosyanızı kaydetmediyseniz, metin alanında resmin sabit diskinize göre tanımlanan yol adının tamamı görüntülenir. Siz dosyanızı kaydedene kadar Dreamweaver bu tür referanslar oluşturamaz. Bu nedenle geçerli bir bağlantı yerine resmin sabit diskinizdeki konumuna bağlı bir yol adı kullanılır. Dosya kaydedildiğinde yol adı güncellenerek yerini resmin, kendi içinde bulunduğu belgeye bağlı konumuna bırakır. Bununla birlikte, dosyayı, herhangi bir resmi (hatta arka plan resimlerini) aktarmadan önce kaydetmek en iyisidir. Sabit diskinize göre tanımlanan yol adları uzak sunucuda işe yaramaz. Sayfanızı kaydetmeden resim eklediğinizde bağlantısı kopmuş resimler kullanma riski söz konusudur. Select Image Source iletişim kutusunda seçtiğiniz resim yerel sitenizin dışında bir yerdeyse Dreamweaver bir uyarı penceresi görüntüler ve size dosyayı sitenize kopyalama seçeneğini sunar. Sitenizde kullandığınız sayfalar ve elemanlar (HTML, resimler, multimedya vs) genellikle yerel kök klasörünüzde bulunur. Mutlak yollar (absolute paths) adı verilen teknik sayesinde yerel kök klasörünüzde bulunmayan ama Internet te (kendi sitenizde ya da başka bir yerde) belirli bir konumda bulunan elemanları da kullanabilirsiniz. Ders 4 te gördüğümüz bu teknik banner larda sık sık kullanılır. Bu tür öğeler Dreamweaver ın belge penceresinde görüntülenmediği için bunları görebilmek için sayfanızı ya da sayfalarınızı Web tarayıcınızda önizlemeniz gerekir. Arka plan resimlerinizi Macromedia Fireworks veya Adobe Photoshop gibi bir resim editöründe oluşturabilirsiniz. Büyük resimlerin sayfanın boyutunu ve indirme süresini ciddi ölçüde artırabileceğini aklınızdan çıkarmayın. Bu yüzden mümkün olan her yerde daha küçük resimler kullanmaya çalışın. Sayfalarınız ne kadar küçük olursa, yüklenmeleri de o kadar hızlı olur ve ziyaretçilerinizin sitenizde kalması, gezinmesi ve daha sonra sitenizi tekrar ziyaret etmesi olasılığı da yine aynı oranda artar. Eğer birden fazla arka plan resmi arasından seçim yapacaksanız, Apply düğmesini kullanarak arka plan resmini Page Properties iletişim kutusunu kapatmadan sayfanızda görebilirsiniz. Bir arka plan resmini silmek istiyorsanız, Page Properties iletişim kutusunu açıp ilgili dosyanın adını Background image metin alanından silebilir ya da CSS panelinin Properties listesinde background-image özelliğini bulup bunun değerini değiştirebilir ya da silebilirsiniz. Resİmlerle Çalışmak 173

6 3. Repeat menüsünden repeat-y yi seçin ve OK düğmesine tıklayarak Page Properties iletişim kutusunu kapatın. Yaptığınız değişiklikler belgeye uygulanacak ve ys_bkg_main.gif arka plan resmi belge penceresinde düşey olarak döşenecektir. Belge penceresini sağa doğru, arka plan resminin bittiği noktayı geçecek şekilde genişletirseniz, son derste uyguladığınız arka plan renginiz görebilirsiniz. Aşağıda gördüğünüz gibi arka plan resminin repeat (tekrarlama) özelliğini kontrol etmek için kullanabileceğiniz çeşitli seçenekler mevcuttur. repeat-y seçeneği, seçilen arka plan resmini düşey olarak döşer repeat-x seçeneği, resmi yatay olarak döşer repeat seçeneği, resmi hem düşey, hem de yatay olarak döşer no-repeat seçeneğinde resim döşenmez Siz bir repeat özelliği tanımlamazsanız, varsayılan durumda arka plan resimleri hem yatay, hem de düşey olarak döşenir. Bununla ilgili diğer seçenekler şunlardır: Attachment seçeneği arka plan resminin sabitlenip, sabitlenmeyeceğini veya sayfanın geri kalan kısmıyla birlikte kaydırılıp kaydırılmayacağını belirlemenizi sağlar. Bu özellik tekrarlanmayan arka plan resimlerinde kullanılır. Horizontal position ve Vertical position seçenekleri arka plan resminin konumunu kontrol etmenizi sağlar. Konum ayarlama işlemi, yatay olarak yerleştirme için left, center ya da right seçeneklerinin, düşey olarak yerleştirme için de top, center ya da bottom seçeneklerinin ayarlanmasıyla veya sayısal değerler ve piksel (pixels) gibi bir ölçü birimi aracılığıyla tam bir konum tanımı yapılarak gerçekleştirilir. 174 DERS 5

7 Sayfaya Resim Yerleştirmek Resimler, metin gibi diğer içerik bileşenleriyle birlikte doğrudan belgenin gövde kısmına yerleştirilebilir. Bu uygulamada belgelerinize resim eklemeye başlayacaksınız. Bu kitapta çalışacağınız bütün resimler, Internet te kullanılmak üzere GIF ve JPEG formatında kaydedilmiştir. Hiçbir resmi tekrar kaydetmeniz veya optimize etmeniz gerekmez. İnternet te Kullanılan Resim Formatları İnternet te en çok ve en yaygın şekilde kullanılan resim formatı GIF (Graphic Interchange Format) ve JPEG dir (Joint Photographic Experts Group). Resimleri Internet te kullanmak üzere kaydetme işlemi optimizasyon olarak adlandırılır ve Macromedia Fireworks ya da Adobe Photoshop gibi bir resim editörüyle gerçekleştirilebilir. Bir resmi GIF olarak mı yoksa JPEG olarak mı kaydedeceğinize karar verirken en yüksek resim kalitesini ve olası en düşük dosya boyutunu hedefleyin. Genel bir kural olarak, resimde düz renklerden oluşan geniş alanlar varsa ve renk harmanları yoksa veya çok azsa GIF formatını kullanın. GIF ler metinlerde, vektör tabanlı resimlerde, ayrıca sınırlı renge ve çok küçük boyutlara sahip resimlerde çok kullanışlıdır. GIF resimleri maksimum 8-bit renk modu kullanılarak kaydedilebilir. Bu modda sadece 256 renk görüntülenebilir. GIF dosyaları daha hızlı yüklenir, daha fazla optimizasyon seçeneğine sahiptir, ayrıca saydamlık ve animasyonu destekler. GIF dosyaları için.gif uzantısı kullanılır. Fotoğraflarda ya da ton aralığı büyük olan resimlerde JPEG formatını kullanmalısınız. JPEG formatı renk harmanlarını çok iyi görüntüleyebilir ve bir GIF resminin kesri kadarlık bir boyutta çok daha kaliteli fotografik resimler oluşturabilirsiniz. JPEG formatında resimler 24-bit modunda kaydedilir, bütün renkler korunur ve fazlalık verilerin atıldığı kayıplı bir sıkıştırma tipi kullanılır. JPEG kalitesi düştükçe, bahsettiğimiz atılan verilerden dolayı resme ait daha fazla bilgi kaybı olur. JPEG lerin kayıplı özelliğinden dolayı resmin kalitesini düşürmemek için bütün düzenleme işlemleri kaynak dosyası üzerinde yapılmalı ve tekrar JPEG olarak kaydedilmelidir. JPEG dosyalarının uzantısı.jpg dir. İnternet te PNG (Portable Network Graphic) adında üçüncü bir format daha kullanılır. PNG formatı, GIF in yerini alması için tasarlanmıştır; JPEG ve GIF formatlarının özelliklerini birleştirir. PNG dosyaları kayıpsızdır, GIF dosyalarından daha iyi sıkıştırır ve renk kontrolü açısından daha fazla seçeneğe sahiptir, ayrıca JPG gibi bütün renkleri koruyabilir ya da bir GIF dosyası gibi sınırlı sayıda renk kullanabilir. PNG JPEG lerin yerini alması için tasarlanmamıştır. PNG, animasyon desteğine sahip değildir ve eski Web tarayıcıları tarafından desteklenmez. Dosya uzantısı.png dir. Resİmlerle Çalışmak 175

8 1. Ekleme noktasını belgenin en üst kısmında bulunan Yoga Sangha başlığının önüne yerleştirin ve Return (Macintosh ta) ya da Enter (Windows ta) tuşuna basın. Ekleme noktasını yeni boş satırın içine yerleştirin. Insert araç çubuğunun Common kategorisinde yer alan Images menü düğmesine tıklayın ve Image ı seçin. Images: Image düğmesi Select Image Source iletişim kutusu açılacaktır. Bu iletişim kutusunu kullanarak sayfanıza resim ekleyebilirsiniz. Alternatif olarak Insert > Image komutu da kullanılabilir. Windows kullanıcıları için Preview images onay kutusu, göz atma esnasında tıkladığınız resimlerin küçük örneklerini görmenizi sağlayan kullanışlı bir seçenek sunar. Bu seçenek işaretlendiğinde resimler Select Image Source iletişim kutusunda boyutları, dosya büyüklükleri ve yaklaşık indirilme süreleriyle birlikte görüntülenirler. Macintosh ta Preview images onay kutusu yoktur. Eğer sütunlu görüntü modundaysanız, bir resmi seçtiğinizde Select Image Source iletişim kutusunun sağ panelinde resmin boyutları, dosya büyüklüğü ve yaklaşık indirilme süresiyle birlikte resmin önizlemesini görürsünüz. 2. Lesson_05_Graphics/Images klasöründeki yoga_sangha-title.jpg dosyasını bulun. Select Image Source iletişim kutusu çeşitli seçenekler içerir. Resim almak istediğiniz klasörü menüyü kullanarak (bu menü Macintosh ta isimsizdir ve Windows ta da Look In [Konum] olarak adlandırılmıştır) ve menü ile görünüm araçlarının alt kısmında yer alan dosya ve klasör bölümünden seçim yaparak tanımlayabilirsiniz. Macintosh kullanıcıları hiyerarşik bir görünümden faydalanarak farklı dosya ve klasör seviyelerine erişebilir. Windows ta görünümü belirli dosya tipleriyle sınırlandırmak için kullanılabilen bir Files of type (Dosya türü) menüsü ve seçilen dosyanın adını (normalde uzantı olmadan) görüntüleyen bir File name (Dosya adı) metin alanı vardır. URL metin alanında, seçilen resme erişmek için index.html belgesi tarafından kullanılacak yol görüntülenir. URL metin alanının altında Relative to menüsü yer alır ve varsayılan durumda Document olarak ayarlanmıştır. Relative to seçeneği Dreamweaver ın resimlere nasıl göndermede bulunacağını belirlemenizi sağlar: Belgeye bağlı olarak (Document seçeneği) ya da sitenin kök klasörüne bağlı olarak (Site Root seçeneği). Belgeye bağlı göndermelerde Dreamweaver resme ait yolu, HTML belgenizin resim dosyasına bağlı göreceli konumunu temel alarak oluşturur. Relative to menüsünde Document seçeneği 176 DERS 5

9 işaretlendiğinde menünün sağ tarafında resim eklediğiniz belgenin dosya adı belirir (burada index.html i görürsünüz). Site root (göreceli göndermede bulunma) seçeneği kullanıldığında resmin yolu, seçilen resmin sitenin köküne (yerel kök klasörünün en üst düzeyi olarak da bilinir) bağlı göreceli konumu temel alınarak oluşturulur. Site root seçeneği işaretlenirse, menünün sağında sitenin adı görünür. Genelde belgeye bağlı yolları ve bağlantıları kullanmanız gerekir. Çok büyük bir siteniz varsa ya da sayfaları sık sık taşımanız gerekiyorsa Site Root seçeneğini kullanmak isteyebilirsiniz. Resimler için kitap boyunca sadece belgeye bağlı yolları kullanacaksınız. Select Image Source iletişim kutusunda dinamik sitelerle kullanılmak üzere tasarlanan çeşitli ilave seçenekler göreceksiniz. Select File Name From bölümünde Macintosh kullanıcıları bir Data Sources düğmesiyle bir de Sites and Servers düğmesi göreceksiniz. Select File Name From kısmı Windows ta üst iletişim kutusunun üst tarafındadır ve iki radyo düğmesi (File system ve Data sources) ile birlikte bir de Sites and Servers düğmesi içermektedir. File System, Yoga Sangha proje sitesi için ve bir sunucu teknolojisi (ColdFusion, ASP, JSP ya da PHP gibi) kullanmayan ve buna benzeyen siteler için hem Macintosh ta, hem de Windows ta varsayılan seçim yöntemidir. Data Sources ve Sites and Servers seçenekleri belgelerin bir uygulama sunucusunda çalıştırıldığı dinamik siteler için kullanılır. Kitaptaki derslerde bu seçenekleri kullanmanıza gerek yok, çünkü verilerlere yönetilen dinamik bir site oluşturmuyorsunuz. Resİmlerle Çalışmak 177

10 3. Choose (Macintosh ta) ya da OK (Windows ta) düğmesine tıklayın. Image Tag Accessibility Attributes iletişim kutusundaki Alternate Text metin alanına Yoga Sangha yazın ve OK düğmesine tıklayın. Alternate Text seçeneği, kullanıcıların Web tarayıcısında resim görüntüleme özelliği devre dışı bırakıldıysa, kullanıcıların Web tarayıcısı resim görüntüleyemiyorsa, belirli bir resim yüklenemiyorsa veya kullanıcının resimleri görmesini engelleyen başka bir durum söz konusu ise, böyle durumlarda görüntülenecek olan metni tanımlamanızı sağlar. Alternatif metin, resmin yazılı eşdeğeri olmalıdır, yani söz konusu işlevi tanımlamalıdır. Örneğin sitenin gezinti sistemi için önem taşıyan bütün resimlerde alternatif metin kullanmak gerekir. Alternatif metin eklemek faydalı bir özelliktir, çünkü kullanıcıların Web tarayıcısında resim görüntüleme özelliği devre dışı bırakıldıysa ya da kullanıcıların Web tarayıcısı salt metin tipinde ise, bu sayede normalde kaçıracakları bilgilerden bazılarını görebilirler. Ayrıca görme engelli insanlar genellikle okuyucu (reader) ya da konuşma örnekleyici (speech synthesizer) adı verilen ve Web sayfalarının içeriğini sesli olarak ileten çeşitli programlar kullanırlar. Böyle durumlarda resimlere ait alternatif metinler sesli olarak okunur. Birçok Web tarayıcısında kullanıcı imleci resmin üzerine getirdiğinde ilgili alternatif metin görüntülenir. Kullandığınız alternatif metinler ne kadar açıklayıcı ve ayrıntılı olursa, sitenizin kullanıcıları için de o kadar faydalı olurlar. Kimi zaman sadece görsel olarak işlev gören ve sayfanızın içeriği açısından önemli sözcüklerin ya da başka betimleyici öğelerin görüntülenmediği resimler kullanabilirsiniz. Görme engelli kullanıcıların sitenizde gezinirken işlerini zorlaştırabilecek işlevsiz resimlere örnek olarak alternatif metinlerle uygun olmayan şekilde tanımlanan boşluk resimlerini (belirli bir yer işgal eden görünmez resimler) gösterebiliriz. Bu tip resimler için Alternative metin alanının sağındaki menü düğmesine tıklayarak <empty> seçeneğini işaretlemelisiniz. Alâkasız alternatif metinler kullanmaktan kaçının; bu yarardan çok zarar getirir. Bu uygulamada tanımladığınız alternatif metin, resimde gösterilen metnin aynısıdır. Alternatif metin, resimleri tanımlayan <img> etiketinin bir niteliğidir. Alternatif metin, ilgili resim seçildikten sonra Properties denetçisi aracılığıyla değiştirilebilir. <empty> seçeneğini içeren menü Properties denetçisinde de mevcuttur. 178 DERS 5

11 Section 508 ve WCAG ye Uygun Siteler Oluşturmak Erişilebilirliğin (accessibility) amacı, mümkün olan en fazla kullanıcının erişebileceği siteler yaratmaktır. Aşağıda açıklamaları verilen Section 508 ve Web İçeriği Erişilebilirlik Yönergeleri (Web Content Accessibility Guidelines - WCAG), Internet üzerinden erişilebilirlik konusuyla ilgili ihtiyaçları temel almaktadır. Section 508, 1973 te çıkarılan (Amerika Birleşik Devletleri nde) Rehabilitasyon Kanunu nda yapılan bir değişikliktir. Buna göre A.B.D. deki federal bürolar, Internet gibi teknolojilerle kullanıma sunulan içeriğe erişmek için bütün kullanıcıların eşit fırsatlara sahip olmasını sağlayarak engelli insanların ihtiyaçlarının dikkate alınmasını sağlamak zorundadır. Section 508, engelli olmayan insanların kullanabildiği mukayese edilebilir bilgi kaynakları ve servislerin sunulacağı engelli insanlar için gereken standartları tanımlar. Section 508 her ne kadar özel sektör için zorunlu olmasa da, bütün Web sitelerinde olabildiğince uyumlu kodlar kullanma alışkanlığının edinilmesi pek çok sebepten dolayı önemlidir. Görme zayıflığından renk körlüğüne hatta tamamen körlüğe kadar çeşitli bedensel engeller, nüfusun ve dolayısıyla kullanıcılarınızın önemli bir bölümünü etkilemektedir. WCAG, erişilebilirlikle ilgili pek çok sorunun çözümü için W3C tarafından geliştirilmiştir ve erişilebilir siteler geliştirmeyle ilgili açık ve anlaşılır bir yönerge paketi olarak işlev görmektedir. Erişilebilir siteler tasarlamak WebTV, mobil telefonlar ve PDA ler açısından da önemlidir. Konuyla ilgili ayrıntılı bilgi için adresini ziyaret edebilirsiniz. Bu sorunun bir çözümü, sitenizin bir alternatif, salt metin tabanlı versiyonunu oluşturmaktır. Ama aynı zamanda bu çözüm mümkün ya da gerekli olmayabilir (özellikle de sunulan içerik ve hizmetlerle ilgili sorunlar, kullanılabilir alan, ilâve sayfaların oluşturulması için gereken zaman ve kaynak ile sitenin devamlılığını sağlamak için artan ihtiyaçlar dikkate alındığında). Salt metin tabanlı bir sayfaya erişmek (oluşturulurken kullanılan tekniklere ve içeriğine bağlı olarak) mümkün olmayabilir. Salt metin tabanlı sitelerin diğer bir dezavantajı da, genellikle asıl siteye göre daha az bilgi içermeleri ve/veya işlevsellik anlamında asıl siteye göre daha yetersiz olmalarıdır. Tek bir site kullanmak ve buna erişilebilirlik özellikleri eklemek genelde en iyi çözümdür. Böyle bir site tek bir konumda mümkün olduğunca fazla (birbirinden farklı) kullanıcı için çeşitli seçenekler sunabilir, ayrıca içeriği kopyalama ve sitenin devamlılığını sağlama gibi işlemleri iki kez yapma zahmetinden kurtarır. Erişilebilirlik sorunlarını çözmek için aynı sayfaları oluşturmak zorunda kalmadan ve sayfa tasarımınızın görsel özelliklerine zarar vermeden faydalanabileceğiniz başka birçok entegre çözüm mevcuttur. Dreamweaver; CSS, alternatif metin, açıklamalar ve özetler gibi bileşenlerin kullanımıyla erişilebilir Web sayfaları oluşturmanızı sağlayan çeşitli basit yöntemler sunar. Erişilebilirlikle ilgili mesajları etkinleştirmek ya da devre dışı bırakmak için Dreamweaver > Preferences (Macintosh ta) ya da Edit > Preferences (Windows ta) komutunu ve kategori listesinden de Accessibility yi seçin. Erişilebilirlik nitelikleriyle ilgili mesaj almak istemediğiniz bütün elemanların işaretini kaldırın. Resİmlerle Çalışmak 179

12 4. Heading 1 ile biçimlendirilen Yoga Sangha metninin bulunduğu satırı silin ve belgeyi kaydedin. Bu başlığa artık gerek yok, çünkü resim proje sitesinin ismini içeriyor ve alternatif metin de tanımlandı. Bu metnin ve bulunduğu satırın silinmesi gerekiyor. yoga_sangha-title.jpg resmi bir JPEG olarak kaydedildi; bunun sebebi metnin arkasındaki geniş ton aralığıdır. Metni oluşturan satırların kalitesini korumak için resim yüksek kaliteli bir JPEG olarak kaydedildi ve bu da dosya boyutunun büyük olmasına sebep oldu. Daha düşük kalitede bir JPEG formatı kullanılsaydı, aynı resimde daha fazla JPEG kalıntısı (Yoga Sangha metni gibi düz renkli alanlarda daha sık rastlanan gereksiz verilerin atıldığı yerlerdeki küçük blok şeklinde kareler) olacaktı. Burada fotografik alanlar ve metnin ihtiyaç duyduğu noktalar arasındaki dengeyi sağlamak için en iyi seçenek JPEG tir. Resimleri Yeniden Boyutlandırmak ve Tazelemek Dışarıdan bir resim aktardığınızda resmin genişliği ve yüksekliği Properties denetçisinde görüntülenir ve otomatik olarak koda yerleştirilir. Bu da Web tarayıcısına sayfanın yerleşim düzenini tanımlamak için ihtiyaç duyduğu bilgileri verir. Bu seçenek, sayfalarınızın yüklenme hızında fark yaratabilir. 1. yoga_sangha-title.jpg resmini seçin ve Properties denetçisinde yer alan W metin alanındaki değeri 220 piksel, H metin alanındaki değeri de 40 piksel yaparak genişliği ve yüksekliği değiştirin. Değişikliği uygulamak ve görüntüyü tazelemek için Return (Macintosh ta) ya da Enter (Windows ta) tuşuna basmanız veya belge penceresinin içinde bir yere tıklamanız gerekir. <img> (image - resim) etiketinin yeni genişlik ve yükseklik nitelikleri, asıl resim dosyasının büyüklüğünü değiştirmeden resmin daha küçük boyutlarda görüntülenmesini sağlar. Seçilen resmin dosya boyutunun (Properties denetçisinde görüntülenir) değişmediğine dikkat edin. Bütün resim düzenlemelerini (netlik, resim kalitesi ve dosya büyüklüğünün ayarlanması da dahil olmak üzere) tek bir resim editöründe yapacak şekilde ayarlamanın önemli avantajları vardır. Aynı resmi bir resim editöründe küçültür ve Internet için yeniden optimize ederseniz dosya boyutu daha küçük ve resim kalitesi de daha yüksek olacaktır. 180 DERS 5

13 Dosya boyutu Web sayfaları için önemli bir özelliktir. Dosya boyutu ne kadar küçükse, resimleriniz o kadar hızlı yüklenir. Ve sayfalarınız ne kadar hızlı yüklenirse, ziyaretçilerinizin sıkılıp başka bir siteye gitme olasılığı da o oranda azalacaktır. 2. Seçili durumdaki resmin kenarlığı üzerindeki seçim tutamaçlarından (siyah kareler) birine tıklayın. Yeniden boyutlandırmak üzere imleci sürükleyin ve resmi orijinalinden daha büyük hale getirin. Genişlik ve yükseklik özellikleri otomatik olarak güncellenecektir. Yeni boyutların kalın olarak yazıldığına dikkat edin. Bu kalın biçimlendirme ilgili resmin yeniden boyutlandırıldığını gösterir. Kimi zaman bir resmi yanlışlıkla boyutlandırabilirsiniz. Bu kalın biçimlendirme özelliğini görerek durumu fark edebilirsiniz. Resmin boyut oranını korumak isterseniz resmin sağ alt köşesindeki seçim tutamaçlarını sürüklerken Shift tuşunu basılı tutun. Resmin boyutlarını büyütürken kalitenin düştüğüne dikkat edin. Resimler Web tarayıcılarında ekran çözünürlüğünde (72 dpi) görüntülenir. Bu çözünürlük değeri, resmi orijinalinden daha büyük boyutlarda görüntülemek için yeterli değildir. Bu yüzden, mümkün olan en küçük dosya boyutunu elde etmek üzere bir resim editöründe (Macromedia Fireworks ya da Adobe Photoshop gibi) boyutları ayarlamanız gerekecektir. 3. Properties denetçisinde W ve H metin alanlarının hemen sağında yer alan Reset Image To Original Size düğmesine tıklayın. Reset Image To Original Size düğmesi Resample (görüntüyü tazeleme) simgesiyle gösterilir. Bu düğme W (Genişlik) ve H (yükseklik) metin alanlarını birleştiren çizgilerin ortasında yer alır. Resample simgesi ve birleştirme çizgileri, resmin boyutlarının değiştirildiğini gösteren diğer bir işarettir. Bu simge, sadece resmin boyutlarında değişiklik yapıldığında belirir. Simgeye tıkladığınızda resim orijinal büyüklüğüne getirilir. Genişlik ve yükseklik değerini gösteren sayıların düz metne döndüğüne dikkat edin. Bu da resmin orijinal büyüklüğe ayarlandığını gösterir. Çok büyük resimler ya da diğer sunucularda yer alan resimleri kullanırken düşük kaliteli bir kaynak resmi kullanarak ziyaretçilere görsel bir ipucu sağlayabilirsiniz. Düşük kaliteli bir kaynağı tanımlarken, ilk başta görüntülenecek olan daha düşük kaliteli bir resim seçersiniz. Daha yüksek kaliteli olan resim, indirme işlemi tamamlandığında belirir. Bir resim seçildiğinde Properties denetçisinde düşük kaliteli kaynak resminin tanımlanması için bir Low Src metin alanı belirir. Bir resim seçmek için bu metin alanının yanındaki Browse For File Folder isimli klasör simgesine tıklayın. Bu tekniği, asıl resmin doysa boyutunun büyük olduğunu ve bu yüzden indirilmesinin kullanıcının tahmininden daha uzun süreceğini biliyorsanız ya da resmi yavaşladığı bilinen bir kaynaktan alıyorsanız kullanabilirsiniz. Böyle durumlarda kullanılan düşük kaliteli kaynak resimleri genellikle Yükleniyor ya da Loading gibi mesajlar içerir. Resİmlerle Çalışmak 181

14 Resimlerin Yerleştirilmesi Bir belgeye resim yerleştirirken bu yerleştirme işlemiyle ilgili olarak çeşitli seçeneklerden faydalanabilirsiniz. Aşağıdaki uygulamada CSS kullanan bir hizalama ayarı oluşturmak için faydalanılan bir yöntem gösterilmiştir. 1. index.html belgesinde ekleme noktasını At Yoga Sangha, we re dedicated to teaching ifadesinin yer aldığı satırın başına yerleştirin. Lesson_05_Graphics/ Images klasöründe yer alan studio-om.jpg resmini ekleyin. studio-om.jpg resmini eklerken bu derste daha önce yer alan Sayfaya Resim Yerleştirmek uygulamasında öğrendiğiniz teknikleri kullanın. Varsayılan durumda resim metin satırının başında görünür. Aşağıdaki uygulamalarda CSS kullanarak resmi sola hizalayacak ve metni resmin sağ tarafını saracak şekilde ayarlayacaksınız. 2. CSS Styles panelindeki New CSS Rule düğmesine tıklayın. Selector Type alanında Class ı seçin, Name metin alanına.studiophoto yazın ve OK düğmesine tıklayın. CSS Rule Definition iletişim kutusunda Box kategorisini seçin, Float menüsünden left i seçin ve OK düğmesine tıklayın. Bir belgedeki her eleman bir kutu (box) olarak değerlendirilir. CSS, kutu kavramını bir elemanın görünümünü, konumunu, vs. kontrol etmek için kullanır. Elemanlar ve dolayısıyla onları temsil eden kutular blok ya da satıriçi tipte olabilir ve her kutu başka kutular içerebilir. Burada kutuyu studiophoto sınıfını uygulayacağınız satıriçi resim elemanının konumunu kontrol etmek için kullanıyorsunuz. Kullanılabilecek üç konum ayarlama yönteminden biri Float, diğer ikisi de absolute ve fixed tır. Float seçeneğini left (sol) olarak ayarladığınızda etkilenen blok, yani studiophoto sınıfının uygulandığı eleman, onu içeren bloğun sol tarafındaki kenar boşluğuna doğru itilir. 182 DERS 5

15 Belgenin gövde kısmı bir kutu olarak değerlendirilir ve bazı durumlarda tutucu blok olarak da düşünülebilir. Kayar durumdaki elemanın üst kısmı, içinde bulunduğu bloğun üst kısmıyla hizalanacak ve çevreleyen içerik, kayar durumdaki elemanın etrafını saracaktır. 3. Belge penceresinde studio-om.jpg resmini ve ardından Properties denetçisindeki Class menüsünden studiophoto yu seçin. Resim sayfanın sol tarafına kayacak ve içinde bulunduğu paragraf bloğunun üst kısmıyla hizalanacaktır. Sonraki metin, sağ tarafta resmin etrafını saracaktır. Align Niteliğini Kullanmak Dreamweaver, düşey ve yatay hizalama seçeneklerinin yer aldığı bir menü aracılığıyla Properties denetçisindeki resim hizalama seçeneklerine hızlı bir şekilde erişmenizi sağlar. Bu menüdeki tüm hizalama seçenekleri <img> etiketinin align niteliğini kullanır. align niteliğini <img> etiketine uygulanmış haliyle kullanmak artık tercih edilmeyen bir yöntemdir, çünkü bu satıriçi, sunuma yönelik bir işaretleme şeklidir. Ancak eski siteler üzerinde çalışıyorsanız bu yöntemin nasıl işlediğini de bilmeniz gerekebilir. Hizalama seçenekleri resmin bulunduğu geçerli satır temel alınarak uygulanır. Bu seçenekler aşağıda açıklanmıştır. Default. Bu seçenekte hiçbir align niteliği tanımlanmamıştır. Baseline. Resmin altını metin satırının üzerine oturduğu taban çizgisiyle hizalar. Top. Resmin üstünü satırdaki en yüksek öğeyle hizalar (bu öğe bir resim olabilir). Middle. Resmin ortasını metin satırının üzerine oturduğu taban çizgisiyle hizalar. Bottom. Resmin altını metin satırının üzerine oturduğu taban çizgisiyle hizalar (Baseline seçeneğiyle aynıdır). TextTop. Resmin üstünü metin satırındaki en uzun boylu karakterle hizalar. Genellikle Top seçeneğiyle aynıdır (ama her zaman değil). Absolute Middle. Resmin ortasını metin satırının ortasıyla hizalar. Absolute Bottom. Resmin altını metin satırının en kısa boylu karakteriyle hizalar. Left. Resmi sola kaydırır. Bundan sonra gelen metin, sağ tarafta resmin etrafını sarar. Right. Resmi sağa kaydırır. Bundan sonra gelen metin, sol tarafta resmin etrafını sarar. Bu menüdeki seçenekler Left, Center ve Right hizalama düğmeleriyle aynı değildir. Menüdeki hizalama seçenekleri <img> etiketine uygulanır, ama yukarıda adı geçen üç hizalama düğmesi resimleri içeren blok elemanına (<p> etiketi gibi) uygulanır ve bu yüzden bu etiketin içindeki diğer her şey hizalama işleminden etkilenir, çünkü onlar da aynı bloğun bir parçasıdır. Resİmlerle Çalışmak 183

16 Bir Resmin Etrafına Kenarlık Eklemek Kimi zaman bir resmi vurgulamak için arka plandan ya da onu çevreleyen içerikten ayırmanız gerekir. Bu efekti oluşturmak için kullanabileceğiniz yöntemlerden biri, resmin etrafına bir kenarlık (border) eklemektir. Kenarlık, dikkati resmin üzerine çekebilir ve siteye daha hoş bir görünüm kazandırabilir. Bazen kenarlıklar bağlantıları göstermek için de kullanılabilir. Bir kenarlığı iki şekilde tanımlayabilirsiniz. Şimdiki uygulamada kenarlık oluşturmak için CSS kullanacaksınız, fakat image etiketine border niteliği uygulamak şeklindeki ikinci yöntemi de öğreneceksiniz. 1. CSS Styles panelindeki All Rules listesinden studiophoto kuralını seçin ve panelin alt kısmındaki Edit Style düğmesine tıklayın. Kurallar, onları oluşturduğunuz sırayla, en eskisi listenin en üstünde ve en yenisi de en altta olacak şekilde görüntülenirler. 2. CSS Rule Definition iletişim kutusunda Border kategorisini seçin. Style alanında Top menüsünden solid i seçin, Width alanındaki Top satırına karşılık gelen metin alanına 1 yazın ve Color alanında Top satırına karşılık gelen metin alanına #747E3F yazın. OK düğmesine tıklayarak iletişim kutusunu kapatın ve yaptığınız değişiklikleri uygulayın. Dreamweaver resmin etrafına bir piksel genişliğinde bir kenarlık ekleyecektir. Border yani kenarlık ayarında, Rule Definition iletişim kutusunun varsayılan seçeneği olan piksel tabanlı ölçü birimi kullanılmaktadır. Kenarlığın genişlik değerini istediğiniz gibi ayarlayabilirsiniz. 184 DERS 5

17 Bir resme <img> etiketinin border niteliğini kullanarak da kenarlık uygulayabilirsiniz. Bunun için ilgili resmi seçin ve Properties denetçisindeki Border metin alanına istediğiniz kalınlık değerini girin. Bir resme bağlantı atarsanız, kenarlık rengi, Page Properties iletişim kutusunda tanımlanan varsayılan bağlantı rengi (Link Color) ile aynı olacaktır (eğer bir CSS stili uygulanmadıysa, çünkü bu durumda bağlantı kenarlık renginde herhangi bir değişiklik yapmaz). Kenarlık rengi, Page Properties iletişim kutusunda tanımlanan varsayılan metin rengiyle aynı olacaktır. Aşağıdaki örnekte, Properties denetçisi ile uygulanmış border niteliğine sahip bir resim görüyorsunuz. Buradaki uygulamada yaptığınız gibi resim kenarlıklarını tanımlamak için CSS kullanmak amacıyla border niteliğini kullanmaktan kaçınmak, daha iyi bir yaklaşımdır. Resimlere İsim Atamak Resim isimleri, her ne kadar çoğunlukla görünmeseler de Web sayfalarının önemli bileşenlerindendir. Resimlere birer isim atamak genel olarak iyi bir alışkanlıktır ve bu isimler script yazarken nesneyi tanımlamak için kullanılır. yoga_sangha-title.jpg resmini seçin ve Properties denetçisindeki resim adı metin alanına Yoga yazın. Properties denetçisindeki resim alanı belirli bir etiketle gösterilmemiştir. Bu alan sol üst köşede, resim boyutunun hemen altında yer alır. Resim adı metin alanı Resme atadığınız isim dahili bir isimdir ve asıl olarak davranışlar (Behaviors) gibi işlevler (Ders 8) için kullanılır. Resimleri adlandırmak şart değildir, ama bunun iyi bir alışkanlık olduğunu unutmayın. Resim isimlerini kısa tutun, küçük harflerle yazın ve boşluk ya da özel karakterler kullanmaktan kaçının. Resİmlerle Çalışmak 185

18 Assets Panelini Kullanarak Resim Eklemek Assets paneli, sitenizin bileşenlerini Dreamweaver içinden düzenleme imkânı sağlar. Bu aracı, çeşitli medya ve sayfa elemanlarını görmek ve düzenlemek için kullanabilirsiniz. Örneğin bütün resimlerinizi düzenlemeniz zor olabilir; özellikle de büyük bir site üzerinde çalışıyorsanız. Assets paneli ile bu resimleri kolayca takip edebilirsiniz. 1. Files panel grubunda Assets panelini seçin. Assets panelinin sol tarafında yer alan düğme sütununun üst kısmında yer alan Images düğmesine tıklayın. Assets paneli ya da Files panel grubu görünür durumda değilse, Files panel grubu içinde Assets panelini açmak için Window > Assets komutunu kullanabilirsiniz. Assets panelinin sol tarafında yer alan diğer düğmeler sitenizde kullanabileceğiniz farklı varlık (asset) tiplerini temsil eder. Bunların içinde renkler de (Colors) yer alır. Assets paneliyle iki şekilde çalışabilirsiniz. Paneli Site listesiyle (sitenizdeki bütün resimlerin tam bir listesini içerir) ya da Favorites listesiyle (sadece sizin sık kullanılan olarak işaretlediğiniz resimleri gösterir) görüntüleyebilirsiniz. Her iki görünümde de seçtiğiniz bir resmi sayfanıza ekleyebilirsiniz. Images düğmesi 186 DERS 5

19 2. Eğer seçili durumda değilse (varsayılan durumda seçili olması gerekir) Assets panelinin üst tarafındaki Images:Site seçeneğine (Images düğmesinin sağında yer alır) tıklayın. Yoga Sangha proje sitesinde, Assets panelinin Images bölümünde listelenen çoğu resmin birden fazla kopyasını göreceksiniz. Çünkü her ders klasöründe ve ilgili Completed klasöründe resimlerin farklı kopyaları bulunmakta ve dolayısıyla sitede her resmin çeşitli kopyaları kullanılmaktadır. Kendi sitelerinizde aynı resimlerden bazılarını içeren birden fazla resim klasörü kullanmadıkça bu durumla karşılaşmazsınız. Boşluk resmi (spacer) olarak kullanılan GIF lere ve gezinti sisteminde kullanılan resimlere bazen farklı resim klasörlerinde rastlarsınız. Bir resmin birden fazla kopyasını bulundurmak genellikle şart değildir. Çünkü sitenizde herhangi bir konumdaki resimleri kullanabilirsiniz. Aslında birden fazla resim kullanımı pek istenmez. Bir resmi güncellemeniz gerektiğinde aynı resmin birden fazla kopyası varsa bir sürü dosyada değişiklik yapmanız gerekebilir. Assets penceresinin Site görünümünde sitedeki bütün resimler gösterilir. Resimler, herhangi bir belgede ister kullanılsın, ister kullanılmasın, bu pencerede otomatik olarak belirirler. Panelin sitenizdeki bütün resim varlıklarının bir katalogunu oluşturması birkaç saniye sürebilir. Sitenizi ilk oluşturduğunuzda önbelleği etkinleştirmediyseniz, Dreamweaver önbelleği etkinleştirmek ve oluşturmak için Assets panelindeki Refresh Site Liste düğmesine tıklamanız gerektiğini bildirir. Önbellek varsayılan durumda etkindir ve siz sitenize ait Site Definition iletişim kutusundaki Enable Cache onay kutusunun işaretini kaldırmadığınız sürece otomatik olarak oluşturulur. Sitenize yeni bir varlık eklediğinizde bu varlık Assets panelinde hemen görüntülenmeyebilir. Paneli, sitenizdeki tüm resimleri gösterecek şekilde güncellemek için site katalogunu tazelemeniz gerekir. Bunun için Assets panelinin sağ alt köşesindeki Refresh Site List düğmesine tıklayın. 3. Ekleme noktasını Yoga Sangha was founded by Katchie Ananda and Jayne Hillman ifadesiyle başlayan paragrafın başına yerleştirin. Assets panelinde, Lesson_05_Graphics/Images klasöründe yer alan teaching.jpg resmini bulun ve Insert düğmesine tıklayın. Ayrıca Assets panelinde ilgili resmi seçebilir ve istediğiniz konuma sürükleyebilirsiniz. Bir resim dosyasının konumunu bulmak için söz konusu dosyayı seçtikten sonra Cmd tuşunu basılı tutup tıklayarak veya sağ tıklayarak açılan bağlam menüsünden Locate In Site komutunu seçebilirsiniz. Resİmlerle Çalışmak 187

20 Assets panelini yatay olarak genişlettiğinizde Full Path sütununu görürsünüz. Bu sütunu kullanarak resimlerin nereye konduğunu görebilirsiniz. Macintosh kullanıcıları paneli sağ alt köşesine tıklayıp sürükleyerek genişletebilir. Paneli genişletmenizi sağlayacak kadar yere sahip olmak için önce paneli ya da panel gruplarını sola taşımanız gerekebilir. Windows ta panelleri arabirimin geri kalan kısmından ayıran düşey çubuğu üzerine tıklayıp sola sürükleyebilirsiniz. Resim belge penceresinde belirecektir. Assets panelinde resim seçtiğinizde panelin üst kısmında resmin küçük bir önizleme görüntüsü belirir. Kullanılabilir önizleme alanını büyüterek (imleci görünüm alanının alttaki kenarlığının üzerine getirin ve sürükleyerek yeniden boyutlandırın) ve/veya tüm Assets panelini büyüterek bu küçük resmin boyutlarını büyütebilirsiniz. Assets panelinde bir resmi kolayca seçebilir ve Edit simgesine tıklayarak resmi varsayılan resim düzenleme programınızda açabilirsiniz. Sütun üstbilgilerine tıkladığınızda resim listesi yeniden sıralanacaktır. Örneğin Name sütununun üstbilgisine tıkladığınızda resimler alfabetik olarak küçükten büyüğe (yukarıya bakan bir okla gösterilir) ya da büyükten küçüğe (aşağıya bakan bir okla gösterilir) doğru yeniden sıralanır. Diğer sütun üstbilgilerini de boyuta (Size), türe (Type) ve tam yol (Full Path) göre sıralamak için kullanabilirsiniz. Diğer sütunları görmek için ekranı sağa doğru kaydırmanız gerekebilir. Bir sütunda ya da sütun üstbilgisinde üç nokta (...) görürseniz, bu sütunun içeriğini görmeniz için paneli genişletmeniz gerekir. Assets paneli etkinleştirildiğinde (listedeki bir resme tıklayarak etkinleştirin) aradığınız dosyayı seçmek için dosyanın adının ilk harfini (ya da ilk birkaç harfini) yazabilirsiniz. 188 DERS 5

21 Bu fotoğraf bir JPEG olarak kaydedilmiştir. Aynı resmi bir GIF olarak kaydetseydiniz resim kaba degradelerle, renklerin etrafında kırıklı kenarlarla piksel piksel görüntülenirdi. Bunun sebebi, bu formatta (GIF) bütün renk tonlarının sadece birkaç renkle eşleştirilmesidir. Bu durumda en iyi seçenek JPEG tir. 4. Image Tag Accessibility Attributes iletişim kutusundaki Alternate Text metin alanına A Yoga Sangha Teacher yazın ve OK düğmesine tıklayın. Belge penceresinde yeni eklediğiniz resmi seçin ve Properties denetçisindeki resim adı metin alanına teacher yazın. Resme studiophoto CSS sınıfını uygulayın. Resimlerinize onları ekleme aşamasında isim ve alternatif metin ayarsanız zaman kazanırsınız. Ayrıca gerektiğinde Code görünümünde bunlarla çalışmanız daha kolay olur. Bu aşamada belgenizin görünümü üstteki örneğe benzeyecektir. Resİmlerle Çalışmak 189

22 Resimleri Favori Listesiyle Yönetmek Tekrar tekrar kullandığınız resimleri Favorite (Sık Kullanılanlar) listesine eklemeniz size önemli ölçüde zaman kazandırabilir. Sitenizdeki her resmi Favorite listenize ekleyebilirsiniz. Her sitenin kendi Favorite listesi vardır. Dreamweaver ı kullanmaya başladığınızda bu liste boştur. Aşağıdaki uygulamada Site kategorisinden Favorite listenize bir resim ekleyecek ve sonra da bu listeyi düzenleyeceksiniz. 1. Assets panelinin Site listesinde teaching.jpg resmini seçin ve sağ alt köşedeki Add To Favorites düğmesine tıklayın. Add to Favorites (Sık Kullanılanlara Ekle) düğmesi Bir iletişim kutusu açılarak seçilen varlıkların bu sitenin Favorite listesine eklendiğini bildirecektir. İletiyi kabul etmek için OK düğmesine tıklayın ve iletişim kutusunu kapatın. Bir resmi Favorites listesine eklemek için kullanabileceğiniz birkaç alternatif yöntem mevcuttur. Resmi Files panelinde seçebilir ve panelin sağ üst köşesindeki bağlam menüsünü açarak Add to Favorites komutunu seçebilirsiniz. Diğer bir yöntem de, belge penceresindeki bir resmi sık kullanılan varlıklardan biri haline getirmektir. Bunun için resme Ctrl tuşunu basılı tutarak tıklayın (Macintosh ta) ya da sağ tıklayın (Windows ta) ve açılan bağlam menüsünden Add To Image Favorites komutunu seçin. Bu bağlam menüsü pek çok seçenek içerir ve bağlantılar ve Flash nesneleri gibi diğer elemanlarla birlikte de kullanılabilir. 190 DERS 5

23 2. Assets panelinin üst kısmındaki Images seçenekleri arasında yer alan Images: Favorites radyo düğmesini seçin. Assets paneli, önceki adımda eklediğiniz resimle birlikte Favorite listesini görüntüleyecektir. Assests panelini kullanarak resimlerinizi yönetmeye başladıktan sonra resim eklediğiniz gibi muhtemelen bazı resimleri de silmeniz gerekecektir. Favorite listesinde bir resim seçildiğinde Add to Favorites düğmesi Remove from Favorites düğmesine dönüşür. Remove from Favorites düğmesine tıkladığınızda, seçtiğiniz resim listeden silinir. Images kategorisindeyken hem Site, hem de Favorite listesinde sitenizin içindeki belirli bir resmin konumunu bulmak için bağlam menüsünü kullanabilirsiniz. Bunun için bir resmi seçin ve bağlam menüsünden Locate in Site komutunu seçin. Site yapısında ilgili resim seçili hale gelecek şekilde Files paneli etkinleşecektir. 3. Paneli alt kısmındaki New Favorites Folder simgesine tıklayın. Açılan klasörün isim metin alanındaki Untitled varsayılan adının yerine Teachers yazın ve Return (Macintosh ta) ya da Enter (Windows ta) tuşuna basın. Resimlerinizi kolayca bulmak için onları klasörler halinde düzenleyebilirsiniz. Bunun için bağlam menüsündeki New Favorites Folder seçeneğini de kullanabilirsiniz. Bu seçenek bağlam menüsünde sadece Images kategorisinin Favorite (Sık Kullanılanlar) bölümündeyken kullanılabilir. 4. teaching.jpg resmini Teachers klasörünün üzerine sürükleyin. Klasörün içeriğini görmek için küçük klasör simgesine çift tıklayabilir, sonra da tekrar çift tıklayarak klasörü kapatabilirsiniz. Bir klasörün içindeki resimler klasörün altında ve biraz girintili olarak gösterilir. Favorite listesinde oluşturduğunuz bir klasörü silmeniz gerekirse ilgili klasörü seçin ve Assets panelinin alt kısmındaki Remove from Favorites düğmesine tıklayın. Bir Resmin Etrafındaki Boşluğu Ayarlamak Metinleri resimlerin etrafına sararken ilgili resmin etrafındaki boşluğu da ayarlamanız gerekebilir. Başlangıçta belgenizdeki metin resme çok yakın olacaktır. Bu da metnin okunmasını zorlaştırabilir. Belirli bir miktarda boşluk yaratmak, sayfanızın yerleşim düzeninin daha güzel görünmesine yardımcı olacaktır. Boşluk ayarlarında piksel tabanlı bir ölçü kullanılır. Resİmlerle Çalışmak 191

24 1. CSS Styles panelindeki All Rules listesinden studiophoto kuralını seçin ve panelin alt kısmındaki Edit Style düğmesine tıklayın. Şu anda metin bu resmin kenarına çok yakın durmaktadır. Resmin etrafına biraz boşluk eklerseniz hem sayfa daha güzel görünecek, hem de metin daha rahat okunacaktır. 2. CSS Rule Definition iletişim kutusunda Box kategorisini seçin. İletişim kutusunun Margin alanında Same For All onay kutusunun işaretini kaldırın, yine Margin alanındaki Right ve Bottom metin alanlarına 5 yazın ve Return (Macintosh ta) ya da Enter (Windows ta) düğmesine tıklayın. Yaptığınız bu ayarla resmin sağına ve altına 10 piksellik boşluk eklenecektir. CSS kullanarak ilgili elemanın yanlarındaki boşluk miktarını ayrı ayrı kontrol edebilirsiniz. Bu özellik, örneğin resmin üst kenarının metnin üst kısmıyla hizalanacağı ve resmin sol kenarının da metnin sol kenarıyla hizalanacağı bir durumda çok işinize yarayabilir. Ayrıca <img> etiketinin H Space (yatay boşluk) ve V Space (düşey boşluk) niteliklerini tanımlayarak da bir resme boşluk ekleyebilirsiniz. Bu nitelikler resmin her iki tarafına da (yatay veya düşey) eşit miktarda boşluk ekler. CSS kullanmadıkça resmin sadece tek bir tarafına boşluk ekleyemezsiniz. Bu nitelikleri Properties denetçisindeki V Space ve H Space metin alanlarını kullanarak tanımlayabilirsiniz. 192 DERS 5

25 Bir Resim Yer Tutucusu Eklemek Asıl resim henüz hazır değilse bir resim yer tutucusu da ekleyebilirsiniz. Belgenize bir resim yer tutucusu ekleyerek asıl resmin sayfada metinler, tablolar veya diğer elemanlarla birlikte nasıl görüneceği hakkında yaklaşık olarak bir fikir elde edebilirsiniz. 1. Ekleme noktasını Anusara Yoga Immersion ilânına ait açıklamanın sonuna yerleştirin ve Return (Macintosh ta) ya da Enter (Windows ta) tuşuna basarak yeni bir paragraf oluşturun. Insert araç çubuğunun Common kategorisinde Images menüsüne tıklayın ve Image Placeholder ı seçin. Images: Image placeholder düğmesi Image Placeholder iletişim kutusu açılacaktır. Resim yer tutucularının varsayılan genişliği ve yüksekliği 32 X 32 pikseldir. 2. Name metin alanına class yazın. Width (Genişlik) değerini 176 ve Height (Yükseklik) değerini de 132 olarak ayarlayın. Color (Renk) kutusuna tıklayın ve renk numunelerini kullanarak siyah rengi seçin, sonra da Alternate Text metin alanına a class at Yoga Sangha yazın. OK düğmesine tıklayın. Resim yer tutucusu belge penceresinde belirecektir. Yer tutucunun renginin siyah olduğuna ve resmin ismiyle boyutlarını görüntülediğine dikkat edin. Bilgisayarınızda Fireworks kuruluysa ve resim dosyaları için varsayılan editör olarak ayarlıysa, belge penceresinde resim yer tutucusunu seçip Properties denetçisindeki Create düğmesine tıklayarak yer tutucu için tanımladığınız büyüklükte bir Fireworks belgesi açabilirsiniz. Bu belgeyi kaydettiğinizde Fireworks ün Save As (Farklı Kaydet) iletişim kutusunda otomatik olarak yer tutucu için kullandığınız isim atanacaktır. Resİmlerle Çalışmak 193

26 Sayfanızı bir Web tarayıcısında önizlediğinizde resim yer tutucusu alternatif metinle (sizin Image Placeholder iletişim kutusunda tanımladığınız boyutlara ve renklere sahip bir kutu içerisinde yer alır) birlikte yırtılmış bir resim simgesi görüntüleyecektir. Bundan kurtulmak için resim yer tutucusunu bir sonraki uygulamada göreceğimiz gibi asıl resimle değiştirmeniz gerekir. Sayfanızın görüntüsü bu örnektekine benzeyecektir. Resim Yer Tutucusunu Değiştirmek Asıl resmi oluşturduktan ya da müşterinizden aldıktan sonra yer tutucuyu (sayfanızda resmin nasıl duracağıyla ilgili olarak fikir vermesi için kullanmıştınız) asıl resimle değiştirmeniz gerekir. İki resmi birbiriyle değiştirmek için de bu teknikten faydalanabilirsiniz. 1. Belge penceresindeki resim yer tutucusuna çift tıklayın. Select Image Source iletişim kutusu açılacaktır. 2. Lesson_05_Graphics/Images klasöründeki class.jpg resmini seçin ve Choose (Macintosh ta) ya da OK (Windows ta) düğmesine tıklayın. Asıl resim belge penceresindeki yer tutucunun yerini alacaktır. Resim yer tutucusuna atanan isim ve alternatif metin bu kez asıl resme atanacaktır. 194 DERS 5

27 Resim Düzenleme Tercihlerini Ayarlamak Dreamweaver ile Web sayfaları oluştururken, kullandığınız resimlerde değişiklik yapma gereği duyabilirsiniz. Kapsamlı düzenleme işlemleri için resmi harici bir resim düzenleme programında açmanız ve gereken ayarlamaları o şekilde yapmanız gerekir. Dreamweaver bu işlemi, ilgili resmi, tanımladığınız bir programda hızlı bir şekilde açmanızı sağlayarak basitleştirir. 1. Dreamweaver Preferences (Macintosh ta) ya da Edit > Preferences (Windows ta) komutunu seçin ve Preferences iletişim kutusundaki Category listesinde File Types/Editors ı seçin. Bu iletişim kutusunu kullanarak başka harici programları da dosya uzantılarına göre varsayılan editörler olarak atayabilirsiniz. Dreamweaver 8, Flash ve Fireworks teki çalışmalarınızı bağlantılı düzenleme (roundtrip editing) olarak bilinen bir özellikle entegre hale getirebilirsiniz. Bu özellik, dosya güncellemelerinin programlar arasında aktarılmasını mümkün kılar. Bundan yararlanabilmek için Fireworks ü varsayılan resim editörü olarak ayarlamanız gerekir. 2. Extensions listesinden.gif i seçin. Editors listesinin üstündeki artı (+) düğmesine tıklayın ve Fireworks gibi bir resim düzenleme programı seçin. Uygulama listesinde ilgili program seçiliyken programı bütün GIF dosyaları için varsayılan editör olarak ayarlamak üzere Make Primary düğmesine tıklayın. Resİmlerle Çalışmak 195

Dreamweaver Asset Panelinin kullanımı ve bölümleri

Dreamweaver Asset Panelinin kullanımı ve bölümleri Asset Panelinin kullanımı Assets paneli Files panel grubunda yer alır. Assets panelini Window > Assets komutunu seçerek de açabilirsiniz. Renk varlıklarına erişmek için Assets panelinin sol sütunundali

Detaylı

Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com. Hazırlayan: İdris Kahraman

Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com. Hazırlayan: İdris Kahraman 7. Doç. Dr. İsmail Rakıp Karaş www.ismailkaras.com irkaras@gmail.com Hazırlayan: İdris Kahraman Dreamweaver Dreamweaver en iyi web editör yazılımlarından biridir. Biz tasarım modunda çalışırken,dreamweaver

Detaylı

Web sayfalarında yapılan her çalışma ve düzenleme tablolar aracılığı ile yapılır. Dolayısıyla çoğu web sayfalarında tablo kullanmak zorunluluktur.

Web sayfalarında yapılan her çalışma ve düzenleme tablolar aracılığı ile yapılır. Dolayısıyla çoğu web sayfalarında tablo kullanmak zorunluluktur. Yazı Tipi Stili HTML kodları 47 Kalın İtalik Altı Çizili 9.2.6 Metin yükseltme veya alçaltma 1. Sayfa görünümünde, belge penceresinin altındaki Tasarla düğmesini tıklatın. 2.

Detaylı

Açılan programın pencere görünümü aşağıdaki gibidir. 2. Araç Çubuğundan kaydet düğmesi ile

Açılan programın pencere görünümü aşağıdaki gibidir. 2. Araç Çubuğundan kaydet düğmesi ile POWERPOINT PROGRAMI Powerpoint bir sunu hazırlama programıdır. Belirli bir konu hakkında bilgi vermek için, derslerle ilgili bir etkinlik hazırlamak için, dinleyicilere görsel ortamda sunum yapmak için

Detaylı

Aşağıdaki örnekte, aynı düzen tablosu ve hücreleri içerikle birlikte gösterilmektedir.

Aşağıdaki örnekte, aynı düzen tablosu ve hücreleri içerikle birlikte gösterilmektedir. 12 DÜZEN TABLOLARI Microsoft Office FrontPage 2003 programında düzen tabloları ve hücrelerini kullanarak, profesyonel görünümlü Web sayfası düzenleri oluşturabilirsiniz. Düzen tablosu, sayfa düzeni için

Detaylı

ÖĞRENME FAALİYETİ 1 ÖĞRENME FAALİYETİ 1

ÖĞRENME FAALİYETİ 1 ÖĞRENME FAALİYETİ 1 ÖĞRENME FAALİYETİ 1 ÖĞRENME FAALİYETİ 1 AMAÇ Bilgisayar ve elektronik tablolama yazılımı sağlandığında elektronik tablolama yazılımı çalışma alanı düzenlemelerini yapabileceksiniz. ARAŞTIRMA Güncel olarak

Detaylı

Silmek istediğiniz satır/sütun/hücre yi seçin ve aşağıdaki adımlardan birini takip edin:

Silmek istediğiniz satır/sütun/hücre yi seçin ve aşağıdaki adımlardan birini takip edin: Satır/Sütun/Hücre Ekleme Paket Programlar Not_04 Oluşturduğunuz tabloya satır, sütun ve hücre ekleyebilirsiniz. Bunun için ekleme yapacağınız hücreye tıklayın ve aşağıdaki adımlardan birini takip edin:

Detaylı

a. Giriş sekmesi: 1. Paragraf bölümünde Madde İşaretleri veya Numaralandırma seçeneklerinden istediğinize tıklayın.

a. Giriş sekmesi: 1. Paragraf bölümünde Madde İşaretleri veya Numaralandırma seçeneklerinden istediğinize tıklayın. Madde İmleri ve Numaralandırma Sıralı veya sırasız listeler oluşturmak için madde imleri ve numaralandırma seçeneğini kullanabilirsiniz. Madde İşaretli ve Numaralandırılmış Listeler Oluşturma Yazılı olan

Detaylı

1.1 Web Kavramlar. 1.1.1.3 URL terimini tanımlayınız ve anlayınız.

1.1 Web Kavramlar. 1.1.1.3 URL terimini tanımlayınız ve anlayınız. 1.1 Web Kavramlar 117 Anahtar 7erim/er 1.1.1.1 Web ve Internet terimlerini tanımlayınız. Her birinin anahtar özelliklerini tanımlayınız. Web bir Internet hizmetidir. Web Internet üzerinde bağlantılı html

Detaylı

Metin Tabanlı İçerik Oluşturma Araçları

Metin Tabanlı İçerik Oluşturma Araçları Metin Tabanlı İçerik Oluşturma Araçları Microsoft Office Word Kelime işlemci, görsel nesnelerin veya çizimlerin resim ya da arka plan olarak kullanıldığı metinler oluşturabilen, harita ve tablo gibi şekiller

Detaylı

Kopyalama ve Taşıma konularıyla ilgili daha değişik uygulamalar yaparak bu konunun pekiştirilmesini sağlamanız yararınıza olacaktır.

Kopyalama ve Taşıma konularıyla ilgili daha değişik uygulamalar yaparak bu konunun pekiştirilmesini sağlamanız yararınıza olacaktır. Kopyalama ve Taşıma konularıyla ilgili daha değişik uygulamalar yaparak bu konunun pekiştirilmesini sağlamanız yararınıza olacaktır. NOTLAR: 1. Bir Klasörün içindeki bir dosyayı fare sol tuşunu basılı

Detaylı

ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU

ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU ÇANKAYA ÜNİVERSİTESİ WEBMAIL KULLANIM KLAVUZU Üniversitemiz Webmail servisi yenilenmiş olup Roundcube webmail üzerinden servis vermeye başlamıştır. Daha önce kullanılan SquirrelMail servisi https://oldwebmail.cankaya.edu.tr/

Detaylı

2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI

2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI 2014-2015 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI İşletim Sisteminde Yapılan Uygulamalar Bir Bilgisayarda Hangi İşletim Sistemi Yüklü Olduğunu

Detaylı

Donatlar-NotePad DONATILAR

Donatlar-NotePad DONATILAR Donatlar-NotePad DONATILAR Donatılar işletim sistemiyle birlikte gelen programların yer aldığı bölümdür. Bu programlara Başlat-Tüm Programlar- Donatılar adımlarıyla ulaşılır. Not Defteri (Notepad) Sadece

Detaylı

Hizalama Word dokümanlarınızda oluşturduğunuz veya oluşturacağınız metinlerin hizalamasını yapabilirsiniz. Bu işlem için:

Hizalama Word dokümanlarınızda oluşturduğunuz veya oluşturacağınız metinlerin hizalamasını yapabilirsiniz. Bu işlem için: Biçimleme Metin biçimleme Hizalama Word dokümanlarınızda oluşturduğunuz veya oluşturacağınız metinlerin hizalamasını yapabilirsiniz. Bu işlem için: 1. Hizalamak istediğiniz metni seçin. 2. Giriş sekmesini

Detaylı

AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı

AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı AEGEE-Eskişehir Online Web Yönetim Paneli ( WEBBY ) Yardım Dökümanı Emre GÜLCAN IT Responsible & Web Admin AEGEE-Eskişehir emregulcan@gmail.com e_gulcan@hotmail.com 0535 729 55 20 1 1. YÖNETİM PANELİNE

Detaylı

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 6 1.1 Frontpage 2003 ün açılması Frontpage 2003 ü çalıştırabilmek için Başlat/Programlar/ Microsoft Office Microsoft Office Frontpage 2003 yolu izlenir. FrontPage 2003,

Detaylı

İçindekiler. Akıllı Tahta Uygulaması (ATU) Kullanma Kılavuzu. İçindekiler. Bölüm 1: Uygulama Hakkında Genel bilgi 2

İçindekiler. Akıllı Tahta Uygulaması (ATU) Kullanma Kılavuzu. İçindekiler. Bölüm 1: Uygulama Hakkında Genel bilgi 2 İçindekiler 1 İçindekiler Bölüm 1: Uygulama Hakkında Genel bilgi 2 Bölüm 2: Akıllı Tahta Uygulamasının Yüklenmesi Akıllı Tahta Uygulaması nı yükleme 3 Akıllı Tahta Uygulaması nı kaldırma 3 Akıllı Tahta

Detaylı

www.elektrikogretmenleri.com

www.elektrikogretmenleri.com DREAMWEAVERDA NESNELERE DAVRANIŞ EKLEME Dreamweaver da fare hareket olaylı, animasyonlu görüntüler oluşturmak istenildiğinde hazır scriptler anlamına gelen Davranışlar(behaviors) kullanılmaktadır. Yukarıdaki

Detaylı

Microsoft Office Publisher 2016

Microsoft Office Publisher 2016 Microsoft Office Publisher 2016 Publisher 2016 Publisher görsel açıdan zengin, profesyonel görünümlü yayınlar oluşturmanıza yardımcı olan bir masaüstü yayımcılık uygulamasıdır. Bilgisayarınızda Publisher'la

Detaylı

www.wikispaces.com Kullanım Kılavuzu

www.wikispaces.com Kullanım Kılavuzu www.wikispaces.com Kullanım Kılavuzu İnternet tarayıcınıza(internet Explorer vb.) www.wikispaces.com adresini yazıp enter tuşuna bastığınızda yukarıdaki ekranla karşılaşacaksınız. Önceden oluşturmuş olduğunuz

Detaylı

8.Sayfa ve 9.Yazım 10.Belge Görünüm 11.Ekran Yakınlaştırma Sözcük Sayısı Denetimi Düğmeleri ve Uzaklaştırma

8.Sayfa ve 9.Yazım 10.Belge Görünüm 11.Ekran Yakınlaştırma Sözcük Sayısı Denetimi Düğmeleri ve Uzaklaştırma Genel Ekran Görünümü 1.Ofis Düğmesi 2.Hızlı Erişim Araç Çubuğu 3.Belge Başlığı 4.Menüler 5.Menü Şeridi 6.Kaydırma Çubuğu 7.Cetveller 8.Sayfa ve 9.Yazım 10.Belge Görünüm 11.Ekran Yakınlaştırma Sözcük Sayısı

Detaylı

7. Çerçeveler. Bu bölümü bitirdiğinizde,

7. Çerçeveler. Bu bölümü bitirdiğinizde, 7. Çerçeveler Bu bölümü bitirdiğinizde, Çerçevelerden oluşan bir WEB sayfası tasarlamayı, İç içe çerçeveler oluşturmayı ve Çerçeveleri isimlendirmeyi, Bağ kurulan dosyaları belirtilen çerçeve içerisinde

Detaylı

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ

1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 1 MİCROSOFT FRONTPAGE 2003 E GİRİŞ 6 1.1 Frontpage 2003 ün açılması Frontpage 2003 ü çalıştırabilmek için Başlat/Programlar/ Microsoft Office Microsoft Office Frontpage 2003 yolu izlenir. FrontPage 2003,

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Publisher 2013 önceki sürümlerden farklı görünüyor, bu nedenle öğrenmenizi kolaylaştırmak için bu kılavuzu oluşturduk. Hızlı Erişim Araç Çubuğu En sevdiğiniz komutları

Detaylı

MS POWERPOINT 2010. Şekil 111 Powerpoint 2010 Programını Başlatmak

MS POWERPOINT 2010. Şekil 111 Powerpoint 2010 Programını Başlatmak MS POWERPOINT 2010 1.Giriş: PowerPoint, Windows ortamında çalışan bir sunu paket programıdır. Metin, taslak, çizim ve grafikler kullanılarak sunular, slaytlar, broşürler, bildiriler, konuşmacı notları

Detaylı

5.Slayt ana hat görünümü 6.Görev bölmesi penceresi 7.Not alanı 8.Durum çubuğu

5.Slayt ana hat görünümü 6.Görev bölmesi penceresi 7.Not alanı 8.Durum çubuğu MS POWERPOINT 2010 PowerPoint, Windows ortamında çalışan bir sunu paket programıdır. Metin, taslak, çizim ve grafikler kullanılarak sunular, slaytlar, broşürler, bildiriler, konuşmacı notları ve taslaklar

Detaylı

www.elektrikogretmenleri.com

www.elektrikogretmenleri.com FIREWORKS (MENU OLUŞ TURMA) 1 Önce Başlat menüsü Programlar Adobe Web Premium CS3 Adobe Fireworks CS3 kısayol simgesi ile Fireworks programı açılır. 2 Fireworks programı açıldığında Karşımıza gelen Yeni

Detaylı

2000 de Programlarla Çalışmalar

2000 de Programlarla Çalışmalar Windows 2000 de Programlarla Çalışmalar 24 3 Windows 2000 de Programlarla Çalışmalar Programları Başlatmak Programları başlat menüsünü kullanarak, başlatmak istediğiniz programın simgesini çift tıklayarak

Detaylı

INTERNET KAYNAKLARI. Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR

INTERNET KAYNAKLARI. Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR INTERNET KAYNAKLARI Wik.is Kılavuzu GRUP OTANTİK GRURLA SUNAR Bir Wiki ye Kayıt Olma 1. Öğrencileriniz ya da kurs katılımcılarınız için e- posta adresleri alın. 2. www.wik.is* adresine gidin. 3. Wik.is

Detaylı

ZİRVEDRİVEWEB YAZILIMI KULLANIM KILAVUZU

ZİRVEDRİVEWEB YAZILIMI KULLANIM KILAVUZU ZİRVEDRİVEWEB YAZILIMI KULLANIM KILAVUZU Kullanıcı Girişi:Giriş ekranınd dan kullanıcı adı ve şifre bilgileri girilip giriş butonuna basılaraksisteme giriş yapılır. Sistem Ekranı: 4 2 Klasörler Dosyalar

Detaylı

1. ÇALIŞMA ALANI hücre çalışma sayfası kitap Başlık çubuğu Formül çubuğu Aktif hücre Sekmeler Adres çubuğu Kaydırma çubukları Kılavuz çizgileri

1. ÇALIŞMA ALANI hücre çalışma sayfası kitap Başlık çubuğu Formül çubuğu Aktif hücre Sekmeler Adres çubuğu Kaydırma çubukları Kılavuz çizgileri 1. ÇALIŞMA ALANI Bir elektronik tablolama yazılımını açtığınızda göreceğiniz şey, kutularla dolu bir pencere olacaktır. Satırlar ve sütunların kesişmesiyle oluşan bu kutulara hücre adı verilir. Hücreleri

Detaylı

ZİRVEDRİVE IOS YAZILIMI KULLANIM KILAVUZU

ZİRVEDRİVE IOS YAZILIMI KULLANIM KILAVUZU ZİRVEDRİVE IOS YAZILIMI KULLANIM KILAVUZU Kullanıcı Girişi: Giriş ekranınd sisteme giriş yapılır. dan kullanıcı adı ve şifre bilgileri girilip giriş butonuna basılarak Sistem Ekranı: 4 2 1 2 3 Klasörler

Detaylı

MS WORD 4.BÖLÜM. Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek.

MS WORD 4.BÖLÜM. Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek. MS WORD 4.BÖLÜM Bölüm Adı: NESNE EKLEME Bölümün Amacı: Belgeye nesne ekleme işlemlerini gerçekleştirmek. Neler Öğreneceksiniz? Bu bölümü bitiren kişi: 1. Ekle sekmesini tanır. 2. Kapak sayfası oluşturabilir.

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Word 2013 önceki sürümlerden farklı görünüyor, bu nedenle öğrenmenizi kolaylaştırmak için bu kılavuzu oluşturduk. Hızlı Erişim Araç Çubuğu Buradaki komutlar her zaman

Detaylı

Photoshop ta Web Sayfaları Oluşturma

Photoshop ta Web Sayfaları Oluşturma Photoshop ta Web Sayfaları Oluşturma Dilimleme Photoshop ta üzerinde çalışılan resim dosyaları, düzenlenen fotoğraflar veya tasarlanan sayfalar web ortamında kullanılmak üzere hazırlanabilir. Bir web sayfasını

Detaylı

Kullanım Kılavuzu Milli Eğitim Bakanlığı 2010

Kullanım Kılavuzu Milli Eğitim Bakanlığı 2010 Kullanım Kılavuzu Milli Eğitim Bakanlığı 2010 Bu belge BT Sınıfı Etkinliklerinde Kullanılmak Üzere Hazırlanmıştır İÇİNDEKİLER GİRİŞ... 3 ÜYE (KAYIT) OLMA... 3 YÖNETİM PANELİ İŞLEMLERİ... 5 ŞABLON AYARLARI...

Detaylı

2. Belgeye Metin Ekleme

2. Belgeye Metin Ekleme METİN İŞLEMLERİ Flashta 2 çeşit metin vardır:1)tlf metni 2)Klasik metin 1)TLF Metni : CS5 ile başlayan metin türü. TLF metni FLA dosyanızın yayınlama ayarlarında ActionScript 3.0 ve Flash Player 10 veya

Detaylı

Microsoft Word 2010 ara yüzündeki bölümler aşağıda gösterilmiştir.

Microsoft Word 2010 ara yüzündeki bölümler aşağıda gösterilmiştir. Başlangıç Bu dersin amacı, öğrencilerin çalışma hayatlarında Microsoft Word programını daha etkili ve verimli kullanmalarını sağlamak ve karşılaştıkları sorunların çözümlerine ulaşma konusunda deneyim

Detaylı

KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU. Kaynak : www.veppa.

KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU. Kaynak : www.veppa. KOCAELİ TEKNİK LİSESİ ELEKTRİK ELEKTRONİK BÖLÜMÜ OTOMASYON ATÖLYESİ EKTS (Elektrik Kumanda Teknikleri Simülatörü ) DERS NOTU Kaynak : www.veppa.com Hakkında EKTS (Elektrik Kumanda Teknikleri Simülatörü

Detaylı

HTML içerik oluşturmak için düşünülen bir işaret dilidir. Örnek

HTML içerik oluşturmak için düşünülen bir işaret dilidir. Örnek STİLLER CSS NEDİR? CSS (Cascading Style Sheet) Stiller, HTML elemanlarının nasıl gösterileceğini tanımlar. Stiller HTML de karşılaşılan bazı problemleri çözmek için HTML 4.0 a eklenmiştir. HTML, web

Detaylı

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark

A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark 10 Frame Oluşturmak Standart bir HTML sayfası, tarayıcı penceresinin tamamını kaplayan tek bir bölgeden oluşur. Frame ler tarayıcı

Detaylı

4 Front Page Sayfası Özellikleri

4 Front Page Sayfası Özellikleri 4 Front Page Sayfası Özellikleri İsterseniz Frontpage penceresinin sağ tarafından, isterseniz araç çubuklarından faydalanarak yeni bir sayfa açın. Frontpage te çeşitli sayfa şablonları bulunmaktadır. Ancak

Detaylı

MIS213T İNTERNET VE WEB PROGRAMLAMA GÜZ 2016 LAB DOKÜMANI #2. 1. Bölüm: Temel HTML Etiketleri - Resimler

MIS213T İNTERNET VE WEB PROGRAMLAMA GÜZ 2016 LAB DOKÜMANI #2. 1. Bölüm: Temel HTML Etiketleri - Resimler MIS213T İNTERNET VE WEB PROGRAMLAMA GÜZ 2016 LAB DOKÜMANI #2 Konular - Temel HTML etiketleri kullanma, - Resim, arkaplan rengi, arkaplan resmi ekleme, - Link oluşturma ve ekleme, - Maddeleme, numaralandırma,

Detaylı

BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME

BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME BİLGİSAYARDA OFİS PROGRAMLARI BİÇİMLENDİRME Büro Yönetimi Öğretmeni Fatma GEZ BİÇİMLENDİRME Yazmış olduğumuz metinleri farklı boyut, renk, yazı tipi vb. özelliklerde yazabilmek için biçimlendirme işlemi

Detaylı

SAB 103 TEMEL BİLGİSAYAR KULLANIMI

SAB 103 TEMEL BİLGİSAYAR KULLANIMI SAB 103 TEMEL BİLGİSAYAR KULLANIMI Kelime İşlemci - Word Prof.Dr. Fatih TANK Ankara Üniversitesi Uygulamalı Bilimler Fakültesi Sigortacılık ve Aktüerya Bilimleri Bölümü Prof.Dr. Fatih TANK - Temel - Ders

Detaylı

T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi. ÖĞRETiM ELEMANI KULLANIM KILAVUZU

T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi. ÖĞRETiM ELEMANI KULLANIM KILAVUZU T.C. istanbul ÜNiVERSiTESi ÖĞRENCi BiLGi SiSTEMi ÖĞRETiM ELEMANI KULLANIM KILAVUZU 1 1. Sisteme Giriş Nokta Üniversite Otomasyonu sistemini kullanabilmek için öncelikle Windows işletim sisteminde bulunan

Detaylı

ÖNDER BİLGİSAYAR KURSU. Microsoft Office Kursu Eğitim İçeriği

ÖNDER BİLGİSAYAR KURSU. Microsoft Office Kursu Eğitim İçeriği ÖNDER BİLGİSAYAR KURSU Microsoft Office Kursu Eğitim İçeriği Microsoft WORD 1. PENCERE ELEMANLARI VE GÖRÜNTÜLEME BİÇİMLERİ 1.1. Genel Bilgiler 1.2. Ekran Görünümleri 1.3. Metin Sınırları ve Basımda Çıkmayan

Detaylı

ÖĞRENME FAALĠYETĠ 4 ÖĞRENME FAALĠYETĠ 4 4. SAYFA YAPISI

ÖĞRENME FAALĠYETĠ 4 ÖĞRENME FAALĠYETĠ 4 4. SAYFA YAPISI ÖĞRENME FAALĠYETĠ 4 AMAÇ ÖĞRENME FAALĠYETĠ 4 Bu faaliyette verilen bilgiler doğrultusunda hazırlamıģ olduğunuz belgenin özelliğine göre sayfa yapısı ve yazdırma ayarlarını hatasız yapabileceksiniz. ARAġTIRMA

Detaylı

08.11.2015 WORD KULLANIMI

08.11.2015 WORD KULLANIMI KELİME İŞLEMCİ-MİCROSOFT OFFİCE OFFICE DÜĞMESİ HIZLI ERİŞİM ARAÇ ÇUBUĞU MENÜLER ŞEKİL, RESİM EKLEME TABLO EKLEME ETKİNLİKLER 1 OFFICE DÜĞMESİ: Çalışmamız ile ilgili dosya işlemleri yapmamızı sağlar. Yeni

Detaylı

Microsoft PowerPoint

Microsoft PowerPoint Microsoft PowerPoint GİRİŞ Microsoft Powerpoint bir sunum hazırlama programıdır. Microsoft Powerpoint sayesinde sunumlarınıza içerisinde ses,video,animasyon,grafik,resim,köprüler,web içerikleri ve çeşitli

Detaylı

Kullanıcı Kılavuzu. Temel Arama. help.ebsco.com

Kullanıcı Kılavuzu. Temel Arama. help.ebsco.com Kullanıcı Kılavuzu Temel Arama help.ebsco.com EBSCOhost lider bilgi sağlayıcılarından derlenmiş çeşitli tam metin ve popüler veri tabanları sunan güçlü bir danışma aracıdır. Bu kullanıcı kılavuzunda, EBSCOhost

Detaylı

MICROSOFT OFFİCE WORD PROGRAMI DOSYA İŞLEMLERİ

MICROSOFT OFFİCE WORD PROGRAMI DOSYA İŞLEMLERİ MICROSOFT OFFİCE WORD PROGRAMI Ms Word bir kelime işlemci programıdır. İçinde bulunan detaylı metin biçimlendirme seçenekleri, ayrıntılı tablo, şekil ve grafik oluşturma başarıları nedeniyle, kendi türünde

Detaylı

MICROSOFT WORD 2002. Şekil 1

MICROSOFT WORD 2002. Şekil 1 MICROSOFT WORD 2002 Microsoft Word 2002, bir kelime işlem programı olup, Microsoft Office XP bileşenidir. Word 2002 programı kullanılarak, mektup, rapor, kitap gibi belgeler hazırlanabilir. Bu belgelere

Detaylı

Stil Sayfaları Geliştirmek

Stil Sayfaları Geliştirmek A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark 4 Stil Sayfaları Geliştirmek Cascading Style Sheets (CSS) olarak adlandırılan stil sayfaları, metinler ve resimler gibi çeşitli elemanların

Detaylı

MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI

MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI MICROSOFT OFFICE WORD 2010 ÖRNEK TEST SORULARI 1-) Word 2010 nedir? A-) Hesap Programıdır B-) Tablo - Grafik Programıdır C-) Kelime İşlem Programıdır D-) İşletim Sistemidir 2-) Microsoft Word 2007 programında

Detaylı

Dreamweaver 8. Çalışma alanı yerleşimi. Doküman Penceresi (Document window)

Dreamweaver 8. Çalışma alanı yerleşimi. Doküman Penceresi (Document window) Çalışma alanı yerleşimi Dreamweaver 8 Windows ta, bütün işlemlerin tek pencereden yapıldığı bir entegre yerleşim sunmaktadır. Bu entegre çalışma alanında, bütün pencereler ve paneller tek bir büyük uygulama

Detaylı

HTML Bloklar. CSS Display özelliği

HTML Bloklar. CSS Display özelliği HTML Bloklar Tüm HTML etiketleri için varsayılan bir görünüm değeri vardır ve blok yada satıriçi olarak belirtilir. Blok tipindeki etiketler her zaman yeni bir satırda başlar ve tüm satır boyunca mümkün

Detaylı

VERİ TABANI UYGULAMALARI

VERİ TABANI UYGULAMALARI V. Ünite VERİ TABANI UYGULAMALARI A. BAŞLANGIÇ B. BİR VERİ TABANI YARATMA C. FORMLARIN KULLANIMI D. BİLGİYE ERİŞİM E. RAPORLAMA 127 A BAŞLANGIÇ Konuya Hazırlık 1. Veri tabanı programları hangi amaç için

Detaylı

Yine benzer şekilde hücreler içine yazılan yazıların renklerini değiştirebiliriz. Bunun için tüm satırı veya sütunu yine fareyle seçmek durumundayız.

Yine benzer şekilde hücreler içine yazılan yazıların renklerini değiştirebiliriz. Bunun için tüm satırı veya sütunu yine fareyle seçmek durumundayız. 2. EKLE SEKMESĐ TABLO EKLEMEK: Sayfamıza tablo eklemek için, TABLO butonuna bastıktan sonra açılan pencereden kaç sütün ve kaç satırlık bir tablo oluşturacağımızı belirliyoruz. Fareyi sürüklemek, tablonun

Detaylı

5.bölümde ise dosya göz atıcı ve dosya menüsü yer almaktadır. Dosya göz atıcıyı incelemek için klasör simgesine tıklayınız.

5.bölümde ise dosya göz atıcı ve dosya menüsü yer almaktadır. Dosya göz atıcıyı incelemek için klasör simgesine tıklayınız. Antropi Teach ekranı, 5 bölümden oluşmaktadır. 1.bölümde silgi ve araç kutusu yer almaktadır. 2.bölümde sayfalar arası geçiş yapmayı sağlayan yön okları bulunmaktadır. 3.bölüm tahta işlemi görmektedir.

Detaylı

OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ

OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ Çalışma Kitapları Oluşturmak OFFICE EXCEL 2007 TEMEL EĞĐTĐMĐ Var olan verilerinizin hiçbiriyle ilişkili olmayan verileri toplamak ve depolamak istediğinizde, yeni bir çalışma kitabı oluşturmanız gerekir.

Detaylı

Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri

Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri Temel Bilgi Teknolojileri - I Ayrıntılı Ders İçerikleri Bilgi Teknolojileri (IT) Kavramları, Bilgisayar Kullanımı ve Dosyaların Yönetimi, Bilgi ve İletişim HAFTA 1 1. Genel Kavramlar(Bilgisayarın tanımı,bilgi

Detaylı

Kopya Hakkı 2005 The European Computer Driving Licence Foundation Ltd

Kopya Hakkı 2005 The European Computer Driving Licence Foundation Ltd Tüm haklar mahfuzdur. Bu yayının hiçbir kısmı ECDL Kuruluşundan izin almadan hiçbir şekilde çoğaltılamaz. Çoğaltım talepleri yayıncıya yapılmalıdır. The European Computer Driving Licence Foundation Ltd

Detaylı

MS WORD 5. BÖLÜM. Şekil 3. 100. Sayfa Düzeni Sekmesi. Şekil 3. 101. Temalar Grubu

MS WORD 5. BÖLÜM. Şekil 3. 100. Sayfa Düzeni Sekmesi. Şekil 3. 101. Temalar Grubu MS WORD 5. BÖLÜM Bölüm Adı: SAYFA DÜZENİ Bölümün Amacı: Sayfa yapısı ve düzenini değiştirmek. Neler Öğreneceksiniz? Bu bölümü bitiren kişi: 1. Ofis temalarını bilir. 2. Kenar boşluklarını, sayfa yönlendirmesini,

Detaylı

TEMEL BİLGİSAYAR. Ders Notları. Yrd. Doç. Dr. Seyit Okan KARA

TEMEL BİLGİSAYAR. Ders Notları. Yrd. Doç. Dr. Seyit Okan KARA TEMEL BİLGİSAYAR Ders Notları Yrd. Doç. Dr. Seyit Okan KARA Pencerenin ortasında bulunan beyaz sayfa, slayt tasarımında kullanacağımız sayfamızdır. Sol panelde bu slayt sayfasının küçültülmüş halde bir

Detaylı

Bilgisayar Programcılığı Ön Lisans Programı WEB EDİTÖRÜ. Öğr. Gör. Rıza ALTUNAY

Bilgisayar Programcılığı Ön Lisans Programı WEB EDİTÖRÜ. Öğr. Gör. Rıza ALTUNAY CSS Ünite 7 Bilgisayar Programcılığı Ön Lisans Programı WEB EDİTÖRÜ Öğr. Gör. Rıza ALTUNAY 1 Ünite 7 CSS Öğr. Gör. Rıza ALTUNAY İçindekiler 7.1. CSS KULLANIM ALANLARI... 3 7.1.1. Yerel Kullanım Alanı...

Detaylı

düğmesine ile bir sayfa yukarıya, düğmesi ile bir sayfa aşağı gidebilirsiniz.

düğmesine ile bir sayfa yukarıya, düğmesi ile bir sayfa aşağı gidebilirsiniz. Metin işlemleri Bu bölümde belgenizde değişiklik veya düzenleme yapmak istediğinizde ihtiyaç duyacağınız işlemler ile metin girişini kolaylaştıracak araçlara yer verilmiştir. Dolaşma Belge içinde dolaşmak

Detaylı

ÇANKIRI KARATEKİN ÜNİVERSİTESİ ZİMBRA E-POSTA SİSTEMİ KULLANICI DOKÜMANI

ÇANKIRI KARATEKİN ÜNİVERSİTESİ ZİMBRA E-POSTA SİSTEMİ KULLANICI DOKÜMANI ÇANKIRI KARATEKİN ÜNİVERSİTESİ ZİMBRA E-POSTA SİSTEMİ KULLANICI DOKÜMANI İÇİNDEKİLER GİRİŞ... 3 EPOSTA SİSTEMİNE BAĞLANMA... 3 ESKİ E-POSTLAR... 5 YENİ KİŞİ VEYA GÖREV OLUŞTURMA... 6 MESAJ YAZMA... 6 KİŞİLER...

Detaylı

Microsoft Word 2010 Uygulama 1

Microsoft Word 2010 Uygulama 1 Microsoft Word 2010 Uygulama 1 1. Bulunduğunuz bilgisayarın Belgelerim klasörü altında adına kendi numaranızı verdiğiniz bir klasör oluşturun. Uygulamaya başlamadan önce Elektronik Destek Sisteminde bulunan

Detaylı

Modu l 8: Sunu Hazırlama

Modu l 8: Sunu Hazırlama Modu l 8: Sunu Hazırlama Hazırlayan: H.Hakan Çetinkaya Bu konu bittiğinde; Ms. PowerPoint programı hakkında kısaca bilgi edinecek, Ms. PowerPoint dosyalarını nasıl oluşturacağınızı ve nasıl kaydedeceğinizi

Detaylı

Her bir ofis programının olduğu gibi FrontPage inde bir dosya uzantısı vardır. Bunlar *.html veya *.htm dosya uzantılarıdır.

Her bir ofis programının olduğu gibi FrontPage inde bir dosya uzantısı vardır. Bunlar *.html veya *.htm dosya uzantılarıdır. FrontPage Nasıl Kullanılır? 1 Giriş FrontPage programı kolay şekilde web siteler hazırlayabileceğiniz ofis yazılımlarından birisidir. Hiçbir kod bilgisi gerektirmeden tasarımlarını kolay şekilde yapabileceğini

Detaylı

ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI

ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI ÜNİTE 1: KELİME İŞLEMCİ PROGRAMI Kelime İşlemci Nedir? Bilgisayarda yazıların(metinlerin) yazılmasını ve düzenlenebildiği, resimlerin ve tabloların eklenebildiği yazılımların(programların) genel adıdır.

Detaylı

Hızlı Başlangıç Kılavuzu

Hızlı Başlangıç Kılavuzu Hızlı Başlangıç Kılavuzu Microsoft Access 2013 önceki sürümlerden farklı görünmektedir, dolayısıyla öğrenme eğrisini en aza indirmenize yardımcı olmak üzere bu kılavuzu hazırladık. Ekran boyutunu değiştirme

Detaylı

İmleci yazıya getirip tıklayınca aşağıda hangi tag ler içinde olduğunu gösterir.

İmleci yazıya getirip tıklayınca aşağıda hangi tag ler içinde olduğunu gösterir. 21 Aralık 2011 / Çarşamba Önce bir site tanımlayacağız, yani önce çalışacağımız klasörü oluşturacağız. Bunun içinde, bir de resim klasörünü oluşturacağız. Görünüm : Classic Site Manage Site sitede düzenleme

Detaylı

Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. Microsoft Word 2010 programı hakkında temel bilgileri öğrenmek.

Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. Microsoft Word 2010 programı hakkında temel bilgileri öğrenmek. Amaçlarımız 2 Kelime işlemcilerin işlevlerini öğrenmek. Başlıca kelime işlemcileri tanımak. programı hakkında temel bilgileri öğrenmek. da metin biçimlendirmek. 1 Kelime İşlemcilerin İşlevleri 3 Kelime

Detaylı

Pencereler Pencere Özellikleri

Pencereler Pencere Özellikleri Pencereler Pencere Özellikleri Pencereler Windows işletim sistemleri pencere yapıları üzerine inşa edilmiştir. WINDOWS 7 de tüm işlemler pencereler yardımı ile gerçekleştirilebilmektedir. Programlar ve

Detaylı

EBA Dosya Uygulaması Kullanıcı Kılavuzu ( W eb)

EBA Dosya Uygulaması Kullanıcı Kılavuzu ( W eb) EBA Dosya Uygulaması Kullanıcı Kılavuzu ( W eb) İçindekiler EBA Dosya Nedir?... 1 Kimler kullanabilir?... 2 Uygulama Ne işe Yarar?... 2 Sisteme internet üzerinden giriş nasıl yapılır?... 2 Yeni bir klasör

Detaylı

MODÜL 3 KELİME İŞLEM UYGULAMALARI 1

MODÜL 3 KELİME İŞLEM UYGULAMALARI 1 MODÜL 3 KELİME İŞLEM UYGULAMALARI 1 Kelime İşlemci I. Uygulamanın Kullanımı A. Kelime İşlemcisiyle İlk Adımlar B. Ayarların Yerleştirilmesi C. Kaydetmek D. Yardım Fonksiyonlarını Kullanma II. Temel İşlemler

Detaylı

Copyright 2017 HP Development Company, L.P.

Copyright 2017 HP Development Company, L.P. Kullanıcı Kılavuzu Copyright 2017 HP Development Company, L.P. Bu belgede yer alan bilgiler önceden bildirilmeden değiştirilebilir. HP ürünleri ve hizmetlerine ilişkin garantiler, bu ürünler ve hizmetlerle

Detaylı

BİLGİSAYAR 4 MOLEKÜLER BİYOLOJİ VE GENETİK BÖLÜMÜ YARD. DOÇ. DR. MEHTAP YALÇINKAYA 08.04.2011

BİLGİSAYAR 4 MOLEKÜLER BİYOLOJİ VE GENETİK BÖLÜMÜ YARD. DOÇ. DR. MEHTAP YALÇINKAYA 08.04.2011 BİLGİSAYAR 4 MOLEKÜLER BİYOLOJİ VE GENETİK BÖLÜMÜ HTML DERS NOTLARI 6. DERS YARD. DOÇ. DR. MEHTAP YALÇINKAYA 08.04.2011 HYPERLINKS - KÖPRÜ Sayfalara link (bağlantılar) oluşturmak için kullanılır.

Detaylı

ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3

ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 ÖĞRENME FAALİYETİ 3 AMAÇ Bu öğrenme faaliyeti ile tasarım düzenlemelerini yapabileceksiniz. ARAŞTIRMA Tema ne demektir? Temayı oluşturan ögeler nelerdir? Araştırınız. Arka plan ne demektir?

Detaylı

1. MİCROSOFT EXCEL 2010 A GİRİŞ

1. MİCROSOFT EXCEL 2010 A GİRİŞ 1. MİCROSOFT EXCEL 2010 A GİRİŞ 1.1. Microsoft Excel Penceresi ve Temel Kavramlar Excel, Microsoft firması tarafından yazılmış elektronik hesaplama, tablolama ve grafik programıdır. Excel de çalışılan

Detaylı

Flow Kullanım Klavuzu Mart 2014

Flow Kullanım Klavuzu Mart 2014 Flow Kullanım Klavuzu Mart 2014 İçindekiler Flow nedir? Bir Flow hesabı oluşturmak Oturum açmak Flow Hesabınız Genel Görünüm Flow Hesabınız Kullanım + Add (ekle butonu) Bibliography (Künye/Atıf butonu)

Detaylı

Kütüphane Öğelerini Kullanmak

Kütüphane Öğelerini Kullanmak A-PDF Split DEMO : Purchase from www.a-pdf.com to remove the watermark 12 Kütüphane Öğelerini Kullanmak Web sitenizde tekrar tekrar kullanmanız gerekebilecek pek çok öğe ve öğe grubu vardır. Bunların arasında

Detaylı

"Her zaman düzeltme öner" seçeneği işaretliyse solda bulunan pencerenin "Öneriler" bölümünde düzeltme önerir.

Her zaman düzeltme öner seçeneği işaretliyse solda bulunan pencerenin Öneriler bölümünde düzeltme önerir. ARAÇLAR: Yazım ve Dilbilgisi (F7): Yazılan belgede bulunan yazım hatalarını bulmak için kullanılır. Microsoft'un hazırladığı Office programı ile birlikte bilgisayara yüklenen sözlük (custom.dic) kullanılanarak

Detaylı

2-Hafta Temel İşlemler

2-Hafta Temel İşlemler 2-Hafta Temel İşlemler * Html Komutlarının Yapısı * Açıklamalar * Htm Sayfasının Oluşturulması * Temel Html Komutları * Html Sayfalarının Düzenlenmesi * Html Sayfalarının İncelenmesi Html Komutlarının

Detaylı

Metin İşlemleri, Semboller

Metin İşlemleri, Semboller Ankara Üniversitesi Nallıhan Meslek Yüksekokulu Metin İşlemleri, Semboller NBP108 - GRAFİK ANİMASYON il Öğr.Gör. Salih ERDURUCAN 1 / 13 3. METİN İŞLEMLERİ 3.1. Metin Aracı Animasyon yazılımı yazı yazmak

Detaylı

2. HTML Temel Etiketleri

2. HTML Temel Etiketleri 2. HTML Temel Etiketleri Bu bölümü bitirdiğinizde, HTML ve etiket kavramlarının ne olduğunu, HTML komut yapısını, Örnek bir HTML dosyasının nasıl oluşturulduğunu, Temel HTML etiketlerinin neler olduğunu,

Detaylı

BİLGİSAYAR UYGULAMALARI BÖLÜM 2

BİLGİSAYAR UYGULAMALARI BÖLÜM 2 BİLGİSAYAR UYGULAMALARI BÖLÜM 2 Microsoft Word, bir kelime işlem programı olup, gelişmiş bir Windows altı programdır. Word programı kullanılarak; mektup, rapor, kitap gibi belgeler hazırlanabilir. Bu belgelere

Detaylı

Kişisel Web Sayfası Tasarım Sistemi

Kişisel Web Sayfası Tasarım Sistemi Kişisel Web Sayfası Tasarım Sistemi Kullanım Kılavuzu Faik Demirbaş Ankara 2010 2 Kişisel Web Sayfası Tasarım Sistemi İçindekiler Giriş... 3 Kişisel Web Sayfası Tasarım Sistemine Giriş... 3 Menü İşlemleri...

Detaylı

EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI

EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI 2015-2016 EĞİTİM-ÖĞRETİM YILI BİLİŞİM TEKNOLOJİLERİ VE YAZILIM DERSİ 6. SINIF 2. DÖNEM 2. SINAV ÇALIŞMA NOTLARI MİCROSOFT EXCEL PROGRAMI Programın Açılışı: Başlat Tüm Programlar Microsoft Office Microsoft

Detaylı

Microsoft Access 2003 ten. Access 2010 a geçiş

Microsoft Access 2003 ten. Access 2010 a geçiş Bu Kılavuzda Microsoft Microsoft Access 2010 un görünüşü çok farklı olduğundan, öğrenme çabasını en aza indirmede size yardımcı olmak amacıyla bu kılavuzu hazırladık. Yeni arabirimin önemli bölümlerini

Detaylı

MICROSOFT WORD Şekil 1

MICROSOFT WORD Şekil 1 MICROSOFT WORD 2000 Microsoft Word, bir kelime işlem programı olup, çok gelişmiş bir Windows altı programdır. Word programı kullanılarak; mektup, rapor, kitap gibi belgeler hazırlanabilir. Bu belgelere

Detaylı

Ecat 8. Hakbim Bilgi İşlem A.Ş. Versiyon

Ecat 8. Hakbim Bilgi İşlem A.Ş. Versiyon Ecat 8 Hakbim Bilgi İşlem A.Ş. Versiyon 2015 01.01 1 Ecat8 Nedir? Firmaların elektronik yedek parça kataloğu ihtiyacını karşılamak için Hakbim Bilgi İşlem tarafından geliştirilmiş ve geliştirilmeye devam

Detaylı

Windows Live Movie Maker

Windows Live Movie Maker Windows Live Movie Maker Nedir? Movie Maker ile, bilgisayarınızda yer alan fotoğraf ve videolarınızı kullanarak, bunlar üzerinde düzenlemeler, değişiklikler yapabilir, müzik dosyaları ekleyebilir, mikrofon

Detaylı

WEB SİTESİ YÖNETİM PANELİ KULLANMA YÖNERGESİ

WEB SİTESİ YÖNETİM PANELİ KULLANMA YÖNERGESİ WEB SİTESİ YÖNETİM PANELİ KULLANMA YÖNERGESİ Web Sitesi Yönetim Paneli, Üniversitemiz web sitesinde, birimlerimize ait web sitelerindeki içerikler üzerinde ekleme, silme, değiştirme gibi güncelleme işlemlerini,

Detaylı

GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA

GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA GOOGLE DRİVE KULLANARAK FORM OLUŞTURMA Google Docs yani Google Dokümanlar hizmeti bir süre önce Google Drive adlı bulut depolama hizmetinin içerisine alındı ve çok daha gelişerek yoluna devam etti. Google

Detaylı

13 DİNAMİK ÖĞELERLE ÇALIŞMA

13 DİNAMİK ÖĞELERLE ÇALIŞMA 69 13 DİNAMİK ÖĞELERLE ÇALIŞMA Çoğu internet sitesinde sayfa solunda tüm linklerin (köprülerin) bulunduğu bir bölüm vardır. Ziyaretçi web tasarımcının sunduğu bu bölümlerdeki etkileşimli düğmeleri kullanarak

Detaylı

Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir.

Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir. Sayfa numarası ekleme: Ekle menüsünden sayfa numaraları seçeneğine tıklandığında Açılan penceren gerekli ayarlamalar yapılarak sayfa numaraları görüntülenir. Tarih ve saat ekleme: Ekle menüsünden Tarih

Detaylı