Kategori arşivi: HTML-HTML5

Html Link Ekleme

Html sayfamızda ink eklemek için<a></a> etiketini kullanmamız gerekmektedir. Bu etiketi kullanarak web sayfamızda dışarıya (farklı bir web sitesine) veya içeriye doğru (web site içi) linkler ekleyebiliriz. Bu linkin basit şekilde kullanımı aşağıdaki gibidir;

<a href="link verilecek adres" alt="link açıklaması">Link İsmi</a>

Bu etiketin kullanımını daha iyi anlamak için örnek bir link yapısı oluşturalım;

<a href="http://bilgialnet.com" alt="Bilgisayar eğitim sitesi"> Bilgialnet.com Sitesine Gitmek için Buraya Tıklayın...</a>

Burada alt etiketinin kullanımı zorunlu değildir. Arama motorları için bu etiketin önemi olduğu unutulmamalıdır.

Linke tıklandığında sayfanın yeni sekmede açılmasını istiyorsak bu yapının içine target=”blank” değerini eklememiz gerekmektedir. Bu işlem için aşağıdaki örneği inceleyelim;

<a href="http://bilgialnet.com" alt="Bilgisayar eğitim sitesi" target="blank"> Bilgialnet.com Sitesine Gitmek için Buraya Tıklayın...</a>

Evet bu şekilde link yeni sekmede açılacaktır. Evet html de link ekleme işlemi bu kadar kolay. Tekrar görüşmek üzere. Şimdilik hoşçakalın.

HTML Resim Ekleme Kodu

Html ile oluşturduğumuz web sayfamıza resim eklemek için <img> etiketinin kullanabiliriz. Bu etiketin kullanımını bu yazıda örnekle açıklayacağız.

Html’de web sayfamıza resim eklemek için aşağıdaki örnekteki etiket yapısını kullanmamız gerekmektedir;

<img src="dosyadizini/dosyaismi.jpg" alt="acıklama" height="yüksekliği" weight="genişliği"/>

Etiketin içinde yer alan alt=”” değeri zorunlu değildir. Ayrıca weight ve height bölümlerini de kullanmayabiliriz. Eğer bu değerleri kullanmazsak resim boyutu orjinal olarak web sayfasında gözükecektir.

Örnek;

<img src="public_html/banner.jpg" alt="bilgisayar eğitimi" height="400" weight="200"/>

Html’de görsel ekleme işlemi bu kadar kolay. Html ile ilgili konularımıza devam edeceğiz. Bizi takip etmeye devam edin.

Makalede anlatılan konu ile ilgili görüşlerinizi veya problemlerinizi yorum bölümünden bizlere iletebilirsiniz.

HTML Başlık Etiketleri

Seo için çok önemi olan html başlık etiketleri toplam 6 adettir. Html sayfalarda tanımlanabilen bu başlık etiketlerinin her biri farklı boyutta ekranda gözükmektedir. Bu başlık etiketlerinin kullanımı çok basittir. Bu etiketlerin kullanımını öğrenmek için aşağıdaki örneği inceleyebilirsiniz;

<html>
<body>
<h1>Bu başlık h1 ile oluşturuldu</h1>
<h2>Bu başlık h2 ile oluşturuldu</h2>
<h3>Bu başlık h3 ile oluşturuldu</h3>
<h4>Bu başlık h4 ile oluşturuldu</h4>
<h5>Bu başlık h5 ile oluşturuldu</h5>
<h6>Bu başlık h6 ile oluşturuldu</h6>
</body>
</html>

Bu kodları metin belgesinin içine kopyalayarak, html uzantılı olarak kaydedip, çalıştırarak deneyebilirsiniz. Bu etiketlerin görünümü aşağıdaki görseldeki gibi olacaktır;

Seo için web sayfalarında bu komutların kullanımı çok önemlidir. Bu konu ile ilgili ilerleyen günlerde makale yayınlayacağım. Bizi takip etmeye devam edin.

Html Yazdır Butonu Ekleme

