ADI SOYADI : 6.SINIFLAR WEB PROGRAMLAMA DERS ÇALIŞMA NOTLARI EK NOTLAR Sayfalarımıza ses ve video ekleyelim HTML sayfalarımıza içeriği zenginleştirmek, görselliği arttırmak için videolar ekleyebilir. Sayfamıza fon müziği eklemek için ses ekleme komutlarını kullanırız. Ses Dosya Türleri: MIDI ses dosyaları ( .mid) , .wma ve .wav ses dosyaları, mp2 veya mp3 ses dosyaları , .ra veya .ram veya .rpm ses dosyaları. Web sitelerimizde en çok kullanılan ses dosyası türü .mp3 uzantılı ses dosyalarıdır. <embed> işareti : Web sayfalarına ses veya video dosyaları eklemek için <embed> işareti ve bu işaretin özellikleri kullanılır. Örnek : <embed src=”istiklalmarsi.mp3” hidden=”true” autorstart=”true” loop=”true”> Src:İngilizce source (kaynak) kelimesinden gelen özellik web sayfasında çalınmak istenen ses dosyasının adresini ve adını belirtir. Hidden:Web tarayıcılar ses dosyası çalmak için bir program kullanır. Hidden gizli anlamına gelir. Hidden özelliği True ise çalan program web tarayıcıda gösterilir, False olursa eğer program web tarayıcıda gösterilmeden ses dosyası çalınır. Autostart:Ses dosyasının sayfa görüntülenir görüntülenmez çalmasını istiyorsan autostart özelliğine True değerini atamamız gerekli Loop:Döngü anlamına gelen özellikle, bir ses dosyasının kaç defa çalışacağını belirleyebilirsin. Loop özelliğine -1 veya True değerini atarsan, ses sürekli çalar. False değerini atarsan ses bir defa çalar ve durur. Video Dosya Türleri: .avi (Audio Video İnterleave) , .wmv (Windows Media Video) , .mpg veya .mpeg (Moving Pictures Expert Group), .mov(Quick Time), .rm veya .ram(Real Video), .swf veya .flv(Flash), .mp4 (MPEG-4) video türleri bulunmaktadır. En çok kullanılan video türleri : avi , mpeg, swf, flv, mp4 Örnek : <embed src=”yalovatanitim.avi” hidden=”false” autorstart=”false” loop=”false”> Yukarıdaki örnekte yalovatanitim.avi video dosyası web sayfasına eklenmiştir. Gizliliği kapatılmış, otomatik başlaması iptal edilmiş ve video bir kere gösterildikten sonra yeniden dönmesi iptal edilmiştir. Sayfalarımıza üst etiket (Meta Tag) ekleyelim Üst Etiket (Meta Tag) Nedir ? Meta tag’lar HTML kodunuzun HEAD bölümüne yerleştirilmiş bilgi etiketleridir. Arama motorlarına site ve içeriği hakkında bilgi sunar. Sitenizin bu arama motorlarınca doğru bir şekilde gösterimi için bazı Meta tag’ları kullanmakta fayda vardır. Burada sıklıkla kullanılan meta tag’ları açıklamaya ve onları site kodu içerisine nasıl yerleştirebileceğinizi açıklamaya çalışacağız Tanımlama(description) : Adından da anlaşılacağı üzere site içeriğinin tanımı için kullanılıyor. Örnekte gösterildiği gibi XYZ yerine sitenizin tanımını yerleştiriyorsunuz. Arama motorları bu kısmı gözden geçiriyorlar. Bir cümle ile siteden bahsedebilirsiniz. Örneğin; “Bu site web tasarım dersi için hazırlanmıştır”. Tanım kısmı, Google da dahil olmak üzere, bir çok arama motoru tarafından destekleniyor ve sitenizin arama sonuçları içinde düzgün bir şekilde sergilenmesi için kullanılıyor. Örnek : <meta name=”description” content=”XYZ”> Name özelliği meta tagın hangi özelliğinin kullanılacağını gösterir. Description özelliği tanımlama yapılacağını gösterir. Content (içerik) özelliği tanımlamanın içeriğinin ne olacağını gösterir. Anahtar Kalimeler(Keywords): Site arama motorları tarafından arşivlenirken hangi anahtar kelimelerin kullanılabileceğini belirtmek için kullanılıyor.Anahtar kelimeleri “kelime X” şeklindeki ifadeler yerine virgülle ayırarak yazmak gerekiyor Örnek : <meta name=”keywords” content=”kelime X, kelime Y, kelime Z” /> Keywords özelliği meta tagın anahtar kelimeleri listeleyeceğini gösterir. Kelime X, Y,Z : Anahtar kelimelerin listelendiğini gösterir. İstenilen sayıda anahtar kelime eklenebilir. Robotlar(robots): Örnek : <meta name="robots" content="index,follow" /> Bu tag, arama motorlarına site içeriği ile karşılaştıklarında nasıl davranmaları gerektiğini anlatıyor. Virgülün solundaki ifade sayfanın arşivlenip arşivlenmeyeceğine karar verilmesini sağlarken, sağındaki ifade sayfadaki linklerin takip edilip edilmeyeceğini belirtiyor. Arşivle için seçenekler index (indeksle) ve noindex (indeksleme). Linklerin izinin sürülmesi ile ilgili seçenekler de follow (takip et), nofollow (takip etme) şeklinde. Bu tag özellikle indekslenmesini istemediğiniz bir sayfa varsa önem kazanıyor, çünkü robotlar sadece noindex değerini dikkate alıyorlar ve bu değer yoksa öntanımlı olarak siteyi indeksleyip linkleri de takip ediyorlar. Web sitenizdeki bir sayfanın indekslenmesini istemiyorsanız o sayfaya: Örnek : <meta name="robots" content="noindex,nofollow" /> Content-Type: Sayfanda kullandığın dile ait özel harf ve işaretlerin sorunsuz olarak görüntülenmesi için gerekli ayarlamaları yapmazsan web sayfanı görüntüleyenler yazılarını şeklinde tuhaf işaretlerle görürler. Örnek: <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> Content-type özelliği ile hazırlamış olduğumuz web sitesinin sahip olduğu dil türünü belirleyeceğimizi bildiriyoruz. Content özelliği ile sitenin içeriğinin metinlerden ve HTML etiketlerinden oluştuğunu belirtiyoruz. Charset özelliği ile sitenin dilinin ne olacağını belirtiyoruz. Türkçe dil desteği veren karakter kod küme örnekleri : UTF-8 , Windows-1254 , iso-8859-9, latin5, xmac-turkish ONUR AĞIRMAN – BİLİŞİM TEKNOLOLERİ ÖĞRETMENİ