Görüntüler hakkında

Birçok farklı grafik dosyası formatı türü vardır, ancak üç grafik dosya formatı genellikle web sayfalarında kullanılır—GIF, JPEG ve PNG. GIF ve JPEG dosya formatları en iyi desteklenen ve birçok tarayıcıda en iyi görünen formatlardır.

GIF (Graphics Interchange Format)

GIF dosyaları en fazla 256 renk kullanır ve sürekli olmayan görüntüleri veya gezinme çubukları, düğmeler, simgeler, logolar veya tek renk veya ton kullanan diğer görüntüler gibi geniş düz renkli alan kullanan görüntüleri göstermek için en uygun formattır.

JPEG (Joint Photographic Experts Group)

JPEG dosya formatı, milyonlarca renk içerdiğinden fotoğraf veya sürekli olmayan tonlu görüntüler için en iyi formattır. JPEG dosyasının kalitesi arttıkça, dosya boyutu ve dosya indirme süresi de artar. JPEG dosyasını sıkıştırarak genellikle görüntü kalitesi ile dosya boyutu arasında iyi bir denge kurabilirsiniz.

PNG (Portable Network Group)

PNG dosya formatı, dizinlenmiş renk, gri tonlama ve gerçek renkli görüntüler desteği ile saydamlık için alfa kanalı desteği içeren GIF'lerin yerine kullanılan patent içermeyen dosya formatıdır. PNG, Adobe® Fireworks® uygulamasının esas dosya formatıdır. PNG dosyaları, tüm orijinal katman, vektör, renk ve efekt bilgilerini (alt gölge gibi) korur ve öğeler her zaman tamamen düzenlenebilir. Dosyaların Dreamweaver tarafından PNG dosyası olarak tanınması için .png dosya uzantısına sahip olması gerekir.

Görüntü ekleme

Dreamweaver belgesine görüntü eklediğinizde, HTML kaynak kodunda görüntü dosyasına referans üretilir. Bu referansın doğru olduğundan emin olmak için görüntü dosyası geçerli sitede olmalıdır. Geçerli sitede değilse, Dreamweaver dosyayı siteye kopyalamak isteyip istemediğinizi sorar.

Görüntüleri dinamik olarak da ekleyebilirsiniz. Dinamik görüntüler, sürekli değişen görüntülerdir. Örneğin, bant reklamın dönüş sistemleri olası bant reklamlar listesinden tek bir bant reklam seçmeli ve ardından seçili bant reklam görüntüsünü sayfa istendiğinde dinamik olarak görüntülemelidir.

Görüntüyü ekledikten sonra görme sorunu olan kullanıcıların kullandığı ekran okuyucular tarafından okunabilecek görüntü etiketi erişilebilirlik nitelikleri ayarlayabilirsiniz. Bu nitelikler HTML koduyla düzenlenebilir.

Görüntü eklemeyle ilgili eğitim için bkz. Görüntü ekleme.

  1. Belge penceresinde görüntünün olmasını istediğiniz yere ekleme noktasını yerleştirin ve aşağıdakilerden birini yapın:

    • Ekle panelinin Genel kategorisinde Görüntüler simgesini tıklatın.
    • Ekle panelinin Ortak kategorisinde Görüntüler düğmesini tıklatın ve Görüntü simgesini seçin. Ekle panelinde Görüntü simgesi görüntülendiğinde simgeyi Belge penceresine (veya kodla çalışıyorsanız Kod görünümü penceresine) sürükleyebilirsiniz.
    • Ekle > Görüntü seçeneğini belirleyin.
    • Varlıklar panelinden bir görüntüyü (Pencere > Varlıklar) Belge penceresinde istenen konuma sürükleyin; ardından 3. adıma geçin.
    • Dosyalar panelinden görüntüyü Belge penceresinde istediğiniz konuma sürükleyin ve ardından 3. adıma geçin.
    • Masaüstünden görüntüyü Belge penceresinde istediğiniz konuma sürükleyin ve ardından 3. adıma geçin.
  2. Görüntülenen iletişim kutusunda aşağıdakilerden birini yapın:
    • Görüntü dosyası seçmek için Dosya Sistemi seçeneğini belirleyin.
    • Dinamik görüntü kaynağı belirlemek için Veri Kaynağı öğesini seçin.
    • Dreamweaver sitelerinizden birinin uzak klasöründe bulunan bir görüntü dosyasını seçmek için Siteler ve Sunucular düğmesini tıklatın.
  3. Eklemek istediğiniz görüntüyü veya içerik kaynağını seçmek için gözatın.

    Kaydedilmemiş bir belgede çalışıyorsanız, Dreamweaver görüntü dosyasına bir file:// referansı oluşturur. Belgeyi sitede herhangi bir yere kaydettiğinizde, Dreamweaver referansı belgeye göre yola dönüştürür.

    Not:

    Görüntüleri eklerken uzak sunucuda bulunan bir görüntüye kesin yol kullanmak da mümkündür (örn: yerel sabit diskte bulunmayan bir görüntü). Çalışırken performans sorunları yaşıyorsanız, Komutlar > Harici Dosyaları Görüntüle seçeneğini iptal ederek Tasarım görünümünde görüntünün gösterilmesini devre dışı bırakabilirsiniz.

  4. Tamam'ı tıklatın. Tercihler (Düzen > Tercihler) içindeki iletişim kutusunu etkinleştirdiyseniz Görüntü Etiketi Erişilebilirlik Nitelikleri iletişim kutusu görünür.

  5. Alternatif Metin ve Uzun Açıklama metin kutularına değerleri girin ve Tamam'ı tıklatın.
    • Alternatif Metin kutusunda görüntünün kısa açıklamasının adını girin. Ekran okuyucular buraya girdiğiniz bilgileri okur. Girişinizi 50 karakterle sınırlamalısınız. Daha uzun açıklamalar için Uzun Açıklama metin kutusunda görüntü hakkında daha fazla bilgi veren bir dosyaya bağ vermeyi düşünün.
    • Uzun Açıklama kutusunda, kullanıcı görüntüyü tıklattığında görüntülenecek dosya konumunu girin veya dosyaya gözatmak için klasör simgesini tıklatın. Bu metin kutusu görüntüye göre veya hakkında daha fazla bilgi veren bir dosyaya bağ sağlar.

    Not:

    Gereksinimlerinize uygun olarak bir veya iki metin kutusuna da bilgi girebilirsiniz. Ekran okuyucular görüntünün Alt niteliğini okur.

    Not:

    İptal'i tıklatırsanız, görüntü belgede görüntülenir ancak Dreamweaver, erişilebilirlik etiketlerini veya niteliklerini görüntüyle ilişkilendirmez.

  6. Özellik denetçisinde (Pencere > Özellikler) görüntünün özelliklerini ayarlayın.

