HTML web sayfalarını oluşturmaya yarayan bir dildir. HTML'in zaman içinde farklı versiyonları olmuştur. Burada 2014 yılında ilk resmi yayını yapılmış versiyon olan HTML5 anlatılacaktır.
HTML kodları etiketlerden ve bu etiketlerin içindeki yazılardan oluşur. Bir HTML elemanı genel olarak şu kalıptadır:
<etiket>Yazı</etiket>
Elemanın başındaki <etiket> kısmı açılış etiketi, sonundaki </etiket> kısmı da kapanış etiketi olarak adlandırılır.
HTML kodlarını yazmak için Adobe Dreamweaver gibi editörler kullanılabilir. Fakat Windows'la birlikte gelen Notepad de HTML kodu yazmak için yeterlidir ve bu eğitimde önerilen bunun kullanılmasıdır.
HTML dosyaları .html veya .htm uzantısı ile kaydedilmelidir. Daha sonra bu dosyalar herhangi bir internet tarayıcısı (IE, Mozilla Firefox, Google Chrome) ile açılabilir. HTML dosyalarını kaydederken "Encoding" olarak UTF-8 yazmanız önerilir. Bu Türkçe karakterlerin doğru görüntülenmesini sağlayacaktır.
Bazı HTML elemanları yukarıda gösterilen formata uymazlar. Örneğin <!DOCTYPE xxx> şeklinde bir elemanla tarayıcıya dokümanda kullanılan dil bildirilir. Tarayıcının kodu doğru yorumlaması için en başta kullanılan dil bildirilmelidir. xxx kısmına kullanılan dil yazılır. HTML5 kullanıldığını belirtmek için burada html kullanılır.
<!DOCTYPE html>
Genel formata uymayan bir başka eleman da yorum elemanıdır. Bu elemanın şekli <!--Yorum--> şeklindedir. Bu şekilde kodların arasına yorumlar eklenebilir. Bu yorumlar tarayıcı tarafından yok sayılır. Yorumların amacı kodu inceleyen kişiyi kod hakkında bilgilendirmektir.
Dikey boşluk bırakmak için kullanılan <br> ve kısımları ayırmak için kullanılan <hr> elemanları da formata uymayan elemanlardandır. Bunlar tek başlarına kullanılırlar. Bu gibi kapanış etiketlerine sahip olmayan elemanların <br/> ya da <hr/> gibi sonunda eğik çizgiyle birlikte kullanımları uygun ve yaygındır. Yaygın olmasının sebebi, kapanış etiketine sahip olmayan elemanların HTML5'ten önceki sürümlerde bu şekilde kullanılmasıdır.
HTML kodları büyük/küçük harf duyarlılığına sahip değildir. Fakat genel uygulama küçük harf kullanılması şeklindedir.
HTML elemanları iç içe olabilir. Örneğin <html> etiketleri arasına yazılan kod web sayfasını tanımlar. <!DOCTYPE> elemanı hariç bütün HTML elemanları bu etiketlerin arasında olmalıdır. <body> etiketleri arasındaki kısım ise sayfanın görülebilen içeriğini ifade eder. <body> etiketleri <html> etiketlerinin içinde olmalıdır. Bir paragraf girilmek istenirse <body> etiketlerinin arasına <p> etiketleri ile oluşturulmuş bir eleman girilmelidir. Bu örnek şu şekilde yazılabilir:
<!DOCTYPE html>
<html>
<body>
<p>Bu bir paragraftır.</p>
</body>
</html>
Elemanlara nitelikler de yüklenebilir. Örneğin link vermek için <a> etiketi kullanılır. Fakat link verilecek yazıyı tek başına etiketin içine yazmak çok da yeterli olmayacaktır. Burada nitelikler devreye girer. <a> etiketine href niteliği eklenerek linkin gideceği adres belirtilebilir:
<a href="http://www.google.com">Google</a>
Yukarıdaki satır uygun bir kod yapısının içine eklenirse Google'a link oluşturun bir Google yazısı meydana getirecektir:
<!DOCTYPE html>
<html>
<body>
<a href="http://www.google.com">Google</a>
</body>
</html>
Nitelikler eleman hakkında ek bilgiler sağlar. Örneğin yukarıdaki örnekte yazının hangi adrese bağlantı oluşturacağını belirtmiştir. Yukarıda da görüldüğü gibi nitelikler açılış etiketi içine yazılır ve yazım formatı şu şekildedir: nitelik="değer"
Örneğin kodların arasına yazılacağı <html> etiketine iki farklı nitelik yazılabilir. Bunlardan birisi manifest niteliğidir ve şöyle kullanılır: manifest="URL". URL yerine yazılacak adres manifesto dosyasının yerini belirtir. Bu dosya sayfaya girildiğinde belleğe alınacak dokümanları listeler. Bunun kullanılmasıyla ziyaret edilen sayfaların internet bağlantısı olmadan da ziyaret edilebilmesi sağlanır.
<html> etiketine eklenebilecek diğer nitelik ise xmlns niteliğidir. Bu nitelik sayfanın XHTML'e uyumlu olması istendiğinde kullanılır ve alabileceği tek değer vardır. Kullanılacak kalıp şu şekildedir: xmlns=http://www.w3.org/1999/xhtml.
Niteliklerin sağladığı bilgiler işlevsel etkilere sahip olmayabilir. Bu durumda niteliklerle verilen ek bilgiler sadece bilgilendirme amacı taşıyacaktır. Bu bilgileri tarayıcılar ya da arama motorları kullanabilir.
Bazı nitelikler değer olmadan kullanılır. Mesela ileride gösterilecek olan <input> elemanında bu tür nitelikler sıkça görülür. Örnek olarak bu elemana girilen required niteliği gösterilebilir. Bu durumda nitelik <input required> olarak yazılır. Fakat yine HTML5 öncesindeki kurallardan dolayı bu tür niteliklerin <input required="required"> şeklinde, yani değer olarak da niteliğin ismi yazılarak kullanıldığı görülebilir. Bu kullanım da uygun bir kullanımdır.
HTML5 >>>>> Başlık ve Paragraflar