IRCForumları - IRC ve mIRC Kullanıcılarının Buluşma Noktası - Tekil Mesaj gösterimi

13 Nisan 2006, 15:52

FLOATING FRAME KULLANIMI HTML sayfalarında sık kullanılmayan bir unsur olsa da HTML 3.2 standartlarına giren Floating Frame özelliğini anlatmakta fayda görüyoruz. Sayfa içerisinde başka bir HTML sayfasını göstermek istiyor ve bu sayfanın dilediğiniz sınırlar dışına taşmasına engel olmak istiyorsunuz. O zaman Floating Frame'leri kullanabilirsiniz. Aşağıda gördüğünüz örnek satırı HTML sayfanıza girdiğinizde 200x200 piksel ebatlarında bir pencere açılacak ve DENEME.HTM sayfası bu pencerenin içerisine yüklenecek.

<IFRAME SRC="deneme.htm" width=200 height=200></IFRAME>

SRC= ifadesinin karşısına HTML dosyasının adını vererek kullanabileceğiniz gibi [Üye Olmadan Linkleri Göremezsiniz. Üye Olmak için TIKLAYIN...] benzeri bir adres de kullanarak bir ' Web sitesinin' pencere sınırlarınız içerisinde açılmasını sağlayabilirsiniz
İlk sayfa bir kaç saniye görünsün, kaybolsun!.. Buna "Splash page" (suya dalma sayfası) da deniyor; bir kaç saniye görünüyor, sitenizin niteliği hakkında fikir veriyor, ilgi çekiyor, sonra yerini ana sayfaya bırakıyor.:

<META HTTP-EQUIV="Refresh" CONTENT="5; URL=ANASAYFA.HTML">
<BODY><IMG width="300" height="200" alt="Giriş grafiği" SCR="giris.gif">
<BODY>
Bu tekniği iki sayfasının arasında reklam amacıyla uygulayanlar bile var!
-----------------------------------------------------------------------

Sayfa Kendisini KapatsınÖyle bir web sitesi oluşturdunuz ki bir sürü yardımcı pencere açıyor…. Öyle ki kullanıcılar artık açılan bu yeni pencerelerin içinde boğulduklarından şikayet ediyorlar. Endişelenmeyin tam sizin durumunuza göre bir püf noktası vereceğiz şimdi.
Aşağıdaki 4 satırlık HTML kodunu sayfanıza eklediğinizde kodu eklediğiniz alanda bir düğme oluşacaktır. Artık kullanıcılarınız bu düğmeye basarak pencereyi rahatlıkla kapatabilir. Şimdi siz "İyi de güzelim kullanıcılarım pencerenin sağ tarafındaki çarpı tuşuna basmayı zaten akıl edebilirlerdi." diyeceksiniz. Bence bu tuş aynı zamanda sayfanın izlendikten sonra işinin bittiğinin de bir göstergesi.

<FORM>
<INPUT TYPE="BUTTON" VALUE="Kapat" NAME="lowerButton" onClick="self.close()">
</FORM>
Sayfanızı Sık Kullanılanlar'a eklettirin:IE 4.0 ve üstünü kullanan ziyaretçilere, isterlerse, bir kelimeyi tıklattırarak, sayfanızı Windows Sık Kullanılanlar klasörüne eklettirebilirsiniz. Buradaki kod, kendi Browser belirleme fonksiyonunu da içeriyor; dolayısıyla başka tür ve sürüm Browser'ı olan ziyaretçiler açısında arzu etmedikleri bir durum olmayacaktır:

<SCRIPT>

</SCRIPT>
-----------------------------------------------------------------------

Durum çubuğunda yanıp sönen yazıKullanıcı herhangi bir URL üzerine gittiğinde devreden çıkan yazı hiç bir kısayol üzerine gidilmediğinde yine yanıp sönmeye başlıyor.

<SCRIPT language="JavaScript"></SCRIPT> <BODY OnLoad="flash();">
Geri DüğmesiBrowser'ın Geri düğmesi özellikle Çerçeveli sayfalarda nereye geri döneceğini bilmeyebilir. Bu bakımdan sayfalarınızda arzu ettiniz yere kendi Geri düğmenizi koyabilirsiniz:

<FORM><INPUT TYPE="button" VALUE="Geri dönmek için burayı tıklayınız!" onClick="history.go(-1)"></FORM>
Aynı kodu grafik yerine bir veya daha fazla kelimeye de kazandırabilirsiniz:
<a href="javascript:history.go(-1)">Geri dönmek için burayı tıklayın</a>
Aynı kodu, HTML-vari düğmelere de uygulayabilirsiniz:
<FORM><INPUT TYPE = "BUTTON" VALUE = "Back" onClick = "window.history.go(-1);">
<INPUT TYPE = "BUTTON" VALUE = "Forward" onClick = "window.history.go(1);"></FORM>
-----------------------------------------------------------------------

Tablolar Tablolar, HTML sayfasında listeler ve şablonlar hazırlamak dışında, resimleri ve metinleri sayfa içerisinde istenilen bölgelere yerleştirmek ve bunun gibi bir çok alanda kullanılırlar. HTML 3.2 ile birlikte pek çok yeni özelliğe kavuşan ve daha görsel hale getirilen tablolar konusunu iyi öğrenen bir webmaster, hayalgücü ile tasarladığı "TÜM" sayfaları tablolar yardımı ile oluşturabilir. <TR>,<TD>,<TH> ve bunları kapatma taglarıyla birlikte kullanılan <TABLE...> tag'ının genel kullanımı şöyledir:

<TABLE BORDER=X CELLPADDING=X CELLSPACING=X WIDTH=[% veya X] HEIGHT=[% veya X] BGCOLOR=X BACKGROUND="X">

BORDER değişkenine verilecek 0 veya daha üstü bir değer tablonun kalınlığını belirler. CELLPADDING değişkenine verilebilecek herhangi bir sayı, tablonun sınırları ile tablo içeriği arasındaki mesafeyi, CELLSPACING ise hücreler arasındaki mesafeyi belirler. WIDTH ve HEIGHT değişkenleri bir yüzde değeri veya bir sayı olabilir. WIDTH=590 değeri verildiğinde 640*480 çözünürlükte ekranın tüm genişliğini kaplayacak bir tablo oluşturulur. WIDTH=%50 değerini verildiğinizde ise Web tarayıcınız o tablonun her zaman ekran genişliğinin yarısını kaplamasını sağlar.
<TABLE> tag'ının içerisinde kullanılan BGCOLOR değişkeni tablonun fon rengini tayin eder. X değeri geçen aylarda değindiğimiz HEX kodlarından (#FFFF00) veya renk isimlerinden (white, olive...) biri olmalıdır. Tablonuz daha canlı ve profesyonel görünsün istiyorsanız, arka fonuna bir GIF veya JPG resmini de BACKGROUND ekini kullanarak döşetebilirsiniz. Gelelim tablonun oluşturulmasına. Genel prensip şudur: <TABLE> tag'ıyla tabloya başladıktan sonra her satırı oluşturmak için <TR>, her sütunu oluşturmak için ise <TD> tag'ını kullanmalısınız. Aman bu tagları kullanıyorsanız her satırın sonuna </TR> ve her sütunun sonuna </TD> tag'larının koymayı unutmayın!
Bir diğer durum da, herhangi bir hücrenin yanındaki iki ya da daha çok hücreyi enine ya da boyuna doğru içine almasıdır ki bu işlemi yapmak için <TD [COLSPAN=X, ROWSPAN=X]> veya <TR [COLSPAN=X, ROWSPAN=X]> ekleri kullanılır. Örneğin 2 satır ve 2 sütunlu 1.tablonun oluşturulması için aşağıdaki kodlara ihtiyaç vardır, bu kodlar aynı zamanda COLSPAN ve ROWSPAN eklerini de anlatmaktadır.

<TABLE BORDER=1 CELLSPACING=2 CELLPADDING=3> 
<TR><TH COLSPAN=2> 

Tablo Örneği:

</TR></TD><TR><TD>
deneme1
</TD><TD> 
deneme2
</TR></TD><TR><TD>
deneme3
</TD><TD> 
deneme4
</TD></TR></TABLE> 

Eğer renkli tablolar elde etmek isteseydik
<TABLE .... ifadesinin yanına BGCOLOR="#FFFF80",
<TD.. ifadesinin yanına ise BGCOLOR="#000080" eklerini girmeniz gerekecekti
-----------------------------------------------------------------------

