Dasar Düzey HTML Etiketleri

HTML etiketleri web sayfalarının yapısını belirlemek ve içeriklerini işaretlemek için kullanılır. Bu makalede, bazı temel HTML etiketlerini inceleyeceğiz.

HTML etiketleri, web sayfalarının doğru şekilde oluşturulmasını sağlar. Herhangi bir web sayfasının temelinde HTML etiketleri bulunur. Bu etiketler, sayfaları parçalara böler ve her bir parçanın nasıl görüneceğini belirler.

Bunun yanı sıra, HTML etiketleri içeriğe anlam katar. Örneğin, <h1> etiketi bir başlık oluştururken, <p> etiketi bir paragraf oluşturur.

HTML etiketlerini kullanarak sayfalarınızın yapısını düzenleyebilir ve içeriğinizi daha iyi erişilebilir hale getirebilirsiniz. Bu makalede, HTML etiketlerinin nasıl kullanıldığını ve ne işe yaradığını öğreneceksiniz.

HTML Başlığı

HTML Başlığı

Bir HTML belgesinde <title> etiketi kullanarak sayfa başlığını belirtebilirsiniz. Başlık, tarayıcı sekmesinde ve arama sonuçlarında görünecektir.

HTML Paragraf

HTML Paragraf

Bir HTML belgesinde <p> etiketi kullanarak paragraf oluşturabilirsiniz. Bu etiket, sayfa içeriğini paragraflara ayırarak daha okunaklı bir tasarım elde etmenizi sağlar. Paragraflar, metinleri mantıklı bir şekilde gruplandırmak için kullanılır ve okuyucunun bilgileri daha iyi anlamasını sağlar.

HTML paragraf etiketi, blok düzeyinde bir etiket olduğu için, başlangıç ve sonlandırma etiketi arasına gelen tüm içeriği bir paragraf olarak kabul eder. Bu sayede metinleriniz hizalı ve düzenli görünecektir.

Örneğin, bir blog yazısında farklı konulardan bahsediyorsanız, her bir konuyu ayrı paragraflara ayırarak daha okunabilir bir içerik oluşturabilirsiniz. Ayrıca, metinleri paragraflara bölmek, okuyucuların dikkatini çekmek için kullanılan bir tasarım yöntemidir.

Bununla birlikte, çok fazla paragraf kullanmak da metnin akışını bozabilir. Bu yüzden, içeriğinizin amacına ve okuyucunun beklentilerine uygun olarak paragrafları düzenlemek önemlidir.

HTML Alt Başlık

Bir HTML belgesi oluştururken, <h1>, <h2>, <h3> gibi başlık etiketlerini kullanarak başlıklar ekleyebilirsiniz. Bu başlıklar, sayfanın yapısal hiyerarşisini belirlemek için kullanılır. Örneğin, <h1> başlığı sayfanın ana başlığını ifade ederken, <h2> ve <h3> gibi alt başlıklar daha spesifik bilgileri temsil eder. Bu şekilde, sayfadaki içeriği daha organize bir şekilde sunabilir ve okuyucunun gözünde anlamı daha net olarak oluşturabilirsiniz. HTML başlıkları aynı zamanda arama motorları tarafından da dikkate alınır ve sayfa yapısının anlaşılmasında önemli bir rol oynar.

HTML İç İçe Başlık

HTML İç İçe Başlık=

Bir HTML belgesinde başlık etiketlerini iç içe kullanarak daha detaylı bir yapı oluşturabilirsiniz. Örneğin, <h2> içinde <h3> başlıkları kullanarak alt başlıklar oluşturabilirsiniz.

HTML Liste

HTML Liste

Bir HTML belgesinde, sıralı veya sırasız listeler oluşturmak için <ul> ve <li> etiketlerini kullanabilirsiniz. Bu etiketler, web sayfalarında öğeleri kolayca listeleyebilmenizi sağlar.

Sırasız Liste

<ul> etiketiyle bir sırasız liste oluşturabilirsiniz. Her bir liste öğesi için <li> etiketini kullanmanız gerekmektedir. Örneğin:

<ul>  <li>Elma</li>  <li>Armut</li>  <li>Muz</li></ul>

Bu kod, bir sırasız liste oluşturacak ve tarayıcınızda veya web sayfasında şu şekilde görünecektir:

  • Elma
  • Armut
  • Muz

Sıralı Liste

<ol> etiketiyle bir sıralı liste oluşturabilirsiniz. Yine her bir liste öğesi için <li> etiketini kullanmanız gerekmektedir. Örneğin:

<ol>  <li>Kahvaltı</li>  <li>Öğle yemeği</li>  <li>Akşam yemeği</li></ol>

Bu kod, bir sıralı liste oluşturacak ve tarayıcınızda veya web sayfasında şu şekilde görünecektir:

  1. Kahvaltı
  2. Öğle yemeği
  3. Akşam yemeği

HTML listeler, içerikleri düzenli bir şekilde sunmanızı ve sayfanın okunabilirliğini artırmanızı sağlar. Listeler, menüler, ürünler ve daha fazlası gibi metin tabanlı içerikleri organize etmek ve görsel olarak daha çekici hale getirmek için kullanışlıdır.

HTML Resim

Bir HTML belgesinde <img> etiketi kullanarak resim ekleyebilirsiniz. Bu etiketin src özelliğiyle resim dosyasının URL’sini belirtmeniz gerekmektedir.

HTML sayfalarına resim eklemek, görsel açıdan zenginleştirmek ve okuyucuların ilgisini çekmek için önemlidir. <img> etiketi kullanarak resim ekleyebilirsiniz.

Resim eklerken dikkat etmeniz gereken en önemli özellik, resim dosyasının URL’sini src özelliğiyle belirtmektir. Bu, resmin nerede bulunduğunu tarayıcıya söyleyen bir adrestir. Örneğin:

<img src="https://www.example.com/resim.jpg" alt="Bir resim">

alt özelliği ise, resmin yüklenemediği durumlarda kullanıcıya alternatif bir metin sunmak için kullanılır.

Resimleri HTML içine yerleştirirken, genellikle resim boyutunu ve hizalamasını belirlemek için CSS kullanılır. Bu da sayfanın görüntüsünü daha iyi kontrol etmenizi sağlar.

Özetlemek gerekirse, HTML etiketi olan <img> ile resim ekleyebilir ve src özelliğiyle resim dosyasının URL’sini belirtebilirsiniz. Bu sayede sayfanızı görsel olarak zenginleştirebilir ve okuyucuların dikkatini çekebilirsiniz.

HTML Bağlantılar

Bir HTML belgesinde <a> etiketi kullanarak bağlantılar oluşturabilirsiniz. Bağlantılar, kullanıcıları başka bir sayfaya yönlendirmek için kullanılır. Bir bağlantı oluşturmak için <a> etiketi içerisine href özelliğiyle hedef sayfanın URL’sini yazmanız gerekmektedir. Örneğin, <a href="https://example.com">Bu bir bağlantıdır</a> şeklinde kullanabilirsiniz.

Bağlantılar, web sayfalarınız arasında gezinmeyi kolaylaştırmak ve kullanıcıların farklı içeriklere erişmesini sağlamak için önemlidir. Ayrıca, SEO açısından da değerlidir çünkü arama motorları bağlantıları takip ederek sitenizin yapısal bilgisini anlar ve indeksler. Bağlantıların açıklayıcı metinlerle kullanılması, hem kullanıcıların hem de arama motorlarının sayfanızı anlamalarına yardımcı olur.

Yorum yapın