Dreamweaver'da görüntü ekleme ve düzenleme

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 panelinde, açılır listeden HTML öğesini seçin. Görüntü'yü tıklatın. Simgeyi çift tıklatın veya belge penceresine (ya da kod kullanarak çalışıyorsanız Kod görünümü penceresine) sürükleyin.

• 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.

• Canlı Görünüm'de görüntüyü Extract panelinden veya Katmanlar sekmesinden sürükleyin. Canlı Kılavuzlar'a göre öğeyi başka bir öğenin üstüne, altına, sağına veya soluna bırakın. Alternatif olarak, </> simgesini tıklatıp Öğeye Hızlı Bakış'ı kullanarak öğeyi belge yapısında kesin bir noktaya bırakın.

Eklemek istediğiniz görüntüyü veya içerik kaynağını seçmek için göz atı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 bu referansı belgeye göre bir göreli yola dönüştürür.

Tamam'ı tıklatın. 

Seçili bir görüntünün Özellik Denetimi'ni görüntülemek için görüntüyü tıklatın ve Pencere > Özellikler'i seçin.

Minik resim görüntüsünün altındaki metin kutusuna bir ad girin. Görüntü Değiştir gibi bir Dreamweaver davranışı kullanırken veya JavaScript ya da VBScript gibi bir komut dosyası dili kullanırken görüntüye başvuruda bulunmak için bu adı kullanabilirsiniz.

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şliği ve yüksekliğiyle uyuşmayan G ve Y değerleri girerseniz görüntü tarayıcıda düzgün görüntülenmez. Orijinal değerlere geri dönmek için G ve Y metin kutusu etiketlerini tıklatın veya 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.

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.

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

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. Görme sorunu olan ve salt metin tarayıcılarla konuşma sentezleyicisi kullananlar için metin yüksek sesle okunur. Bazı tarayıcılarda bu metin, imleç görüntünün üzerine getirildiğinde de görüntülenir.

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

Hedef     Bağlanan sayfanın yüklediğ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.
• _new bağlı dosyayı 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ılan hedeftir. Bu değeri açıkça belirtmeniz gerekmez.
•  _top bağlı dosyayı tarayıcı penceresinin tamamında açarak tüm çerçeveleri kaldırır.

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

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

Dreamweaver sayfasındaki görüntü orijinal Photoshop dosyası ile eşitlenmediğinde Dreamweaver orijinal dosyanın güncellendiğini algılar. Bu uygulama, Akıllı Nesne simgesinin oklarından birini kırmızı renkte görüntüler. Web görüntüsünü Tasarım görünümünde seçip Özellik Denetimi'nde Orijinalden Güncelleştir düğmesini tıklattığınızda görüntü otomatik olarak güncelleştirilir. Güncelleştirilen görüntü orijinal Photoshop dosyasında yaptığınız değişiklikleri yansıtır.

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

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

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

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

Belge penceresinde, görüntüyü tıklatın veya görüntü etiketini kod içinden seçin.

Alternatif Metin kutusunda 50 karakterden daha kısa olacak şekilde görüntünün adını veya kısa bir açıklamasını girmek için aşağıdakilerden birini yapın. Ekran okuyucular buraya girdiğiniz bilgileri okur.  

• Kod görünümünde ilgili görüntü niteliklerini düzenleyin.

• Hızlı Özellik Denetimi'ni kullanarak, görüntü özniteliklerini Canlı Görünüm'de düzenleyin.

• Özellik denetiminde Alt değerini düzenleyin.

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 öğenin dışında bir alanı tıklatın ve öğeyi yeniden seçin. Alternatif olarak, öğeyi seçmek için etiket seçicide uygun etiketi tıklatabilirsiniz.

• Öğenin genişliğini ayarlamak için sağ seçim tutamacını 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ını) korumak için Shift tuşunu basılı tutarak köşe seçim tutamacını sürükleyin.

• Öğenin yüksekliğini ve genişliğini belirli bir boyuta (örneğin, 1 x 1 piksel) ayarlamak için Özellik Denetimi'ni kullanın. G ve Y alanlarına bir sayısal değer girin. Öğeleri görsel olarak en az 8 x 8 piksel ölçülerinde yeniden boyutlandırılabilirsiniz.

Yeniden boyutlandırılmış bir öğeyi orijinal boyutlarına döndürmek için Özellik Denetimi'nde G ve Y alanlarındaki değerleri silin. Ayrıca görüntü Özellik Denetimi'ndeki Boyutu Sıfırla düğmesini de tıklatabilirsiniz.

Görüntüyü yeniden boyutlandırma bölümünde açıklandığı şekilde görüntüyü yeniden boyutlandırın.

Görüntü Özellik denetiminde Yeniden Örnekle düğmesini tıklatın.

Düzen > Görüntü seçeneğini belirleyin. Dreamweaver'da aşağıdaki görüntü düzenleme özelliklerini ayarlayabilirsiniz:

Bir hazır ayar seçin, bir dosya formatı belirleyin ve kalite düzeyini belirtin. Sürgüyü kalite düzeyleri arasında hareket ettirdiğinizde iletişim kutusunda görüntünün dosya boyutunu görebilirsiniz. Hazır olduğunda Tamam'ı tıklatın.

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 örneklemek, 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. Nokta esaslı bir nesne yeniden örneklendiğinde, görüntüyü daha büyük veya küçük yapmak için pikseller eklenir veya çıkarılır. Görüntüyü daha yüksek bir çözünürlüğe yeniden örneklemek, genellikle görüntü kalitesinde küçük bir kayba neden olur. Ancak daha düşük bir çözünürlüğe yeniden örneklemek, veri kaybına ve genellikle kalitede düşüşe neden olur.

