HTML dökümanları, HTML öğeleri kullanılarak oluşturulan metin dosyalarıdır.

HTML öğeleri, HTML etiketleri kullanılarak tanımlanır.

HTML Etiketleri

  • HTML etiketleri, HTML öğelerini belirtmek için kullanılır.
  • HTML etiketleri 2 karakter ile sınırlanır. < ve >
  • Bu karakterlere grup parantezleri (angle brackets) denir.
  • HTML etiketleri çift olarak kullanılır. Örn: <b> Bu metin koyu fonttadır. </b>
  • Bu çiftlerden birincisine başlama etiketi, ikincisine ise bitiş etiketi denir.
  • Başlama ve bitiş etiketleri arasında kalan herşeye ise öğe içeriği (element contents) denir.
  • HTML etiketleri büyük/küçük harfe duyarlı değildir, yani <b> ve <B> aynı görevi görür. (Türkçe karakter olan "İ" ve "ı" harflerinin bu durumun dışında kaldığını unutmayınız.)

HTML Öğeleri

Önceki sayfadaki örneğimizi hatırlayalım:

<html>
<head>
<title>Sayfa Başlığı</title>
</head>
<body>
Bu benim ilk sayfam <b>Bu metin koyu</b>
</body>
</html>

Bu bir HTML öğesidir:

<b>Bu metin koyu</b>

HTML öğesi başlangıç etiketi olan <b> ile başladı.
HTML öğesinin içeriği: Bu metin koyu
HTML öğesi bitiş etiketi olan </b> ile sonlandırıldı.

<b> etiketinin amacı, görüntülenecek olan metinin koyu gösterilmesi gerektiğini bildirmektir.

Etiketleri neden küçük harflerle belirtiriz?

HTML etiketlerinin büyük/küçük harfe duyarlı olmadığını söylemiştik: <B> ve <b> aynıdır. Eğer Web'de gezintiye çıkarsanız bir çok sitenin kaynak kodunun bütük harflerle yapılmış olduğunu göreceksiniz..Fakat biz her zaman küçük harf kullanırız. Neden?

Eğer Web standartlarını kontrol etmek istiyorsanız küçük harf kullanmalısınız. World Wide Web Consortium (W3C) HTML 4 versiyonu ile beraber küçük harf kullanımını önerir. Ayrıca XHTML (yeni nesil HTML) dili de bunu kullanmanızı şiddetle önerir.

HTML BAŞLIK

Başlık İngilizce'de heading kelimesine tekabül eder. Etiketleri <h1>, <h2>, <h3>, <h4>, <h5> ve <h6>'dır. <h1> en büyük başlığı, <h6> ise en küçük başlığı temsil eder. Şimdi şu kodu inceleyelim:

<h1>Başlık 1</h1>
<h2>Başlık 2</h2>
<h3>Başlık 3</h3>
<h4>Başlık 4</h4>
<h5>Başlık 5</h5>
<h6>Başlık 6</h6>

Ekran Çıktısı

Başlık 1

Başlık 2

Başlık 3

Başlık 4

Başlık 5
Başlık 6

 Görüldüğü gibi <h1> en büyük başlığı, <h6> ise en küçük başlığı simgeliyor.

HTML Nedir?

Hiper Metin İşaretleme Dili (İngilizce Hypertext Markup Language, kısaca HTML) web sayfalarını oluşturmak için kullanılan standart metin işaretleme dilidir. Dilin son sürümü HTML5’tir.

HTML, bir programlama dili olarak tanımlanamaz. Zira HTML kodlarıyla kendi başına çalışan bir program yazılamaz. Ancak bu dili yorumlayabilen programlar aracılığıyla çalışabilen programlar yazılabilir. Programlama dili denilememesinin nedeni tam olarak budur. Temel gereği yazı, görüntü, video gibi değişik verileri ve bunları içeren sayfaları birbirine basitçe bağlamak, buna ek olarak söz konusu sayfaların web tarayıcısı yazılımları tarafından düzgün olarak görüntülenmesi için gerekli kuralları belirlemektir. HTML kodunu web tarayıcıları okur, yorumlar ve görsel hale dönüştürürler, dolayısıyla aynı HTML kodunun farklı tarayıcılarda farklı sonuç vermesi olasıdır.

Küçüktür ve büyüktür işaretleri arasına yazılan HTML komutları kullanılarak yazılır. İşaretlenen metnin başını ve sonunu belirtmek için çoğunlukla çift olarak kullanılırlar.

Örnek:

<h1>Selam</h1>

 Ancak işaretlemek yerine metnin bir yerine bir işaret konacaksa tek olarak da kullanılabilirler.

Örnek: 

<img alt="" />

 

 

İşaretleme dili olan Html, web sayfalarının hazırlanmasında kullanılan sistemdir. Bir programlama dili olmayan Html bilgisayarlarımızda kullandığımız web sitelerinin oluşturulmasında kullanılır. Chrome, Fİrefox ve İnternet Explorer gibi tarayıcılar html kodlarını işleyerek bu kodları web sayfasına dönüştürür.

HTML Neler Sunuyor?

- Görsel, yazı ve video gibi içeriklerin web sayfasına konumlandırılmasını sağlamaktadır.

- Oluşturulan bu içeriklerin doğru şekilde internet sitelerinde görüntülenmesini sağlar.

- Arama motorlarına web siteleri hakkında bilgi verir.

Html kodu yazmak için bilgisayarlara bir program yüklemek gerekmez. Wordpad, not defteri ya da word gibi ortalarda bir metin editörü html sayfaları oluşturabilir. Kod yazmayı daha kolay hale getirmek için dreamwear, sublime Text ve notepad++ gibi araçlar kullanılabilir. Yazılan html kodları kaydedilirken htm, xhtml ve html gibi tarayıcıların anlayacağı şekilde kaydedilmesi gerekir.

HTML Yazarken Dikkat Edilmesi Gerekenler

A- ,, şeklinde () büyüktür ifadesi ile yazılan birime tag denir.

B- Açılan etiketler kapatılmalıdır. Etiketler / işareti ile kapatılır.

C- Html kodları yazılırken Türkçe karakter yer almaz.

D- Bu etiketler yazılırken küçük ya da büyük harf tercih edilebilir. Ancak genellikle küçük harfler tercih edilir.

HTML Etiketleri ve HTML Etiketlerinin Anlamları

- Html: Tüm etiketleri saran, html kodu ile kodlama işleme yapılması gerektiğini belirten sayfanın başında açılarak sayfanın sonunda da kapatılan etiketin adıdır.

- Head: Hazırlanan site ile alakalı içerik ve tanımların yer aldığı bölümdür. Bu alanda yer alan kodlar sitede görünmez.

- Body: Bu alan tüm sitenin görüntülendiği ve siteye giren herkesin görebildiği alandır. Kullanılan etiketlerin büyük kısmı body alanı üzerinde yer bulunur.

Metin Düzenleme Etiketleri

tagının içine yazılan metin düzenleme etiketleri tek tek incelendiğinde şu detaylar öne çıkıyor.

1) Başlık Etiketi: Başlık eklemek için bu başlık kullanılır.

Başlıktaki h, İngilizce heading yani başlık demektir. h1, h2, h3, h4, h5, h6 olarak 6 değişik şekilde başlık boyutu vardır. EN büyük başlık için h1 tercihi kullanılır.

2) Kalınlık Etiketi: Yazıları kalın yapmak için etiketi tercih edilir. İngilizce bol kelimesi kalın demektir. Bu kelimenin baş harfi kullanılarak simgesi oluşturulmuştur.

3) İtalik (eğik yazı) Etiketi: Eğik yazım için bu etiket tercih edilir. İngilizce ıtalic kelimesinin baş harfi kullanılarak simgesi oluşturulmuştur. Vurgu yapılması gereken yerde bu etiket kullanılır.

4) Altını Çiz etiketi: İstenen yerlerin altını çizmekte kullanılan bu etiket İngilizce underline kelimesinin baş harfi ile oluşturulmuştur.

5) Alt Satıra Geç Etiketi: Alt satıra geçmek için html kodu yazarken enter tuşu işe yaramaz. Bu işlem için etiketi ile html de alt satıra geçilir.

6) Paragraf Etiketi: Uzun yazılarda okunurluğu arttırmak için metni paragrafla bölmek için etiketi kullanılır.

7) Etiketi: Bu etiket yazının renk ayarla işlemi, yazı boyutu değiştirme işlemi ve yazı tipini değiştirme işlemini yapmak için bu etiket kullanılır. Bu üç işlemi aynı etiket ile yapmak için 1 ve 7 arasındaki parametreler etiket içinde kullanılır.

HTML'de Bağlantı Oluşturma

Html'de bağlantı oluşturma aslında gezinti işlemlerinin temelini oluşturur. Web sayfası birçok alt başlık menüden meydana gelir bunun için html kodları bu alanlar arası bağlantı oluşturarak bağlantı ağı oluşturulur.

- Site İçi Bağlantı Oluşturma: etiketi ile web sayfası içinde bağlantı ağı oluşturulabilir.

- Site Dışı Bağlantı oluşturma: Site dışı bağlantı dendiğinde siteniz ile Facebook ile bağlantı kurulabilir. Site dışı bağlantı yapılırken site adının baş kısmına https:// ya da http:// ön eki eklenmesi gerekir.