Top

Bölüm 6 (HTML Dersleri)

Bölüm 6 (HTML Dersleri)

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 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 Paragrafları

Paragraflar <p> etiketi ile tanımlanır. Tarayıcılar(İnternet explorer, firefox, chrome, opera gibi), otomatik olarak paragraftan önce ve sonra boş satır atar bu sayede.

<p> Bu bir paragraf</p>

Kapanış tagını(etiketini) unutmayın

Çoğu tarayıcı kapanış tagini unutmuş bile olsanız html kodunu düzgünce gösterecektir.

<p> Bu bir paragraf

<p> Bu da bir başka paragraf

Yine de tarayıcıların bu davranışına güvenmemek lazım. Beklenmeyen sonuçlar doğurabilir unutulan ya da kullanılmayan kapanış tagları(etiketleri).

Bu da benim sözüm; HTML5’te ve XHTML’de ki şu an anlattıklarım HTML 5 öncesi için geçerlidir. HTML5 deneysel aşamada şu an ve çoğu kod ve kod blokları her tarayıcı tarafından desteklenmemekte. Ve en çok sorun çıkaran da Internet explorer’dır bu konuda. En deneyimli olanları ise Chrome ve Firefox tarayıcıları. Asıl mesele ise şu; açtığınız her tagı yani etiketi kapatmalısınız ve tüm kodlar küçük yazılmalı. Genel olarak w3 konsorsiyumu böyle kabul etmektedir artık. Tarayıcılar da buna göre şekillenmektedir.

Ve ek olarak; her verdiğim örneği test etmelisiniz önceki bölümlerde bahsettiğim şekilde. ya da bu adresteki editörü de deneyebilirsiniz. Buraya tıklayınız editör için!

HTML Satır Sonları

Yeni bir paragrafa başlamaksızın satır sonu yani yeni bir satır istiyorsanız

<br />

etiketini kullanabilirsiniz. Bunun son etiketi yoktur, başlangıç etiketinde son bulur ve boş bir elemandır.

<br> veya <br />

HTML 4.0 sonrasında, XML’de, XHTML’de HTML elemanlarının son(kapanış) etiketsiz olmasına izin verilmez.

Çoğu tarayıcı desteklediği halde <br> ‘yi <br /> olarak yazmak gelecekd değişikliklere karşı koyacaktır.

HTML Çıktısı – Yararlı ipuçları

HTML’nin nasıl görüntüleneceğinden emin olamayabilirsiniz. Büyük veya küçük ekranlar ve windows’un yeniden boyutlandırması farklı sonuçlar doğuracaktır.

HTML ile, fazladan boşluklar ya da satırlar koymanızla aldığınız çıktının(ekrana yazdırmanız yani) değişmesini sağlayamazsınız.

Tarayıcılar fazladan boşlukları ve satırları sayfa görüntülenirken kaldıracaktır. Satırların tamamı bir satır olarak, boşlukların tamamı da bir boşluk olarak algılanacaktır.


Bu dersimiz de burada bitmiştir. Yaralı olması dileğiyle. Umarım bu da açıklayıcı olmuştur. Uygulamalarınız gerekli. Ben en başında bu anlattıklarıma dair 3 tane ekran görüntüsü paylaşmıştım. Sonuçları oradan görebilirsiniz.

 

Siz neler düşünüyorsunuz? Yazımızı beğendiyseniz aşağıdaki butonlardan tavsiye edebilirsiniz, paylaşabilirsiniz veya yorumlarınızı sunabilirsiniz. Teşekkürler okuduğunuz için!

Bir önceki yazımız olan Bölüm 5 (HTML Dersleri) başlıklı makalemizde baslik, Bölüm ve çizgi hakkında bilgiler verilmektedir. Daha fazla yazımızı görmek için HYTürkyılmaz Dijital pazarlama ve growth hacking blogu anasayfası'yı ziyaret edebilirsiniz. Yazımızı aşağıdaki paylaşım butonlarıyla paylaşarak sevginizi yayınız! Teşekkürler!

Hasan Yasin Türkyılmaz

Sosyolog, dijital stratejist. Dijital medya, reklam ve growth hacking eğitimleri ve hizmetleri sunarım. PC, konsol fark etmez. Oyun oynamayı severim.

Tüm yazıları - Websitesi

Beni takip edin!:
TwitterFacebookLinkedInPinterestGoogle PlusDiggFlickrStumbleUponYouTubeYelpRedditDelicious