Temel HTML İşlemleri, HTML Sayfa Yapısı


Web tasarım öğrenmenin ilk adımı HTML dilini öğrenmekir. Daha sonra CSS ve JavaScript/Jquery öğrenilmesi gerekmektedir. Front-End dediğimiz web sayfalarının ön kısmında son kullanıcıya görülen taraf için HTML-CSS-Jquery üçlüsünü öğrenmek şarttır. 



HTML (Hypertext Markup Language) web sayfalarını oluşturmak için W3C tarafından belirlenen komutlardan oluşan bir dildir.  HTML komutlarını notepad içinde dahi yazabilirsiniz. Fakat Sublime, Atom, Notepad++ gibi editörlerde daha rahat yazabilirsiniz.

HTML dili tag dediğimiz komutlar oluşur. Tag komutları genelde küçük-büyük işaretleri arasına yazılır. Örneğin <html> gibi, bir tag komutunu bitirirken genelde küçüktür işaretinden sonra slash işareti konur. Örneğin <html> ifadesi bitirilirken </html> şeklinde bitirilir. 

Aşağıda örnek bir web sayfasının taslak halini görmektesiniz. Nasıl bir insanın önce başı sonra gövdesi vücudunu oluşturuyorsa, web sayfasının da <head> başlığını <body> gövdesini oluşturur ve bu sırayla yazılır.


<html>
<head>
        <!--  Sayfa başlık ifadeleri -->
</head>

<body>
     <!-- Web sayfasının gövdesi, resimler, tablolar, metinler buraya yazılır -->
</body>

<html>

Şimdi de örnek bir web sayfası yapalım. Burada Türkçe karakterlerin sorunsuz görüntülenmesi için     <meta charset ="utf-8> satırını ekledik. Ayrıca Chrome gibi bir tarayıcıda sayfa başlığını belirlemek için <title> komutunu kullandık. 

<html>
<head>
       <title>Oğuzhan TAŞ Kişisel Sayfası</title>
        <meta charset ="utf-8">
</head>

<body>
    <h1> Merhaba HTML<h1>
</body>

<html>


Yukarıdaki mavi kodu kopyalayıp bir Notepad sayfasına yapıştırıp, ismini "ilk.html" adıyla kaydediniz. Sonra üzerine çift tıklayarak çalıştırınız, görüntü aşağıdaki gibi olacaktır. Tebrikler ilk web sayfanızı yaparak web tasarıma ilk adımı attınız.



Mutlu kodlamalar,
Oğuzhan TAŞ
Ekim 2018
Bookmark and Share