Html Dersleri.?

MySouLNeedLove

MySouLNeedLove

New member
Katılım
9 Ara 2005
Mesajlar
825
Reaction score
0
Puanları
0
Yaş
37
Konum
Çalışıyorum
Çok Yakında Html Dersleri Verecem...

Ders 1!..

Hemen Notepad'i açın ve başlayalım...

<HTML>
</HTML>

Terimlerin İngilizcesini söylemek zorundayım zira edineceğiniz bütün yardımcı programlarda İngilizce olacak.Yukarıda Kırmızı ile yazılmış şeylere "TAG" yani "etiket" derler. İlki açılış tag idir, ikincisi kapanış tag i. Kapanış tag i yapmak için açılş tag ine / eklediniz mi yeterlidir. Tag lerin hepsinin olmamakla beraber birçoğunun kapanış tag i vardır.
Tag leri Tarayıcınızla konuşmak gibi değerlendirin, daha doğrusu birşeyler yapmasını tarif ediyorsunuz. Şu anda tarayıcıya bunun 'HTML dökümanının başlangıcı olduğunu' söylediniz (<HTML>) ve bununda 'HTML dökümanının sonu' olduğunu söylediniz. (</HTML>). Şimdi içine birşeyler dolduralım.





Her HTML dökümanı bir çift HEAD tag i ister.

<HTML>
<HEAD>
</HEAD>
</HTML>
Genişletmek için tıkla ...



HEAD Taglerinin bizi ilgilendiren tarafı şimdilik sadece TITLE tagleridir.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
</HTML>
Genişletmek için tıkla ...

Ve sayfanın geri kalanı ise BODY ( Gövde )tagleri arasında bulunur. Yani şu anda izlediğiniz sayfa bu tagler arasındadır.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
Genişletmek için tıkla ...



Aman, birşey daha, dökümanınıza TITLE ile BODY tagleri arasına giracak birşeyler ilave edelim.

<HTML>
<HEAD>
<TITLE>Benim ilk web denemem!</TITLE>
</HEAD>
<BODY>
Merhaba Hackhell.com!
</BODY>
</HTML>
Genişletmek için tıkla ...

Şimdi save yapın, fakat text dökümanı değil, html dökümanı olarak. index.html olarak yeni bir klasörün içinde save yapın. Eğer bu biraz kafayı karıştırdı ise şöyle yapın... Notepadde Dosyayı tıklayın sonra Farklı Kaydet.
Çıkan diyalog kutusunda -> tıklayarak yeni bir klasör açın, istediğiniz adı verin. Sonra çift tıklayıp açın
Dosya Adı: diyen yere index.html yazın Farklı kaydet: tıklayın. Ama dikkat edin all files(*.*) yada Bütün dosyalar desin.
Enter'a basın ve bitti evet bitti.!

Tebrikler! artık tam fonksiyonlu webdede yayınlanabilecek bir WEB SAYFANIZ oldu. başardınız. İsterseniz SuperTurks veya ilkturk üye alanınızdan file manager ile web alanınıza yollayın. Artık bütün dünya görebilir...


Şimdi tarayıcının adres çubuğuna http://sitenizinadı.org yazın... birşey başarmış olmanın keyfi ile eserinizi seyredin.
Bir sonraki basamak sayfanıza güzel birşeyler koymak olacak.

Bir sonraki bölüme geçmeden iki önemli nokta

BİR: bu yaptığınız bir iskelet HTML dökümanı idi. Şu anda bu okuduğunuz sayfa dahil bütün fiyakalı web sayfaları bu esas tagleri bulundurmak zorundadır.

İKİ: Döküman <TITLE>Benim ilk web denemem!</TITLE> etiketleri arasında yazılı olanlar entepede tarayıcı penceresinin sol üst köşesinde, lacivert çubuğun üzerinde çıkar. İnanmazsanız kafanızı kaldırıp dediğim yere bakın.

Ders 2!.. Çok Yakın Zaman Gelecek Hazırlık Var.. Bu Deneme Tabi Begenirseniz Dersler Devam Edecek..Arkadaşlar..
 
