in ,

BaşarılıBaşarılı

Html Dersleri – 1 – Html’e Giriş

Bir önceki yazımızda HTML Nedir? Ne Değildir? ve Html’in Tarihçesinden bahsetmiştik. Bu yazımızda da Html’e ufak bir örnekle giriş yapacağız.

Html ile web sayfası hazırlamak için bilgisayarımıza herhangi bir program yüklemenize gerek yoktur. Herhangi bir metin editörü html sayfaları oluşturmak için yeterlidir. Ancak daha hızlı ve kaliteli sayfalar oluşturmak için Notepad++, Sublime Text, Dreamweaver gibi programlar da tercih edilebilir. Hazırlamış olduğunuz web sayfalarını kaydederken html, htm, xhtml gibi tarayıcıların anlayabileceği bir uzantı ile kaydetmeniz yeterlidir.

İlk Sayfamızı Oluşturalım

Metin Editörünü açın ve aşağıdaki metni içerisine ekleyin. Daha sonra bu belgeyi deneme.html olarak kaydedin. (Şimdilik kodların ne olduğuna takılmayın. Daha sonra açıklayacağız.)

<html>

   <head>
      <title>İlk Html Sayfam</title>
   </head>

   <body> 
      Bu benim ilk 'Html' sayfam... 
   </body>

</html>

Oluştuduğumuz dosyaya çift tıklayın. Dosyamız tarayıcıda açılacaktır. Açılan sayfanın ekran görüntüsü aşağıdaki gibi olacaktır.

Örneğin Açıklaması

Daha önce de bahsettiğimiz(Html Nedir?) gibi Html dokümanlarımızı etiketler oluşturur. Html içerisinde bu etiketler açılır ve kapatılır. Etiket örneği <etiketAdi> şeklinde açılır ve kapatılırken etiket adının önünde ‘/’ getirilerek </etiketAdi> şeklinde yazılır.

Html dokümanımızdaki ilk etiketimiz ‘<html>‘ olacaktır. Bu etiket tarayıcımıza bir HTML dosyasının çalıştırılacağını söyler. Html dokümanlarında ilk açılan etiket son kapanır. Bu yüzden dokümanımızdaki ilk ve son etiket olacaktır.

Örneğimizde gördüğümüz ilk etiketimiz <head>…</head> ne işe yarar ?
<head>…</head> etiketi arasında kalan kısımlar bazı önemli bilgilerimizi ve sitenin tarayıcı üzerindeki başlığını içerir. Bu bilgiler tarayıcı penceresinde görüntülenmezler.
Head içerisinde tanıyacağımız ilk etiketimiz <title>Baslik</title> olacaktır. Bu etiket anladığımız gibi sayfamızın başlığını içerir. Tarayıcının üst kısmında ilgili sekmemizde bu başlığı görebiliriz.

Peki bu <body>…</body> ne işe yarar ?
Bu etiketler genel olarak sayfamızı oluşturan neredeyse tüm etiketleri içerisinde barındırır denilebilir. Örneğimizde de body içerisinde yazdığımız Bu benim ilk ‘Html’ sayfam… metni görüntüleyebildiğimiz gibi web sayfamızda yer alarak kullanıcılara gösterilmektedir.

Bu dersimizde ufak bir örnekle Html’e giriş yaptık. Sonraki derslerimizde diğer etiketleri inceleyecek ve kendi Html sayfamızı zamanla oluşturacağız. Takipte Kalın!..

Bildir

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Milli Savunma Bakanlığı ATMACA Füzesinin Kalifikasyon Atışını Paylaştı

Çikolata Fabrikasında Bozulan Karıştırma Makinesine Sıkışan 19 Yaşındaki İşçi Yaşamını Yitirdi