1. Anasayfa
  2. Nedir

HTML Nedir, Ne İşe Yarar? İşte Merak Edilenler


HTML nedir? HTML açılımı, Hyper Text Markup Language yani Hiper metin işaretleme dili’dir. Daha basit tabirle, Web’de görüntülenmesi amaçlanan belgeler için standart biçimlendirme dilidir.

  • Hypertext: İnternet kullanıcılarının web’de gezinme yöntemidir. Kullanıcılar, köprüler adı verilen özel metinlere tıklayarak yeni sayfalara erişir.
  • Markup language: Bir belgenin öğelerini tanımlayan etiketlerden oluşan bir sistemdir. İşaretleme dosyaları, biz insanlar tarafından okunabilecek şekilde tasarlanmıştır ve daha karmaşık programlama sözdizimi yerine standart kelimeler içerir.

HTML esasen, web tarayıcılarına bir sayfanın yapısını ve stilini nasıl anlayacaklarını söyler ve web sayfalarının formlar, ses ve video dosyaları ve daha fazlasını içermesine olanak tanır. Bugünlerde bir web sitesi oluşturmak için HTML bilmek gerçekten gerekli mi? Cevap hayır. Bir geliştirici değilseniz ve sadece basit bir web sitesi oluşturmak istiyorsanız, bunu basit bir sürükle ve bırak görsel düzenleyicisinin yardımıyla kolaylıkla yapabilirsiniz.

Bu makalede, HTML’nin temellerini, nasıl çalıştığını, CSS ve JavaScript ile ilişkisini ele alacağız…

HTML Ne İşe Yarar, Nasıl Çalışır?

Standart bir web sitesi, ana sayfa , hakkında sayfası ve iletişim sayfası gibi bir dizi HTML sayfasından oluşur. Bu sayfaların her biri , tarayıcının yorumlaması ve ziyaretçiler için göstermesi gereken bir .html veya .htm uzantısıyla kaydedilmiş bir HTML belgesidir .

Bu sayfalar, sayfanın temel öğeleri olan bir dizi HTML etiketi ve öğesinden oluşur. Bu kavramı açıklamak için bir örnek alalım:

<p>Bu bir paragraf.</p>

Bu bir HTML öğesi örneğidir, öğenin nerede başlayıp nerede bittiğini tanımlayan bir etiketle (örneğin <p> etiketi) çevrilidir. Öğelere bakmanın başka bir yolu, onları bir etiketin gerçek içeriği olarak düşünmektir.

Şimdi tam bir HTML sayfası oluşturmak için etiketlerin ve öğelerin nasıl bir araya geldiğini görelim.

İlgilenebilirsin:   Web Hosting Nedir? Türleri Nelerdir?

Temel bir HTML belgesi neye benzer?

Gördüğünüz gibi, bir HTML belgesi, sayfanın yapısını tanımlayan bir dizi öğeden oluşur:

<!DOCTYPE html>
<html>
  <head>
    <title>Web Sitem</title>
  </head>
  <body>
    <h1>Hello, world!</h1>
    <p>Bu bir paragraf.</p>
    <a href="https://example.com">Bu bir bağlantı</a>
    <img src="https://example.com/200?text=Demo+Image"/>
  </body>
</html>

Bu örnekte:

  • <!DOCTYPE html> tarayıcıya bunun bir HTML belgesi olduğunu söyler
  • <html>, tüm belgeyi tanımlayan kök öğedir
  • <head>, sayfa hakkında <title> gibi meta bilgileri içerir
  • <title>, tarayıcı penceresinin başlık çubuğunda görüntülenecek başlığı ve sekme adını kapsar
  • <body> belgelerin gövdesini tanımlar, temel olarak başlıklar, paragraflar, resimler, bağlantılar vb. gibi tüm görünür öğeler için bir kapsayıcıdır.
  • <h1> bir başlık oluşturur. <h1> (en büyük) ile <h6> (en küçük) arasında değişen etiketler istendiğinde kullanılabilir
  • <p> bir paragraf oluşturur
  • <img> bir resim ekler. Görüntü kaynağı, sunucunuzdaki bir dosyanın URL’si veya yolu olabilir.
  • <a> href özniteliği tarafından tanımlanan bir URL’ye köprü oluşturur

Bu HTML kodu tarayıcınızda aşağıdaki gibi görüntülenecektir:

html ornek

Gördüğümüz gibi, tarayıcı etiketleri görüntülemiyor, sayfanızı son kullanıcıya doğru şekilde oluşturmak ve görüntülemek için yorumluyor. İnternette bir sayfa oluşturan HTML kodunu görüntülemek istiyorsanız. Bir sayfa arka planına sağ tıklayın ve Sayfa kaynağını görüntüle öğesini seçin.

HTML değişir ve gelişir mi?

Evet! HTML, 1991 yılında Sir Tim Berners-Lee tarafından oluşturuldu, ancak o sırada resmi olarak piyasaya sürülmedi. HTML 2.0 1995’te piyasaya sürüldü ve o zamandan beri her yeni sürüm yeni etiketler ve öğeler getirerek birkaç büyük değişiklik gördü. 

Bugün, gezinme öğeleri, makaleler, bölümler, üstbilgiler ve altbilgiler için ayrılmış etiketler dahil olmak üzere yerel ses ve video desteğinin yanı sıra anlamsal işaretlemeyi tanıtan HTML5‘deyiz.

HTML, CSS ve JavaScript arasındaki ilişki nedir?

Az önce gördüğümüz gibi HTML, bir web sayfasının yapısını tanımlamayı mümkün kılar. Ancak, yalnızca HTML içeren web siteleri çok geride kaldı! Daha güncel bir web sitesi oluşturmak için CSS ve JavaScript gibi diğer web teknolojilerini kullanmanız gerekecek!

  • CSS, renkler, arka planlar, yazı tipleri, animasyonlar ve düzen gibi HTML öğelerinin stillendirilmesinden sorumludur. 
  • JavaScript, öğeleri dinamik yapan koddur; atlıkarıncalar, etkileşimli açılır pencereler ve fotoğraf galerileri oluşturmak, hatta karmaşık animasyonlar oluşturmak ve multimedyayı kontrol etmek için kullanılabilir.
İlgilenebilirsin:   İnternet Olmadan Android ve PC Arasında Dosya Aktarımı

Bu üç teknoloji birlikte, modern ön uç web geliştirmenin bel kemiğini oluşturur. Bunları birleştirerek hemen hemen her şeyi inşa etme gücüne sahip olursunuz!

Daha ileri gitmek istiyorsanız, ihtiyacınız olan her şeyi size öğretebilecek tonlarca ücretsiz çevrimiçi kurs var.  Aşağıdaki kaynaklara göz atın:

  • OpenClassrooms : HTML5 ve CSS3 ile web sitenizi nasıl oluşturacağınızı öğrenmek için kesinlikle en iyi kaynaklardan biri. Üstelik ücretsiz!
  • FreeCodeCamp : 7000’den fazla ücretsiz öğretici ile sınavlara girerek, projeleri tamamlayarak ve hatta bir kursu tamamladığınızda sertifikalar alarak öğrenebilirsiniz.
  • Codecademy : Daha görsel insanlar için etkileşimli öğreticiler içeren birçok ücretsiz giriş kursu sunar.
  • W3Schools : Etkileşimli bir “Kendiniz Deneyin” düzenleyicisi içeren bir dizi ücretsiz HTML öğreticisi sunar ve tarayıcıda kodla denemeler yapmanıza olanak tanır.

FTC: İçerikte bulunan bağlantılar aracılığıyla ürün/hizmet satın aldığınızda komisyon kazanabiliriz. Komisyonlar editoryal değerlendirmelerimizi etkilemez.