Select Page

HTML Dersleri | 2 – HTML’de İlk Sayfa Yapımı

HTML Dersleri | 2 – HTML’de İlk Sayfa Yapımı

Genel hatlarıyla HTML ve özelliklerinden bahsetmiştik. Bu yazımda sizlere basit bir HTML sayfası oluşturup, onu nasıl kaydedeceğimize ve serverda nasıl görüntüleyeceğimize dair bilgiler vereceğim.

gtblog_html21

Öncelikle HTML belgelerinin genel kod yapısını hatırlayıp bir göz atalım.

Üst tarafta da gördüğünüz üzere ana taslağımız her zaman bu etiketlerden oluşuyordu. Sayfanızın yapısına göre Türkçe karakterlere yer verecek olursanız ”<head>” etiketinin içine Meta etiketini tanımlamamız gerekecek.“ <meta http-equiv=”content-type” content=”text/html; charset=windows-1254″/> <meta http-equiv=”content-type” content=”text/html; charset=iso-8859-9″ /> “ kodlarını ekleyerek Türkçe karakter desteğini de yapmış olacaksınız. Bu meta etiketleri  HTML4’te ve HTML5’te sürekli güncellenmiştir. Tüm karakterleri destekleyen kod HTML5 için “< meta charset=“UTF-8″  >” kodudur.


Gelelim şimdi ilk sayfamızı oluşturmaya:

Şu an en basitinden internet tarayıcımıza “Merhaba Dünya!” yazmayı deneyelim. Üstteki şablonun aynısını alıp bilgisayarınızdaki “Not defteri” programına yazmaya başlayın.En başta ne demiştik, tarayıcımız bizim yazdığımız onca kodun içinden sadece “<body>” etiketi içinde yazılanları sayfada gösterecektir. Bu yüzden “Merhaba Dünya!” yazısını “< body>”  etiketi içine yazmamız gerekecektir.

Dediklerimi yaptığınızda;

gtblog_html22

Kodlarını elde etmiş olacaksınız. Sıradaki işimiz yazdığımız bu kodları kaydetmek. Bildiğiniz üzere Not Defteri’ne kaydettiğimiz tüm metin dosyaları .txt uzantısıyla kaydolur. Biz burada HTML sayfaları elde etmek istediğimiz için dosyamızı farklı kaydet butonuna tıklayarak uzantısını “.htm” veya “.html” diye değiştiriyoruz ve kaydediyoruz.

gtblog_html23

Ben “taslak.htm” adıyla kaydettim. Kaydettiğiniz bu sayfa var olan tarayıcınız hangisiyse onun simgesini alacaktır. Kaydettiğiniz bu sayfayı açtığınızda karşınıza gelecek ekran:

gtblog_html24

olacaktır.Gördüğünüz gibi sol üst kısımdaki araç çubuğumuzda “<title>” etiketine yazdıklarımız, ana alanda ise “<body>” etiketine yazdıklarımız yer aldı.

Böylelikle ilk HTML sayfanızı oluşturmuş oldunuz. Gördüğünüz gibi çok basit ve kullanışlı bir algoritması var. HTML gözünüzde büyütmeniz gereken bir dil değil. Kendinizi verecek olursanız hemen kavrayacağınız bir dil. Biz bu yazıda HTML sayfamızın ana yapısını, ilk sayfamızı oluşturmayı gördük. Bir sonraki yazıda, ana ekranın renklendirilmesi, yazılarımızın renklendirilmesi ve  biçimlendirmelerinden bahsedeceğim

Yazar hakkında:

Yorum yap

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir