HTML Temel Etiketler

Web sayfalarının iskeletini oluşturan HTML,  temelde 1 bildirim ve 3 ana etiketten oluşur. Bunlar; !doctype bildirimi ile HTML , HEAD ve BODY etiketleridir.

DOCTYPE sadece bildirim amaçlı iken diğer etiketler ise kendi içlerinde başka etiketleri, bildirimleri yada başka scripteri barındırabilirler.  Tek tek bakalım...

!DOCTYPE

Sayfada kullanılam HTML dilinin versiyonu bu etiket ile belirtilir. Sayfa başında belirtilir. İçerisine başka bir etiket almaz. Bir html sayfanın HTML 5 versiyonu olduğu aşağıdaki bildirim ile belirtilir. 

<!doctype html>

HTML

<html> kodlarının (html etiketlerinin) yazımına başladığımızı gösteren etikettir. Tarayıcılar, yazılan kodların HTML kodları olduğunu html etiketini gördüğünde anlarlar. Yani bir nevi Sayfanın HTML sayfası olduğunu belirtir. </html> ile html kodları yazımının bittiği anlaşılır. HTML etiketi, HEAD ve BODY etiketlerini de içine alır. 

Tüm html kodları <html>.....…</html> etiketleri arasında yer alır.   

<!doctype html>
<html>
    <head>
        <title>  ... </title>
           .
           .         
    </head>
    <body>
      .
      .
    </body>
</html>

HEAD

Head baş,kafa anlamına gelir.  Sayfanın başı gibi düşünülebilir. Tasarımla ilgili  bilgi ve tanımları içeren etikettir. HEAD içerisine yazılanlar tasarım içerisinde görünmez..

Head etiketleri arasında aşağıdakiler olabilir:

title : sayfa başlığı

meta : çeşitli tanımlar

style : genel css kodları

link : css ve diğer bağlantılar

script  : javascriptler kodları

<head>
  <title>HTML TEMEL ETİKETLER  </title>
  <meta charset="utf-8">
  <style>  body {padding: 1rem}  </style>
  <link rel="stylesheet" href="html.css">
  <script> alert("HTML") </script>
</head>

TITLE

Sayfanın, tarayıcı sekmesinde görünen başlığını belirler. Head etiketleri arasında yazılır.

<!doctype html>
<html>
    <head>
        <title>  Sayfa Başlığı </title>        
    </head>
    <body>    
    </body>
</html>

Yukarıdaki kodlar çalıştığında, sayfa başlığı aşağıdaki gibi olacaktır.

,

META

Sayfa ile ilgili çeşitli bilgi ve ayarların tanımlandığı etikettir. Sayfadaki karakter kodlaması , anahtar kelimeler , site açıklaması, mobil cihaz uyumluluğu, site sahibi vs  gibi tanımları içerebildiği gibi , sayfanın istenilen sürede kendini yenilemesini de sağlayabilir. META etiketleri SEO (Search Engine Optimization)  için önemlidir.

<head> 
  <meta charset="utf-8">
  <meta name="keywords" content="kelime1,kelime2,kelime3,.........">
  <meta name="description" content="T.C. Milli Eğitim Bakanlığı">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  <meta name="author" content="Erkan ÜNLÜ">
  <meta http-equiv="refresh" content="30"> 
</head>

Meta etiketi ilgili geniş bilgi ve parametreleri için aşağıdaki makaleyi inceleyebilirsiniz.

HTML META EtİKETİ ve Parametrelerİ

BODY

Body vücut anlamına gelir. HTML sayfanın vücudu  olarak düşünülebilir. Sayfanın görünecek kısmını beliryelen bölümdür. Body etiketleri içerisinde , metin etiketleri , tablolar , divler , çerçeveler (frame) vs gibi tasarım ile ilgili etiketler yerleştirilir.

<!doctype html>
<html>
    <head>
        <title>  Sayfa Başlığı </title>        
    </head>
    <body>    
           .
           .

       TASARIM ETİKETLERİ

           .
           .
    </body>
</html>

Body etiketi ilgili geniş bilgi ve parametreleri için aşağıdaki makaleyi inceleyebilirsiniz.

https://erkanunlu.com.tr/makale-html-body-etiketi-ve-parametreleri