Ev Social Media Dreamweaver'da Web Sitenize Görüntü Ekleme - mankenler

Dreamweaver'da Web Sitenize Görüntü Ekleme - mankenler

Video: HTML - Ders 4 Siteye Resim ve Video Ekleme 2024

Video: HTML - Ders 4 Siteye Resim ve Video Ekleme 2024
Anonim

Photoshop, Photoshop Elements veya Fireworks gibi başka bir programa ihtiyacınız var … Web sayfanıza bir resim ekleme, ilk bakışta neredeyse büyülü görünebilir, çünkü süreç Dreamweaver ile çok basittir. Web grafikleri ile ilgili zorluk, bunları sayfalarınıza eklemezken, görüntüleyicinizin tarayıcısına çabucak yüklenebilecek iyi görünümlü görüntüler yaratır.

Görüntü oluşturmak, değiştirmek, düzenlemek ve optimize etmek için Photoshop, Photoshop Elements veya Fireworks gibi başka bir programa ihtiyacınız var. görüntülerin en iyileştirilmesi dosya boyutlarını küçültür, böylece resimleriniz daha hızlı indirilir. Dreamweaver bazı temel resim düzenleme araçları sağlar, ancak çoğunlukla sayfanıza resim eklemek ve yerleştirmek için Dreamweaver kullanırsınız.

Dreamweaver, web sayfalarındaki görüntüleri yerleştirmeyi kolaylaştırır ve bunun için birden fazla yol sunar:

  • Ortak Ekle panelinde Görüntüler simgesini tıklatın ve sonra Görüntü Ekle iletişim kutusunu kullanarak bir resim seçin.

  • Dosyalar panelinde, bir resim adını tıklatıp resmin görünmesini istediğiniz sayfaya sürükleyin.

  • Ekle menüsünü kullanın.

Kullanışlı bir web, JPEG, GIF veya PNG görüntüsüne sahip değilseniz, zaten optimize edilmiş görüntüleri indirebilirsiniz.

Ekle menüsünü kullanarak bir web sayfasına resim yerleştirmek için şu talimatları izleyin:

  1. Mevcut bir sayfayı açın veya yeni bir sayfa oluşturup kaydedin.

  2. İmlecinizi görüntüye sayfaya eklemek istediğiniz yere getirin.

    Yeni bir boş dosyanın sol üst köşesine resim ekleyebilirsiniz ve bir web sayfasındaki etiketleri ve öğeleri içine görüntüler yerleştirebilirsiniz, ancak ek bir HTML kullanmadan yalnızca bir sayfanın ortasına resim koyamazsınız. etiketleri veya CSS biçimlendirmesini yerleştirin.

  3. Ekle → Görüntü → Resim'i seçin.

    Görüntü Kaynağı Seç iletişim kutusu görüntülenir.

  4. Eklemek istediğiniz görüntüyü bulmak için göz atın.

    Bilgisayar sisteminize bağlı olarak, görüntüleri farklı şekillerde yerleştirirken önizleme yapabilirsiniz. Üç yaygın seçenek vardır:

    • Windows XP'li bir bilgisayarda, Herhangi bir açık klasördeki tüm görüntülerin küçük resim sürümlerini görüntülemek için Bak alanının sağındaki Görünüm menüsü açılır listesinden Küçük Resimler'i seçin. Ayrıca, iletişim kutusunun en sağındaki herhangi bir seçili resmin tek bir önizlemesini görüntüleyebilirsiniz.

    • Windows Vista veya Windows 7 olan bir bilgisayarda, Bakın Menüsünün sağındaki Görünüm menüsü açılır listesinden bir simge seçeneği (Küçük Simgeler, Orta Simgeler, Büyük Simgeler veya Ekstra Büyük Simgeler) seçin Herhangi bir açık klasördeki tüm görüntülerin küçük resim sürümlerini görüntülemek için alan. Ayrıca, iletişim kutusunun en sağındaki herhangi bir seçili resmin tek bir önizlemesini görüntüleyebilirsiniz.

    • Mac'te, iletişim kutusunun sol üst köşesinden Sütunları Görüntüle seçeneğini seçin. İletişim kutusunun en sağındaki herhangi bir seçili resmin tek bir önizlemesini görüntüleyebilirsiniz.

      Kredi: Casey Stoll'un resimleri
  5. Resmi yerleştirmek için resim adını çift tıklayın veya bir kez tıklayın ve Tamam'ı tıklayın.

    Bir sayfaya bir resim eklerseniz ve resim yerel site klasörüne kaydedilmemişse, Dreamweaver bir uyarı iletişim kutusu ister ve görüntüyü yerel site klasörünüze kopyalamayı önerir. Birçok tasarımcı, yerel sitenin içindeki tüm resimleri kendi sitelerinde sakladıkları resimler olarak adlandırılan bir alt klasör oluşturur, ancak isterseniz birden çok alt klasöre resim düzenleyebilirsiniz.

  6. Resim özelliklerini görüntülemek ve düzenlemek için web sayfanızdaki görüntüyü seçin.

    Görüntü seçenekleri, bir resim seçildiğinde sayfanın altındaki Özellik denetçisinde otomatik olarak görüntülenir.

    Kredi: Fotoğraf Casey Stoll