Görüntü özelliklerini ayarlama

Görüntü Özellik denetçisi görüntünün özelliklerini ayarlamanıza olanak sağlar. Görüntü özelliklerinin tamamını görmüyorsanız, sağ alt köşedeki genişletici oku tıklatın.

Özellik denetçisinde Görüntüler özellikleri.
  1. Seçili bir görüntünün Özellik denetçisini görüntülemek için Pencere > Özellikler seçeneğini belirleyin.

  2. Minik resim görüntüsünün altındaki metin kutusuna adı girin, böylece bir Dreamweaver davranışı kullanırken (Görüntü Değiştir gibi) veya JavaScript ya da VBScript gibi bir komut dosyası dili kullanırken görüntüye başvuruda bulunabilirsiniz.
  3. Görüntü seçeneklerinden herhangi birini ayarlayın.

    G ve Y

    Piksel cinsinden görüntünün genişliği ve yüksekliğidir. Görüntüyü sayfaya eklediğinizde Dreamweaver bu metin kutularını otomatik olarak görüntünün orijinal boyutlarıyla güncelleştirir.

    Görüntünün gerçek genişlik ve boyutuyla uyuşmayan G ve Y değerleri girerseniz, görüntü tarayıcıda düzgün görüntülenmeyebilir. (Orijinal değerlere geri dönmek için G ve Y metin kutusu etiketlerini tıklatın veya yeni değer girerken G ve Y metin kutularının sağında görüntülenen Görüntü Boyutunu Sıfırla düğmesini tıklatın.

    Not:

    Bu görüntü örneğinin görüntülenme boyutunu ölçeklendirmek için bu değerleri değiştirebilirsiniz, ancak bu, görüntüyü ölçeklendirmeden önce görüntü verilerinin tamamını yüklediğinden indirme süresini azaltmaz. İndirme süresini azaltmak ve görüntünün tüm örneklerinin aynı boyutta görüntülendiğinden emin olmak için görüntüleri ölçeklendirmek amacıyla görüntü düzenleme programı kullanın.

    Kaynak

    Görüntünün kaynak dosyasını belirtir. Kaynak dosyasını bulmak için klasör simgesini tıklatın veya yolu yazın.

    Bağ

    Görüntünün köprüsünü belirtir. Dosyalar panelinde dosyaya Dosyaya İşaret Et simgesini sürükleyin, sitenizdeki belgeyi bulmak için klasör simgesini tıklatın veya URL'yi elle yazın.

    Alt

    Salt metin tarayıcılar veya görüntüleri manuel olarak indirmek üzere ayarlanmış tarayıcılar için görüntü yerine gösterilen alternatif metni belirtir. Salt metin tarayıcılarla konuşma sentezleyicisi kullanan görme sorunu olan kullanıcılar için metin yüksek sesle okunur. Bazı tarayıcılarda bu metin imleç görüntünün üzerine getirildiğinde görüntülenir.

    Eşleşme Adı ve Etkin Nokta araçları

    İstemci tarafı görüntü eşleşmesini etiketlemenize ve oluşturmanıza olanak sağlar.

    Hedef

    Bağlanan sayfanın yükleneceği çerçeveyi veya pencereyi belirtir. (Görüntü başka bir dosyaya bağlanmadığında bu seçenek kullanılamaz.) Geçerli çerçeve kümesindeki tüm çerçevelerin adları Hedef listesinde görüntülenir. Aşağıdaki ayrılmış hedef adlarından da seçim yapabilirsiniz:

    • _blank bağlı dosyayı adlandırılmamış, yeni bir tarayıcı penceresine yükler.

    • _parent bağlı dosyayı, bağı içeren çerçevenin üst çerçeve kümesine ya da penceresine yükler. Bağı içeren çerçeve yuvalanmış değilse bağlı dosya, tarayıcı penceresinin tamamında açılır.

    • _self bağlı dosyayı, bağla aynı çerçeveye ya da pencereye yükler. Bu hedef varsayılandır, bu nedenle genellikle belirlemenize gerek yoktur.

    • _top bağlı dosyayı tarayıcı penceresinin tamamında açarak tüm çerçeveleri kaldırır.

    Düzenle

    Harici Düzenleyiciler tercihlerinde belirlediğiniz görüntü düzenleyiciyi başlatır ve seçili görüntüyü açar.

    Orijinalden güncelle

    Web görüntüsü (diğer bir deyişle Dreamweaver sayfasındaki görüntü) orijinal Photoshop dosyasıyla senkronize olmadığında Dreamweaver orijinal dosyanın güncellenmediğini algılar ve Akıllı Nesne simgesi oklarından birini kırmızı olarak görüntüler. Web görüntüsünü Tasarım görünümünde seçip Özellik denetçisindeki Orijinalden Güncelleştir düğmesini tıklattığınızda orijinal Photoshop dosyasında yaptığınız değişiklikleri yansıtarak görüntü otomatik olarak güncelleştirilir.

    Görüntü ayarlarını düzenle

     Görüntü En İyileştirme iletişim kutusunu açar ve görüntüyü en iyileştirmenize olanak sağlar.

    Kırp

     Seçili görüntüdeki istenmeyen alanları kaldırarak görüntünün boyutunu keser.

    Yeniden Örnekle

     Yeniden boyutlandırılan görüntüyü, yeni boyutu ve şeklinde resim kalitesini artırarak yeniden örnekler.

    Parlaklık ve Kontrast

     Görüntünün parlaklık ve kontrast ayarlarını belirler.

    Keskinleştir

     Görüntünün keskinlik ayarlarını belirler.

Kodda görüntü erişilebilirlik niteliklerini düzenleme

Görüntü için erişilebilirlik niteliklerini eklediyseniz, bu değerleri HTML kodunda düzenleyebilirsiniz.

  1. Belge penceresinde görüntüyü seçin.
  2. Aşağıdakilerden birini yapın:
    • Kod görünümünde ilgili görüntü niteliklerini düzenleyin.
    • Sağ tıklatın (Windows) veya Control tuşunu basılı tutup tıklatın (Macintosh) ve ardından Etiketi Düzenle'yi seçin.
    • Özellik denetçisinde Alt değerini düzenleyin.

Görüntüyü görsel olarak yeniden boyutlandırma

Görüntü, eklenti, Shockwave veya SWF dosyaları, apletler ve ActiveX denetimleri gibi öğeleri Dreamweaver'da yeniden boyutlandırabilirsiniz.

Görüntüyü görsel olarak yeniden boyutlandırma, görüntünün mizanpajı farklı boyutlarda nasıl etkileyeceğini görmenize yardım eder, ancak görüntü dosyasını belirttiğiniz oranlarda ölçeklendirmez. Görüntüyü istediğiniz boyuta ölçeklendirmek için görüntü düzenleme aracı (Adobe Fireworks gibi) olmadan Dreamweaver'da görsel olarak yeniden boyutlandırırsanız, kullanıcının tarayıcısı sayfa yüklendiğinde görüntüyü ölçekler. Bu, sayfa indirme süresinde gecikmeye ve görüntünün kullanıcının tarayıcısında uygun olmayan biçimde görüntülenmesine neden olabilir. İndirme süresini azaltmak ve görüntünün tüm örneklerinin aynı boyutta görüntülendiğinden emin olmak için görüntüleri ölçeklendirmek amacıyla görüntü düzenleme uygulamasını kullanın.

Bir görüntüyü Dreamweaver'da yeniden boyutlandırdığınızda, yeni boyutlarına uyması için görüntüyü yeniden örneklendirebilirsiniz. Yeniden örnekleme, orijinal görüntünün görünümüne olabildiğince yakın eşleşmesi için yeniden boyutlandırılan JPEG ve GIF görüntü dosyalarına piksel ekler veya çıkarır. Görüntüyü yeniden örnekleme dosya boyutunu küçültür ve indirme performansını geliştirir.

Öğeyi görsel olarak yeniden boyutlandırma

  1. Belge penceresinde öğeyi (örneğin, görüntü veya SWF dosyasını) seçin.

    Yeniden boyutlandırma tutamaçları öğenin sağında, altında ve sağ alt köşesinde görüntülenir. Yeniden boyutlandırma tutamaçları görüntülenmezse, yeniden boyutlandırmak istediğiniz öğenin haricinde bir yeri tıklatın veya öğeyi seçmek için etiket seçicide uygun etiketi tıklatın.

  2. Aşağıdakilerden birini yaparak öğeyi yeniden boyutlandırın:
    • Öğenin genişliğini ayarlamak için seçim tutamacını sağa sürükleyin.
    • Öğenin yüksekliğini ayarlamak için alt seçim tutamacını sürükleyin.
    • Aynı anda öğenin hem yüksekliğini hem de genişliğini ayarlamak için köşe seçim tutamacını sürükleyin.
    • Boyutlarını ayarlarken öğenin en boy oranını (yüksekliğine göre genişlik oranı) korumak için köşe seçim tutamacını Shift tuşunu basılı tutarak sürükleyin.
    • Öğenin yükseklik ve genişliğini belirli bir boyuta (örneğin, 1 x 1 piksel) ayarlamak için sayısal değer girmek üzere Özellik denetçisini kullanın. Öğeler görsel olarak en az 8 x 8 piksel olarak yeniden boyutlandırılabilir.
  3. Yeniden boyutlandırılan bir öğeyi orijinal boyutlarına geri döndürmek için Özellik denetçisinde G ve Y metin kutularındaki değerleri silin veya görüntü Özellik denetçisinde Boyutu Sıfırla düğmesini tıklatın.

Görüntüyü orijinal boyutuna geri döndürme

  1. Görüntü Özellik denetçisinde Boyutu Sıfırla düğmesini tıklatın.

Yeniden boyutlandırılan görüntüyü yeniden örnekleme

  1. Görüntüyü yukarıda açıklandığı gibi yeniden boyutlandırın.
  2. Görüntü Özellik denetçisinde Yeniden Örnekle düğmesini tıklatın.

    Not:

    Görüntü yer tutucularını veya bitmap görüntüler dışındaki öğeleri yeniden örnekleyemezsiniz.

Görüntü yer tutucusu ekleme

Görüntü yer tutucu, en son resim web sayfasına eklenmeye hazır olana kadar kullandığınız grafiktir. Metin etiketi vermenin yanı sıra yer tutucunun boyutunu ve rengini de ayarlayabilirsiniz.

  1. Belge penceresinde, görüntü yer tutucu eklemek istediğiniz yere ekleme noktasını yerleştirin.
  2. Ekle > Görüntü Nesneleri > Görüntü Yer Tutucusu seçeneğini belirleyin.

  3. Ad (İsteğe bağlıdır) için görüntü yer tutucunun etiketi olarak görünmesini istediğiniz metni girin. Bir etiket görüntülenmesini istemiyorsanız, metin kutusunu boş bırakın. Ad bir harfle başlamalı ve sadece harf ve rakam içermelidir; boşluğa ve yüksek ASCII karakterlerine izin verilmez.
  4. Yükseklik ve Genişlik için (Gereklidir) görüntü boyutunu piksel cinsinden ayarlamak üzere bir rakam girin.
  5. Renk için (İsteğe bağlıdır) renk uygulamak üzere aşağıdakilerden birini yapın:
    • Bir renk seçmek üzere renk seçiciyi kullanın.
    • Rengin onaltılı değerini girin (örneğin, #FF0000).
    • Web uyumlu renk adı (örneğin kırmızı) girin.
  6. Alternatif Metin (İsteğe bağlıdır) için salt metin tarayıcı kullanan kullanıcılara görüntüyü tanımlamak üzere bir metin girin.

    Not:

    Görüntü etiketi, boş src niteliği içeren HTML koduna otomatik olarak eklenir.

  7. Tamam'ı tıklatın.

    Yer tutucunun rengi, boyut nitelikleri ve etiketi aşağıdaki gibi görüntülenir:

    Nitelikleri olan görüntü yer tutucu.

    Tarayıcıda görüntülendiğinde etiket ve metin boyutu görüntülenmez.

Görüntü yer tutucusunu değiştirme

Görüntü yer tutucu, tarayıcıda görüntüyü göstermez. Sitenizi yayınlamadan önce eklediğiniz görüntü yer tutucularını GIF veya JPEG gibi web uyumlu görüntü dosyalarıyla değiştirmelisiniz.

Fireworks uygulamanız varsa, Dreamweaver görüntü yer tutucusundan yeni bir grafik oluşturabilirsiniz. Yeni görüntü, yer tutucu görüntüsü boyutuyla aynı boyuta ayarlanır. Görüntüyü düzenleyebilir ve ardından Dreamweaver'da değiştirebilirsiniz.

  1. Belge penceresinde şunlardan birini yapın:
    • Görüntü yer tutucuyu çift tıklatın.
    • Görüntü yer tutucusunu seçmek için tıklatın, ardından Özellik denetçisinde (Pencere > Özellikler), Kaynak metin kutusunun yanındaki klasör simgesini tıklatın.
  2. Görüntü Kaynağı iletişim kutusunda görüntü yer tutucuyu değiştirmek istediğiniz görüntüye gidin ve Tamam'ı tıklatın.

Görüntü yer tutucusu özelliklerini ayarlama

Görüntü yer tutucusunun özelliklerini ayarlamak için Belge penceresinde yer tutucuyu seçin, ardından Özellik denetçisini görüntülemek üzere Pencere > Özellikler seçeneğini belirleyin. Tüm özellikleri görmek için sağ alt köşedeki genişletici oku tıklatın.

Yer tutucu görüntünün adını, genişliğini, yüksekliğini, görüntü kaynağını, alternatif metin açıklamasını, hizalamasını ve rengini ayarlamak için Özellik denetçisini kullanın.

Görüntü Yer Tutucusu Özellik denetçisi.

Yer tutucu Özellik denetçisinde gri metin kutusu ve Hizala metin kutusu devre dışı bırakılmıştır. Bu özellikleri, yer tutucuyu görüntüyle değiştirdiğinizde görüntü Özellik denetçisinde ayarlayabilirsiniz.

  1. Aşağıdaki seçeneklerden birini belirleyin:

    G ve Y

    Piksel cinsinden görüntü yer tutucunun genişliğini ve yüksekliğini ayarlar.

    Kaynak

    Görüntünün kaynak dosyasını belirtir. Yer tutucu görüntüsünde bu metin kutusu boştur. Yer tutucu grafiğini değiştirmek üzere bir görüntü seçmek için Gözat düğmesini tıklatın.

    Bağ

    Görüntü yer tutucunun köprüsünü belirler. Dosyalar panelinde dosyaya Dosyaya İşaret Et simgesini sürükleyin, sitenizdeki belgeyi bulmak için klasör simgesini tıklatın veya URL'yi elle yazın.

    Alt

    Salt metin tarayıcılar veya görüntüleri manuel olarak indirmek üzere ayarlanmış tarayıcılar için görüntü yerine gösterilen alternatif metni belirtir. Salt metin tarayıcılarla konuşma sentezleyicisi kullanan görme sorunu olan kullanıcılar için metin yüksek sesle okunur. Bazı tarayıcılarda bu metin imleç görüntünün üzerine getirildiğinde görüntülenir.

    Oluştur

    Değiştirilen görüntüyü oluşturmak için Fireworks uygulamasını başlatır. Bilgisayarınızda Fireworks uygulaması da yüklü olmadığı sürece Oluştur düğmesi devre dışı bırakılır.

    Orijinalden güncelle

    Web görüntüsü (diğer bir deyişle Dreamweaver sayfasındaki görüntü) orijinal Photoshop dosyasıyla senkronize olmadığında Dreamweaver orijinal dosyanın güncellenmediğini algılar ve Akıllı Nesne simgesi oklarından birini kırmızı olarak görüntüler. Web görüntüsünü Tasarım görünümünde seçip Özellik denetçisindeki Orijinalden Güncelleştir düğmesini tıklattığınızda orijinal Photoshop dosyasında yaptığınız değişiklikleri yansıtarak görüntü otomatik olarak güncelleştirilir.

    Renk

    Görüntü yer tutucunun rengini belirtir.

Dreamweaver'da görüntüleri düzenleme

Dreamweaver'da görüntüleri yeniden örneklendirebilir, kırpabilir, en iyileştirebilir ve keskinleştirebilirsiniz. Parlaklığını ve kontrastını da ayarlayabilirsiniz.

Görüntü düzenleme özellikleri

Dreamweaver, görüntüleri Fireworks veya Photoshop gibi harici görüntü düzenleme uygulaması kullanmanıza gerek kalmadan değiştirmenize olanak sağlayan temel görüntü düzenleme özellikleri sağlar. Dreamweaver görüntü düzenleme araçları, web sitenizde kullanılmak üzere tasarımcıların görüntü dosyaları oluşturma konusunda sorumlu oldukları içerikle kolayca çalışmanız için tasarlanmıştır.

Not:

Dreamweaver görüntü düzenleme özelliklerini kullanmak için bilgisayarınızda Fireworks veya diğer görüntü düzenleme uygulamalarının yüklü olmasına gerek yoktur.

  1. Değiştir > Görüntü seçeneğini belirleyin. Bu Dreamweaver görüntü düzenleme özelliklerinden herhangi birini ayarlayın:

    Yeniden Örnekle

    Orijinal görüntünün görünümüne olabildiğince yakın eşleşmesi için yeniden boyutlandırılan JPEG ve GIF görüntü dosyalarına piksel ekler veya çıkarır. Görüntüyü yeniden örnekleme dosya boyutunu küçültür ve indirme performansını geliştirir.

    Bir görüntüyü Dreamweaver'da yeniden boyutlandırdığınızda, yeni boyutlarına uyması için görüntüyü yeniden örneklendirebilirsiniz. Bir bitmap nesnesi yeniden örneklendiğinde, görüntüyü daha büyük veya küçük yapmak için pikseller eklenir veya çıkarılır. Genellikle görüntüyü daha yüksek bir çözünürlüğe yeniden örneklemek görüntü kalitesinde küçük bir kayba neden olur. Ancak daha düşük bir çözünürlüğe yeniden örnekleme veri kaybına ve genellikle kalitede düşüşe neden olur.

    Kırp

    Görüntünün alanını azaltarak görüntüleri düzenler. Genellikle görüntünün nesnesini daha da vurgulamak ve görüntüdeki ilgi odağının merkezini çevreleyen gereksiz nesneleri silmek için görüntüyü kırpmak isteyeceksinizdir.

    Parlaklık ve Kontrast

    Görüntüdeki piksellerin parlaklığını veya kontrastını değiştirir. Bu, görüntünün vurgularını, gölgelerini ve orta tonlarını etkiler. Genellikle çok koyu veya çok parlak olan görüntüleri düzenlerken Parlaklık/Kontrast kullanırsınız.

    Keskinleştir

    Görüntü içindeki kenarların kontrastını arttırarak görüntünün odağını ayarlar. Bir görüntüyü tararken veya dijital fotoğraf çekerken, birçok görüntü yakalama yazılımının varsayılan eylemi görüntüdeki nesnelerin kenarlarını yumuşatmaktır. Bu, dijital görüntülerin oluştuğu piksellerde çok ince detayların kaybolmasını engeller. Bununla birlikte, dijital görüntü dosyalarındaki ayrıntıları ortaya çıkarmak için görüntüyü genellikle keskinleştirmek gerekir, bu nedenle kenar kontrastları artırılır ve görüntünün daha keskin görünmesi sağlanır.

    Not:

    Dreamweaver görüntü düzenleme özellikleri yalnızca JPEG, GIF ve PNG görüntü dosyası formatlarına uygulanır. Diğer bitmap görüntü dosya formatları bu görüntü düzenleme özellikleri kullanılarak düzenlenemez.

Görüntüyü kırpma

Dreamweaver bitmap dosyası görüntülerini kırpmanıza (veya kesmenize) olanak sağlar.

Not:

Bir görüntüyü kırptığınızda, kaynak görüntü dosyası diskte değişir. Bu nedenle, orijinal görüntüye geri dönmenizin gerekebileceği durumlara karşı görüntü dosyasının bir yedek kopyasını saklayabilirsiniz.

  1. Kırpmak istediğiniz görüntüyü içeren sayfayı açın, görüntüyü açın ve aşağıdakilerden birini yapın:
    • Görüntü Özellik denetçisinde Kırpma Aracı simgesini tıklatın.
    • Değiştir > Görüntü > Kırp seçeneğini belirleyin.
    • Seçili görüntünün çevresinde kırpma tutamaçları görüntülenir.
  2. Çevreleyen kutu korumak istediğiniz görüntü alanını çevreleyene kadar kırpma tutamaçlarını ayarlayın.
  3. Sınırlayıcı kutunun içini çift tıklatın veya seçimi kırpmak için Enter tuşuna basın.
  4. Kırpmakta olduğunuz görüntü dosyasının diskte değiştirileceğini bildiren bir iletişim kutusu görüntülenir. Tamam'ı tıklatın. Sınırlayıcı kutu dışında kalan seçili bitmapteki tüm pikseller kaldırılır, ancak görüntüdeki diğer nesneler kalır.
  5. Görüntüyü önizleyin ve beklentilerinizi karşıladığından emin olun. Karşılamıyorsa, orijinal görüntüye dönmek için Düzen > Kırpmayı Geri Al seçeneğini belirleyin.

    Not:

    Dreamweaver'dan çıkana veya harici görüntü düzenleme uygulamasında dosyayı düzenleyene kadar Kırp komutunun efektini geri alabilirsiniz (ve orijinal görüntü dosyasına geri dönebilirsiniz).

Bir görüntüyü en iyileştirme

Web sayfanızdaki görüntüleri Dreamweaver içinden en iyileştirebilirsiniz.

  1. En iyileştirmek istediğiniz görüntüyü içeren sayfayı açın, görüntüyü seçin ve aşağıdakilerden birini yapın:
    • Görüntü Özellik denetçisindeki Görüntü Ayarlarını Düzenle düğmesini  tıklatın.
    • Değiştir > Görüntü > En İyileştir seçeneğini belirleyin.
  2. Görüntü En İyileştirme iletişim kutusunda düzenlemelerinizi yapın ve Tamam'ı tıklatın.

Görüntüyü keskinleştirme

Keskinleştirme, görüntünün tanımını veya keskinliğini arttırmak için nesnelerin kenarlarının çevresindeki piksellerin kontrastını artırır.

  1. Keskinleştirmek istediğiniz görüntüyü içeren sayfayı açın, görüntüyü açın ve aşağıdakilerden birini yapın:
    • Görüntü Özellik denetçisinde Keskinleştir düğmesini  tıklatın.
    • Değiştir > Görüntü > Keskinleştir seçeneğini belirleyin.
  2. Sürgü denetimini sürükleyerek veya metin kutusuna 0 ila 10 arasında bir değer girerek Dreamweaver'ın görüntüye uyguladığı keskinleştirme derecesini belirleyebilirsiniz. Keskinleştir iletişim kutusunu kullanarak görüntünün keskinliğini ayarlarken görüntüdeki değişiklikleri önizleyebilirsiniz.
  3. Görüntüden memnun kaldığınızda Tamam'ı tıklatın.
  4. Dosya > Kaydet öğesini seçerek değişikliklerinizi kaydedin veya Düzen > Keskinleştirmeyi Geri Al seçeneğini belirleyerek orijinal görüntüye geri dönün.

    Not:

    Yalnızca, görüntüyü içeren sayfayı kaydedene kadar Keskinleştir komutunun (ve orijinal görüntü dosyasına geri dönmenin) etkisini geri alabilirsiniz. Sayfayı kaydettikten sonra görüntüde yapılan değişiklikler kalıcı olarak kaydedilir.

Görüntünün parlaklık ve kontrastını ayarlama

Parlaklık/Kontrast komutu, görüntüdeki piksellerin parlaklığını veya kontrastını değiştirir. Bu, görüntünün vurgularını, gölgelerini ve orta tonlarını etkiler. Genellikle çok koyu veya çok parlak olan görüntüleri düzenlerken Parlaklık/Kontrast kullanırsınız.

  1. Ayarlamak istediğiniz görüntüyü içeren sayfayı açın, görüntüyü açın ve aşağıdakilerden birini yapın:
    • Görüntü Özellik denetçisinde Parlaklık/Kontrast  düğmesini tıklatın.
    • Değiştir > Görüntü > Parlaklık/Kontrast seçeneğini belirleyin.
  2. Ayarları belirlemek için Parlaklık ve Kontrast kaydırıcılarını sürükleyin. Değerler -100 ila 100 arasındadır.
  3. Tamam'ı tıklatın.

Rollover görüntüsü oluşturma

Sayfanıza rollover görüntüleri ekleyebilirsiniz. Rollover görüntüsü, tarayıcıda görüntülendiğinde, görüntünün üzerine işaretçi geldiğinde değişen görüntüdür.

Rollover'ı oluşturmak için iki görüntünüz olmalıdır: birincil görüntü (sayfa ilk yüklendiğinde görüntülenen görüntü) ve ikincil görüntü (işaretçi birincil görüntünün üzerine geldiğinde görüntülenen görüntü). Rollover'daki her iki görüntü de aynı boyutta olmalıdır; görüntüler aynı boyutta değilse Dreamweaver, ilk görüntünün özelliklerine uyması için ikinci görüntüyü yeniden boyutlandırır.

Rollover görüntüleri onMouseOver olayına yanıt vermek üzere otomatik ayarlanır. Görüntüyü farklı bir olaya (örneğin fare tıklatmasına) yanıt verecek veya rollover görüntüsünü değiştirecek biçimde ayarlayabilirsiniz.

  1. Belge penceresinde, rollover'ın görüntülenmesini istediğiniz yere ekleme noktasını yerleştirin.
  2. Aşağıdaki yöntemlerden birini kullanarak rollover'ı ekleyin:
    • Ekle panelinin Ortak kategorisinde Görüntüler düğmesini tıklatın ve Rollover Görüntüsü simgesini seçin. Ekle panelinde Rollover Görüntüsü simgesi görüntülendiğinde simgeyi Belge penceresine sürükleyebilirsiniz.
    • Ekle > Görüntü Nesneleri > Rollover Görüntüsü seçeneğini belirleyin.
  3. Seçenekleri ayarlayın ve Tamam'ı tıklatın.

    Görüntü Adı

    Rollover görüntüsünün adı.

    Orijinal görüntü

    Sayfa yüklendiğinde görüntülenmesini istediğiniz görüntü. Metin kutusuna yolu girin veya Gözat'ı tıklatıp görüntüyü seçin.

    Rollover Görüntüsü

    İşaretçi orijinal görüntünün üzerine geldiğinde görüntülenmesini istediğiniz görüntü. Yolu girin veya Gözat'ı tıklatıp görüntüyü seçin.

    Önceden Yüklenen Rollover Görüntüsü

    Tarayıcının önbelleğine görüntüleri önceden yükler, böylece kullanıcı işaretçiyi görüntünün üzerine getirdiğinde gecikme olmaz.

    Alternatif Metin

    (İsteğe bağlıdır) Salt metin tarayıcı kullanan kullanıcılara görüntüyü tanımlayan metin.

    Tıklatıldığında URL'ye Git

    Kullanıcı rollover görüntüsünü tıklattığında açılmasını istediğiniz dosya. Yolu girin veya Gözat'ı tıklatıp dosyayı seçin.

    Not:

    Görüntünün bağını ayarlamazsanız Dreamweaver, rollover davranışının eklendiği HTML kaynak koduna boş bir bağ (#) ekler. Boş bağı kaldırırsanız, rollover görüntüsü artık çalışmaz.

  4. Dosya > Tarayıcıda Önizleme seçeneğini belirleyin veya F12'ye basın.

  5. Tarayıcıda, rollover görüntüsünü görmek için işaretçiyi orijinal görüntünün üzerine getirin.

    Not:

    Tasarım görünümünde rollover görüntüsünün etkisini göremezsiniz.

Harici görüntü düzenleyici kullanma

Dreamweaver uygulamasındayken, seçili görüntüyü harici bir görüntü düzenleyicide açabilirsiniz; düzenlenen görüntü dosyasını kaydettikten sonra Dreamweaver uygulamasına geri döndüğünüzde, görüntüde yaptığınız değişiklikler Belge penceresinde görünür.

Fireworks'u birincil harici düzenleyiciniz olarak ayarlayabilirsiniz. Düzenleyicinin açacağı dosya türlerini de belirleyebilir ve birden fazla görüntü düzenleyici de seçebilirsiniz. Örneğin GIF düzenlemek istediğinizde Fireworks'u başlatacak ve JPG veya JPEG düzenlemek istediğinizde de farklı bir görüntü düzenleyici başlatacak biçimde tercihlerinizi ayarlayabilirsiniz.

Harici görüntü düzenleyiciyi başlatma

  1. Aşağıdakilerden birini yapın:
    • Düzenlemek istediğiniz görüntüyü çift tıklatın.
    • Düzenlemek istediğiniz görüntüyü sağ tıklatın (Windows) veya Control tuşunu basılı tutup (Macintosh) tıklatın, ardından Birlikte Düzenle > Gözat öğesini seçin ve bir düzenleyici belirleyin.
    • Düzenlemek istediğiniz görüntüyü seçin ve Özellik denetçisinde Düzenle'yi tıklatın.
    • Birincil görüntü düzenleyiciyi başlatmak için Dosyalar panelinde görüntü dosyasını çift tıklatın. Bir görüntü düzenleyici belirtmediyseniz Dreamweaver, dosya türünün varsayılan düzenleyicisini başlatır.

    Not:

    Dosyalar panelinde bir görüntüyü açtığınızda, Fireworks entegrasyonu etkin değildir; Fireworks orijinal PNG dosyasını açmaz. Fireworks entegrasyonu özelliklerini kullanmak için görüntüleri Belge penceresinin içinden açın.

    Dreamweaver penceresine döndükten sonra güncelleştirilen görüntüyü görmüyorsanız, görüntüyü seçin ve ardından Özellik denetçisinde Yenile düğmesini tıklatın.

Varolan bir dosya türü için harici görüntü düzenleyici ayarlama

Grafik dosyalarını açmak ve düzenlemek için görüntü düzenleyici seçebilirsiniz.

  1. Aşağıdakilerden birini yaparak Dosya Türleri/Düzenleyiciler iletişim kutusunu açın:
    • Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh) seçeneğini belirleyin ve soldaki Kategori listesinde Dosya Türleri/Düzenleyiciler öğesini seçin.
    • Düzen > Dış Düzenleyici ile Düzenle öğesini seçin ve Dosya Türleri/Düzenleyiciler seçeneğini belirleyin.
  2. Uzantılar listesinde harici düzenleyici ayarlamak istediğiniz dosya uzantısını seçin.
  3. Düzenleyiciler listesinin üzerindeki Ekle (+) düğmesini tıklatın.
  4. Dış Düzenleyici Seç iletişim kutusunda, bu dosya türü için düzenleyici olarak başlatmak istediğiniz uygulamaya gözatın.

  5. Bu düzenleyicinin, bu dosya türü için birincil düzenleyici olmasını istiyorsanız Tercihler iletişim kutusunda Birincil Yap'ı tıklatın.

  6. Bu dosya türü için başka bir düzenleyici ayarlamak istiyorsanız, 3. ve 4. adımları yineleyin.

    Bu görüntü türünü düzenlediğinizde Dreamweaver otomatik olarak birincil düzenleyiciyi kullanır. Belge penceresinde görüntünün içerik menüsünden diğer listelenen düzenleyicileri de seçebilirsiniz.

Uzantılar listesine yeni dosya türü ekleme

  1. Aşağıdakilerden birini yaparak Dosya Türleri/Düzenleyiciler Tercihleri iletişim kutusunu açın:

    • Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh) seçeneğini belirleyin ve soldaki Kategori listesinde Dosya Türleri/Düzenleyiciler öğesini seçin.
    • Düzen > Dış Düzenleyici ile Düzenle öğesini seçin ve Dosya Türleri/Düzenleyiciler seçeneğini belirleyin.
  2. Dosya Türleri/Düzenleyiciler Tercihleri iletişim kutusunda, Uzantılar listesinin yukarısındaki Ekle (+) düğmesini tıklatın.

    Uzantılar listesinde bir metin kutusu görüntülenir.

  3. Düzenleyicinin başlamasını istediğiniz dosya türü için dosya uzantısını yazın.
  4. Dosya türü için harici düzenleyici seçmek üzere Düzenleyiciler listesinin üzerindeki Ekle (+) düğmesini tıklatın.
  5. Görüntülenen iletişim kutusunda bu görüntü türünü düzenlemek için kullanmak istediğiniz uygulamayı seçin.
  6. Bu düzenleyicinin görüntü türü için birincil düzenleyici olmasını istiyorsanız, Birincil Yap'ı tıklatın.

Varolan düzenleyici tercihini değiştirme

  1. Aşağıdakilerden birini yaparak Dosya Türleri/Düzenleyiciler Tercihleri iletişim kutusunu açın:

    • Düzen > Tercihler (Windows) veya Dreamweaver > Tercihler (Macintosh) seçeneğini belirleyin ve soldaki Kategori listesinde Dosya Türleri/Düzenleyiciler öğesini seçin.
    • Düzen > Dış Düzenleyici ile Düzenle öğesini seçin ve Dosya Türleri/Düzenleyiciler seçeneğini belirleyin.
  2. Dosya Türleri/Düzenleyiciler tercihleri iletişim kutusunda, Uzantılar listesi içinde, varolan düzenleyicileri görüntülemek üzere değiştirdiğiniz dosya türünü belirleyin.

  3. Düzenleyiciler listesinde etkin olmasını istediğiniz düzenleyiciyi seçin ve aşağıdakilerden birini yapın:
    • Düzenleyici eklemek veya çıkarmak için Düzenleyiciler listesinin üzerindeki Ekle (+) veya Sil (–) düğmelerini tıklatın.
    • Düzenleme için varsayılan olarak açılacak düzenleyiciyi değiştirmek üzere Birincil Yap düğmesini tıklatın.

Görüntülere davranışlar uygulama

Görüntüye veya görüntü etkin noktasına mevcut herhangi bir davranışı uygulayabilirsiniz. Etkin bir noktaya davranış uyguladığınızda Dreamweaver, HTML kaynak kodunu area etiketine ekler. Görüntülere özellikle üç davranış uygulanır: Görüntüleri Önceden Yükle, Görüntü Değiştir ve Görüntü Değiştirme Geri Yükleme.

Görüntüleri Önceden Yükle

Sayfa görüntülendiğinde belirmeyen görüntüleri (davranışlar, AP öğeleri veya JavaScript ile değiştirilenler gibi) tarayıcının önbelleğine yükler. Bu, görüntülerin ilk görüntülendiği zamanki indirme işleminden kaynaklanan gecikmeleri önler.

Görüntü Değiştir

img etiketinin SRC niteliğini değiştirerek bir görüntüden diğerine geçer. Bu eylemi düğme rollover'ları ve diğer görüntü efektleri (bir kerede birden fazla görüntü değiştirme dahil) oluşturmak için kullanın.

Görüntü Değiştirme Geri Yükleme

Değiştirilen son görüntü kümesini önceki kaynak dosyalara geri yükler. Bu eylem, bir nesneye Görüntü Değiştir eylemini eklediğinizde varsayılan olarak otomatik eklenir; hiçbir zaman elle seçmenize gerek yoktur.

Atlama menüleri gibi daha karmaşık gezinme sistemleri oluşturmak için de davranışları kullanabilirsiniz.

Bu çalışma Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License kapsamında lisanslanmıştır  Creative Commons şartları, Twitter™ ve Facebook sitelerinde paylaşılanları kapsamaz.

Yasal Uyarılar   |   Çevrimiçi Gizlilik İlkesi