Top

web Tag

  • All
  • Dijital pazarlama
  • Dijital, İyi Şeyler Podcast
  • E-Ticaret
  • Eğitim
  • Growth hacking
  • İnceleme
  • Kişisel
  • Rehber
  • Reklam
  • Sosyoloji
  • Teknoloji
  • Wordpress

Facebook bugün, pazarlamacılara yardımcı olacak yeni özellikleri başlattı. Cihazlar/araçlar arası insanlara ulaşıp onları eylemde bulunmaya teşvik etmek adına özelliklerin içeriği. Hedef kitle orjinal adıyla Custom Audiences, daha önce reklamı yapılan, pazarlanılan siteyi ya da mobil uygulamayı ziyaret edenleri hedefleyen mesajlar ulaştırmaya izin veren bir...

HTML5 ses dosyaları çalmak için de bir satandart sunmakta.


Web’te ses/audio

Şu ana kadar, web sayfaları üzerinde ses çalmak için bir standart yoktu.

Günümüzde ise, çoğu ses parçası flash gibi eklentilerle çalışmakta. Bununla beraber, tüm tarayıcılar aynı eklentiyi desteklememekte.

HTML5 audio elementi ile bir ses parçası standardı getirmekte.

Audio elementi ses parçalarının çalınmasını sağlar, veya bir ses akışının çalınmasını.


Audio Türleri

Varsayılan olarak, audio elementine uygun 3 tür mevcut:

TürIE 9Firefox 3.5Opera 10.5Chrome 3.0Safari 3.0
Ogg VorbisHayırEvetEvetEvetHayır
MP3EvetHayırHayırEvetEvet
WavHayırEvetEvetEvetEvet

 


Nasıl Çalışır

Ses çalabilmek için tüm ihtiyacınız olan şey:

<audio src=”song.ogg” controls=”controls”>
</audio>

Control özelliği play, pause, ve volume gibi yani çal, duraklat ve ses gibi kontrol düğmelerini sağlar.

<audio> ve </audio> etiketleri arasına audio elementini desteklemeyen tarayıcılar için uyarı yazsıı konulabilir.

Yukarıdaki Ogg dosyası örneği Firefox, Opera ve Chrome’da düzgünce çalışmaktadır.

Internet Explorer ve Safari’de de çalabilmesi için  türü mp3 olan bir dosya eklemelisiniz.

Audio elementi çoklu kaynağa sahip elementleri kabul etmekte. Source(kaynak) elementleri farklı ses dosyalarına bağlanabilmekte. İlk tanınan formatı çalacaktır tarayıcılar:

 

Tüm <audio> Özellikleri

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


HTML, Web Sunucuları

Ürettiğiniz web sitesini tüm dünyaya duyurmak ve 7/24 sunmak için web sunucu üzerinde depolamanız gerekmektedir.

Bu durum 3 tip maliyet doğurur;

Donanım maliyeti;

Gerçek bir web sitesi için; birtakım güçlü sunucu donanımı alma ihtiyacı doğurur. Düşük fiyatlı bir bilgisayarın bunu yapabileceğini düşünmeyin. Çünkü 24 saat ve devamlı yüksek bağlantıda çalışması gereklidir.

Yazılım maliyeti;

İstemcilerin yani sıradan bilgisayar kullanıcılarının sahip olması gereken lisansların (programların herbir tanesinin lisansı olur.) da kat be kat üzerinde tutar sunucuların(server’ların) yazılımlarının lisansı. Sunucu lisansları aynı zamanda kullanıcı limitine de sahip olabilir. Buna dikkat etmeniz gereklidir.

Emek maliyeti;

Düşük emek harcanacağını sanmayın. Kendi donanım ve yazılımınızı kurarsınız, bug’lar ile virüsler ile uğraşırsınız ve server’ı daima herşeyin olabileceği bir ortamda açık, çalışır tutmak zorundasınızdır.

İnternet servis sağlayıcı kullanmak

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com‘dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools’a ait paylaşacak olduğum online editörü kullanabilirsiniz.


URL’lere dair bilgiler

Açık hali Uniform Resource Locators’tır. Bir Web Adresinin diğer bir adıdır. Bir url sözcük bütününden oluşur. Tıpkı “nefarkederki.com” gibi. Ve aslında “nefarkederki.com”‘un ardında bir ip adresi mevcuttur. IP internet protokolüdür. 4 basamaklı ve her bir basamak 255 haneye sahip olabilir. Siz aslında tarayıcıya nefarkederki.com adlı url’yi girdiğinizde tarayıcı nefarkederki.com’a ait ip adresini çevirmektedir. İsimleri hatırlamak daha kolaydır. Bu yüzden onları kullanırız.