Bir sayfaya bir görüntü dosyası yerleştirdiğinizde, aslında sayfanın bir kopyasını eklemiyorsunuz; görüntüye bir referans oluşturursunuz. Altta yatan kod, bir sayfadan diğerine yapılan bir bağlantı koduna çok benzemektedir.

Hem resim başvuruları hem de bağlantılar, dosyanın adını ve sayfadan o dosyaya giden yolu içerir. Aslında, görüntüyü görüntülediğinde görüntüyü bulmak için bir web tarayıcısı için bir talimat oluşturuyorsunuz.

Web sayfanızda bir resim görüntülemek için web sitenizi yayınladığınızda hem sayfayı hem de resmi yüklemeniz gerekir. Resim dosyalarınız ve bu dosyalara atıfta bulunan sayfalar, web sunucunuzda olduğu gibi sabit diskinizdeki aynı göreceli konumda değilse, resimlerinize yapılan referansı kırarsınız ve sayfanızda çirkin bir Kırık Resim simgesi görünür.

Resimlerinizin ve dosyalarınızın birbiriyle ilişkili olarak kalmalarını sağlamanın en iyi yolu, Dreamweaver'ın sizin için onları takip etmelerine izin vermektir. Bu nedenle, site kurulum sürecini tamamlamak ve Dosyalar panelinde bulunmak dışında asla bir görüntüyü taşımadığınızdan veya yeniden adlandırmadığınızdan emin olmak çok önemlidir.

Dreamweaver'da Web Sitenize Görüntü Ekleme - mankenler

Editörün Seçimi

Arama Motorları Okunabilen Gezinme Yapıları Oluşturma İpuçları - mankenler

Arama Motorları Okunabilen Gezinme Yapıları Oluşturma İpuçları - mankenler

Navigasyon yapısı, arama motorları tarafından görünür olmalıdır. Bazı sayfa bileşenleri arama motorları için görünmez olabilir. Örneğin, JavaScript ile oluşturulmuş bir navigasyon yapısı bazı arama motorları tarafından çözülemeyebilir. Web sitenizde gezinmenin tek yolu JavaScript gezinme yöntemiyle yapılmışsa, bir sorun yaşayabilirsiniz; bazı arama ...

SEO: Anahtar Kelime Tabanlı Arama ile Semantik Arama - mankenler

SEO: Anahtar Kelime Tabanlı Arama ile Semantik Arama - mankenler

Muhtemelen öğrendiniz SEO araştırması sayesinde, arama motorlarının, sonuçları sorgularla eşleştirmek için anahtar kelimeler kullanması. Ancak, bu tamamen doğru değildir. Arama motorları ilk olarak, sorgudaki kelimelerin sayfadaki kelimeleri ne kadar yakından eşleştirerek sayfaları ödüllendiren bir sıralama sistemi kullanmak için geliştirildi. Sorgu cümleyi ne kadar çoksa ...

SEO Video İfadeleri İyileştirme - AYAKLAR İpuçları

SEO Video İfadeleri İyileştirme - AYAKLAR İpuçları

Sitenizdeki tüm videoları SEO için optimize etmek istiyorsunuz . Video, arama motorları ve kullanıcılarının gittikçe arayan medya içeriği sunarak web sitenizi zenginleştirir. Hızlı başvuru için, videoda karıştırma için en iyi uygulamaların bir özeti: Yerleştirme: Videoyu ilgili sayfaya yerleştirin ...

Editörün Seçimi

QuickBooks 2012'de Sınıfları Ayarlama - mankenler

QuickBooks 2012'de Sınıfları Ayarlama - mankenler

QuickBooks 2012, sınıfları sınıfları ayrıştırmak veya izlemek için kullanmanıza olanak tanır hesap numarası, müşteri, satış temsilcisi, madde vb. gibi diğer muhasebe bilgisini kullanarak mümkün olmayan şekillerde finansal veriler. Bir firma, örneğin, finansal bilgileri mağazalar, iş birimleri ya da ... tarafından ayrıştırmak için sınıfları kullanabilir.

Sınıfları QuickBooks 2013'de Nasıl Kuruluruz - mankenler

Sınıfları QuickBooks 2013'de Nasıl Kuruluruz - mankenler

QuickBooks 2013, sınıfları sınıflandırarak ayrıştırmanızı veya izlemenizi sağlar hesap numarası, müşteri, satış temsilcisi, madde vb. gibi diğer muhasebe bilgisini kullanarak mümkün olmayan şekillerde finansal veriler. Bir firma, örneğin finansal bilgileri mağazalar, iş birimleri ya da ... tarafından ayrıştırmak için sınıfları kullanabilir.

QuickBooks 2015 İşini Ayarlama - kuklalar

QuickBooks 2015 İşini Ayarlama - kuklalar

Içinde QuickBooks 2015, müşteri tarafından faturaları takip edebilirsiniz veya müşteri ve iş tarafından. Bu kooky gibi gelebilir, ancak bazı işletmeler müşterileri belirli işler için fatura eder (belki de birkaç kez). Tek ailelik evlerin inşaatçılarından bir avuç için temel işi yapan bir inşaat alt yüklenicisine başvurun. Bu inşaat alt yüklenicisi muhtemelen müşterilerini faturalar ...

Editörün Seçimi

Bir IOS Uygulaması Geliştirmek İçin Tasarım Kalıplarını Kullanma - Sahte hayata

Bir IOS Uygulaması Geliştirmek İçin Tasarım Kalıplarını Kullanma - Sahte hayata

IOS uygulaması geliştirme için, çerçeve sizin için ağır bir yük kaldırma işlemi yapıyor. Her şey güzel ve iyidir, ancak bu çerçeveyle çalışmak, yalnızca kendi başına çalışmalarına izin vermekten çok daha karmaşıktır. Çerçeve, tasarım olarak da bilinen bazı programlama paradigmaları etrafında tasarlandı ...

IOS Uygulamalarını Geliştirmek İçin Çalışma Alanı Penceresindeki İçerik Düzenleyicileri Nasıl Kullanılır

IOS Uygulamalarını Geliştirmek İçin Çalışma Alanı Penceresindeki İçerik Düzenleyicileri Nasıl Kullanılır

Editör alanında belirli iOS uygulaması içeriğini düzenlemek için kullandığınız bir takım editörler bulunur. İçerik editörleri, bağlamın, düzenlemekte olduğunuz dosyanın türüne göre belirlendiği bağlam esaslıdır. Bu, bir Gezgin veya Düzenleyici atlama çubuğunda yaptığınız seçim - araç çubuğu görünen anlamına gelir ...