Primer lesson: köprü metni biçimlendirme dili

Köprü Metni Biçimlendirme Dili (HTML)

HTML, Köprü Metni Biçimlendirme Dili anlamına gelir. Bir web tarayıcısında görüntülenmek üzere tasarlanmış belgeler için standart biçimlendirme dilidir. HTML, Basamaklı Stil Sayfaları (CSS) gibi teknolojiler ve JavaScript gibi kodlama dilleri tarafından desteklenebilir.

Web'in Temeli

İnternet özünde küresel olarak birbirine bağlı geniş bir bilgisayar ağıdır. Bu ağla etkileşim kurmamızın birincil yolu, internet üzerinden erişilen, birbirine bağlı hipermetin belgelerinden oluşan bir sistem olan World Wide Web (WWW) aracılığıyladır. WWW'nin kalbinde HTML ile yazılmış belgeler olan web sayfaları bulunur. HTML, sitelerin temel yapısını sağlar ve bu yapı daha sonra CSS ve JavaScript gibi diğer teknolojiler tarafından geliştirilir ve değiştirilir.

HTML Belgelerinin Yapısı

Bir HTML belgesi, açılı ayraçlar içine alınmış öğeler olan bir dizi iç içe geçmiş etikete göre yapılandırılmıştır. Bu etiketler web tarayıcısına içeriğin nasıl görüntüleneceğini bildirir. Basit bir HTML belge yapısına örnek:

 <!DOCTYPEhtml>
<html>
    <kafa>
        <title>Sayfa Başlığı</title>
    </head>
    <gövde>
        <h1>Bu bir Başlıktır</h1>
        <p>Bu bir paragraftır.</p>
    </body>
</html>

Bu kod, bir başlık, bir başlık ve bir metin paragrafından oluşan temel bir web sayfasını tanımlar.

HTML Öğeleri ve Etiketleri

HTML belgeleri HTML öğelerinden oluşur. Her öğe bir başlangıç etiketi, bir miktar içerik ve bir bitiş etiketiyle temsil edilir. Bir öğenin başlangıç ve bitiş etiketleri, bitiş etiketinin öğe adından önce eğik çizgi içermesi dışında aynıdır.

Örneğin, <code><p></code> etiketi bir metin paragrafını içine alır ve aşağıdaki şekilde yapılandırılmıştır:

 <p>Bu bir örnek paragraftır.</p>

Farklı öğeler farklı amaçlara hizmet eder. Örneğin:

Başlıklar için <code><h1>...</h1></code> - <code><h6>...</h6></code> etiketleri kullanılır.
<code><a></code> etiketi bir köprüyü tanımlar.
<code><img></code> etiketi belgeye bir resim gömer.

Öznitellikler

HTML öğeleri, öğeler hakkında ek bilgi sağlayan niteliklere sahip olabilir. Nitelikler bir öğenin başlangıç etiketine yerleştirilir ve genellikle <code>name="value"</code> gibi ad/değer çiftleri halinde verilir.

Örneğin, bir görseli gömmek için, görselin URL'sini belirtmek amacıyla <code>src</code> (source) özelliğiyle birlikte <code><img></code> etiketini kullanırız:

 <img src="resmin url'si.jpg " alt="Resmin açıklaması">

<code>alt</code> özelliği, resim görüntülenemiyorsa alternatif metin sağlar.

Bağlantılar ve Gezinme

<code><a></code> etiketinin kullanımı, Web'in birbirine bağlılığının temelini oluşturan köprüler oluşturur. Bir köprü başka bir web sayfasına, aynı sayfanın farklı bir bölümüne, hatta indirilebilir bir dosyaya bağlantı verebilir. Örneğin:

 <a href="https://example.com">Example.com'u ziyaret edin</a>

Bu, <code>https://example.com</code>'a bir bağlantı oluşturur.

Listeler

HTML, listeler oluşturmaya yönelik öğeler sağlar. İki ana liste türü vardır:

Öğelerin sırasının önemli olmadığı sırasız listeler (<code><ul></code>). Sırasız bir listedeki öğeler madde işaretleri ile işaretlenir.
Öğelerin sırasının önemli olduğu sıralı listeler (<code><ol></code>). Sıralı bir listedeki öğeler numaralandırılmıştır.

Listedeki her öğe <code><li></code> (list öğesi) etiketinin içine alınır.

HTML5

HTML5, standardın en son gelişmesidir ve multimedya ve etkileşimli belgelere yönelik modern ihtiyaçları yansıtan birçok yeni özellik sunar. Bunlar yeni yapısal öğeleri içerir (<code><header></code>, <code><footer></code>, <code><article></code>, <code><section></code>) , grafik öğeleri (çizim için <code><canvas></code>, ölçeklenebilir vektör grafikleri için <code><svg></code>) ve medya öğeleri (<code><audio></code> ve <code ><video></kod>).

Anlamsal HTML

Anlamsal HTML, web sayfalarındaki bilgilerin anlambilimini veya anlamını güçlendirmek için HTML işaretlemesinin kullanımını ifade eder. Anlamsal HTML, yalnızca öğelerin nasıl göründüğünü veya davrandığını tanımlamak yerine (bu, CSS ve JavaScript'in işidir), içeriğin yapısını ve türünü doğru bir şekilde tanımlar. Örneğin, <code><article></code> etiketi içerideki içeriğin bir makale olduğunu belirtirken, <code><nav></code> etiketi bir gezinme menüsünü belirtir.

Anlamsal HTML kullanmak, web içeriğinin erişilebilirliğini ve aranabilirliğini geliştirerek onu daha kullanışlı ve keşfedilebilir hale getirir.

Çözüm

HTML, web sayfalarının temel yapısını sağlayan, World Wide Web'in temel taşı teknolojisidir. Etiketlerin, niteliklerin ve öğelerin kullanımı yoluyla HTML, yapılandırılmış belgelerin oluşturulmasına olanak tanır. HTML'yi anlayarak ve kullanarak, basit metin belgelerinden karmaşık etkileşimli multimedya deneyimlerine kadar web üzerinde erişilebilen geniş bir içerik yelpazesi oluşturulabilir. Web geliştirmenin temeli olan HTML uzmanlığı, web için tasarım yapmak veya geliştirme yapmak isteyen herkes için çok önemlidir.

köprü metni biçimlendirme dili