Siz bir bağlantıya tıkladığınızda bir HTML sayfasındayken, altı <a> etiketiyle çizilmiş bir adrese ulaşılır World Wide Web üzerinde.

Bir Uniform Resource Locator ise world wide web üzerindeki bir belge ya da veriyi adreslemek için kullanılır.

Bir web adresi “http://www.nefarkederki.com/images/logo.gif” gibi bir söz dizimi kuralı kullanır.

Şema olarak;

scheme://host.domain:port/path/filename   ‘dır.

Açıklaması;

  • scheme – Internet Servisinin tipini tanımlar ve genel olarak http’dir.
  • host – Domain host’unu(alan sahipliği yani) tanımlar. Temel olarak http için www’dur.
  • domain – Internet alan adını tanımlar tıpkı nefarkederki.com gibi.
  • :port – Host’a ait Port numarasını tanımlar. Http için port 80’dir varsayılan olarak.
  • path – Sunucudaki bir yolu tanımlar. Eğer ifade edilmediyse, web siteniz hosting paketinizdeki disk alanının root’u dur yani kök dizinidir.
  • filename – Dökümanın veya kaynağın ismini tanımlar.

Genel URL Şeması;

Çeviriler tırnak içinde gösterilir. Çevirilerin kaynağı; w3schools.com'dur. Çeviri haricindekiler bana aittir. Temel HTML derslerine de bakabilirsiniz bu konuya yabancıysanız. 16 Bölümdür ve ilk bölüme buradan ulaşabilirsiniz. Editör olarak; Notepad++, Dreamweaver ya da w3Schools'a ait paylaşacak olduğum online editörü kullanabilirsiniz.HTML, Özel karakterler / Entities, URL ve...

HTML ile kendi web sayfalarınızı oluşturabilirsiniz.  W3Schools.com 'dan yapacağım bu çeviriler ile HTML'yi kolaylıkla öğrenebileceksiniz. HTML'nin öğrenmesi kolaydır ve zevkli bulacaksınız bu dili.Başlangıç olarak bilgi; çevirileri(başlıklar hariç) çift tırnak içinde göstereceğim. Kendi yazdıklarım normal yazı olarak kalacak. Anlatacaklarımı uygulayabilmeniz için ilk önce denetim masasından klasör...

HTML ile kendi web sayfalarınızı oluşturabilirsiniz.  W3Schools.com ‘dan yapacağım bu çeviriler ile HTML’yi kolaylıkla öğrenebileceksiniz. HTML’nin öğrenmesi kolaydır ve zevkli bulacaksınız bu dili.

Başlangıç olarak bilgi; çevirileri(başlıklar hariç) çift tırnak içinde göstereceğim. Kendi yazdıklarım normal yazı olarak kalacak. Anlatacaklarımı uygulayabilmeniz için ilk önce denetim masasından klasör seçeneklerini bulmanız ve klasör uzantılarını göster halini seçmelisiniz. Ardından istediğiniz bir alanda(mesela masaüstünde) bir klasör açın web ismini verin. Klasörün içine girin(fare ile çift tık). Fare ile sağ tuş tıklayın ve metin belgesi(yeni metin.txt diye yazar) dosyasını oluşturun. Biz bu yeni metin.txt dosyası ile HTML dosyalarımızı oluşturacağız. Yeni metin.txt dosyasını açın ve farklı kaydete tıklayın. Açılan pencerede isim kısmına index.html yazın ve kaydedin web klasörümüzün içine. index.html klasörüne çift tıklayın ve browser(chrome, firefox, opera, internet explorer gibi)’da görebilelim. Artık web klasörümüzün içinde yeni metin.txt ve index.html adlı iki dosya olacağını biliyorsunuz ve artık hazırsınız. Bunu hazırlayamadıysanız bile, örnekleri uygulayabilmeniz için W3Schools‘taki metin editörünü paylaşmış olacağım. Sol taraftaki verileri silip, etiketleri(anlatacağım) yazarsınız ve edit and click me yazan yere basarsınız sağ tarafta da web sayfasının durumunu görebilirsiniz böylece. Bu benim ilk çalışmam. Umarım hepimize yararlı olur. Anlaşılmayan yerleri yorum olarak yazabilirsiniz/sorabilirsiniz. Kolay gelsin.


HTML Çerçeveleri/Frames