Görüntünün alanını azaltarak görüntüleri düzenler. Görüntünün konusunu daha da vurgulamak ve ilgi odağının merkezini çevreleyen gereksiz nesneleri silmek için görüntüyü kırpma özelliğini kullanabilirsiniz.

Görüntüdeki piksellerin parlaklığını veya kontrastını değiştirir. Parlaklık ve Kontrast, 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.

Görüntü içindeki kenarların kontrastını artı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. Tarama işlemi, 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. Keskinleştir seçeneği kenar kontrastını artırır ve görüntünün daha keskin görünmesini sağlar.

Kırpmak 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 denetiminde Kırp Aracı simgesini tıklatın.

• Düzen > 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.

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 bitmap görüntüdeki tüm pikseller kaldırılır, ancak görüntüdeki diğer nesneler kalır.

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.

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 Denetimi'ndeki Görüntü Ayarlarını Düzenle düğmesini tıklatın.

• Düzen > Görüntü > En İyileştir seçeneğini belirleyin.

Görüntü En İyileştirme iletişim kutusunda düzenlemelerinizi yapın ve Tamam'ı tıklatın.

• Görüntü Özellik denetiminde Keskinleştir düğmesini tıklatın.

• Düzen > Görüntü > Keskinleştir seçeneğini belirleyin.

Dreamweaver'ın görüntüye uyguladığı keskinleştirme derecesini belirtmek için sürgü kontrolünü sürükleyin. Metin kutusuna 0 ve 10 arasında bir değer de girebilirsiniz. Keskinleştir iletişim kutusunu kullanarak görüntünün keskinliğini ayarlarken görüntüdeki değişiklikleri önizleyebilirsiniz.

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.

• Görüntü Özellik Denetimi'nde Parlaklık ve Kontrast düğmesini tıklatın.

• Düzen > Görüntü > Parlaklık/Kontrast seçeneğini belirleyin.

• Ekle panelinde, açılır listeden HTML öğesini seçin. Seçenekler listesinden Rollover Görüntüsü'nü seçin.

• Ekle > HTML > Rollover Görüntüsü seçeneğini belirleyin.

Rollover Görüntüsü Ekle iletişim kutusunda görüntüleri seçin ve rollover görüntüsünün özelliklerini ayarlayın. Şu seçenekleri ayarlayabilirsiniz:

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

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.

İş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.

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.

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

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.

Rollover görüntüsünü önizlemek için Dosya > Gerçek Zamanlı Önizleme seçeneğini belirleyin veya F12 tuşuna basın.

Harici düzenleyiciyi açmak için 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şu basılıyken görüntüyü tıklatın (Macintosh). Ardından, Birlikte Düzenle > Gözat'ı tıklatın ve bir düzenleyici seçin.

• Düzenlemek istediğiniz görüntüyü seçin ve Özellik Denetimi'nde 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.

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 Denetimi'nde Yenile düğmesini tıklatın.

Düzenle > Tercihler (Windows) veya Dreamweaver > Tercihler (macOS) seçeneğini belirleyin ve soldaki bölmede bulunan Kategori listesinden Dosya Türleri/Düzenleyiciler öğesini seçin.

Uzantılar listesinde harici düzenleyici ayarlamak istediğiniz dosya uzantısını seçin.

Dış Düzenleyici Seç iletişim kutusunda, bu dosya türü için düzenleyici olarak başlatmak istediğiniz uygulamaya göz atın.

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.

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.

Düzenle > Tercihler (Windows) veya Dreamweaver > Tercihler (macOS) seçeneğini belirleyin ve soldaki bölmede bulunan Kategori listesinden Dosya Türleri/Düzenleyiciler öğesini seçin.

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.

Düzenleyici ayarlamak istediğiniz dosya türünün uzantısını seçin.

Dosya türü için harici düzenleyici seçmek üzere Düzenleyiciler listesinin üzerindeki Ekle (+) düğmesini tıklatın.

Görüntülenen iletişim kutusunda bu görüntü türünü düzenlemek için kullanmak istediğiniz uygulamayı seçin.

Bu düzenleyicinin görüntü türü için birincil düzenleyici olmasını istiyorsanız Birincil Yap'ı tıklatın.

Düzenle > Tercihler (Windows) veya Dreamweaver > Tercihler (macOS) seçeneğini belirleyin ve soldaki bölmede bulunan Kategori listesinden Dosya Türleri/Düzenleyiciler öğesini seçin.

Dosya Türleri/Düzenleyiciler tercihleri iletişim kutusundaki Uzantılar listesinde, var olan düzenleyicileri görüntülemek üzere değiştirdiğiniz dosya türünü belirleyin.

Düzenleyiciler listesinde etkin olmasını istediğiniz düzenleyiciyi seçin ve aşağıdakilerden birini yapın:

• Düzenleyici eklemek veya kaldırmak için Düzenleyiciler listesinin üzerindeki Ekle (+) veya Sil (–) düğmesini 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.