Frontend Development #1
Frontend kısmını 3 ana başlıkta ele alacağız. Bunlardan ilki, Frontend’in iskeleti HTML.
Hiper Metin İşaretleme Dili web sayfalarını oluşturmak için kullanılan standart metin işaretleme dilidir. Dilin son sürümü HTML5'tir. HTML, bir programlama dili olarak tanımlanamaz. Zira HTML kodlarıyla kendi başına çalışan bir program yazılamaz.
HTML açılımı Hyper Text Markup Language Türkçesi ise Hiper Metin İşaretleme Dili’dir.
HTML ile birlikte fotoğraf, video, yazı ve benzeri dosya biçimlerini tarayıcıya tanıtarak dosya aktarımı ve kullanıcıda görüntü oluşumu sağlanabilmektedir.
HTML ‘ i yazı editörleri ile kullanmamız gerekmektedir. Örneğin Visual Studio, Atom vs.
Tüm html elementlerinde “<” ve “>” işaretleri kullanılır.
Bir HTML sayfasının içerisinde ilk önce <html> tag’ı oluşturulur. Ve oluşturulan bu tag şu şekilde kapatılır : </html>
HTML sayfasının içerisinde iki bölüm vardır : <head> ve <body>
Örnek;
<html> : html tagı açılır
<head> : head tagı açılır
***** Websayfasıyla alakalı bilgilerin ve body bölümünden önce çalıştırılması gereken kodların bulunduğu bölümdür.
örnek : sayfanın başlığı, sayfanın açıklaması, tasarım kodları, javaScript kodları
</head> : head tagı kapatılır
<body> : body tagı açılır
***** Yazdığımız kodların sitenin ziyaretçilerine göründüğü bölüm burasıdır.
html elementleri oluşturup ekleyebiliriz. mesela bir resim ya da bir link ya da bir makale
</body> : body tagı kapatılır
</html> : html tagı kapatılır.
Tag Nedir? Tag ile birlikte kullanılan attribute nedir?
Tag veya Etiket, bir içeriğin kolayca kategorize edilebilmesine yardımcı olması amacıyla oluşturulan belirteçlerdir. İnsanların bugün aktif olarak kullanmış olduğu dillerin tamamına yakını oldukça büyük bir kelime hacmine sahiptir. Aranan bir başlık kişilerin dil alışkanlıkları göz önüne alındığında defalarca kez farklı kelimelerle aynı anlama gelecek şekilde yazılabilir. Tag’ler sayesindeyse bir yazı veya içeriği farklı şekillerde etiketlenerek kategorik hale getirebilir ve içeriği hakkında kullanıcılara daha fazla bilgi sunabiliriz. Böylece kullanıcılar aradıkları içeriklere daha kolay ulaşabilirler.
Örnek;
Resim Tag’ı <img/> , Paragraf Tag’ı <p/>, Başlık Tag’ı <h1/>
Attribute, türkçede nitelik demektir. Tag’lar ile birlikte kullanılır.
Örnek;
<a href=”/international-sales-offers/” class=”nav-a” tabindex=”0">Today’s Deals</a>
Tag : <a/>
Attribute : href ;( linki belirtmek için ) , class ; (şekillendirmek için ) , tabindex ; (tab’a bastığımızda gelme sırası ) vb.
