Sizin için Herşey

Kod dersleri


HTML-Ders1: HTML Nasıl Kullanılır?

  HTML kolay bir dildir. Bizim kullandığımız teknik ile öğrenmek daha da kolay olacak. Ancak her şeyden önce,sabredip bu bir sayfalık yazıyı okumalısınız. Yoksa ne bu sitede, ne de başka bir sitede pek bir şey anlayamayacaksınız.



  İlk dersimizde klişeleşmiş konulara (HTML in açılımı, kimlerin bulduğu vs) değinmemize gerek yok. Bu sitede bulacağınız dersler internetteki sıkıcı derslere benzemeyecek.

  Burada, basit ve herkesin anlayabileceği şekilde dersler bulacaksınız.Haydi  soru cevap şeklinde hazırladığımız ilk dersimize başlayalım:
 

1-HTML Nedir?


  Html bir uzantıdır. tıpkı mp3'ün bir şarkı uzantısı olması gibi, Html de bir yazı dosyası uzantısıdır. Bu yazı dosyalarını açmak için de Microsoft Word gibi, bilgisayarınızın metin editörlerini kullanabilirsiniz. 


  Html uzantılı dosyalar, başka bir bilgisayardan, internet yoluyla ulaşılabilir. Microsoft Word gibi programlar interneti kullanamadığı için, Tarayıcı dediğimiz programlar oluşturulmuştur. Tarayıcılar, hem internete bağlanabilen, hem de html dosyalarını gösterebilen programlardır. En çok bilinen tarayıcılar ise şunlardır:

  • İnternet Explorer
  • Mozilla Firefox
  • Chrome
  Çoğu internet sayfası aslında bir html dosyasıdır. Siz dosyanın adresini yazarsınız, tarayıcınız o dosyayı internetten bulup açar ve size gösterir.

  Gerçi Php,  asp gibi farklı dosyalar da var, ama bu yazıyı html öğrenmeniz için hazırladık, html öğrenmenize yaramayacak şeylerden bahsetmiyoruz.


2-Ama Siteleri Açtığımda Kodlar Görünmüyor?

  Doğru. Tarayıcılar html dosyalarını yorumlayarak gösterir. Yani html kodlarıyla hazırlanmış dosyayı alır,inceler ve nasıl görünmesi gerektiğine karar verip size gösterir.






3-HTML Kodlarını Nasıl Görebilirim?


  Bir html dosyasının yorumlanmamış haline o dosyanın Kaynağı denir. HTML sayfalarının(dosyalarının) kaynakları, html kodlarından oluşur ve tarayıcınızdaki bir sayfada bir yere sağ tıklayıp Kaynağı Göster yazısına tıklamanız gerekir.

4-Nasıl HTML Dosyası Oluşturabilirim?


  Yeni bir metin belgesi oluşturup açın. Dosya -> Farklı kaydet seçeneğine tıklayın ve dosya adının sonundaki .txt yerine .html yazın.

5-HTML kodları denemenin kolay yolu yok mu?


  Evet. Derslerimiz boyunca html kodlarını denemeniz için şu editörü kullanmanız en mantıklısı olur:

http://kodonizle.blogspot.com

  Açılan sayfada ilk kısma kodlarınızı yapıştırdığınızda ve ÖNİZLE butonuna tıkladığınızda, sağ taraftaki kısımda kodlarınızın önizlemesi görünecektir.

  Şimdi Bir Örnek Yapalım:

<div style="background-color:red;width:200px;height:150px;"><a style="color:white;">deneme</a></div>

  Bu kodu kopyalayıp, yukarıda verdiğimiz adresteki editörde deneyin. Bu kod gözünüzü korkutmasın, içinde css kodu da var.

  Bu örneği vermekle asıl amacımız, Kod Önizleme Editörünü denemeyi öğrenmeniz.




  Eğer bu kodu sitenize yerleştirseydiniz, şöyle görünecekti:


HTML programlama dilinde kullanılan tüm kodlar aşağıda listelenmiştir:


