HTML, Hyper Text Markup Language cümlesinin ilk harfleri ile oluşturulmuş bir kısaltma olup web tarayıcıları tarafından yorumlanan betik dilidir. HTML türünde yazılmış dosyalar ya .htm ya da .html dosya uzantıları ile saklanabilir. En temelde medya içeriklerinin ve yazıların bir web sayfasında nasıl görüneceğini anlatabileceğimiz bir işaretleme dili olarak karşımıza çıkar. Burada dikkat edilmesi gereken ise HTML’in bir programlama dili ile kıyaslanamayacağıdır. Ancak web sitelerinde belirli işlevleri yerine getiren fonksiyonlar HTML içerisine gömülebilir. Yani programlama dilleri ile yazılmış kodlar HTML etiketleri ile uyumlu çalışabilir.
index.html Nedir?
Herhangi bir web adresini görüntüleyeceğiniz zaman sizi ilk karşılayacak olan sayfanın kaynağına index.html adı verilir. Bu ilk sayfaya ulaştıktan sonra diğer sayfalara ulaşmak için navigasyon düğmeleri barındırır. Her web sayfası index olmaya adaydır. Index belirlemek tamamen yapılacak olan servise bağlıdır.
HTML Neleri Sağlıyor?
HTML bir web sitenin en temel özelliklerinden en benzersiz özelliklerini yapmanızı sağlar. En temelde header olarak adlandırılan baş kısmı gövde kısmı ve footer olarak adlandırılan son kısmı HTML ile iskeletlendirebilirsiniz.
Daha dinamik web siteleri için HTML etiketlerinden daha fazlasına ihtiyacımız olur. Dinamik web siteleri ise frontend olarak adlandırılan arka plandaki işlemleri ile sürekli hizmet veren web sitelerine denir. Bu türde web siteleri oluşturmak için JavaScript CSS, ASP, PHP, Python ve mySQL veri tabanı dillerine ihtiyaç vardır.
HTML İskeleti
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Bu bir başlıktır. </h1>
<p>Bu bir paragraftır.</p>
</body>
</html>
Bu yapı bir web site sayfasının içeriği oluşturmak için kullanılan kalıptır.
<html> etiketi: etiketler veya meta bağıntılar gibi bütün kod alanını içerecek olan etikettir.
<head>etiketleri arasına link bağlamalar meta tanımları ve CSS sınıfları tanımlanır.
<body> etiketleri ise web sayfasındaki bütün görsel öğeleri oluşturduğumuz kısımdır.
Merak ettiğiniz bir web sayfasın iskeletini görmek için:
Web sayfasına mouse ile sağ tık ardından ‘Sayfa Kaynağını Görüntüle’ seçerseniz o sayfanın nasıl bu yapıya benzer bir yapısı olduğunu gözlemleyebilirsiniz.
Diğer HTML Etiketleri
<h1>à Başlık etiketi
<h2>à Başlık etiketi
<h3>à Başlık etiketi
<h4>à Başlık etiketi
<h5>à Başlık etiketi
<h6>à Başlık etiketi
<br/>àYazı yazarken bir alt satıra inmek için kullanılan enter tuşuna benzetilebilir. Biten bütün işlemlerden sonra yeni bir şey için bir alt satıra geçer.
<hr/>àYatay çizgi oluşturmak için kullanılır.
<img>àGörsel eklemek için kullanılan etikettir.
<p>àParagraf etiketi
<div>àHTML öğrenmeye karar verdiğinizde en çok karşılaşacağınız etiket olacaktır. Bu etiketler bir alan yaratarak benzersiz öğeler oluşturmayı sağlıyor.
Bu etiketler açıldığı gibi kapatılması zorunludur aksi halde yazılan kodlar web tarayıcıları tarafından yorumlanamamaktadır. Ve bu etiketlerin aldığı özelliklerde mevcut olabilmektedir. Örneğin <img src=’görsel adresi’>satırında img etiketi için src özelliği mevcuttur.
HTML Editörleri
Fazlasıyla HTML kodları yazabileceğimiz editörler mevcuttur. İşlevine göre ücretli veya ücretsiz editörler de mevcut olmaktadır. Yazı yazılabilen her editör HTML için uygun olsa da işimizi kolaylaştıran üçüncü parti uygulamalar:
- Notepad++
- Vscode
- Sublime Text
- Atom
- Dreamweaver
Bu editörler şu anda en popüler HTML editörleri olarak karşımıza çıkıyor. Hepsinin az miktarda sağladığı farklılıklar mevcuttur. Örneğin özelliğini hatırlayamadığınız bir etiketin bütün özelliklerini otomatik olarak gösterebilme. Bu editörler kişiselleştirilebileceği için sıkılmadan kod yazma imkânı sağlıyor.
Yazılım dünyasına merak ve ilgili kişilerin web teknolojilerin ana arterleri olan HTML, CSS ve JavaScriptöncelikli olarak öğrenmeleri başarılı bir yazılım kariyerine öncülük edebilir. Zira hem kolay hem de hızlı sonuç alınabildiğinden zevklidir. Buradan işe koyulmak daha derinlere gidebilmek için mükemmel bir yoldur.