Arama Motorlarına Yardımcı olun.. GECENİZİ gündüzünüze kattınız ve bir site hazırladınız. Şimdi insanların sitenizin varlığından haberdar olmasını istiyorsunuz. Ne yapacaksınız? Tabii ki sitenizi bilinen arama motorlarına kayıt edeceksiniz. İşte bu noktada bir püf noktasına ihtiyacınız var. Arama motorlarının kullandığı ' ajan' programlar sitenize geldiklerinde ilk baktıkları şey bir takım tanımlardır. Aşağıda bu tanımları oluşturmak için gereken satırları göreceksiniz. Bu satırları <HEAD>...</HEAD> ifadeleri arasına girerseniz hedef kullanıcıya ulaşmanız daha kolay olacaktır.

<META name="description" content="Sitenizin amacı, kısa açıklaması, sloganı">
<META name="keywords" content="sitenizdeki bölümler, anahtar kelimeler" >
<META name="copyright" content="Telif sınırlamaları ve tanımları" >
Türkçenizi kaybetmemek için Bilgisiyarla uğraşalı beri, kendi dilimiz sık sık kazaya uğruyor, ama sayfalarımızın dilini korumak elimizde. Her sayfanın başına şu META etiketi koyabilirsiniz:

<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<meta http-equiv="Content-Language" content="tr">
Resimleri Bloklayın! Sayfanızdaki grafiklerin hepsinin sol tarafı aynı hizaya gelsin istiyorsanız, sadece yazı için kullanılır sandığınız <BLOCKQUOTE> etiketinden grafiklerde de yararlanabilirsiniz:

<BLOCKQUOTE><IMG scr="resim.gif"></BLOCKQUOTE>
Bütün grafikleriniz soldan yaklaşık 40 piksel hizalanacaktır! Resimleriniz sayganın sağına hizalansın istiyorsanız, buna bir de ALIGN ekleyebilirsiniz:

<BLOCKQUOTE><IMG scr="resim.gif" ALIGN=right></BLOCKQUOTE>
<BLOCKQUOTE> etiketi kendi içinde kullanırsa, içindeki unsuru 80 piksel sağa iter.
<BLOCKQUOTE><BLOCKQUOTE><IMG scr="resim.gif" ALIGN=right> </BLOCKQUOTE></BLOCKQUOTE>
Tabiî, en istikrarlı hizalama aracı olarak daima tablodan yararlanabilirsiniz

-----------------------------------------------------------------------

Dikey Çizgi HTML'de yatay çizgi (<HR>) var da, dikey çizgi yok. Tasarımınız, sayfada dikey çizgi gerektiriyorsa, tablodan yararlanabilirsiniz. Grafik programınızda eni ve boyu 1 piksel ve rengi siyah bir kutu resmi yapın. Bunu 1psiyah.gif adıyla kaydedin. Dikey çizgiye ihtiyacınız olan yerde bir tablo oluşturun; metinlerinizin bir kısmı ve tablonun içine girebilir; girmeyebilir. İşte

bir örnek:
<table width="75%" border="0" cellspacing="0" cellpadding="0">
<tr> <td align="center" valign="top">Burada metin var.</td>
<td><img src="1psiyah.gif" width="5" height="300"></td>
<td align="center" valign="top"> Burada metin var </td></tr>
</table>

Çizginin yüksekliği ne kadar olacaksa, çizginin bulunduğu kutudaki IMG etiketinin yüksekliğini o kadar arttırın.
Beyaz Boşluklar Bazen, iki satır arasında tam istediğiniz ölçüde boşluk elde etmek zor olur. <P> çok, <BR> ise az boşluk bırakır. Kolayı var. Eni 1, boyu 2 piksel, saydam bir GIF dosyası yapın ve 1psaydam.gif adıyla kaydedin. Boşluğa ihtiyacınız olan iki satırın arasına şu etiketi koyun:

<IMG scr="1psaydam.gif" width=1 height=1 hspace=20 vspace=49>
Burada 20 ve 49 yerine, kendi ihtiyacınız olan boşluğun değerini yazacaksınız. Bir satırı arzu ettiğiniz kadar içerden başlatmak amacıyla da aynı teknikten biraz farklı ifadeyle yararlanabilirsiniz:

<IMG hspace="25" scr="1psaydam.gif>Bu satır 25 piksel içerden başlayacak.
İki sütun yazı arasına arzu ettiğiniz kadar boşluk vermek için, sütunları bir tablonun hücrelerine alın, ortalarındaki hücrenin boyunu ve enini istediğiniz boşluk ölçüsüne getirin.
Sadece Netscape'de bulunan <SPACER> etiketi de beyaz boşluk sağlayabilir:
<SPACER TYPE="block" WIDTH="30" HEIGHT="45"> IE, bu kodu görünce, hiç bir şey yapmaz.