1. Anasayfa
  2. Web Geliştirme

HTML Öğreniyoruz #1 (Temel Etiketler)

HTML Öğreniyoruz #1 (Temel Etiketler)
0

Merhaba arkadaşlar, günümüzde yaygın web sitesi kullanımı ile etkinliği ve işlevselli her geçen gün daha fazla artan bir teknolojiye sahibiz. HTML5. Bu teknoloji sayesinde, E-ticaret sitelerinden tutun haber, iletişim, blog vb. birçok web sitesine erişebiliyoruz. Peki ya bu web sitelerinin altında neler yatıyor ? Haydi gelin en temelden HTML etiketlerini öğrendiğimiz bu seriye sizlerle birlikte başlayalım…

 

Öncelikle, Html Nedir ? Tam olarak ne işe yarar ? Gibi sorularınız varsa öğrenmek için HTML Nedir, Öğrenebileceğiniz Kaynaklar yazımızı inceleyebilirsiniz. Şimdi ise etiketleri tanıtmaya başlayabilirim.

 

“Doctype” Etiketi

“Doctype” etiketi, Html sayfasının olmazsa olmazı denilecek kadar öneme sahiptir. Hem Seo hem de tarayıcı tanınabilirliği açısından bu etiket oldukça önemlidir. Tanımsal olarak Html sayfasının html5 standartlarını takip eden bir döküman olduğunu belirtir.

Kodun Kullanımı:

 

Şeklindedir.

HTML5 için anlamsal (semantik) etiketler çok önemlidir. siteniz ne kadar standartlara uygun bir şekilde dizayn edilmişse o kadar görünür ve üst sıralarda olmaya hak kazanır. Google Chrome, İnternet Explorer, Opera, Mozilla Firefox, Safari vb. bütün tarayıcılar bu anlamsal (semantik) etiketleri göz önünde bulundurarak sıralamaları ve görünürlüğü site içeriklerinin uyumlu oluşuna göre dizayn eder. Bu şekilde web sitenize daha fazla ve canlı ziyaretçi çekebilirsiniz.

 

“html” Etiketi

“html” etiketi, web siteniz için yine olmazsa olmazların en başında gelir. Çünkü adını da konusundan almış olduğu üzere bu etiket, web sitesi için yazılacak kodları içerisinde barındırır. Mesela “html” etiketinin iki alt öğesi olan “head” ve “body” etiketleri başta olmak üzere diğer bütün html” etiketleri bu etiketin arasına yazılır ve web site taslağı oluşturulur. Bu nedenle konumuzun en önemli etiketi de diyebiliriz. Tabi bu etiketleri de (head ve body) yazımın devamında sizlere açıklayacağım. Yalnız şuan için sadece taslak görüntüsü olması ve “html” etiketini tanıtması adına aşağıda onlar ile ilgili de birkaç örnek kod satırı vereceğim.

 

“head” Etiketi

“head” etiketi, html”i açıklarkende bahsettiğim gibi sayfanın ana taslağını oluşturmak için görevli elemanlardandır. Bu etiket “html” sayfasının kullandığı harici kaynakların (CSS ve javascript dosyaları) sayfaya tanıtıldığını kısımdır. Ayrıca sayfanın arama motorları tarafından ulaşılabilir ve anlamlandırılabilir olması için sayfayı tanımlayan özet bilgilerin (meta etiketlerinin) eklendiği kısımdır . head” etiketinin alt öğeleri ise title” ve meta” etiketleridir.

 

“body” Etiketi

“body” etiketi, HTML dilinde bir sayfanın içerisindeki tüm içeriğin, tabloların, manşetlerin ve aklınıza gelebilecek diğer tüm elementlerin gösterildiği alan ve HTML etiketidir. … “head”, sayfa ile ilgili görünmeyecek element ve bilgilere yer verirken Body” etiketi sayfa içerisinde görünmesi gereken elementleri de içerisinde barındırır.

Kodların Kullanımı:

Son olarak “html” ,“head” ve “body” etiketini kullanmış olursak bu şekilde olur.

 

☕ Yazılarımı beğeniyorsanız ve daha fazlası için destek olmak isterseniz buradan bana kahve ısmarlayabilirsiniz.

Teşekkürler. 

Ne Düşünüyorsun?
  • 0
    harika_
    Harika!
  • 0
    g_zel_
    Güzel!
  • 0
    haval_
    Havalı!
  • 0
    e_lenceli_
    Eğlenceli!
  • 0
    _zg_n_m_
    Üzgünüm!
  • 0
    sevmedim_
    Sevmedim!

Her zaman yeni bir şeyler öğrenmek isteyen, işleri hep nasıl daha iyi yapabileceğini düşünen ve bu konuda ilginç fikirleri olan hayalperest bir front-end developer.

Yazarın Profili
İlginizi Çekebilir

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