Html'e Giriş

HTML ve CSS, web site yapımı ve tasarımı için sık sık kullanılan diller olup günümüzde de neredeyse tüm tarayıcılar ve cihazlarda desteklenmektedir. Kullanımları ise çok kolaydır. Html dilini kullanmak için ".html" uzantılı bir dosya oluşturum içerisine kodlarınızı yazdıktan sonra tarayıcınız ile açmalısınız. Kurulumu bu kadar basit bir dildir ve hatta editör olarak not uygulamanızı bile kullanabilirsiniz ama biz hem sağladığı bir çok özellik hemde hızından dolayı Sublime Text 3 editörünü kullanıcağız. (Sizede tavsiye ederim)

İlk olarak Html'in kod yapısını öğrenelim. Html de kodlar etiketler şeklinde yazılır. Etiketlerin yapısı ise 2 şekildedir. Bunlar açılır-kapanır ve sadece açılır etiketlerdir. Açılır-kapanır etiketlerin içerisine yazı yada başka etiketleri yazabilirken sadece açılır etiketlerin içerisine herhangi birşey yazılamaz. Şimdi ise etiketlerin kullanımına bakalım.

<etiket>

<etiket></etiket>

Gördüğünüz gibi üstteki örnekte etiket sadece açılırken alttaki örnekte hem açılıp hem kapanmıştır. Bunuda 2 etiketteki "/" ifadesi ile anlıyabiliris. Bu ifade bize bir etiketin kapandığını ve dolaylı olarak daha önce açıldığını söyler. Tabikide her etiketin bir kullanım şekli vardır mesela "div" etiketi açılıp kapanırken "img" etiketi ise sadece açılır.
Şimdi ise Html'deki temel kod yapısına bakalım. Bu örneği kendi html dosyanızın içine yazıp sonucu daha iyi görebilirsiniz:

<!DOCTYPE html>

<html>
	<head>
		<title> İlk Sayfam </title>
	</head>
	<body>
		Merhaba, bu benim ilk sayfam.
	</body>
</html> 

Şimdi de bu kodların ne işe yaradıklarını adım adım görelim.

1- "!DOCTYPE html" etiketi. Bu etiket dosyamızın bir html dosyası olduğunu belli eder ve tarayıcınız da ona göre davranır. Eğer kullanmazsanız çeşitli sorunlar ile karşılaşabilirsiniz.

2- "html" etiketi. Bu etiket dökümanınızın ana etiketidir yani sayfanızla alakalı tüm kodlar bu etiketler arasına yazılır.

3- "head" etiketi ise sayfanızın ön kodlarını ve bağazı özellikleri barındıran yerdir.

4- "title" etiket de sayfanızın sekme başlığıdır. Sayfanın içerisinde bir etki yapmadığı için "head" kısmına yazılır.

4- "body" etiketi ise sayfanızın ana kısmıdır yani ekranda gördüğünüz çoğu şey bu etiketler arasına yazılır. İçerisine yazılanlar ise direk olarak ekranda görünür.

Bu dersimizde Html'e küçük bir başlangıç yaptık, ilerki derslerde ise HTMl'in derinliklerine doğru ilerliyeceğiz.

Yukarı Çık