Temel Unsurlar&İlk Html Sayfam

Temel Unsurlar

Bu sayfaya geldiğinize göre HTML öğrenme işinde
ciddisiniz demektir. HTML nispeten kolay bir dildir dedik. Bu dilde binary veya
hexadecimal kodlar yok. Herşey metin tabanlı ve bir HTML dökümanı oluşturmak
için ihtiyacınız olan şey bir editör. Hatta sizde herhangi bir HTML editörü
bulunmuyorsa bu işi Windows'un Notepad'i ile dahi halledebilirsiniz. Piyasada
iki tip editör bulunuyor. Birisi metin tabanlı, kod yazmayı gerektiren fakat
bunun yanısıra rutin bazı işlemleri kolaylaştıran editörler (HotDog, HomeSite.. )
diğeri WYSIWYG (What You See Is What You Get / Ne görürsen onu alırsın ) tarzı
denen kısaca görsel, kodlamayla uğraştırmayı gerektirmeyen editörler (FrontPage,
Dreamweaver, NetObjects Fusion,.. ). Benim yeni başlayanlara tavsiyem Windows'un
Notepad'i. Bu işlerin nasıl yapıldığını öğrendikçe ilerde siz de görsel
editörlere geçebilirsiniz. Çünkü bir yerde istenmedik sonuçlar çıkabilir ve
kodlara müdahele etmeniz gerekebilir. Üstelik görsel editörler bazen istenmeyen
kodlar ekliyorlar, bu da döküman boyutunun büyümesi demek.



Burada şunu da belirtmek gerekiyor; browserlar
arasındaki yorum farklarından dolayı sayfanız bir browser'da iyi görünürken bir
başka browser'da hiç istemediğiniz bir şekilde görüntülenebilir. Hele yeni bazı
teknikleri (css, dhtml gibi ) sadece MS Internet Explorer 4 ve üstü desteklerken
Netscape henüz bu teknikleri tam olarak desteklemiyor. Yine de piyasayı
neredeyse yarı yarıya paylaşan bu iki browser'ın birbirlerine üstün olduğu
yönleri var. Sonuçta, ne kadar fiyakalı bir sayfa da yapsanız elde ettiğiniz
başarı sayfanızı ziyaret eden kişinin kullandığı browser'a mahkum. Hatta
ziyaretçiniz browser'ına verdiği bir talimatla "yalnız şu fontu kullan",
"grafikleri görüntüleme" şeklinde bir ayar yapmışsa emekleriniz boşa gitti
demektir. Yine de bu kadar karamsar olmayalım.



Bu kadar genel bilgi yeter. Bir sonraki konuda
ilk HTML sayfamızı yapıyoruz.


İlk Html Sayfam

Öncelikle çalışmalarınızı saklamak için
kullanacağınız boş bir klasör oluşturup uygun bir ad verin, mesela
html_ders olsun. Daha sonra bu ad bize lazım olacağından kolaylık olması
için siz de yeni klasöre bu adı verebilirsiniz.


Şimdi de bu klasörü açıp yeni bir metin
belgesi oluşturun (sağ fare/Yeni/Metin belgesi ).

Dosyayı çift tıklayarak açın ve şunları
yazın:

Kod: 
<head> 
      <title>Ylk Sayfam</title> 
     </head> 
      
     <body> 
     Sayfama Hoşgeldiniz 
     </body> 
      
     </html>


Şimdi dosyayı kaydedin (Dosya/Farklı
Kaydet... ). Dosya adı kısmına şöyle yazın: "sayfa1.htm" (tırnaklar
dahil ) ve Tamam'a basın.



Notepad'i kapatın, metin dosyasını silin ve
oluşan yeni dosyayı açın. Dosya varsayılan browser'ınız (Internet Explorer,
Netscape Navigator gibi ) tarafından açılacaktır. Şöyle bir görüntü elde
edeceksiniz:
1.gif

2.gif



ilk HTML sayfamızı yapıyoruz.


Öncelikle çalışmalarınızı saklamak için
kullanacağınız boş bir klasör oluşturup uygun bir ad verin, mesela
html_ders olsun. Daha sonra bu ad bize lazım olacağından kolaylık olması
için siz de yeni klasöre bu adı verebilirsiniz.


Şimdi de bu klasörü açıp yeni bir metin
belgesi oluşturun (sağ fare/Yeni/Metin belgesi ).

Dosyayı çift tıklayarak açın ve şunları
yazın:


Kod Alanı:


<head>
<title>Ylk Sayfam</title>
</head>

<body>
Sayfama Hoşgeldiniz
</body>

</html>









Şimdi dosyayı kaydedin (Dosya/Farklı
Kaydet... ). Dosya adı kısmına şöyle yazın: "sayfa1.htm" (tırnaklar
dahil ) ve Tamam'a basın.



Notepad'i kapatın, metin dosyasını silin ve
oluşan yeni dosyayı açın. Dosya varsayılan browser'ınız (Internet Explorer,
Netscape Navigator gibi ) tarafından açılacaktır. Şöyle bir görüntü elde
edeceksiniz:






Tebrikler ilk HTML sayfanızı yaptınız.


Şimdi de bu belgeyi nasıl oluşturduğumuzu
birlikte inceleyelim. Birşey dikkatinizi çekti mi? Yngilizce bir takım kelimeler
var ve bu kelimeleri küçük < ve büyük > sembolleri arasına yazdık.
Bu ifadelere tag (etiket ) deniyor. Etiketler etki etmesi istenilen metnin
önüne ve arkasına yazılıyor. Önce etiketi yazıyoruz, sonra metni yazıyoruz daha
sonra aynı etiketi önüne bir bölü işaretiyle tekrar yazıyoruz. Bu son yaptığımız
etiketi sonlandırıyor. Bir kaç istisna dışında tüm etiketler belge içerisinde
sonlandırılmak zorunda.



Burada kullandığımız etiketler ve anlamları
şöyle:



<html>...</html>
Tarayıcıya HTML dosyasının başladığını ve
bittiğini belirtiyor. Diğer tüm kodlar bu iki etiket arasına yazılır.



<head>...</head>

<body>...</body>
Bir HTML belgesi iki bölüme ayrılır: head
(baş ) ve body (gövde ). <head>...</head> etiketleri arasına sayfa hakkında
bilgiler yazılır, meta ve title gibi etiketler burada yeralır. Meta
etiketlerine ileride değineceğiz.

<body>...</body> arası ise sayfamızın gövde bölümü. Ekranda gösterilecek
kısımlar bu tagler arasında yeralıyor.




<title>...</title>
Title sayfanın başlığını belirtiyor. Burada
yazılanlar browser penceresinin başlığında browser adıyla beraber
gösteriliyor.


Dikkat ederseniz hazırladığımız sayfada sadece
temel etiketleri kullandık. Yani metin biçimlendirmeye yarayan hiçbir etiket
kullanmadık. Bu yüzden <body>....</body> arasına yazdığımız Sayfama
Hoşgeldiniz yazısı browser'ın varsayılan metin ayarlarıyla gösteriliyor.
Yşin ilginç tarafı hiçbir kod yazmadan sadece Sayfama Hoşgeldiniz yazıp
kaydetsek ve browser'da böyle görüntülesek de aynı neticeyi elde edecektik.


Sonraki bölümde metin biçimlendirmeye yarayan
etiketleri öğreneceğiz.
 
Teşkrler. Herkes rahatlıkla anlayabilir. Güzel anlatmsn, gercektn ideal, dewamını beklıorz! :hhgül ​
 
teşekkürler kardeş.tüm dersleri takip etmeye şçalışacağım.eline emeğine sağlık...Allah razı olsun senden.....
 
kardeş sağol inşallah devam edecem derslere Allah senden razı olsun
 
Cevap yazmak için giriş yap yada kayıt ol.
Geri
Üst