Çerçevelerle daha doğrusu frame’ler ile,  bir tarayıcı penceresinde birden fazla html belgesi görüntüleyebiliyorsunuz. Çağırılan her bir html belgesi bir çerçeve olarak anılır, her bir frame(çerçeve) de diğerlerinden bağımsızdır.

Çerçeveleri kullanma neden avantajlı değildir;

  • HTML’nin ileri versiyonlarında destek bulamayabilir
  • Kullanımı zordur çünkü tüm sayfayı basmak zordur.
  • Web geliştiricisinin birçok HTML belgesini takip etmesi gerekir.

HTML, Frameset Elementi

Frameset elementi bir veya daha fazla frame elemanını tutar. Her bir frame elementi ayrı bir belgede tutulur.

Frameset elemanı frameset’te kaç tane sütun ve satır olacağını belirler ve kaçının ne kadar pixel ya da yüzdelik alan kaplayacağını belirler.

HTML, Frame Elementi

<frame> etiketi belirli bir pencereyi tanımlar bir frameset içinde.

Aşağıdaki örnekte 2 sütunlu bir frameset mevcut.

Birinci sütun tarayıcının %25’ini kaplıyor. İkincisi ise %75’ini kaplıyor. “frame_a.htm” birinci sütunda, “frame_b.htm” ise ikinci sütundadır.

Misal;

<frameset cols=”25%,75%”>
<frame src=”frame_a.htm” />
<frame src=”frame_b.htm” />
</frameset>

Not; frameset’in sütunlarının alanı yanı cols, piksel cinsinden de yazılabilir ve sütunlardan geriye kalan yıldız ile kalan alanı kaplaması sağlanabilir.  (cols=”200,500″) ve (cols=”25%,*”) gibi.

HTML ile kendi web sayfalarınızı oluşturabilirsiniz.  W3Schools.com ‘dan yapacağım bu çeviriler ile HTML’yi kolaylıkla öğrenebileceksiniz. HTML’nin öğrenmesi kolaydır ve zevkli bulacaksınız bu dili.

Başlangıç olarak bilgi; çevirileri(başlıklar hariç) çift tırnak içinde göstereceğim. Kendi yazdıklarım normal yazı olarak kalacak. Anlatacaklarımı uygulayabilmeniz için ilk önce denetim masasından klasör seçeneklerini bulmanız ve klasör uzantılarını göster halini seçmelisiniz. Ardından istediğiniz bir alanda(mesela masaüstünde) bir klasör açın web ismini verin. Klasörün içine girin(fare ile çift tık). Fare ile sağ tuş tıklayın ve metin belgesi(yeni metin.txt diye yazar) dosyasını oluşturun. Biz bu yeni metin.txt dosyası ile HTML dosyalarımızı oluşturacağız. Yeni metin.txt dosyasını açın ve farklı kaydete tıklayın. Açılan pencerede isim kısmına index.html yazın ve kaydedin web klasörümüzün içine. index.html klasörüne çift tıklayın ve browser(chrome, firefox, opera, internet explorer gibi)’da görebilelim. Artık web klasörümüzün içinde yeni metin.txt ve index.html adlı iki dosya olacağını biliyorsunuz ve artık hazırsınız. Bunu hazırlayamadıysanız bile, örnekleri uygulayabilmeniz için W3Schools‘taki metin editörünü paylaşmış olacağım. Sol taraftaki verileri silip, etiketleri(anlatacağım) yazarsınız ve edit and click me yazan yere basarsınız sağ tarafta da web sayfasının durumunu görebilirsiniz böylece. Bu benim ilk çalışmam. Umarım hepimize yararlı olur. Anlaşılmayan yerleri yorum olarak yazabilirsiniz/sorabilirsiniz. Kolay gelsin.


HTML Listeleri

En genel HTML Listeleri sıralı ve sırasız listelerdir.

HTML Sıralı Listeler

<ol> etiketi ile başlar sıralı listeler. Her bir liste elemanı da <li> tag ı ile başlar.

Liste elemanları numaralanmış olarak gözükür.

  1. Kahve
  2. Süt

gibi. Kodlar da şöyle;

<ol>
<li>Kahve</li>
<li>Süt</li>
</ol>

HTML Sırasız listeler

Sırasız listeler de <ul> etiketi ile başlar. Elemanları da <li> etiketi ile…

Küçük siyah daireler ile işaretlidir liste;

  • Kahve
  • Süt

gibi, kodları da şöyle;

<ul>
<li>Kahve</li>
<li>Süt</li>
</ul>

HTML, Tanımlı Listeler