Temel HTML Etiketleri

Merhabalar, mobilhanem.com için hazırladığım HTML5, CSS3 eğitim setine hoşgeldiniz. Bu derste Temel Html Etiketleri’ni tanımaya çalışacağız. Bir html sayfası oluştururken kullanmamız gereken temel html etiketleri (<html><head><title><meta><body>) vardır. Bu html etiketleri sayesinde sayfamızı temel parçalara bölerek işlemlerimizi daha düzenli yaparız. Örnek olarak, <head> etiketleri arasında sayfa başlığı, sayfa hakkında temel bilgileri barındıran meta etiketleri veya css, javascript dosyalarımızı sayfaya dahil ettiğimiz alandır. Tarayıcı tarafında gözükmesini istediğimiz diğer tüm etiketleri de <body> etiketleri arasına yazarız.

Temel html etiketlerini kullanarak hemen bir sayfa tanımlayalım.

Önceki derste bahsettiğimiz üzere .html uzantılı bir sayfa tanımlayarak işe başlıyoruz.

Örnek olarak index.html adında bir dosya açabiliriz.

Ardından

etiketlerini yazıyoruz. Yine önceki dersimizde bahsettiğimiz üzere etiketlerin açılıp kapanma özelliğini kullanarak etiket içinde başka etiketler tanımladık.

İlk olarak <html> etiketini açarak, sırasıyla <head>, <body> etiketlerini açtık ve kapattık. Şimdi de kullandığımız tüm etiketlerin ne işe yaradıklarına tek tek bakalım.

<html> Etiketi Ne İşe Yarar?

html etiketi içerisine yazılacak tüm etiketleri kapsar. Html etiketi kullanmadan diğer etiketlerin bir anlamı olmaz.

<head> Etiketi Ne İşe Yarar?

Bu etiket sayfanın tarayıcıya ve arama motorlarına tanıtıldığı (Meta etiketleriyle), CSS ve Javascript dosyalarının dahil edildiği alanı temsil etmektedir. Sayfa görünümde herhangi bir değişikliğe sebep olmaz. Görünmez özellikleri temsil edecektir.

<title> Etiketi Ne İşe Yarar?

Bu etiket sayfa isminin belirtilmesini sağlar. Yani tarayıcı sekmesini temsil eden adı kapsar.

<meta /> Etiketi Ne İşe Yarar?

Meta etiketleri sayfaya ait temel bilgileri (Sayfa açıklaması, anahtar kelimeler, başlık vs) gibi bilgileri tarayıcılara ve arama motorlarına iletir. Böylelikle sayfanın hangi konu ile alakalı olduğunu arama motorları öğrenir ve sonuçları o bilgilere göre listeler. Meta etiketleri her html sayfasında muhakkak olması gereken etiketlerdir.

Kullanılan en temel metalar :

Not: HTML etiketlerinin açılıp kapanma özelliğinde bahsetmiştik önce derste hatırlarsanız. Fakat meta etiketlerinde görüldüğü üzere kapanma etiketi ayrı bir etiket olarak tanımlanmıyor, tek etiket içerisinde / ifadesiyle hem açılıp hemde kapatıldığını görüyoruz. İstisnai etiketler olduğunu meta etiketleriyle görmüş olduk.

<body> Etiketi Ne İşe Yarar?

Bu etiket arasında yazacağımız tüm etiketler ekrana yansır. Genel olarak tasarım yaparken <body> etiketleri arasında çalışacağız. Yani <body> etiketi bir html dosyanın en önemli kısmı.

<p> Etiketi Ne İşe Yarar?

En sık kullanacağımız etiketlerden birisi olan <p> etiketi, paragraflar oluşturmamızı sağlar.

Bu dersimizde her html sayfasında olması gereken temel html etiketlerini (<html><head><title><meta><body>) öğrendik. Gelecekte tanımlayacağımız tüm html sayfalarımızda bu etiketleri defalarca kullanacağız.

Bir sonraki HTML dersinde görüşmek üzere hoşça kalın!

Şaban Koparal

CBÜ Bilgisayar Mühendisliği & Back-End Developer

1 Yorum

Haftalık Bülten

Mobilhanem'de yayınlanan dersleri haftalık mail almak ister misiniz?