HTML5 de Sayfana Audio&Ses Doyası Nasıl Eklenir? - Printable Version +- Hakkalyakin Board (https://hakkalyakin.com) +-- Forum: GENEL KÜLTÜR BİLGİLERİ (https://hakkalyakin.com/forumdisplay.php?fid=10) +--- Forum: GENEL KÜLTÜR BiLGiLERi MAiN (https://hakkalyakin.com/forumdisplay.php?fid=229) +---- Forum: Webmaster Bilgileri (https://hakkalyakin.com/forumdisplay.php?fid=232) +---- Thread: HTML5 de Sayfana Audio&Ses Doyası Nasıl Eklenir? (/showthread.php?tid=10102) |
HTML5 de Sayfana Audio&Ses Doyası Nasıl Eklenir? - RasitTunca - 07-01-2020 HTML5 de Sayfana Audio&Ses Doyası Nasıl Eklenir? HTML5 "audio" etiketi, bir HTML belgesinde audio player elementi belirtmek için kullanılır. Örneğin, ziyaretçilerinizin müzik dinlemesi için web sayfanıza bir audio player yerleştirebilirsiniz. HTML5'ten önce, ses dosyalarının web'de audio player ile oynatılabilmek için bir standart yoktu. Modern tarayıcılarda, sayfanıza audio player eklenmesi, resim ekleme kadar kolay. Artık özel eklentilerle (flash) uğraşmaya veya karmaşık kodlara ihtiyaç duymuyorsunuz, tek bir öğeyle bunu yapabilirsiniz. Gerçekten audio player ekleme ne kadar basit olduğunu bir örnekle başlayalım: ÖRNEK: Code: <audio controls> Yukarıda ki kodlar Sayfanıza basit bir audio player yerleştirmeniz ve bir kullanıcının medya aracını oynatabilmesi, duraklatması veya başka şekilde kontrol edebilmesi için temel denetimleri göstermeniz için tek ihtiyacınız olan kodlar budur. HTML5 "audio" etiketi, ses playerin nasıl başlatacağını belirten nitelikleri kabul eder. Öznitelikleri olarak, controls , autoplay , loop ve daha fazlasını içerir. Desteklenen niteliklerin tam listesi için aşağıya bakınız. HTML <audio> Öğesi HTML5'te audio player görüntülemek için yapmanız gereken şu kodları eklemek : ÖRNEK: Code: <audio controls> Website hızını artırmak için, source özniteliğine her zaman type özniteliğini eklemeniz gerekir. Aksi halde, tarayıcının oynatabileceği ses dosyası bulana kadar tarayıcı her ses dosyasını yükler. NOT : Yukarıda gördüğünüz üzere birden çok src (kaynak dosya) tanımlayabilirsiniz. <audio> Etiketi en modern tarayıcılar tarafından desteklenmektedir ancak sorun, farklı tarayıcıların aynı dosya biçimini desteklemiyor olmasıdır. İnternet Explorer .Wav uzantılı ses dosyalarını oynatamaz, ancak İnternet Explorer bunun yerine .mp3 dosyalarını oynatabilir. Bu sorunun çözümü her iki biçimi de kullanmaktır, bu nedenle ziyaretçilerin sesleri, tarayıcıları ne olursa olsun duyabiliyor. AUDİO ÖZELLİKLER <audio> öğesinin varsayılan davranışını değiştirebilecek veya geliştirebilen birkaç özel nitelik vardır. src : Öğesini kullanarak birden fazla kaynak dosyası belirtebilirsiniz. Kaynak elemanı, kullanıcının tarayıcısından birinin desteklemediği durumlarda birden çok biçimi bir geri bildirim olarak belirtmenizi sağlar. autoplay : Autoplay bu, tarayıcıya audio player oynatımını otomatik olarak başlatmasını söyler Mobil tarayıcıların genelde bu özelliği desteklemediğini, kullanıcının audio player oynatmaya başlamak için ekrana dokunması gerektiğini unutmayın. Websiteye gelen ziyaretçi yüksek sesli bir müzik ile karşılaşması, çok rahatsız edici olabileceğinden, bu özelliği dikkatli kullanın. (örnek kullanım: autoplay veya autoplay="autoplay" ) controls : Varsayılan audio denetimlerini gösterir oynat, duraklat, vb... (örnek kullanım: controls veya controls="controls" ) loop : Audio player oynatma Bitirdikten sonra müziğin tekrar oynatmaya devam edip etmeyeceğini belirtir. (örnek kullanım: loop veya loop="loop" ) muted : Audio playerin ses çıkışının varsayılan durumunu denetler. Varsa, bu öznitelik, yükleme üzerine ses çıkışının sessiz kalmasına (yani sesin olmamasına) neden olur. Bu özellik kullanıcıların tercihlerini geçersiz kılacaktır. Kullanıcı daha sonra istediği takdirde sesi açmayı seçebilir. preload : Ses dosyasının açılan sayfada ön yüklemesinin yapılıp yapılmayacağı belirtir. webmaster, en iyi kullanıcı isteklerine neden olacağını düşündüğü şeyleri tarayıcıya bir ipucu vermesine olanak tanır. Bu özelliği kullanmak gerekli değildir, bazı tarayıcılar bu özelliği görmezden gelir. Bu üç değerden birini alır : preload="none" : Taracıya ses dosyasının önceden yüklenmemesi gerektiğini söyler. preload="metadata" : Tarayıcıya, metnin uzunluğu veya formatını gibi meta verileri indirmesini söyler. preload="auto" : Kullanıcının kullanması beklenmese bile, tüm ses dosyasının indirilebileceğini gösterir. preload=" " : Boş dize, varsayılan değer preload="auto" Her durumda, tarayıcı bu özelliği bir komut değil bir ipucu olarak alır. HTML Ses - Tarayıcı Desteği HTML5' te, üç adet desteklenen ses biçimi vardır: MP3, Wav ve Ogg. Farklı biçimler için tarayıcı desteği şu şekildedir: Tarayıcıların Desteklediği Audio Dokumenteleri MP3, Wav, Ogg Internet Explorer : MP3 Chrome : MP3, Wav, Ogg Firefox : MP3, Wav, Ogg Safari : MP3, Wav Opera : MP3, Wav, Ogg HTML5 TARAYICILARIN DESTEKLEDİĞİ SES FORMATLARI Dosya Formatı Audio Type MP3 audio/mpeg Ogg audio/ogg Wav audio/wav |