Bir web sitesindeki sayfayı yazıcıdan yazdırabilmemiz için çeşitli yöntemler bulunmaktadır. Ctrl + P kısayolunu kullanmak bu yöntemlerden bir tanesidir. Bir diğer yöntem ise web sayfalarına yazdır butonu eklemektedir.

Web sayfamıza yazdır butonu ekleyerek kullanıcıların kolay bir şekilde web sayfasının çıktısını almasını sağlayabiliriz. Bu işlem yazdırma işleminin yapılmasını istediğimiz web sayfasına aşağıdaki komutu eklememiz yeterli olacaktır;

<input type="button" onclick="window.print()" value="BU SAYFAYI YAZDIR">

Bu komutu eklediğimiz sayfada yazdırma butonu aktif olacaktır. Ziyaretçiler bu butona tıkladığında yazdırma sayfası karşılarına gelecektir. Html ile ilgili konularımıza devam edeceğiz. Bizi takip etmeye devam edin.

HTML5 Video Ekleme

html dersleri

Html ile oluşturduğunuz web sitenize sadece birkaç komut ile video ekleyebilmeniz mümkündür. Bu işlem için ilk olarak web sunucunuzda oluşturduğunuz bir klasöre videonuzu yüklemeniz gerekmektedir. Biz örneğimizde videomuzun /videolar klasöründe olduğunu varsaydık. Şimdi html5 ile video ekleme işlemi için hangi komutlar kullanmamız gerektiğini öğrenelim;

Html5 ile video eklemek aşağıdaki gibi bir komut kullanmamız yeterli olacaktır;

<video width="400" height="350" controls="controls">
<source src="videolar/ornek.mp4" type="video/mp4">
</video>

Bu komutta “controls” değeri videomuzda başlat, durdur, ses ayarı gibi nesnelerin eklenmesini sağlar. Width, height değerleri ise videomuzun web sayfamızdaki boyutlarını belirler.

Web sayfamız yüklendiğinde videonun otomatik olarak başlamasını istiyorsak komutumuza “autoplay” değerini eklememiz gerekmektedir. Bu işlem için aşağıdaki örnekteki gibi bir komut eklemeniz yeterli olacaktır;

<video width="400" height="350" autoplay="autoplay" controls="controls">
<source src="videolar/ornek.mp4" type="video/mp4">
</video>

Evet html5 ile video ekleme işlemi bu kadar kolay. Html5 ile ilgili konularımıza devam edeceğiz. Bizi takip etmeye devam edin.

HTML Kayan Yazı Kodu

Web sitelere giriş yaptığımızda mutlaka kayan yazılar ile karşılaşmışızdır. Özellikle duyurular ve haberler birçok sitede kayan yazı olarak karşımıza gelmektedir. Web sitemize kayan yazı eklemek istiyorsak birkaç html komutu eklememiz yeterli olacaktır. Bu yazımızda web sitelere kayan yazı eklemek için uygulamamız gereken komutları basit bir şekilde açıklayacağız;

Sağdan Sola Doğru Kayan Yazı Nasıl Eklenir?

<marquee direction=right>Bu yazı sağdan sola doğru kayacaktır...</marquee>

Soldan Sağa Doğru Kayan Yazı Nasıl Eklenir?

<marquee>Bu yazı soldan sağa doğru kayacaktır...</marquee>

Yukarıdan Aşağıya Doğru Kayan Yazı Nasıl Eklenir?

<marquee direction="down" scrollamount="1">Bu yazı yukarıdan aşağıya doğru kayacaktır...</marquee>

Not: Buradaki scrollamount=”1″ komutu kayma hızını belirtmektedir. Değeri arttırarak kayma hızını yavaşlatabiliriz.

Aşağıdan Yukarıya Doğru Kayan Yazı Nasıl Eklenir?

<marquee direction="up" scrollamount="1">Bu yazı aşağıdan yukarı doğru kayacaktır...</marquee>

Html ile kayan yazı ekleme işlemi bu kadar kolay. Html ile ilgili konularımıza devam edeceğiz. Bizi takip etmeye devam edin.