Kod Açıklama XHTML
<!--...--> Açıklama eklemek. Var
<!DOCTYPE>  Dosya türünü yazmak. Var
<a> Bağlantı vermek. Var
<abbr> Kısaltma. Var
<acronym> Kısaltmayı açıklamak. Var
<address> Adres vermek. Var
<area> Resim üzerinde alan belirtmek. Var
<b> Kalın yazmak. Var
<base> Tüm bağlantılar için ana yolu bildirme. Var
<bdo> Yazı yönünü bildirme. Var
<big> Büyük yazmak. Var
<blockquote> Alıntı yapmak. Var
<body> İçeriğe başlangıcı bildirmek. Var
<br> Satır atlamak. Var
<button> Buton eklemek. Var
<caption> Tablo başlığı belirtme. Var
<center> Hizayı ortalar. Yok
<cite> Alıntı yapmak. Var
<code> Bilgisayar kodu şeklinde yazmak. Var
<col> Tablo sütununu belirtme. Var
<colgroup> Tablo sütun gruplarını belirtme. Var
<dd> Açıklama eklemek. Var
<del> Üstü çizili yazı yazmak. Var
<div> Dosyada alan belirtme. Var
<dfn> Bir terim açıklamak. Var
<dl> Terimler listesi. Var
<dt> Terim açıklamak. Var
<em> Vurgulu yazı. Var
<fieldset> Alan belirleme. Var
<form> Form kullanma. Var
<frame> Alt pencere açmak (frame) Var
<frameset> Alt pencereleri tanımlamaya başlamak. Var
<h1> to <h6> Başlık (1-6 arası) Var
<head> Dosya bilgilerini açıklama bölümü. Var
<hr> Yatay çizgi çekmek. Var
<html> HTML'ye başlamak. Var
<i> Sağa yatık yazmak. Var
<img> Resim eklemek. Var
<input> Form nesnesi eklemek. Var
<ins> Vurgu yapmak. Var
<kbd> Kelime yazdırma. Var
<label> Etiket belirleme. Var
<legend> Bir alan için başlık belirleme. Var
<li> Listeleme. Var
<link> Dosyaya bağlantı verme. Var
<map> Resim tanımlama. Var
<meta> Dosya bilgisi tanımlama. Var
<noscript> Script desteği yoksa yapılacaklar. Var
<object> Bir obje ekleme (flash vs.) Var
<ol> Numaralandırılmış liste ekleme. Var
<optgroup> Seçim grubu. Var
<option> Sürükle-bırak seçim listesi. Var
<p> Paragraf. Var
<param> Parametre bildirme. Var
<pre> Formatlı yazı ekleme. Var
<q> Küçük alıntılar için. Var
<samp> Bilgisayar yazı tipi kullanma. Var
<script> Script tanımlama. Var
<select> Seçim kutusu tanımlama. Var
<small> Küçük yazma. Var
<span> Bir alan tanımlaması. Var
<strong> Vurgu yapmak. Var
<style> Stil belirleme. Var
<sub> Normalden aşağı yazı. Var
<sup> Üs yazmak. Var
<table> Tabloya başlamak. Var
<tbody> Tablo başlangıcı. Var
<td> Sütun belirleme. Var
<textarea> Metin kutusu. Var
<tfoot> Tablo altlığı. Var
<th> Tablo başlığı. Var
<thead> Tablo başlığı. Var
<title> HTML Dosyası başlığı. Var
<tr> Satır belirleme (tablo). Var
<tt> TT Yazı. Var
<ul> Madde işaretli liste. Var
<var> Değer. Var
<xmp> PRE komutunun aynısı. Yok
 
Bugün 30 ziyaretçikişi burdaydı!

apBLOG Hakkında

Merhaba ben gürkan aksoy sitenin adminiyim site işine yaklaşık 11 ay önce giriştim bende herkes gibi acemi olduğum için ilk başlarda şimdi acemilere ücretsiz yardımda bulunuyorum 1 aydır sitein 1 yaşına girmesiyle beraber bir yarışma düzenleyeceğim...
devamını oku >

Şimdi Reklamlar

HTML/CSS Döken: Tugay TEKECİ - yapiyoruz.tr.gg -//- Çizim: 6Noran - 6noran.com // 2012 - 2013
Bu web sitesi ücretsiz olarak Bedava-Sitem.com ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol