Dremaweaver-Ortam-Araçları_emresupcinMerhaba arkadaşlar,

Yine dreamweaver ile makalemize devam edeceğim. Bu sefer siz değerli okurlara dreamweaver’da ki çoklu ortam araçlarından bahsedeceğim. Tabii nasıl kullanıldıklarına da değineceğim. Resim Nasıl Eklenir? ile başlayalım diğerlerine de hep beraber açıklayıcı nitelikle ile değinelim. Arkadaşlar şunu da belirtmek istiyorum; Artık Notepad ile değilde dreamweaver’ın kod kısmı ile çalışıp sayfa önizlemesi yapalım ki dreamweaver’ın kodsal kısımlarında zorluk çekmeyelim

 

Resim Ekleme


Resimler HTML belgelerine estetik açıdan çok şeyler katabilir; fakat büyük boyutları nedeniyle yavaş yüklenir. Bu da ziyaretçinin sıkılmasına neden olabilir. Bu nedenle resimleri az kullanmanız doğru olacaktır. Internet üzerinde en çok kullanılan resim dosyası biçemleri GIF, JPG ve PNG’dir. Bu biçemlerin seçilmesindeki amaç sayfanın yüklenmesini kolaylaştırmaktır.

 

Windows ortamında en çok kullanılan resim formatı olan BMP’lerin web üzerinde kullanılmamasının en büyük sebebi, iyi resim kalitelerine karşın boyutlarının çok büyük olmasıdır. GIF biçemi 256 renk kullanarak ve JPG biçemi de resmin kalitesinden biraz kısarak boyut sorununu halleder. Resimler <img> etiketi aracılığıyla kullanılır. <img> etiketi ile beraber kullanılan bazı parametreler vardır. Bunlar;

 

src : Resmin bulunduğu dizini bu parametre ile bildiririz. <img src=”resim.jpg”>

width : Resmin genişliğini piksel cinsinden bildirir. <img src=”resim.jpg” width=”100″>

height : Aynı şekilde resmin yüksekliğini bildirir. <img src=”resim.jpg” height=”100″>

border : Resmin etrafındaki çizginin kalınlığını belirtir. <img src=”resim.jpg” border=”6″>

align : Yatay konum belirler; left, right, center değerlerini alır. <img src=”resim.jpg” align=”left”>

alt : Mouse resmin üzerindeyken yazacağınız metni gösterir. <img src=”resim.jpg alt=”Buraya açıklama yazın.”>

 

Aşağıda yukarıda anlattığım konu ile ilgili bir uygulama yaptım. Aşağıdaki ekran görüntüsünden ve kodlarından yaptığım uygulamayı sizlerde görebilirsiniz.

 

Dreamweaver-Resim-Ekleme_emresupcin

  1  <html>
  2       <head>
  3  <title>Resim Ekleme</title>
  4        </head>
  5    <body>
  6  <img src="...../resim.jpg"
  7     width="250"
  8     height="185"
  9     border="4"
  10         alt="Gezgin">
  11       </body> </html>

Üzerine tıklayınca istediğiniz bir adrese yeni pencere açan bir resim de ekleyebilirsiniz. Bunun için aşağıdaki kod satırını yazmanız yeterlidir.
<a href=”http://www.gidilecek adres.com” target=”…..”><img src=”resim.jpg” ></a>

 

Ses Araçları Ekleme


HTML etkileşimli ve çarpıcı dokümanlar oluşturmak için mükemmel bir ortamdır. Ses ve video görüntülerinin HTML sayfalarında kullanılabilmesi bu ortamı daha da çekici bir konuma getirir.

Seçiminize göre geri planda WAV, .AU veya MIDI ses dosyalarından birini çalmak için Internet Explorer’da BGSOUND etietini kullanabilirsiniz.
<bgsound src=’ emresupcin.mid’ loop=5>
komutunu kullandığınızda “emresupcin.mid” adlı MIDI dosyası sayfa yüklendiğinde 5 defa tekrarlanacak ve sonra duracaktır.

 

 

Video Ekleme


Bir AVI veya MOV dosyasını oynatmak için ise yine sadece Explorer’da işe yarayacak DYNSRC komutunu kullanmalısınız. emresupcin.Avi adlı bir video görüntüsünü ekrana yerleştirmek için aşağıdaki gibi bir komut kullanabilirsiniz. Deneme.Gif dosyası görüntü yüklenene kadar sayfada yer kaplayacaktır.
            <img dynsrc=’ emresupcin.avi’ SRC=’ deneme.gif’ loop=infinite >
Çokluortam dosyalarını Netscape’de gösterebiliriz. Fakat görsel açıdan Explorer’daki kadar başarılı olmuyor. EMBED komutuyla Netscape penceresine “gömülen” dosyalar beraberinde çerçeve kaydırma çubuğunu da birlikte getiriyor. Netscape için komut şöyle:
                                 <embed src=’ emresupcin.avi’ >

Yazar
Yazar
Bilgisayar Programcısı, Web Tasarımcı, Üniversite Öğrencisi...
Twitter Facebook Google Linkedin Flickr YouTube

Önceki Yazı:23 Nisan Ulusal Egemenlik ve Çocuk Bayramı…

Sonraki Yazı:C Programlama Dilinde Struct Yapısı Kullanımı?

BENZER YAZILAR
YORUMLAR
SİZ DE CEVAP YAZABİLİRSİNİZ
Bu yazı hakkında görüşünüzü belirtin.

ES Web Tasarım Web Tasarım Blog Teması Emre Supçin Bu tema ES Web Tasarım tarafından düzenlenmiştir. Hiçbir şekilde kopyalanamaz.