HTML Css Php SQL Mysql Rehberi

HTML-CSS-PHP MYSQL-SQL

İbrahim Halil Kutluay Nisan 2013

HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013

Ġçindekiler Ġçindekiler ............................................................... 2 GĠRĠġ .................................................................... 21 Kullanım Kuralları ................................................... 23 HTML DĠLĠ ............................................................. 24 Bir Web Sitesi Bilinmesi Gereken Temel Bilgiler ........ 26 Bir web sitesi için .................................................... 26 Domain Uzantı Adları ............................................ 28 TCP / IP .............................................................. 29 PORT .................................................................. 30 Web Server ......................................................... 30 Apache ............................................................ 32 IIS .................................................................. 32 Bir Web Server yazılım paketi seçerken dikkat edilmesi gereken bir kaç ilkeyi sıralayalım: ........... 32 Web‘de Gezme ĠĢlemine Genel Bir BakıĢ ................. 35 HTML‘in baĢlıca özelliklerini Ģöyle sıralayabiliriz: .......... 36 Web Tarayıcıları ...................................................... 39 Microsoft Internet Explorer ................................. 39 Netscape Navigator ........................................... 40 Firefox ............................................................. 40 Opera .............................................................. 40 Google Chrome ................................................. 40 Yandex Browser ................................................ 40 Tarayıcılar Ġçin Yardımcı Programlar ve Ek Birimler .. 40 HTML Editörleri ....................................................... 42 Expression Web ................................................... 42 Dreamweaver ...................................................... 42 Word .................................................................. 42 NVU ................................................................... 43 HTML‘in Temel BileĢenleri ........................................ 44 2


Etiketler (Tag) ..................................................... 44 HTML Yazım Kuralları ............................................ 45 HTML Dosyasının Bölümleri.................................... 45 Türkçe bilgi içeren bir sayfa örneği ise; ...................... 46 ... ............................................... 47 ... .............................................. 47 ... ................................................. 47 ... .............................................. 47 Meta Etiketleri Arama Motorları Ġçin Sitemize Eklememiz Gereken Bilgiler ................................ 48 Meta Tağlarının GeliĢmiĢ Kullanımı ......................... 50 Sayfanın Süre AĢımını Belirtmek .......................... 50 Bir Sayfanın Belirli Bir süre Ekranda Kalıp Otomatikman BaĢka Bir Adrese Yönlenmesini Sağlamak ......................................................... 50 Türkçe Karakterleri Görüntülemek-Kod Sayfası ........ 51 Etiketinin Parametreleri ........................... 52 TrueType Fontlar-Harf GeniĢliği Serif ve Sans Serif Harfler ............................................................. 52 H1,H2,H3,H4,H5,H6 BaĢlık Etiketleri .................... 53
etiketi...................................................... 54
…
etiketi ............................................. 55 Genel Biçimlendirme Etiketleri .................................. 57 Metni Koyu, veya Ġtalik Yazdırma ........................ 58 HTML Dilinde Renk Kodlaması ............................. 59 Güvenilir 216 Renk ............................................ 62 Sıralı Listeler..................................................... 65 Sırasız Listeler .................................................. 67
Etiketi ile Çizgi OluĢturma ......................... 68 Resim ve Multimedya Dosyalarını Kullanmak ........... 69 Marquee ile Resim Ve Metin Kaydırma .................... 71 Resimleri Kullanırken Dikkat Edilecekler; .............. 73 3


Video ve Ses Dosyalarının Kullanımı ....................... 74 Tablolar ................................................................. 75 BaĢlık, Satır ve Veri Etiketleri................................. 75 Sütun ve Satır BirleĢtirme – Colspan- Rowspan ........ 78 Zemin - Bgcolor ................................................ 78 Tablonun geniĢliği- Width ................................... 78 Tablonun Çerçevesi - Border ............................... 79 Hücre içindeki boĢluk miktarı CELLPADDING ......... 79 Hücreler arası boĢluk miktarı CELLSPACING .......... 80 Sembol ĠĢaretlerinin HTML Dilindeki KarĢılıkları ........ 80 Genel Sayfa Kullanım ġekilleri .................................. 82 Çerçeveler -Frames ................................................. 86 Avantajları ........................................................... 86 Dezavantajları...................................................... 86 Frame Parametreleri ............................................. 88 Frame Satırları ve Sütunları ................................ 89 Yatay Dikey KarıĢık Frame OluĢturmak ................. 91 HTML‘de Bağlantı‘ya (LINK) GiriĢ.............................. 93 HTML‘de Bağlantı Türleri .......................................... 97 HTTP bağlantıları: .............................................. 97 FTP bağlantıları: ................................................ 97 Haber Grupları: ................................................. 97 Elektronik Posta Bağlantısı: ................................ 98 Dosya Bağlantıları: ............................................ 98 Diğer bağlantılar: .............................................. 98 Resimleri Link BaĢlığı Vermek Ġçin Kullanmak .......... 99 Resim Haritası (Image Map) ile Link Kullanımı ....... 100 Link Verirken Relative (göreceli) ve Absolute (mutlak) Adreslemelerin Farkları ....................................... 101 KULLANICI ĠLE ETKĠLEġĠM VE FORMLAR .................. 103 Form Etiketinin Alt Seçenekleri ............................ 106 Form Elemanları Çizelgesi ................................... 107 4


INPUT ............................................................... 110 Kullanıcının klavyeden metin girmesi için: ............. 113 Parola GiriĢi için: ............................................. 113 Onay Kutusu için (Check iĢareti): ...................... 113 Tekil Seçme Kutusu için (Radyo düğmesi): ......... 114 Listeleme Kutusundan SeĢmek Ġçin (SELECT)...... 114 Uzun Metin GiriĢi Ġçin (TEXTAREA) ..................... 115 Gönder ve Sil düğmeleri (Submit ve Reset) ........ 115 Tabindex ........................................................ 116 URL Kodları .................................................... 118 CSS ile Biçimlendirme Teknikleri, Dinamik HTML ....... 120 CSS Stillerine Neden Ġhtiyaç Duyulur .................... 120 Cascading Style Sheets -CSS ve Kullanım ġekilleri . 121 Yerel Stil ġablonu ........................................... 122 Sayfa Ġçi Global Stil ġablonu ............................ 122 Site Ġçi Global Stil ġablonu ............................... 124 Birden fazla stil Ģablonu verilirse Tarayıcı ne yapar? 125 HTML içinde bölüm oluĢturma (DIV) ........................ 126 CSS ve Seçici(Selector) Kavramı ve Seçici Tipleri ... 127 ĠsimlendirilmiĢ Seçiciler .................................... 127 Sınıf Seçiciler .................................................. 128 Karma Seçiciler (Pseude Classes) ...................... 129 ġartlı Seçiciler (Contextual Selectors ) ............... 131 Bir Alana Tanımlı Stillerin DıĢında Stil Uygulamak .. 133 CSS Blokları ve Denetlenebilir Özellikler ................... 133 CSS Biçimlendirme Tablosu ................................. 133 Font Özellikleri Ġçin CSS Kullanımı: .......................... 139 FONT-FAMILY (Yazıtipi ailesi): .............................. 139 FONT-STYLE(YazılıĢ ġekli): .................................. 140 FONT-VARIANT (Yazıtipi türü):............................. 140 FONT-WEIGHT (Yazıtipi Koyuluğu): ...................... 140 FONT-SIZE (Yazıtipi boyutu): .............................. 141 5


Renk ve Zemin Özellikleri:................................... 142 Metin Özellikleri: ............................................. 143 Konum (Pozisyon) Özellikleri ............................... 145 Konum ―POSITION:‖ Değerleri ......................... 146 CSS ve Katman (Layer) Kavramı .......................... 147 Katman Ġndeksi – (Z-index): ............................ 149 BoĢluk bırakma, Margin : .................................... 150 Xhtml BELGE TÜRÜ ............................................ 151 Sonuç .................................................................. 152 Altın Öğütler......................................................... 153 Hosting Hizmeti Alırken ...................................... 153 Web Sitesi Yaparken ........................................... 153 Site Tasarımı Adımları ......................................... 154 Bir Site Tasarlarken ............................................... 156 Bir Web Sitesinin Tutulmasını Sağlayan Etkenler ....... 158 Tanıtım ............................................................. 159 Kullanıcı Dostu Tasarım....................................... 160 EriĢilebilirlik ....................................................... 160 Kaliteli Ġçerik ..................................................... 161 Geri Besleme ..................................................... 161 Php Programlama Dili ............................................ 162 Php Programlama Dili ............................................ 162 Php Dilinin GeçmiĢi ............................................. 162 Neden PHP ........................................................ 164 Interaktif Web Sayfaları Hazırlamak Ġçin Yöntemler 165 PHP ve ASP KarĢılaĢtırması .................................. 167 PHP ve Cold Fusion KarĢılaĢtırması ....................... 169 PHP Dilinin Kapasitesi ......................................... 169 PHP Nasıl ÇalıĢır ................................................. 170 PHP Dili ve Veritabanı Programları ile ĠliĢkisi ............. 172 PHP Dilinin GeniĢletilebilirliği .................................. 175 Bazı PHP Kütüphaneleri ve iĢlevleri ....................... 175 6


PEAR (PHP Extension and Application Repository) .. 179 PHP - Web Sunucusu – PHP Kurulumu ..................... 179 XAMPP .............................................................. 180 APPSERV ........................................................... 180 Uniform Server .................................................. 181 EasyPHP ........................................................... 181 Php Öğrenmek Zormu ........................................... 182 Ġlk PHP Programımız – Merhaba Dünya .................... 182 PHP KOD YAZIM KURALLARI ................................... 182 Açıklama (Yorum) Satırları ..................................... 187 PHP ile Ekrana Çıktı Verme ..................................... 189 echo() fonksiyonu-(Ekrana yazdırma) ................... 189 print() fonksiyonu – (Ekrana Veri Yazma) .............. 190 Escape Kodlar .................................................... 191 DeğiĢken Nedir ? ................................................ 192 DeğiĢken Türleri ................................................. 195 Alfanümerik DeğiĢkenlerin Ġçeriğine Dizi Olarak EriĢme ....................................................................... 196 Diziler (Array) .................................................... 197 Çok Boyutlu Diziler ............................................. 198 Dizi Tanımlama Kuralları ..................................... 199 Nesneler (Objects) ............................................. 200 Sabit Değerler - Constants .................................. 201 define ("SABIT_ADI", değeri); ............................. 202 Operatörler .......................................................... 204 Aritmetik Operatörler: ........................................ 205 BirleĢik Atama Operatörleri.................................. 207 Bir Arttırmak veya Azaltmak için .......................... 208 Kontrol Blokları ve KarĢılatırma Operatörleri ............. 208 KarĢılaĢtırma Operatörleri ...................................... 208 ĠĢlem Önceliği Sıralaması .................................... 211 if komutu ............................................................. 212 7


if-endif Kullanımı ve PHP ile HTML Kodunu Ayırma .. 215 Endif .............................................................. 217 switch komutu ...................................................... 217 Tek KoĢula Göre Ġki Sonuç - Üçlü Operatör (Ternary Operatör)............................................................. 220 Döngü Kavramı ..................................................... 220 For Döngüsü ...................................................... 221 While Do Döngüsü .............................................. 223 Do While Döngüsü .............................................. 223 For .. Each Döngüsü ........................................... 225 Döngüyü Kırmak için Break Komutu ..................... 226 Döngüyü Devam Ettirme : Continue ..................... 227 Döngü Ġçinde Döngü Kullanımı ................................ 228 Döngü ve Kontrol Bloklarında PHP ve HTML Ġç içe Kullanım .............................................................. 229 BaĢka Bir Dosyayı Ġthal Etme ................................. 230 include() fonsiyonu............................................. 231 require() fonksiyonu ........................................... 231 include_Once ve require_Once ............................. 231 include() ve türevlerindeki güvenlik açığı .............. 233 include() ile Kodun Yeniden Kullanımı ................... 234 HEREDOC Nedir ................................................. 235 Fonksiyon Kavramı ve Kategorilere Göre PHP Fonksiyonları ........................................................ 236 DeğiĢkenlerle ĠĢlem Yapan Fonksiyonlar ................ 237 isset() fonksiyonu (değiĢkene değer atanmıĢ mı kontrol etmek) ................................................ 237 unset() fonksiyonu (değiĢkeni hafızadan atmak-yok etmek) ........................................................... 238 empty() (DeğiĢken boĢmu) ............................... 238 is_string(), is_integer(), is_double() fonksiyonları ile tip tespiti........................................................ 239 8


print_r () fonksiyonu........................................ 240 DeğiĢken Tiplerini DönüĢtürme ve DeğiĢken Tipini Öğrenme ........................................................ 241 gettype() fonksiyonu (DeğiĢken tipini alma)....... 242 settype() fonksiyonu (değiĢekene bir tip atama) . 243 Dizilerle ĠĢlem Yapan Fonksiyonlar ..................... 245 array_merge() fonksiyonu- (Dizileri birleĢtirme) .. 246 array_push() fonksiyonu–(Dizilere değiĢken ekleme) ..................................................................... 246 array_shift() fonksiyonu–(Dizinin ilk elemanını silme) ..................................................................... 247 array_slice() fonksiyonu – (Diziden kopyalama) .. 247 sort() ve rsort() fonksiyonları-(Dizileri sıralama).. 248 asort() ve ksort() fonksiyonları-(ĠliĢkili dizileri sıralama) ....................................................... 248 Program Durdurma Fonksiyonları ............................ 249 exit() fonksiyonu (kodun çalıĢmasını durdurmak) ... 249 die() fonksiyonu (kodun çalıĢmasını durdurmak) .... 249 eval() fonksiyonu (kodun çalıĢmasını durdurmak) .. 249 Tarih ve Zamanla ĠĢlem Yapma............................... 250 Avantajları ........................................................ 250 Dezavantajı ....................................................... 251 time() fonksiyonu (Ģu anki zaman bilgisini alma) . 251 microtime() fonksiyonu (Ģu anki zaman bilgisini hassas birimle alma) ........................................ 251 strtotime() fonksiyonu (Metni zaman bilgisine çevirme) ........................................................ 252 date () fonksiyonu (tarih zaman bilgisini metne çevirme) ........................................................ 252 mktime() fonksiyonu (sayılardan tarihi oluĢturma) ..................................................................... 256 checkdate() fonksiyonu-Tarih geçerli mi ............. 257 9


setlocale() fonksiyonu (bölgesel ayarlar) ............ 257 Tarih Bilgilerini Türkçe Yazdırmak ...................... 258 getdate() fonksiyonu (tarih zaman bilgisini alma) 259 Matematiksel ĠĢlemlerde Kullanılan Fonksiyonlar Ve ĠĢlevleri .......................................................... 260 ceil() fonksiyonu (yukarı yuvarlama).................. 260 floor() fonksiyonu (aĢağı yuvarlama) ................. 260 round () fonksiyonu (matematiksel yuvarlama) ... 260 rand() fonksiyonu (rastgele sayı üretme) ........... 261 mt_rand() fonksiyonu (rastgele sayı üretme) ...... 261 srand() ve mt_srand() fonksiyonları (ilk sayıyı vererek rastgele sayı üretmek) ......................... 262 getrandmax() ve mt_getrandmax() fonksiyonları (Üretilebilecek en yüksek sayı) .......................... 263 abs() fonksiyonu (mutlak değer) ....................... 263 sqrt() fonksiyonu (karekök alma) ...................... 263 pow() fonksiyonu (üs alma) .............................. 263 hypot() fonksiyonu (hipotenüs hesaplama) ......... 264 log() fonksiyonu (logaritma) ............................. 264 log10() fonksiyonu (logaritma).......................... 264 base_convert() fonksyionu (sayının tabanını değiĢtirme) ..................................................... 264 bindec() fonksiyonu (desimal düzene çevirme) .... 265 decbin() fonksiyonu (Onluk düzenden ikilik düzene çevirme) ........................................................ 265 dechex() fonksiyonu (16 lık düzene çevirme) ...... 265 decoct() fonksiyonu (8 lik düzene çevirme)......... 265 hexdec() fonksiyonu (Hex düzeninden ikilik düzene çevirme) ........................................................ 265 octdec() fonksiyonu (8‘lik düzenden 2‘lik düzene çevirme) ........................................................ 266 max() fonksiyonu (en büyük değeri bulma) ........ 266 10


min() fonksiyonu (en küçük değeri bulma) ......... 266 Trigonometrik fonksiyonlar ..................................... 266 sin() fonksiyonu (sinüs) ................................... 266 cos() fonksiyonu (kosinüs) ............................... 266 tan() fonksiyonu (tanjant) ................................ 266 asin() fonksiyonu (arcsinüs) ............................. 266 cos() fonksiyonu (arckosinüs) ........................... 267 atan() fonksiyonu (arctanjant) .......................... 267 deg2rad() fonksiyonu (açıyı radyana dönüĢtürme) ..................................................................... 267 rad2deg() fonksiyonu (açıyı radyana dönüĢtürme) ..................................................................... 267 Metin ĠĢleme Fonksiyonları ............................... 268 substr() fonksiyonu (Metnin bir parçasını alma) ... 268 chr() fonksiyonu (ASCII kodun karakter karĢılığı) 270 ord() fonksiyonu (Karakterin ASCII kodunu bulma) ..................................................................... 270 strlen() fonksiyonu (Metnin uzunluğunu bulma) .. 270 count_chars() fonksiyonu (Metin içinde karakterlerin tekrar etme sayısını bulma) .............................. 271 str_word_count() fonksiyonu (Metin içindeki kelime sayısını bulma)................................................ 271 strpos() ve stripos() fonksiyonları (Metnin bulunduğu pozisyon) ....................................................... 272 strstr () ve stristr () fonksiyonları (Metnin ilk bulunduğu yer) ............................................... 273 wordwrap() fonksiyonu (Metni satırlara ayırma) .. 274 explode() fonksiyonu (Metni bölümlere ayırma) ... 274 implode()fonksiyonu (Metni bölümlere ayırma) ... 275 strtoupper() fonksiyonu (büyük harfe çevirme) .. 275 strtolower () fonksiyonu (küçük harfe çevirme) .. 275 11


ucfirst () fonksiyonu (ilk harfi büyük harfe çevirme) ..................................................................... 275 ucwords () fonksiyonu (kelimelerin ilk harfini büyük harfe çevirme) ................................................ 276 number_format() fonksiyonu (Rakamları ekrana biçimlendirerek yazdırmak)............................... 276 strcmp () fonksiyonu (iki metni karĢılaĢtırma) ..... 277 strcasecmp () fonksiyonu (iki metni karĢılaĢtırma) ..................................................................... 278 str_pad () fonksiyonu (metnin etrafını boĢlukla (yada karakterle) destekleme) ................................... 278 printf() ve sprintf() fonksiyonu (biçimlendirerek çıktı verme)........................................................... 279 parse_str() fonksiyonu (get ile alınan değiĢkenleri parçalayarak bir diziye atma) ............................ 283 Veri ġifreleme Fonksiyonları ................................... 284 cyript() fonksiyonu (Metni verilen bir anahtara göre Ģifreleme)....................................................... 284 sha1() fonksiyonu (Metni hash algoritması ile Ģifreleme)....................................................... 285 md5() fonksiyonu (Metni MD5 algoritması ile Ģifrelem) ........................................................ 286 Düzenli Ġfadeler (REGEXPS).................................... 287 Temel Seviye Regexpler ...................................... 288 BaĢlangıç Düzeyi Regexpler ................................. 289 Üst Düzey Regexp Ġfadeleri ................................. 290 En Üst Seviye (Guru ) Düzeyi Regexp Ġfadeleri....... 292 preg_match() fonksiyonu (metinler eĢitmi) ......... 294 preg_match_all() fonksiyonu ............................ 295 ereg() fonksiyonu (dizilim arama) ..................... 295 eregi() fonksiyonu (dizilim arama) ..................... 296 12


ereg_replace() fonksiyonu (dizilim arama ve değiĢtirme) ..................................................... 296 split() fonksiyonu (metni parçalara ayırma) ........ 297 sql _regcase() fonksiyonu (düzenli ifade üretme) 298 Kullanıcı Tanımlı Fonksiyonlar GeliĢtirmek ................ 299 Basit Bir Fonksiyon Yazalım - myecho ................... 299 GLOBAL ve STATĠK DEĞĠġKENLER .......................... 302 Dizi Fonksiyonları .................................................. 305 array() fonksiyonu (değerleri diziye çevirme) ...... 305 count() fonksiyonu (dizinin eleman sayısını bulma) ..................................................................... 305 print_r () fonksiyonu (değiĢken içeriğini yazdırma) ..................................................................... 305 var_dump () fonksiyonu (değiĢken içeriğini yazdırma)....................................................... 305 Dizileri Sıra ile ĠĢlemek .......................................... 307 list() fonksiyonu .............................................. 307 each() fonksiyonu ........................................... 307 For.. Each ile dizileri iĢlemek .................................. 307 For ile dizileri iĢlemek ............................................ 308 PHP ve Formlar ..................................................... 309 Süper Globaller (Superglobals) ............................ 309 Form Dizaynında Altın Kurallar ................................ 312 Formlardan Bilgi Alma ........................................... 313 Form Verilerini ĠĢleme (Ġki dosya ile) ....................... 313 Form Verilerini ĠĢleme POST Metodu ........................ 316 Form Verilerini ĠĢleme (Tek dosya ile) ..................... 317 Form Verilerini ĠĢleme POST Metodu ........................ 320 Hesap Makinesi Programı ....................................... 322 Basit Bir ġifreli GiriĢ Sayfası ................................... 324 Birden Fazla Sayfaya Yayılan Formlar ...................... 325 PHP ile Posta Gönderme......................................... 325 13


mail() fonksiyonu – PHP ile eposta göndermek ....... 326 Web Sayfasından Bir Siteye Dosya Yükleme (Upload) 333 PHP SERVER DEĞĠġKENLERĠ .................................. 336 Kullanıcının Girdiği Değerlerin Doğruluğunu Kontrol Etme ................................................................ 338 Windows ve Unix Dosya EriĢim Yetkilendirmesi ...... 339 PHP Klasör Fonksiyonları ........................................ 341 mkdir() fonksiyonu (Klasör oluĢurmak) .............. 341 rmdir() fonksiyonu (Klasör silmek) .................... 341 chdir() fonksiyonu (Klasör değiĢtirmek) .............. 341 is_dir() fonksiyonu (Dizin mi)............................ 341 opendir() fonksiyonu (Klasörü açmak) ............... 342 readdir() fonksiyonu (Klasörü okumak-listelemek) ..................................................................... 342 closedir() fonksiyonu (Klasörü kapatmak) ........... 342 PHP Dosya Fonksiyonları ........................................ 345 file_exits() fonksiyonu (Dosya var mı?) .............. 345 filesize() fonksiyonu (Dosya boyutunu bulma) ..... 346 is_file() fonsiyonu (Dosya mı ) ......................... 347 is_readable() fonksiyonu (Dosya okunabilir mi?) . 347 is_writable() fonksiyonu (Dosya yazılabilir mi? ) .. 348 is_executable() fonksiyonu (Dosya çalıĢtırılabilir mi? ) ................................................................... 348 touch() fonksiyonu (dosya oluĢturma) ................ 349 unlink() fonksiyonu (dosya silme) ...................... 350 copy() fonksiyonu (dosya kopyalama) ................ 350 readfile() fonksiyonu (Dosyayı satır satır okumak ve ekrana yazmak) .............................................. 350 fopen () fonksiyonu (dosya açma) ..................... 351 fgets () fonksiyonu (dosyadan satır satır okuma) . 352 fseek () fonksiyonu (dosya içinde bir yere konumlanma) ................................................. 352 14


fread () fonksiyonu (dosyadan belirli sayıda karakter okuma) .......................................................... 353 fgetc () fonksiyonu (dosyadan birer birer okuma) 353 feof () fonksiyonu (dosya sonuna gelindi mi) ...... 353 fclose () fonksiyonu (dosyayı kapat) .................. 353 fputs() ve fwrite() fonksiyonu (dosyaya yazmadosyaya ekleme) ............................................. 356 flock() fonksiyonu (Kullanımdaki dosyayı kilitleme) ..................................................................... 357 fileadate() fonksiyonu (Dosyaya son eriĢim tarihi- file access date ) .................................................. 359 filemdate() fonksiyonu (Dosyanın son değiĢtirilme tarihi- file modification date) ............................. 359 filecdate() fonksiyonu (Dosyanın oluĢturulduğu tarih - file creation date) .......................................... 359 CSV Dosya Fonksiyonları........................................ 359 fgetcsv() fonksiyonu (CSV dosyasını satır satır okuma) .......................................................... 360 fputcsv() fonksiyonu (Değerleri CSV formatında yazma) .......................................................... 361 KullanıĢlı Bir Örnek Kayıt Arama ............................. 362 Öğrenci Notlarını Webde Yayınlama ...................... 362 Basit Telefon Rehberi ............................................ 365 Basit Sözlük ......................................................... 369 Basit Ziyaretçi Defteri ............................................ 372 PHP Çerez - Cookie Fonksiyonları ............................ 377 setcookie() fonksiyonu – (Çerez bırakma) .......... 379 Aynı sayfada birden fazla çerez bırakmak .............. 383 PHP Dilinde Oturum – Kullanımı .............................. 384 PHP ve MYSQL Kullanımı ........................................ 385 MySQL Nedir ? ...................................................... 386 Veritabanı ve Tablo Nedir ....................................... 387 15


Mysql Tablo Tipleri ................................................ 387 Mysql Veri Tipleri ............................................... 387 Metin tipleri .......................................................... 388 CHAR ve VARCHAR Farkı ........................................ 388 BLOB ve TEXT Alanlar ...................................... 389 Sayısal Veri Tipleri ................................................ 389 Tarih / Zaman Tipleri ............................................. 390 Küme Tipi ............................................................ 391 Tablo Tasarlama, Key Ve Ġndex Kullanımı ................. 392 MYSQL ‗i Komut Satırından Yönetmek ................... 395 Mysql‘i BaĢlatmak .............................................. 395 Komut Satırından Veritabanı OluĢturmak .............. 395 Komut Satırından Tablo OluĢturmak ..................... 395 Komut Satırından Veri GiriĢi ................................ 396 Komut Satırından Veri Sorgulama ........................ 396 Komut satırından Bilgi DeğiĢikliği Yapmak ................ 397 Komut Satırından Kayıt Silmek ............................... 398 SQL Dilinin Tarihçesi.............................................. 399 ĠliĢkisel Bir VTYS Ġçin 12 kural ................................ 400 SQL Dilinin Bölümleri ............................................. 403 A. DDL (DATA DEFINITION LANGUAGE) KOMUTLARI ....................................................................... 404 B. DML (DATA MANIPULATION LANGUAGE) KOMUTLARI ....................................................... 404 Veritabanı içindeki seçmek, değiĢtirmek, güncellemek ve silmekle ilgili SQL deyimleridir. ............................... 404 C. DCL (DATA CONTROL LANGUAGE) KOMUTLARI .. 404 SQL Komutları ve Örnekler ..................................... 405 A. DDL KOMUTLARI ............................................ 406 CREATE Komutu .............................................. 406

16


CREATE komutu tablo ve view gibi bir veritabanı nesnesi yaratmayı sağlar. (Create ayrıca yeni veritabanıda oluĢturabilir.) ....................................................... 406 Mysql‘de sütun adlarını sınırlamak için ― ` ‖ karakteri kullanılır. Normalde bu verilmedende iĢlem yapılır. normal SQL nostasyonlarında bu karaktere gerek yoktur. .......................................................................... 406 Kullanım Yapısı: ................................................. 406 ALTER DEYĠMĠ................................................. 407 Daha önce yaratılmıĢ nesnenin değiĢtirilmesini sağlar. Örneği bir tablonun tasarımını değiĢtirmek gibi. ........ 407 ALTER TABLE ders01a ADD msn VARCHAR( 40 ) NOT NULL ; ................................................................. 407 DROP DEYĠMĠ ................................................. 407 Bir nesnesin silinmesini sağlar. ............................... 407 DROP TABLE ders01a ............................................ 408 B. DML (DATA MANIPULATION LANGUAGE) KOMUTLARI ....................................................... 408 SELECT DEYĠMĠ ............................................... 408 Temel Kullanımı: ................................................... 408 Parametrelerin Anlamları: ................................. 409 AS Deyimi ile Alias Tanımlama ................................ 411 Where Deyimi....................................................... 412 And ve Or ile Birden Fazla KoĢulun Kontrol Edilmesi 414 In ve Not In Deyimleri ........................................ 414 Like ve Not Like Deyimleri: .................................... 415 Group By Deyimi .................................................. 416 Order By Deyimi: .................................................. 416 SELECT Ġçinde Aritmetik ĠĢlemler ............................ 417 Aritmetik ĠĢlem Operatörleri ................................... 418 Aggregerate fonksiyonları ...................................... 419 sum() fonksiyonu – Bir sütunun toplamı ................ 419 17


Bir sütuna göre bir select ifadesinin toplamını alır. .... 419 avg() fonksiyonu – Bir sütunun ortalaması ......... 420 min() fonksiyonu – Bir sütundaki en küçük değer 420 max() fonksiyonu – Bir sütundaki en büyük değer ..................................................................... 421 count() fonksiyonu – Bir sorguya göre dönen kayıt sayısı ................................................................ 422 JOIN ĠġLEMĠ ......................................................... 422 INNER JOIN ....................................................... 423 LEFT JOIN ......................................................... 424 RIGHT JOIN ...................................................... 424 TABLOYU KENDĠSĠ ĠLE ĠLĠġKĠLENDĠRME (SELF JOIN) ....................................................................... 424 ĠÇĠÇE SELECT NESTED SELECTS .......................... 425 UNION KULLANIMI ................................................ 425 EXISTS KULLANIMI ............................................ 426 C. DCL (DATA CONTROL LANGUAGE) DEYĠMLERĠ ...... 426 GRANT DEYİMİ .................................................. 426 GRANT CREATE DATABASE, CREATE TABLE .............. 426 TO ayĢe ............................................................... 426 SQL FONKSĠYONLARI ............................................ 427 Metinlerle ĠĢlem Yapan SQL Fonksiyonları .............. 427 ascii() fonksiyonu ................................................. 427 char() fonksiyonu ............................................ 427 concat() fonksiyonu ......................................... 428 length() fonksiyonu ......................................... 428 DönüĢtürme Fonksiyonları ...................................... 428 conv() fonksiyonu ........................................... 428 bin() fonksiyonu .............................................. 428 oct() fonksiyonu .............................................. 428 hex() fonksiyonu ............................................. 428 Tarihlerle ĠĢlem Yapan SQL Fonksiyonları .............. 429 18


TABLOLARDA DEĞĠġĠKLĠK YAPMAK: ........................ 431 INSERT Komutu .................................................... 431 UPDATE Komutu: .................................................. 431 DELETE DEYĠMĠ .................................................... 432 Kullanım biçimi: .................................................... 432 DELETE FROM tablo ............................................. 432 PHPMYADMIN ....................................................... 434 PhpMyAdmin Kurulumu ....................................... 435 PhpMyAdmin'i ÇalıĢtırma ve Tanıma ..................... 436 PhpMyAdmin ile Database OluĢturma .................... 438 PhpMyAdmin ile Tablo OluĢturma ......................... 438 Bir Veritabanının Modelini Çıkarmak ..................... 440 MySQL ve PHP ...................................................... 442 PHP Dili Mysql Fonksiyonları Tablosu ..................... 443 mysql_connect() deyimi(Database bağlantısı) ..... 446 mysql_select_db() deyimi................................. 447 mysql_query() fonksiyonu- Mysql‘e sorgu göndermek ..................................................................... 448 mysql_numrows() fonksiyonu-Sorgudan Dönen Kayıt Sayısını Bulmak............................................... 448 mysql_result()-Sorgudan Dönen Kayıtları ĠĢlemek449 Kayıtları Ekrana Listelemek ............................... 449 DeğiĢkenleri Sorguların Ġçinde Kullanmak ........... 450 mysql_fetch_assoc() fonksiyonu- sorgu sonucundan bir satır almak ................................................ 452 mysql_error() fonksiyonu- MySQL hatalarını konrol etmek ............................................................ 452 PHP ile Veritabanı OluĢturma Listeleme ve Silme . 453 PHP ile Tablo OluĢturma, Listeleme, Güncelleme ve Silme ................................................................ 455 PHP ile Tablolara Veri GiriĢi, Listeleme, Güncelleme ve Silme ................................................................ 457 19


Örnek Uygulama: PHP ile ġifreli GiriĢ Sayfası Yapılması .......................................................................... 460 PHP ve GÜVENLĠK ................................................. 473 addslashes() fonksiyonu (metindeki zararlı olabilecek karakterleri etkisiz yapmak) ............................. 476 stripslashes () fonksiyonu (etkisizleĢtirilmiĢ kodları ilk haline döndürmek) ............................................. 476 strip_tags () fonksiyonu (HTML etiketlerini metinden çıkarmak) ......................................................... 477 PHP ile Header Kullanımı ........................................ 478 header() fonksiyonu-(BaĢlık bilgilerini kullanmak) .. 478 Bir Nesne OluĢturalım ............................................ 483 PRATĠK BĠLGĠLER .................................................. 487 Resim Albümü: .................................................. 487 GiriĢ sayfası yapmak .......................................... 490 Sayfada Tarih Yazdırma ......................................... 491 CMS Sistemleri ..................................................... 495 DĠĞER SÜRÜME DAĠR NOTLAR ................................ 498

20


GĠRĠġ Son yıllarda internet denen olgu hayatımızın içine öyle bir girdi ki artık çıkması mümkün olmayacak noktayı bile çoktan geçti. Önceleri fantazi yada prestij olsun diye web sitesi yaptıran Ģirketler artık bunu zorunluluk olarak görmeye baĢladılar. Bir çok firma teklif mektuplarını elden yada kağıda baskılı gönderen Ģirketleri doğrudan elemeye baĢladı. Internet denen Ģeyle 1992 de tanıĢtım. Daha doğrusu internet denen sanal dünya ilk tanıĢmamızda sanal olarak gerçekleĢti. ArkadaĢlarla bazı üniversitelerin yurt dıĢına doğrudan bağlanabildiğini konuĢmuĢtuk yani hepsi bu. 1995 yılında Çukurova Üniversitesinin internet kursuna katıldım. Ftp, ls, sz gibi komutları öğrenmiĢ ne de çok sevinmiĢtim. Ardından sürekli takip ettiğim dergilerde, her Ģey internet, web tarayıcı, Netscape, Frontpage, Outlook, ICQ, IRC gibi baĢlıklara çıkmaya baĢladı. 1998 yılında ilk resmi iĢime baĢladıktan bir süre sonra Ģirketin ilk internet sitesi için benimde HTML öğrenmem gerekmiĢti. Bende Joe Barta‘nın yazdığı ücretsiz HTML öğrenme setinden faydalanarak bugünkü Ģartlarda yüzüne bile bakmayacağım ilk sitemi yapmıĢtım. Derken Hakkı Öcal üstadın kitapçıkları çıkmaya baĢladı. HTML, Javascript, PHP… Hatta kendisi ile yazıĢan Daphne rumuzlu arkadaĢım sayesinde birkaç kez e-mail gönderip yazıĢmıĢlığımızda oldu. Bu vesile ile bugünlerde çok sık kullanılan ―web sitesi olmayana kız vermiyorlar” 21


lafını ilk kez ben bir –emailimde yazdım Hakkı Hocama. Patenti bana ait olsa gerektir ama kimse takmaz sanırım. Etrafta yığınla Ġngilizce kaynak varken neden Türkçe bir kaynak sorusu beni hep üzmüĢtü. Hakkı Öcal üstadın kitapçıkları bir açığı doldurmuĢtu evet ama onlarda yüzeyseldi sonuçta. ĠĢin asıl kötü tarafı kaynak yerinde sayarken PHP çok yol katetmiĢti. Ġsim zikretmek istemiyorum ancak para verip aldığım orijinal kitaplarda son derece yüzeysel konular, son derece yetersiz bir anlatımla verilmiĢti. Yabancılara baktığımda kendimize kızmaya baĢlıyordum. Mesela Paul Hudson‘un online kitabı bizde yazılmıĢ bütün kitaplardan kat be kat iyiyken, web sitesinde bedava yayınlanmaktaydı. Bruce Perens‘in kitapları da ilk yılda parayla satıldıktan sonra PDF halinde bedava veriliyordu. Bense para verip aldığım Türkçe kitaplarda merak ettiğim basit Ģeyleri bile bulamıyordum. Sonuçta iĢ baĢa düĢtü ve 2007 yılında yazmaya baĢladığım notlar, 2008 yılında bu kitabın ilk taslağına dönüĢtü. Ancak uzun bir süre ilgilenme Ģansım olmadı. Artık daha fazla öyle kalmasına gönlüm razı olmadı ve sıkı bir çalıĢma ile yayınlamaya karar verdim. ÇeĢitli kaynaklardan esinlenmeler olduğunu ilk baĢta yazmıĢtım. BaĢta dediğim gibi bu materyaller için maddi beklenti içinde değilim, ancak kullanımı konusunda çeĢitli sınırlar da getirmek zorundayım. Çünkü onca emek harcadıktan sonra bazılarının bunları kaynak bile göstermeden kendilerinmiĢ gibi sahiplenmesi ayıp ötesi bir durum olurdu. 22


Kullanım Kuralları 1. Bu çalıĢmanın tamamı veya bir kısmını kaynak belirtmeden yayınlamanız, çalıĢmamımı sahiplenerek kendinizinmiĢ gibi sunmanız yasaktır. Kaynak belirterek yaptığınız alıntıları bir e-mail ile bildirirseniz sevinirim. 2. ÇalıĢmamızdaki yazı ve örnek kodları ticari amaçla satılan bir kitap için kullanamazsınız. Ticari olmayan çalıĢmalarınızda ise alıntı yapma kurallarına uymanız gereklidir. 3. Bu çalıĢmayı tamamen öğrenciler ve öğrenmek isteyenler bir Ģeyleri araĢtırmak istediklerinde bir kaynak bulabilsinler diye, maddi bir beklenti olmadan hazırladım. Beni teĢvik edecek bir mail, bir teĢekkür, siteme verilmiĢ bir link bu konudaki Ģevkimi artıracaktır. 4. Bu çalıĢma için harcağım emek hakkı için; Ģunu da hatırlatırım ki: Koyduğum kurallar haricinde davranıp emek hırsızlığı yapanlardan hakkımı, öbür dünyadaki hesaplaĢmada talep edeceğim. 5. Emek hırsızlarına karĢı yasal haklarım saklıdır. Bu yasal müeyyideler konusunda sizi önceden uyarmak gibi bir zorunluluğum yada lüksüm yoktur. Umarım yararlı bir Ģeyler ortaya çıkarmıĢımdır.

23


HTML DĠLĠ Atası olan ARPA-NET ve daha sonra adeta çağı değiĢtiren Internet çağımızın en büyük kütüphanesidir. Bu bilgiler değiĢ tokuĢ edilirken herkesin ortak bir dilden konuĢması gerektiğinden buna bir çare arayan uzmanlar, 1986‘da, Standart GenelleĢtirilmiĢ ĠĢaretleme Dili (Standart Generalized Markup Language, SGML) adıyla bir protokol –dili- ortaya çıkardılar. Daha sonra ise günümüzde hala geliĢtirilen HTML protokolu üzeri bir standart oldu. Burada dil derken bir ayrıma dikkat etmek gerekir. HTML bir dildir ancak bu dil makineye komut veren değil sadece bilgiyi görüntüleyecek olan bilgisayar programına ―yazının şurasını kalın yap, burada tablo yapılacak, kenarlıklı olacak, bu kısım bir pragraf” gibi komutlar veren bir dildir. Bu bakımdan HTML‘nin bir betik dili olduğu hatırlanmalıdır. HTML, önceleri Macintosh, ardından IBM uyumlu bilgisayarların yardım dosyalarının oluĢturulmasında kullanıldı. Ancak, HTML kısaltmasının açık Ģekli olan Hypertext Markup Language‘de geçen Hypertext terimi, 1950 yılında Ted Nelson adlı bir bilgisayar uzmanı tarafından içinde “hot” yani baĢka bir metinle veya resimle ilintilendirilmiĢ noktalar bulunan metin anlamına kullanılmıĢtı. Apple bunu bir metne yada simgeye tıklayınca baĢka bir yere gitme yöntemi olarak kullandı. Böylece metinler hareketli gibi davranmıĢ oluyordu. Asıl aĢama ise 1989 yılında yaĢandı. CERN uzmanlarından Tim Berners-Lee, laboratuvar yönetimini ortak bir yazı biçimlendirme sistemine ikna edebilmek 24


için, “Enformasyon Yönetimi: Bir Öneri” baĢlıklı bir rapor hazırlayarak bilgisay Ģebekeleri arasında bilgi alıĢveriĢi için Hypertextin ortak bir dil olmasını önerdi. Doğrusu imza attığı devrimi kendisi bile hayal edememiĢ olsa gerek. Bugünkü Internet‘i Internet yapan iki ana baĢlık vardır. Birincisi bilgisayar arası iletiĢimi gerçek zamanlı olmaktan çıkartan ve iletiĢimi daha sağlam hale getiren HTTP bağlantı protokolünün geliĢtirilmesi; diğeri ise HTML dilinin çok yalın ancak resim, ses, video gibiher materyali taĢımaya yetecek kadar güçlü olmasıdır. Ağ teknoloji 1980‘lerin baĢlarında bağlantının gerçek zamanlı olmasını gerektiriyordu. Internet‘in adı da ağlararası ağ anlamına gelen Ġngilizce ―Inter-networksnetwork: Inter-net kısaltmasından doğmuĢtur. Bir bilgisayar diğerine bağlandığında iletiĢim gerçek zamanlı ve birebir olma durumundaydı. Gönderilen ile alınan bilginin aynı olup olmadığını kontrol etmek ancak böyle mümkündü. HTTP (Hypertext Transmission Protocol-Hyper Metin İletim Kuralları) bunu ortada kaldırdı. HTTP protokolünü bir otobanın ve yanında uzayıp giden bir otoyol çifti gibi düĢünülebilir. Otoban bakımda ise otoyoldan iĢinize devam edebilirsiniz. HTTP‘nin , 1990 yılında kurulan World Wide Web Konsorsiyomu‘nun (W3C) tarafından resmi standartları kabul edildi. Bu yüzden 1990 bugünkü Internet‘in de doğum tarihi olarak kabul edilebilir. W3C sürekli olarak http ve HTML içinde bulunan eksiklikler için ortak standartlar belirlemekte ve bunları duyurmaktadır.

25


Web ortamında çalıĢan dinamik dillerin, HTML‘in pabucunu dama attığı söylense de bu doğru değildir. Çünkü dinamik diller kullanıcının tarafında değil sunucu tarafında çalıĢmaktadır. Yani dinamik dilin ASP veya PHP yahut JSP olması fark etmez çünkü kullanıcı hep HTML verisi almaktadır.

Bir Web Sitesi Bilinmesi Gereken Temel Bilgiler Bir web sitesi için  Her web adresi aslında bir numara bloku tarafından temsil edilir. Bu o sitenin IP numarasıdır. Örneğin 212.175.12.43 gibi.  IP numarası hatırlamak kolay olmadığından her site için bir isim tanımlanmasının hatırlamayı kolay kılacağı düĢünülmüĢtür. Bu isimlere alan adı (domain name) denir.  Hangi ismin hangi IP tarafından karĢılanacağını tutmak içinse NS (name server) dediğimiz rehber bilgisayarlar kurulmuĢtur. (9 ana NS bilgisayar vardır ve tamamı ABD ‗dedir). Name server üzeride kayıt sorgulamak içine DNS denilen servisten yararlanılır. Örneğin IP adresi olarak 194.27.128.101 gibi numaraları akılda tutmak zor olduğundan 1983‘te Wisconsin Üniversitesi DNS‘yi geliĢtirmiĢtir. DNS isimleri rakamlara çevirir ve bu da daha kolay kullanım sağlar. Bazen Ttnet DNS sunucuları hata verdiğinden ―internet çalıĢmıyor‖ diyenler olur. Oysa adres çubuğuna IP no yazılırsa siteye eriĢim sağlanması mümkündür. 26


 Ġsimleri tahsis etmek ve çakıĢmaları önlemek üzere Domain Register iĢi yapan Ģirketler kurulmuĢtur. Bunların iĢi uygun bir alan adını belirli bir ücret karĢılığı kullanıcılara kiralamaktır. Kiralama iĢlemi ile birlikte bu alan adının internette hangi IP no üzerinde olduğuda burada kayıt altına alınır.  Bir sitenin eriĢilebilir olması için DNS bilgisayarında IP ile ağa bağlı bir bilgisayar olması gerekir. Bu kendi bilgisayarımızda olabilir ancak bu sistemlerin gerçek sunucu olması iĢlemlerin aksamasını engelleyeceğinden ve bu sunucularda bizim için hayli masraflı olacağından yeni bir iĢkolu doğmuĢtur. HOSTING dediğimiz bu iĢ kolunun ana amacı kullanıcıların web sitelerini kendi sistemlerinde yayınlamak ve bunun karĢılığında ücret almaktır.  Hosting Ģirketleri sunucu bilgisayarlarına Web server adı verilen bir program kurarlar. Bu program ise 80 nolu portu dinleyere kendisine bağlanan kiĢilere istedikleri dosyaları iletir.  Web server ile kullanıcı TCP/IP iletiĢim protokolü üzerinden konuĢurlar.  Kullanıcı Web Server programına kendisine kurulu olan ve Browser (Web tarayıcı, Gezgin) adı verilen programlar ile 80 nolu http portundan bağlanır.  Kullanıcıları ile Web server arasında köprü olarak ise internete çıkarmak üzere Internet Servis Sağlayıcı (ISS- Ingilizcesi ISP – Internet Service Provider) yer almaktadır. Zaten gerçek zamanlı iletiĢimi gereksiz kılanda bu iĢlemdir bir nevi. 27


Kullanıcı örneğin www.tcmb.gov.tr yazdığında browser bu talebi ISS‘ te bağlandığı bilgisayara iletmekte, o da gerekli arama iĢleminden sonra bilgiyi talep etmektedir. ĠĢte bu aĢamada kullanıcı bağlantıyı kesse bile web server bunu bilmemektedir. Zaten bilmesine de gerek yoktur.  Web sunucu HTML metni ( içerik ve o içeriğin ekranda nasıl gösterileceğine dair biçimlendirme bilgileri) gönderir ancak metni biçimlendirme iĢlemi kullanıcı tarafından yer alan browser tarafından yerine getirilir. Browserlar iĢte bu yüzden HTML yorumlama motoru denilen engine barındırırılar. Her yorumlayıcı farklı mantıkla ve ayrı firmalar tarafından yazıldığından bazı metinlerin ekranda görüntüleme iĢleminde farklılıklar oluĢabilir. Ayrıca bazen Ģirketler sadece kendi tarayıcısına yönelik etiketleri üstelik W3C tarafından onaylanmadan motoruna ekleyebilir. Örneğin BLINK etiketi NETSCAPE O yüzden site tasarımında ne çok bu konuya dikkat edilmelidir. Dolayısı ile BLINK kullanılan bir sayfa Netscape ile normal görünürken, Safari ile farklı görünecektir. En büyük Ģansımız ise tarayıcılar hatalı bir etikete rastlayınca bunu göz ardı ederek geri kalanları çalıĢtırmaya devam etmesidir.

Domain Uzantı Adları Günümüzde alan adları yaĢanan sıkıntıların ardından çeĢitlendirilmiĢ ve alternatifler artmıĢtır. Ancak biz temel standartlar üzerinden anlamlarını belirtelim. 28


.com -Ticari Ģirketlere ait alan adını belirtir .edu -Eğitim kurumlarına ait alan adını belirtir .gov -Hükümet ve devlete ait alan adını belirtir .mil -Askeri alan adını belirtir .net -Ağ servis sağlayıcılarına ait alan adını belirtir .org -Dernek, spor kulübü gibi organizasyonlara ait alan adını belitir

TCP / IP Transmission Control Protocol / Internet Protocol Kelimelerinin baĢ harflerinden oluĢan Paul Baran tarafından düĢünülmüĢ bir sistemdir. Paul Baran‘dan talep edilen Ģey Ģuydu. ―A,B,C Ģehirlerinde bilgisayarlarımız var, A,B,C birbirleriyle konuĢabilsin, bilgi gönderebilsin, ama A devre dıĢı kalsa bile B ve C konuĢmaya devam edebilsin, bu diğerleride içinde geçerli olsun‖. Paul Baran bu iĢ için paket anahtarlamalı ağ iletiĢimi tekniğini düĢündü. Çünkü istenen Ģey verinin iletilmesiydi. Her koşul ve şart altında bile verinin iletilmesi birinci öncelikti. (İlk öncelik güvenlik olmadığı içinde bu gün güvenlik anlamında bir sürü ekstra yatırıma vs gerek duyulmakta). Veriler paketlere bölünecek ve hedef yerde bu paketler birleĢince verinin kendisi oluĢmuĢ olacaktı. Paul Baran daha sonra A,B,C lokasyonlarının nükleer füze merkezleri olduğunu öğrendiğinde aslında geliştirdiği şeyin ne olduğunu anlamıştı anlamasına da bilmeden de olsa internetin ilk öncüsü de olmuştu. Kısaca TCP / IP protokolü de 29


Ģüphesiz ilk olarak askeri amaçlı geliĢtirilen bir protokoldü ve temel amacı ―bir nükleer savaĢ anında tüm telefon Ģebekesi yok olsa bile biz iletiĢimi devam edip karĢı tarafa nükleer saldırı ile cevap verebilelim.― 1983 yılında TCP / IP ye temel hali verildi. TCP / IP protokolü Unix iĢletim sistemine eklenmiĢ ve 1984 yılında DNS kavramı oluĢturulmuĢtur. Günümüzde internet hayatın içine öyle girmiĢtir ki, TCP / IP sadece internetin değil tüm ağ protokollerinin arasından en çok kullanılan durumuna yükselmiĢtir. PORT TCP / IP de her bilgi bilgisayarlar arasında portlar üzerinden iletilir. Ġletim için geçilen yol aynı olsada bilgilerin doğru adrese gitmesi için portların kullanımı Ģarttır. Bir gazete datıcısını düĢünün. Dağıtım kanalı hep aynıdır. Sokaklar. Ancak gazetelere doğru yerlere ulaĢtırmasının tek yolu adreslerdir. Yani kapı numaraları. HTTP iĢlemleri için 80 nolu port kullanılır. Mail alıp gönderme için 25 ve 110 nolu portlar kullanılır. MSN, ICQ, IRC, FTP vs vsvs tüm yazılımların ayrı bir port kullanımı vardır. TCP /IP veriyi iletirken baĢına port‘u da kaydettiğinden, o paketin hangi yazılım için olduğu bilgisi de otomatikman iletilmiĢ sayılabilir. Böylece bilgisayarda aynı anda bir çok yazılım ile internet kullanılabilmektedir.

Web Server Internette tanımlı bir alan adına karĢılık gelen bir numara (IP numarası) vardır demiĢtik. Bu IP nolu bilgisayar sayfa 30


gelen kiĢilere istedikleri bilgileri gönderebilmek için hep açık olmak zorundadır. Ayrıca bu bilgisayarda gelen talepleri toplayıp onlara cevap verecek bir de program yüklü olmalıdır. Web server aslında hem bu iĢlere yarayan programlara hemde bu programların kurulduğu bilgisayarlara verilen bir isimdir. Kafa karıĢtırıcı olabilir ama ama iki tanımda doğrudur. En çok bilinen Web Server programları Apache, MS Internet Information Server (IIS), Xitami gibi yaygın sunuculardır. Bu programların, bilgi alıp-vermenin yanı sıra, elektronik posta alıp verme ve yönlendirme, veritabanlarına eriĢme ve içinden seçme yapma (Query, SQL, vb. gibi), kendi sabit diskinde duran bir dosyayı alıp karĢı tarafa aktarma (FTP, Gopher, WAIS) veya karĢı tarafın vereceği dosyayı alıp kendi sabit diskine kaydetme yeteneği olur. Ġlk Web Server programı, yukarıda, HTML dilinin geliĢtirilmesindeki öncü konumu nedeniyle sözünü ettiğimiz, Ġsviçre‘deki CERN kurumu tarafından geliĢtirildi; ama kısa zamanda UNIX platformunda, anonim bir tarzda ve ücret ödemeden kullanılabilen bir Ģekil aldı. KiĢisel bilgisayarların UNIX gerektiren bilgisayarlara oranla daha ucuz olması, Microsoft‘un NT, IBM‘in OS/2 iĢletme sistemlerinin UNIX‘e ciddî rakip haline gelmiĢ bulunmaları nedeniyle, bu sistemlere dayalı Web Server programları da hızla artmaktadır. Apache Web Server ise bir çok iĢletim sisteminde çalıĢabilmesi ve ücretsiz olması nedeniyle Linux ile birlikte iyi bir ikili olmuĢ ve Internette en çok kullanılan 31


Web Server tutmaktadır.

olma

özelliğini

açık

ara

ile

elinde

Apache 

Açık kaynak kodludur



Bir çok iĢletim sisteminde çalıĢabilir (hatta bir çok sistemde zaten kurulu halde gelir)



Tamamen ücretsizdir



Kaynak kodu kapalıdır.



Windows iĢletim sisteminde çalıĢır.



Ücretsiz değildir.

IIS

Linux ve FreeBSD adlı, ücretsiz dağıtılan UNIX iĢletme sistemleri de, ticarî olanları aratmayacak niteliklere sahiptir. Ayrıca bu tür ücretsiz programlar, Apache Web Server‘ın ücretsiz sürümünü de içerdiklerinden sıfır maliyet ve kurulum ile web server edinmek mümkündür.

Bir Web Server yazılım paketi seçerken dikkat edilmesi gereken bir kaç ilkeyi sıralayalım: 1. Yazılım paketi yeterli güvenliği sağlayacak özelliklere sahip olmalıdır. Binalarda bir odadaki yangının yandaki odaya sıçramasını önleyen ateĢe dayanıklı duvarlardan (Firewall) esinlenerek adlandırılan bir dizi program, Web Server yazılımının bulunduğu bilgisayarın, kötü niyetli kiĢiler tarafından bozulmasına engel olmaktadır. Ancak Web Server‘ın kendi içinde mevcut güvenlik 32


önlemlerinin neler olduğunu dikkatle araĢtırmanız gerekir. Bunuda tarafsız bir gözle yapmak gerekir örneğin çoğu kiĢi için Unix çok güvenli, Windows ise berbattır yada bunun tersi düĢünülebilir. Oysa bu bir takım tutma olayı değild,r ve önyargılı olmak yanlıĢtır. Asıl güvensiz olan sistem değil sistemin baĢında oturan sistem yöneticisidir. Yönetici ne kadar dikkat ederse sistemde o kadar güvende demektir. Burada önemli olan, Internet‘e açılmanın, iyi niyetli-kötü niyetli herkese açılmak olduğunu unutmamaktır. Özellikle form denilen, HTML‘in ziyaretçi bilgisayarın evsahibi bilgisayara talepten baĢka Ģeyler göndermesine imkan veren etiketlerini ve ona bağlı CGI (Common Gateway Interface-Ortak Geçit Arabirimi) adı verilen ziyaretçinin ev sahibi bilgisayardaki programları harekete geçirebildiği buluĢma noktasında yer alacak programları tasarlarken, daima kötüniyetli kiĢileri dikkate alarak hareket etmek gerekir. Internet‘te güvenliğin ne kadar kolay sarsılabildiğine ve ne kadar kolay önlem alınabileceğini bir örnek verelim. Sayfanızda, ziyaretçinin doldurması gereken ―Elektronik Posta Adresiniz:‖ diye bir metin kutusu bulunduğunu düĢünün. Bu kutuya bütün ziyaretçilerin elektronik posta adreslerini yazacaklarını düĢünüyor ve bu bilgiyi iĢleyecek CGI programında, ziyaretçinin bu kutuya yazacağı bilgiyi, alıp doğruca Web Server‘ın ―Mail‖ programına veriyorsunuz. Peki, ya kullanıcı adres yerine;

33


“[email protected]; mail [email protected]

görüntülenmiĢ, en çok hangi dosya indirilmiĢ, han gisteden sizin sitenize en çok ziyaretçi gelmiĢ bunların bilinmesi önemlidir. Özellikle elektronik ticarete dayalı veya mesajını daha çok sayıda kiĢiye iletmek amacıyla hazırlanan Web alanlarını iĢletenlerin, sayfalarının varlığını duyurmak için, mümkün olan her yoldan yararlanmaları gerekir. Çok önemsiz gibi görünebilir ama Google içerik ile reklamı birleĢtirmeyi akıl eden reklam yapısı Ģu anda alanında dünyanın en büyüğü olmayı baĢarmıĢ bir Ģirket. Örneği sitenize gelen ziyaretçi eğer mobilya hakkında bilgi arıyor ise belkide mobilya almaya niyeti vardır bu durumda ona mobilya reklamı gösterilmelidir… ĠĢte bu formül Google Ģirketini bir numara yapmıĢtır. 4. Web Server programıyla ilgili teknik destek ve sorun çözme hizmeti alıp almamak, programın seçiminde belki de en önemli unsur sayılabilir.

Web’de Gezme ĠĢlemine Genel Bir BakıĢ Internet ve intranet ortak dili, HTML dilidir. Bir Web sayfasında yer alan belgenin içindeki bazı kelimeler, simgeler, fotoğraflar, grafik unsurlar veya bunların parçaları bir baĢka sayfa ile hiper-link kurularak, bağlanmıĢtır. Kullanıcı, hiç bir komut öğrenmek zorunda kalmadan, hiç bir bağlantının Internet‘teki adresini bilmek zorunluluğu olmadan bu sayfalardaki bağlantıları tıklayarak, yazıdan yazıya, Ģekilden Ģekilde, gidebilir. Aslında kullanıcı ya da ziyaretçinin bir HTML sayfasıyla iliĢkisi burada da 35


bitmemektedir. Çoğumuz ulaĢtığımız bir alanın adresini Web tarayıcı programında sık sık ziyaret etmek istediği yerlerin arasına koyabilir (bookmark) ve arzu ettiği zaman doğruca iĢaretlenmiĢ olan bu adreslere gidebilir.

HTML’in baĢlıca sıralayabiliriz:

özelliklerini

Ģöyle

1. Belge biçimlendirme: HTML, Web tasarımcısına, belgelerini ziyaretçinin ekranında nasıl oluĢmasını istiyorsa öyle Ģekillendirme imkanı verir. 2. Bununla birlikte tarayıcı programlarının HTML komutlarını yorumlayıĢlarında az da olsa fark vardır ve bu fark sayfalarınızın bir ziyaretçinin bilgisayarında baĢta, diğerinin bilgisayarında baĢka gösterilmesine yol açabilir. Ayrıca ziyaretçileriniz, tarayıcı programlara verdikleri komutlarla, aldıkları sayfalarda genel değiĢiklik veya kısıtlamalar yapabilirler. Siz sayfanızda ne tür harf türü (font) kullanmıĢ olursanız olun, ziyaretçiniz tarayıcı programa ―Sadece Times fontları kullan‖ demiĢ ise, sayfanız bu ziyaretçinin ekranında sizin istediğinizden farklı biçimde görülecektir. Ziyaretçi tarayıcı programına ―Grafik unsurları gösterme!‖ demiĢ ise, sayfalarınız ve tabiî vermek istediğiniz görsel mesaj tamamen farklı bir nitelik kazanacaktır. Bu duruma rağmen, bugünkü Ģekliyle HTML, Web tasarımcısına adeta bir gazete ya da dergi sayfası tasarlarcasına, oluĢturmak istediği görsel etkiyi sağlamasına yeterli tasarım araçları sunmaktadır. 36


3. Ġlk çıktığında web sadece durağan sayfaların aktarıldığı bir yer iken bugün canlı yayın radyo ve tlevizyonlara varıncaya kadar hayatımıza grmiĢtir. Bununla birlikte HTML, bir kelime iĢlem ya da masaüstü yayıncılık programının oluĢturabileceği görsel özelliklere sahip sayfalar oluĢturamaz. Bu kısıtlamalara, Internet‘i tasarlayan uzmanların, platformlar (Windows 3.x, Windows 95/98, Windows NT, Unix, MacOS), donanımlar (Macintosh, PC, Sun) ve tarayıcı programların hepsi tarafından doğru Ģekilde anlaĢılabilen bir platform oluĢturma isteği sebep olmaktadır. HTML, dililinin hassas ölçmelere ve biçimlendirmelere izin vermemesi HTML için eksiklik değil bilinçli bir tercihtir. Çünkü bu durumda ancak belirli platformlarda çalıĢır duruma gelecekti. HTML dilinin platformdan bağımsız olması adına bu yol seçilmiĢtir. 4. HTML ile oluĢturulacak statik alanların içine dinamik sonuçlar doğuracak programlar konulabilir. Bu dillerle HTML sayfalarını duraganlıktan çıkartmak ve ziyaretçi ile etkileĢen, ziyaretçinin arzu, beğeni ve özelliklerine göre içeriğini değiĢtirebilen Web alanları tasarlamak mümkündür 5. Web‘de bulunan aĢağı yukarı bütün içerik yani metin, ses, video türü mer materyal sanat eseri kabul edilmektedir. Kısaca telif hakkı ve bu hakka sahip birisi vardır. Dolayısı ile telif hakkı size ait olmayan veya sahibi tarafından size izin verilmeden bir sanat eserini yayınlayamazsınız. 37


Bir sanat eserini Web sayfanıza koymak ve kamuoyunun ulaĢabileceği Internet gibi herkese açık bir ortama yerleĢtirmek, yasaların ―yayın‖ saydığı bir fiildir. Ġzinsiz sanat eseri yayınlamak ise, Türk Ceza Yasası‘na göre ağır hapis cezasıyla cezalandırılan bir suçtur. Ceza yasaları olmasada bu ahlaki bir suçtur.

38


Web Tarayıcıları Bir Web tarayıcı kullanıcının yazdığı adresi yada tıkladığı linki ilgili web serverdan talep eden varsa dönen bilgiyi içinde tanımlı motor ile yorumlayıp ekran görüntüsünü oluĢturup ekranda gösteren yazılımdır. Burada çok dikkat edilmesi gereken nokta Ģudur. Her tarayıcının yorumlayıcı motoru farklı kiĢiler tarafından geliĢtirildiği için haliyle her komutu aynı Ģekilde yorumlamaları beklenemez. ĠĢte bu yüzden bazı web sayfaları bir tarayıcıda diğerinde olduğundan farklı görünebilirler. Web sitesini ziyaret edebilecek kiĢilere de illa Ģu tarayıcı kullanılmalıdır gibi bir sınır konamayacağından sayfa bazı kiĢiler tarafından hatalı olarak görülecektir. ĠĢte bu yüzden web sitesi yaparken mutlaka sayfanın diğer tarayıcılarda nasıl göründüğü kontrol edilmelidir. HTML‘i kullanarak, ticarî amaçlı Web tasarımı yapan kiĢi, Internet ile bağlantılı bilgisayar kullanıcılarının (Internet kullanıcılarının) hepsinin ekranında aynı Ģekilde gösterilecek sayfalar yapmaya mecburdur. Buna karĢılık bir firmanın intranet ortamı için Web tasarımı yapan kiĢi, HTML‘in sadece kendi firmasının standart olarak benimsediği tarayıcının anlayabileceği özelliklerinden yararlanması mümkündür.

Microsoft Internet Explorer Windows ortamında tarayıcı piyasasına, diğer tarayıcılardan sonra girmesine rağmen, Ģu anda pazarda %80 in üzerinde bir oranda kullanıma sahiptir. 39


Netscape Navigator Netscape Communications Corporation‘ın (NCC) piyasaya sürdüğü NN, IE‘ın hızlı yükseliĢi sonucu gerilemiĢ ve sonunda yerini Open Source kardeĢi Firefox‘a bırakmıĢtır.

Firefox Netscape tarayıcısının kaynak kodu üzerine geliĢtirilmiĢtir. Hızla yaygınlaĢmıĢtır. Firefox Google tarafından da maddi anlamda desteklenen bir projedir

Opera Norveçli bir firmanın geliĢtirdiği Opera standartlara en uyan tarayıcı olması ile ünlüdür. Sekmeli arabirimde ilk defa Operada gelmiĢ bir yeniliktir. Günümüzde eski günlerini aramakta olsada hala bir ölçekte kullanımdadır.

Google Chrome Google‘ın çıkardığı tarayıcı olup Google adı üzerinde yaygınlaĢarak epey bir kullanım oranına kavuĢmuĢtur.

Yandex Browser Rusya menĢeili arama motoru Yandex‘in Chrome‘un açık kaynaklı kısmı üzerine tarayıcısıdır.

Google kurulu

Tarayıcılar Ġçin Yardımcı Programlar ve Ek Birimler Tarayıcılar eskiden sadece iletilen metni göstermekteydi. ġimdi hiçbir eklenti gerekmeden bir çok resim dosyayısını gösterebilmekte ve çözücü (CODEC- COder DECoder) yardımı ile video dosyalarını 40


oynatabilmektedir. CODEC kullanılması tarayıcıların asıl alanlarında kalmasına izin verir. Çünkü sürekli yeni görüntü ve ses formatları çıkmaktadır. Haliyle her tarayıcının buna ayak uydurması mümkün değildir. PlugIn denilen ek birimler tarayıcıya tamamen farklı bir programı açmak yerine, belirli bir tür dosya türünü ekranda canlandırabilme yeteneği kazandıran eklerdir. Tarayıcı program bilgisayara kurulurken bu ek birimler olmaksızın (ya da çok yaygın olanları ile) yüklenir.

41


HTML Editörleri Genel olarak HTML editörleri iki grupta incelenirler, Metin editörleri ve WYSIWYG editörler. Normal metin editörlerine en bilinen örnek Windows ile birlikte gelen notepad programıdır. WYSIWYG editörler ise HTML dosyasını tarayıcı içindeymiĢ gibi göstererek kullanıcının yazdığı metinlerin geri planda HTML karĢılığını kaydederler. Günümüzde editörler öylesine geliĢmiĢtir ki, hata kontrolü, Mouse ile çizerek sayfa çatısı kurma, hazır temalar, hazır sayaç çeĢitleri, FTP ile sayfayı siteye upload etme seçeneklerinin hepsini birden içinde barındıran editörler ortaya çıkmıĢtır.

Expression Web Windows iĢletim sisteminde çalıĢır. Tema, WYSIWYG ve FTP desteği verir.

Dreamweaver Hem metin hemde WYSIWYG tasarıma izin verir. Ayrıca PHP, ASP, CF gibi dilerlide kullanmayı sağlar. Sürükle bırak form dizayn etme, veri tabanına otomatik bağlantı ve sorgu dizayn etme, hazır formlar, FTP ile upload ve en önemlisi Mouse ile çizerek sayfa çatısını CSS formatında çizebilmesidir. Word Word aslında kelime iĢlemcidir ama sayfaları HTML olarak kaydetmeyede izin verir. En büyük sorunu ise Word ile oluĢturulan bir HTML sayfası, aynı iĢi yapan ve 42


Notepad ile oluĢturulmuĢ bir sayfadan yakalĢık iki kat daha büyük olmasıdır. Hele sayfada tablo da bulunuyorsa durum dahada vahimdir.

NVU Bedava bir editördür. Composer kodu üzerine geliĢtirilmiĢtir. WYSIWYS tasarıma izin verir. Tablo kullanma yeteneği kısıtlıdır. Frame vs konularda da kullanıcıyı sıkıntıya sokmaktadır.

43


HTML’in Temel BileĢenleri Bir web sitesinin temeli içeriktir. Resimde olsa metinde olsa görüntüde olsa sonuçta hepsi içeriktir. Bu içerikler ise Etiket denilen (TAG) iĢaretleyiciler yardımıyla biçimlendirilir.

Etiketler (Tag) HTML komutları içeren ve tarayıcıların tanıyabildiği dosya, aslında içinde ASCII karakterlerden baĢka bir Ģey olmayan, düz yazı dosyalarıdır. Tarayıcıya, sayfayı ekranda oluĢtururken vermesini istenilen biçimle ilgili komutlar bir dizi özel etiketler ile belirtilir. Bunları içerikten ayırmak içinse ―<>‖ çifti arasına almak gerekir. Sayfa tasarımı yaparken örneğin etiketi kullanılırsa tarayıcıya ―ben buraya bu etiketi koydum. Artık benden ikinci bir komut gelene kadar her Ģeyi ekrana KOYU olarak bastır‖ denilmiĢ olur. Dolayısıyla HTML‘de ilke, önünde etiketi olmayan herhangi metne yer vermemektir. Önünde etiketi olmayan herhangi bir metin parçası, tarayıcı tarafından temel paragraf olarak nitelenir. HTML, içinde kontrol kodu olmayan metin dosyasıdır. Yani Wordde bir dosya yazdığınızda içinde HTML etiketleri kullanmıĢ ble olsanız bu dosya metin dosyası olmadığından HTML dosyası değildir. Böyle bir dosyanın adındaki uzantıyı silerek, yerine ―.html‖ uzantısını verilirse ekrana gelecek olan dosyadaki metin değil, Çinçe yada Japonca dilini çağrıĢtıran karakterler yığını olacaktır. HTML düz yazı olduğuna göre, bir HTML dosyası oluĢturmak için, herhangi bir kelime-iĢlem yazılımı kullanılabilir. 44


HTML Yazım Kuralları 1. Etiketlerin büyük harfle veya küçük harfle yazılması arasında fark yoktur.
ile
aynı iĢi yapmaktadır. 2. Bir kaç istisna tiket hariç bütün etiketlerin birde sonlandırma çifti vardır. Sonlandırma için aynı etiketin önüne ―/‖ (bölü) iĢareti konulur. Örneğin Türkiye gibi. 3. arasındaki metinler yorum olarak ele alınır ve gösterilmez. İyi bir programcı açtığı etiketi kapatmayı unutmamalıdır. Bunun için en kolay yöntem önce açma ve sonladırma etiketlerini yazma sonra içerisini doldurmaktır.

HTML Dosyasının Bölümleri HTML dosyası iki kısımdan oluĢur. 1. Head denilen baĢlık kısmı. 2. Body denilen metnin kendisi Web tarayıcılar, HTML etiketini gördükten sonra hemen HEAD ve BODY etiketlerini arar ve ekrandaki sayfayı buna göre biçimlendirirler. Basit bir HTML örneği, BaĢlık Metni 45


Body Metni İlk Sayfam Sayfama Hoş geldiniz Türkçe bilgi içeren bir sayfa örneği ise; <meta http-equiv = "Content-Type" "text/html; charset = windows-1254"> 46

content

=


Merhaba. Web Tasarım Rehberi‘ne HoĢ Geldiniz!

... Örneklerde görüldüğü gibi bu etiket bloku tarayıcıya HTML dosyasının baĢladığını ve bittiğini belirtir. Tüm diğer kodlar bu iki etiket arasına yazılır. ... Etiketleri arasında ise sayfa hakkında bilgiler verilir. title gibi etiketler, anahtar kelimeler, sayfanın dili vs burada yer alır. Bu alandaki bilgiler ekranda görünmezler. Sadece title tarayıcı baĢlığı olarak kullanılır. ... Title etiketi tarayıcı penceresinin üstüne yazılacak olan baĢlığı belirtir. Yazılan metin penceresinin üstünde tarayıcı adı ile birlikte yazılır. ... Bu etiketler ise sayfanın ekranda görüntülenecek olan kısmını yazdığımız bloktur. Parametreleri ile birlite sayfanın zemin rengini, linklerin rengini, arkaplan resmini ayarlamak mümkündür.

47


Meta Etiketleri Arama Motorları Ġçin Sitemize Eklememiz Gereken Bilgiler Normal olarak oluĢturulan her sayfanın HEAD kısmına sayfanın açıklamasının yapıldığı, sayfa hakkında anahtar kelimelerin belirtildiği meta etiketler konabilir ve konulmalıdırda. Anahtar kelimeler arama motorlarının sayfayı tanımasını ve tespit etmesini sağlar. Yeni nesil arama motorları (Örn : Google gibi) meta etiketlerinin yanısıra belgenin Gövde kısmındaki içeriği de dikkate alır. Eskiden sırf ziyaretçi çekmek için popüler metinlere meta etiketlerinde alakasız yer verilir bir nevi kullanıcı aldatılırdı. Google BODY kısmınıda dikkate alarak bu iĢe bir önlem almıĢ olmaktadır. 

NAME: Sayfanın yazarı, sayfanın yayın tarihi, vb., bilgiler içerir. <META NAME="bilginin türü" CONTENT="bilgi"> Ģeklinde yazılır.



<META NAME="keywords" CONTENT = "kelime1 kelime2 kelime3"> "keywords" sayfa hakkında bazı anahtar kelimeler içerir. Böylece arama motorları için index oluĢturmaya yardımcı olur. (Dikkat: bu kısma ilgisiz alakasız Ģeyler yazarak arama motorları aldatıldığından artık sadece bu alan değil komple içerik indekslenmektedir. Kısaca kendinizi kandırmayın)



<META NAME ="metin">

="description"



"description" etiketi site hakkında tanımlanma bilgisini içerir. Bu etiketi tanımayan arama motorları ise 48

CONTENT


sayfanın ilk bir kaç kelimesini tanımlama aracı olarak kullanır. Örnek: <META NAME="description" CONTENT ="KiĢisel PHP sitem."> <META NAME="author" Soyadı">

CONTENT

="Adı

Arama yapanlara siteler gösterilirken bazı arama motorları site yazarını bu etiketi tarayarak bulur. Örnek:<META NAME="author" CONTENT="Türkiye" 

HTTP-EQUIV: Ġçinde yer aldığı sayfanın, Web Server tarafından ziyaretçiye gönderilmesinde oluĢturulacak Response Header (KarĢılık BaĢlığı) bölümünde yer alacak bilgiler içerir. <META HTTP-EQUIV="bilginin türü" CONTENT="bilgi"> Ģeklinde yazılır.

AĢağıda, meta etiketlerinin content bölümünde açıklama yapılmıĢ ve parantez içinde bu sayfa için uygun örnekler verilmiĢtir. <meta name="author" content="Sayfayı düzenleyenin adı"> <meta name = "Description" content = "Sayfanın açıklaması"> <meta name="keywords" content="Arama motorlarına yardımcı olmak için sayfa hakkında anahtar kelimeler (bu sayfa için HTML,ders,web sayfası,web sitesi, PHP vs) "> <META name="copyright" tanımları" >

49

content="Telif

hakkı

ve


Eğer sayfa içeriği Ġngilizceden farklı ise hazırlanan sayfada herhangi bir karakter görüntüleme sorunu sorunu yaĢamamak için bölümünde sayfasının kod sayfasını belirten meta etiketleride eklenmelidir. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9"> <meta http-equiv="Content-Type" content="text/html; charset=win-1254"> Bugünlerde arama motorları için yapılabilecek iĢlemler SEO Uzmanlığı adıyla ayrı bir meslek haline dönüĢmüĢtür. Bu konuda bazı materyalleri ilerleyen konularda bulacaksınız.

Meta Tağlarının GeliĢmiĢ Kullanımı Sayfanın Süre AĢımını Belirtmek Bu iĢlem için ―expires‖ etiketi kullanılır. <META HTTP-EQUIV="expires" 04 Apr 2008 23:59:59 GMT">

CONTENT="Wed,

Yukardaki örnekte sayfanın 4 Nisan 2008 günü Greenwich saatiyle gece yarısından itibaren arama motorlarından ve ziyaretçilerin bilgisayarlarında geçici Internet dosyaları klasöründen silinmesini sağlar. Bir Sayfanın Belirli Bir süre Ekranda Kalıp Otomatikman BaĢka Bir Adrese Yönlenmesini Sağlamak Bu iĢlem için ―refresh‖ etiketi kullanılır. Böylece tanımlı süre sonunda hedef URL otomatik açılır.

50


<meta http-equiv = "refresh" content ="5; url=http://abc.com/dnm.html"> Bu sayfanın 5 saniye ekranda kalacağını ve daha sonra URL ile belirtilen adresteki sayfanın yüklenmesini sağlar.

Türkçe Karakterleri Görüntülemek-Kod Sayfası Yukarda örneğini gördüğümüz meta etiketi sayesinde sayfa için bir kod sayfası belirtebiliriz. Böylece hazırlanan sayfanın ekranda hangi karakter seti ile görüntüleneceğinin bilgisini tarayıcıya vermiĢ oluruz. Türkçe için 3 adet karakter seti kullanma imkanımız vardır. 

Windows-1254



Iso-8859-9



UTF

Türkçe bilgilerin görüntülenebilmesi için <meta http-equiv="Content-Type" content = "text/html; charset=windows-1254"> <meta http-equiv="Content-Type" content = "text/html; charset=iso-8859-9"> Seçenekleri kullanılabilinirse de en doğrusu UTF-8 kod sayfasının kullanımıdır. UTF evrensel karakter seti olmak iddiasındadır. Bu konuda da hayli yol katetmiĢtir. Bu 51


nedenle artık UTF kodlamasının kullnaılması kesinlikle önerilir. <meta http-equiv="Content-Type" content = "text/html; charset=utf-8">

Etiketinin Parametreleri Body etiketi Bunlar

çeĢitli

parametreler

ilede

kullanılabilir.



Bgcolor

: Sayfanın zemin rengini belirtir



Background : Sayfanın zemini için bir resim kullanılmasını sağlar.



Text : Sayfadaki yazıların rengini belirtir. Bu renk belirtilmiĢ ise sayfa içinde renk belirten etiket görülmediği sürece tüm içerik bu renkte basılır.

Örneğin Normalde resimler için en boy belirtilebilir ancak etiketinde bu durum söz konusu değildir. Seçilen resim tarayıcı tarafından tüm sayfayı kaplayacak Ģekilde sayfaya yerleĢtirilir.

TrueType Fontlar-Harf GeniĢliği Serif ve Sans Serif Harfler Daktilolarda, kağıdı hareket ettiren mekanizma, her harfin geniĢliğine göre farklı hareket yeteneğine sahip 52


olmadığından ―i‖ veya ―k‖ veya hepsinden geniĢ olan ―m‖ harfi de aynı geniĢlikte bir alana yazılırdı. Zamanla teknoloji sayesinde bu sorun aĢıldı. Harfleri büyüklüklerine göre göreli geniĢlikte olan fontlarla bütün harfleri aynı geniĢlikte olan fontların farkı buradan kaynaklanır. Günümüzde, teknik gerekçelerle eski tip fontlar hala vardır. Harflerin genel karakteristiğine göre ayrımda ise fontlar serif, sans serif ve dekoratif olarak üçe ayrılır. Serif harfler kuyruklu yazılmıĢ, sans serif harfler ise düz olan biçimdir. Web de görsel etki, zıtlıklardan yararlanarak sağlanır. Bir sayfada yer alacak bir metnin serif diğerinin sans serif harflerle yazılması iyi bir zıtlık oluĢturup okunulabilirliği artıracaktır Ekranda okuma kolaylığı açısından sans serif harfler tercih edilmelidir. Özellikle küçük puntolu serif harflerin okunması çok zor olabilir. Sans serif harfler içeren en bilinen fontlar Arial Verdana ve Tahoma fontlarıdır. Serif için en bilinen örnek ise times New Roman fontudur.

H1,H2,H3,H4,H5,H6 BaĢlık Etiketleri HTML bize H1, birinci yani en büyük, H6 sonuncu, yani en küçük olmak üzere altı ayrı büyüklükte baĢlık kullanma imkanı veriyor. Farklı baĢlık büyüklüklerini daha yakından tanımak için, Ģu sayfayı yazarak, örneğin baslik.htm adıyla kaydedin: <meta http-equiv="Content-Type" content="text/html; charset=windows-1254"> 53


BaĢlıklar

H1: baĢlık 1

H2: baĢlık 2

H3: baĢlık 3

H4: baĢlık 4

H5: baĢlık 5

H6: baĢlık 6
Normal Metin
Paragraf etiketi gibi, baĢlık etiketinin de arkasına koyabileceğiniz tek özellik ALIGN‘dır ve bununla baĢlığın sola, sağa, ortaya hizalanmasını veya sağ sol marjların aynı anda hizalanmasını sağlayabilirsiniz.

etiketi Bu etiket metni iki satıra bölmek için kullanılır. Enter tuĢunun iĢlevini taĢır. HTML metni biçimlendirirken MSWORD gibi davranır. Yani ―alt satıra geç‖ yada ―yeni paragrafa baĢla‖ iĢaretini görmedikçe metni sağa doğru yazmaya ve pencere sonuna gelince alta doğru kaydrmaya devam eder. Metni bölmek için HTML kodunda iken enter tuĢuna basmıĢ olmanız tarayıcı için 54


bir anlam ifade etmez. Tarayıcı
etiketini görünce bir alt satıra geçer. Bu satır çok çok çok ama çok uzun bir satır. Ancak HTML için için bunun için bir önemi yok. Çünkü ne yazarsanız yazın özel etiketi görmedikçe aynı paragraftaymıĢ gibi ekrana görüntülenmeye devam edilecektir. Bu satır da bir önceki gibi
<çok çok çok ama çok
uzun bir satır.
Ancak HTML için için bunun için bir
önemi yok.
Çünkü ne yazarsanız yazın
özel etiketi görmedikçe aynı paragraftaymıĢ
gibi ekrana görüntülenmeye devam edilecektir.
Bu satırın farkı ise BR etiketi ile bölünmüĢ olması.

…
etiketi ĠĢlev olarak
etiketine benzer ancak temelde farklıdır.
etiketi
ile sonlandırılır.
sadece alt satıra geçerken bu etiket paragraf baĢı yapar.
55


Bu satır çok çok çok ama çok uzun bir satır. Ancak HTML için için bunun için bir önemi yok. Çünkü ne yazarsanız yazın özel etiketi görmedikçe aynı paragraftaymıĢ gibi ekrana görüntülenmeye devam edilecektir.
Bu satır çok çok çok ama çok uzun bir satır. Ancak HTML için için bunun için bir önemi yok. Çünkü ne yazarsanız yazın özel etiketi görmedikçe aynı paragraftaymıĢ gibi ekrana görüntülenmeye devam edilecektir.

56


Genel Biçimlendirme Etiketleri Genel Biçimlendirme Etiketlerinin Listesi Öncelikle Ģunu belirtmek gerekiyorki biçimlendirme etiketlerinin çoğu “obsolete” yani devre dıĢı bırakılmıĢ durumdadır. Bu yüzden bu listede sadece birkaç temel etiketi bırakıp eski standarda uygun olanları ise çıkarmak durumunda kaldım. Çünkü bu etiketleri kullanmak için zaman harcamak yerine en uygunu yeni standart olan CSS kullanımını öğrenmenizdir.

Kapatılana kadar her harflerle yazılacaktır

metin

koyu

Kapatılana kadar her metin italik olarak yazılacaktır N

..

Sıralı (Ordered) listeler, liste unsurlarının baĢına, tasarımcının arzusuna göre, ya rakam, ya harf koyarak, sıralanmıĢ listelerdir.

Liste elemanlarını belirtir

..

Sırasız (Ordered) listeler, liste unsurlarının baĢına, tasarımcının arzusuna göre, ya içi dolu ya da içi boĢ bir yuvarlak, veya dört köĢe nokta konularak sunulan listelerdir. Listenin baĢladığını ve bittiğini belirten bu iki 57


etiketin arasına liste unsurları (list item)
etiketi ile yazılır. ..

Ġçindeki metnin bilgisayar programı veya benzeri bir Script parçası olduğunu gösterir: // bu bir delphi satırıdır Showmessage(Mesaj)

HTML‘in metin biçimlendirmekten çok metnin bölümlerini tanımlamakta kullanılan ve özellikle Internet‘in metin ağırlıklı olduğu ilk dönemlerinden kalma, ACRONYM, BLOCKQUOTE, CITE, CODE, DEL, DFN, EM, INS, KBD, PRE, Q, SAMP, STRONG, SUB, SUP, VAR, B, I, U, SUP, SUB etiketlerini de ismen hatırlatmak yeterlidir. W3C konsorsiyumu artık metinlerin bu Ģekilde değil CSS ile biçimlendirilmesini standart kabul etmektedir. Dolayısıyla bu tagların çoğu artık obsolete dediğimiz ve sadece geriye dönük uyumluluk açısından varlıklarını sürdürmektedirler. Metni Koyu, veya Ġtalik Yazdırma Bu iĢler için yukardaki tablodada görüleceği <> ve etiketleri kullanılır. 58

gibi


Sayfa baĢlığı
Sayfama hoĢ geldiniz

HTML etiketleri ile,
Tüm yazıları koyu renkte italik yönde yazmak mümkün Burada paragraf etiketini kullandığımıza dikkat edin.
..
etiketleri, paragraf etiketleridir. Tarayıcı bu etiketi gördüğü anda, bir sonraki içerik parçasını alt satıra kaydırır. Paragraf etiketinin nasıl bloklanacağı ALIGN parametresi ile belirtilir. Örneğin paragraf etiketini
Ģeklinde kullanırsanız,
etiketine kadar gireceğiniz bütün metin, bulunduğu yerde ortalanacaktır.

HTML Dilinde Renk Kodlaması Web tarayıcılar renk belirtmek için, ya Ġngilizce kelimeleri ya HEX karĢılıklarını yada RGB değerlerini kullanırlar. Aslında bilgisayarda sadece üç renk vardır. Kırmızı yeĢil ve mavi. Diğer renkler bunların karıĢımından ibarettir. RGB (Red Gren Blue) dediğimiz Ģey aslında o rengi elde 59


edilmek için hangi renkten ne kadar karıĢtırılacağını veren sayılar grubudur. HEX sisteminde sayılar 16 lık sistemde ele alınır. Sayı sistemini 1‘den 10‘a kadar sayılar normal halleriyle diğerleri ise A,B,C,D,E,F harfleriyle ifade edilir. Yani ―11‖ yerine ―1A‖ ―12‖ yerine ―1B‖ yazmak gerekir. Renkleri belirtirken, ―00‖ ise o renkten yüzde sıfır oranında, ―FF‖ ise yüzde 100 oranında karıĢtırılması belirtilmiĢ olur. Bilgisayar ve televizyon ekranında beyaz renk, her üç rengin de yüzde yüz oranında olması halinde, siyah ise her üç rengin de yüzde sıfır oranında olmasıyla sağlandığına göre #000000 Siyah, #FFFFFF ise Beyaz rengi ifade eder. Renk

Adı

HEX kodu

Black

#000000 rgb(0,0,0)

Red

#FF0000 rgb(255,0,0)

Gren

#00FF00 rgb(0,255,0)

Blue

#0000FF rgb(0,0,255)

Yellow

#FFFF00 rgb(255,255,0)

Aqua

#00FFFF rgb(0,255,255)

RGB kodu

Fuchsia #FF00FF rgb(255,0,255) 60


Gray

#C0C0C0 rgb(192,192,192)

White

#FFFFFF rgb(255,255,255)

Bunlar 16 renk temel renktir.

61


Güvenilir 216 Renk Tüm tarayıcıların hepsinde birden 256 renk paleti kullanıldığında hep aynı renkte gösterilen renk koları vardır. Bu renkler 216 adettir. Bunlar Güvenilir 216 Renk (216 Web Safe Colors) olarak bilinirler. AĢağıdaki tabloda kodları verilen renkler her bilgisayarda ve tarayıcıda aynı renk sonucunu verir. 000000 000033 000066 000099 0000CC 0000FF 003300 003333 003366 003399 0033CC 0033FF 006600 006633 006666 006699 0066CC 0066FF 009900 009933 009966 009999 0099CC 0099FF 00CC00 00CC33 00CC66 00CC99 00CCCC 00CCFF 00FF00 00FF33 00FF66 00FF99 00FFCC 00FFFF 330000 330033 330066 330099 3300CC 3300FF 333300 333333 333366 333399 3333CC 3333FF 336600 336633 336666 336699 3366CC 3366FF 339900 339933 339966 339999 3399CC 3399FF 33CC00 33CC33 33CC66 33CC99 33CCCC 33CCFF

62


33FF00 33FF33 33FF66 33FF99 33FFCC 33FFFF 660000 660033 660066 660099 6600CC 6600FF 663300 663333 663366 663399 6633CC 6633FF 666600 666633 666666 666699 6666CC 6666FF 669900 669933 669966 669999 6699CC 6699FF 66CC00 66CC33 66CC66 66CC99 66CCCC 66CCFF 66FF00 66FF33 66FF66 66FF99 66FFCC 66FFFF 990000 990033 990066 990099 9900CC 9900FF 993300 993333 993366 993399 9933CC 9933FF 996600 996633 996666 996699 9966CC 9966FF 999900 999933 999966 999999 9999CC 9999FF 99CC00 99CC33 99CC66 99CC99 99CCCC 99CCFF 99FF00 99FF33 99FF66 99FF99 99FFCC 99FFFF CC0000 CC0033 CC0066 CC0099 CC00CC CC00FF CC3300 CC3333 CC3366 CC3399 CC33CC CC33FF

63


CC6600 CC6633 CC6666 CC6699 CC66CC CC66FF CC9900 CC9933 CC9966 CC9999 CC99CC CC99FF CCCC00 CCCC33 CCCC66 CCCC99 CCCCCC CCCCFF CCFF00 CCFF33 CCFF66 CCFF99 CCFFCC CCFFFF FF0000 FF0033 FF0066 FF0099 FF00CC FF00FF FF3300 FF3333 FF3366 FF3399 FF33CC FF33FF FF6600 FF6633 FF6666 FF6699 FF66CC FF66FF FF9900 FF9933 FF9966 FF9999 FF99CC FF99FF FFCC00 FFCC33 FFCC66 FFCC99 FFCCCC FFCCFF FFFF00 FFFF33 FFFF66 FFFF99 FFFFCC FFFFFF

64


Sıralı Listeler
..
: Sıralı (Ordered) listeler, baĢına, tasarımcının isteğine bağlı olarak, rakam, harf yada özel bir karakter koyarak, yazılmıĢ listelerdir. Listenin baĢladığını ve bittiğini belirten bu iki etiketin arasına liste satırları (list item)

etiketleri arasında yazılır.  TYPE : Etiketi biçimlendirir. o ―1‖

rakamla;

o ―A‖ büyük harfle; o ―a‖ küçük harfle; o ―i‖ küçük Romen rakamları ile; o ―I‖ büyük Romen rakamları ile sıralanmayı sağlar  COMPACT: listenin mümkün olduğu kadar az satır aralığı ile verilmesine yarar  START : listenin harf veya rakamdan baĢlayacağını belirtir) Ģeklinde üç parametresi olabilir. ġimdi örneğin, milli takım listesini Yanlarındada sırt numaraları olsun.

hazırlayalım.

<meta http-equiv="Content-Type" content="text/html; charset=windows-1254"> Web Tasarım Rehberi - Renkler 65


Takım Kadrosu

RüĢtü

Serdar

Ümit

Önder

Emre

Yıldıray

Tümer

Tuncay

Hakan ġükür

Gökdeniz

Semih

TYPE parametresini ―1‖ değil, ―a‖ olarak değiĢtirirseniz sayfadaki liste, bu defa rakamla değil, küçük harflerle sıralanmıĢ olacaktır:

66


! Bu tag Türkçe harflerle uyumsuzdur. A,b,c,ç Ģeklinde devam etmez. A,b,c,d Ģeklinde listeler

Sırasız Listeler
..
: Sırasız (UnOrdered) listeler. Bu tip liste satırlarının baĢına ya içi dolu ya da içi boĢ bir yuvarlak, veya dört köĢe nokta konulur.  TYPE : Etiketi biçimlendirir o DISC, içi dolu daire o CIRCLE, içi boĢ daire; o SQUARE sağlar

dörtköĢe

nokta

ile

sıralanmayı

 COMPACT listenin mümkün olduğu kadar az satır aralığı ile verilmesine yarar. <meta http-equiv="Content-Type" content="text/html; charset=windows-1254"> Web Tasarım Rehberi - Renkler

Takım Kadrosu

RüĢtü
67


Serdar

Ümit

Önder

Emre

Yıldıray

Tümer

Tuncay

Hakan ġükür

Gökdeniz

Semih

Etiketi ile Çizgi OluĢturma Yatay Çizgi (horizontal rule) etiketi, bulunduğu yerde, belirtilen parametrelere göre yatay bir çizgi çizilmesini sağlar. Bu etiketin kapanıĢıĢ çifti yoktur. Pencere boyunca çizgiyi çizer ve iĢlevi biter. Parametreleri Ģunlardır; 

Width kullanılır.

: Çizginin geniĢliğini ayarlamak için



Size kullanılır.

:

Çizginin 68

kalınlığını

ayarlamak

için




Color kullanılır.

:

Çizginin

rengini

ayarlamak

için



Align:Bu parametre right,left ve center değerlerini alabilir. Çizginin sayfadaki yatay konumunun sola, sağa veya ortaya hizalanmasını sağlar.

Örnek:
Türk Milli Takımı Kadrosu


Resim ve Multimedya Dosyalarını Kullanmak Belgeye resim, video, ses dosyaları eklemek normal içerik eklemekle aynı değildir. Örneğin bir tablo içine istediğinizi yazıp; belgeyi açtığınızda bu yazıyı görebilirsiniz. O metin belge içeriğinin bir parçası durumundadır. Ama iĢ resim, ses ve video dosyalarına gelince bu aĢamada iĢ değiĢir ve HTML sayfasında dosyanın bulunduğu yeri belirtmeniz gerekir. Bu iĢlem için URL adreslerinden faydalanılır. Belge metinleri begenin içindeki yer alırken resim vs dosyaların kendileri değilde sadece URL adresleri HTML sayfasında yer alır. Web server böyle bir bağlantı gördüğü anda ilgili dosyayı kontrol eder ve bulursa talepte bulanan tarayıcıya iletir. Tarayıcılar, resim formatı olarak JPG, GIF, PNG türlerini desteklerler. 69


ÖRNEK SAYFA <META http-equiv="Content-Type" content="text/html;charset=windows-1254">

src="img/logo1.jpg"

Fenerbahe Spor Kulübü
2006-2007 ġampiyonu
IMG etiketinin çeĢitli parametreleri vardır. Bunlar 

ALT : Resim için alternatif metin belirtir. Eğer kullanıcı tarayıcısını resimleri göstermemeye ayarlamıĢsa, tarayıcı resim gösterme kapasitesine sahip değilse veya en önemlisi eğer resim verilen adreste yoksa bu metin ekranda görüntülenir.



WIDTH: Resmin ekranda görüntülenecek boyutunu belirtir. Belirtilmez ise orijinal boyutunda gösterilir. Farklı boyut verilirse resim fiziksel olarak etkilenmez sadece ekranda gösterilirken yeniden boyutlandırılır



HEIGHT: Resmin ekranda gösterilecek yüksekliğini belirtir. Belirtilmez ise orijinal boyutunda gösterilir. Farklı boyut verilirse resim fiziksel olarak 70


etkilenmez sadece ekranda gösterilirken yeniden boyutlandırılır 

BORDER: Resim için bir çerçeve çizilmesini sağlar.



ALIGN = Resmin hizalamasını belirtir. LEFT ile sola, RIGHt ile sağa, CENTER ile ortaya hizalanır.

img klasörü içindeki logo1.jpg dosyasını sola hizalı olarak görüntüle. Alternatif metin olarak gerekirse ―logo resmi‖ metnini kullan. Resimler aynı zamanda link verme iĢlemi için kullanılabilirler.Bu konu ilerleyen kısımlarda iĢlenmiĢtir. Marquee ile Resim Ve Metin Kaydırma Marque etiketi verilen parametrelere göre bir metnin yada resmin bir yerden bir yere verilen yönde ve hızda hareket ettirilmesi için kullanılır. Parametreleri;  Direction : Bu parametre right,up,down değerlerinden birisini alır ve buna göre içerğin hangi yöne kayacağı belirlenir. Up yukarı, right sağdan, down ise aĢağı doğru kaymayı gerçekleĢtirir.  Behavior : DavranıĢla ilgili bir parametredir. Alternate değeri verilirse yazılar kaybolmadan pencere içinde gider gelir. YaĢı yetenler Kara ĢimĢek filmindeki arabanın önünde sağa sola giden 71


ıĢığı hatırlayacaktır. vermektedir.

Bu

iĢlem

aynı

etkiyi

 Bgcolor belirler.

: Kayan yazıların arka plan rengini

 Height

: Yazının kayacağı alanın yüksekliği

 Width

: Yazının kayacağı alanın geniĢliği

 Loop : Yazının kaç kez kayacağı belirlenir. Daha sonra da yazı durur.  Scrolldelay : Kaydırma hızı, iki arasındaki süreyi ms cinsinden belirtir

hareket

 Srollamount: Kayan yazının bir defada kaç piksel hareket edeceğini belirtir. Marquee aslında Internet explorer‘a özgü bir etiket olup diğer tarayıcılar tarafından kerhen desteklenmektedir. KiĢisel tecrübelerime göre marquee etiketi çok dikkatli kullanılmalıdır. Mutlaka diğer tarayıcılar ilede denenmelidir. Özelikle alternate parametresi farklı tarayıcılarda farklı davranmaktadır. Bu bakımdan dikkatli olup tarayıcı uyumunu maksimumda tutulmasında fayda vardır. Marquee en çok haber baĢlıklarının dar bir alanda geçiĢ yapması için alandan tasarruf ve vurucu etki açısından kullanılır. Sayfaya bir nebze olsun hareket katar. Ancak ne olursa olsun sayfada 4-5 tane her biri ayrı yöne kayan marquee etiketi çok berbat bir dizayna sebep olur.
BEHAVIOR=tip BGCOLOR=renk HEIGHT=n HSPACE=n LOOP=n 72


SCROLLAMOUNT=n WIDTH=n>

SCROLLDELAY=n

VSPACE=n

Resimleri Kullanırken Dikkat Edilecekler; 1. ĠĢin durumuna göre PNG, GIF KPG kullanımına karar verilmelidir. GIF dosyaları sadece 256 renge kadar desteklerler. Ama daha keskin görünürler. JPG resimler isedaha az yer kaplarlar ancak kayıplı bir format olduğundan resimde hassasiyet kaybı olacaktır. PNG ise GIF formatının lisans sorunlarına çare olarak geliĢtirilmiĢ gir formattır. Ancak IE6 sürümü transparan PNG resimlerle sorunludur. 2. Büyük resimleri kullanmaktan gerekli olmadıkça kaçınmalıdır. Hiç kimse dakikalarca bir resmin yüklenmesini beklemez. Resim kendisi için çok önemli ise ayrı tabii. ĠĢte bu yüzden her zaman resimlerin boyutunun küçük, miktarının az utulması tavsiye edilir. 3. Eğer büyük resimler kullanmak zorunlu ise, bunların JPEG formatına çevrilip ve kalitesinin düĢürülmesi tavsiye edilir. JPEG resimler daha hızlı yüklenirler. 4. Siteye her girenin en son tarayıcı ve Windows kullandığı düĢünülmeden, herkes için kod yazılmalıdır.Resimlere her zaman ALT tagı kullanılarak alternatif metinler verilmelidir. Böylece resim özelliğini kapatanlar yada metin bazlı tarayıcı kullananlarda o ekranda resim olduğunu görebilsinler. 73


5. GIF ve PNG dosyaları kullanıken "Interlaced" haline getirilmeleri daha uygun olacaktır. Interlace tipli resimler kademe kademe yüklenir ve yavaĢ yavaĢ netleĢerek resmi daha hızlı yükleniyormuĢ gibi gösterir. Aksi tadirde resmin tamamı yüklenmeden görüntülenmeyecektir.

Video ve Ses Dosyalarının Kullanımı Eğer sayfa yüklendiğinde bir ses dosyasının çalınması istenirse etiketi kullanılabilir. Bu Ģekilde yüklene ses sürekli aynı olacak ve durdurulması istendiğinde bir iĢlem yapılamayacaktır. ĠĢte bu yüzden bu yöntem çok önerilmez. Ama dinamik bir dil yardımı ile ses dosyası rastgee değiĢecek Ģekilde bir iĢlem yapılırsa daha iyi bir etki bırakabilir. Video dosyası göstermek içinse

Birinci sütun baĢlığı (th)	Ġkinci sütun baĢlığı(th)	Üçüncü sütun baĢlığı(th)	Dördüncü sütun baĢlığı(th)
Satır 1 Sütun 1	Satır 1 Sütun 2	Satır 1 Sütun 3	Satır 1 Sütun 4
Satır 2 Sütun 1	Satır 2 Sütun 2	Satır 2 Sütun 3	Satır 2 Sütun 4
Satır 3 Sütun 1	Satır 3 Sütun 2	Satır 3 Sütun 3	Satır 3 Sütun 4
Satır 4 Sütun 1	Satır 4 Sütun 2	Satır 4 Sütun 3	Satır 4 Sütun 4

Lakap
Sifre
464 HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013 Tekrar
Ġsim
Soyisim
E-mail		465 HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013
Cinsiyet		> Erkek > Kız

HTML Css Php SQL Mysql Rehberi

Sayfama hoĢ geldiniz

Takım Kadrosu

Takım Kadrosu

Fenerbahe Spor Kulübü
2006-2007 ġampiyonu

HTML'de Tablo

Üye Kayıt Formu

CSS Kullanımı

Web Teknikleri

Web Teknikleri

Web Teknikleri

Web Teknikleri

Bölüm içinde bir baĢlık

Bu baĢlık kırmızı olacak

Rastgele bir baĢlık

HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013

print "Merhaba Dünya!"; ?>

$metin

$metin

$metin

Adınız: $adi

1.:

2.:

3.:

4.:

Bu site 5 para etmez. BoĢuna zaman harcamayın!

Kullanıcı Adı	462 HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013
ġifre

HTML Css Php SQL Mysql Rehberi

Recommend Documents

H2: baĢlık 2

H3: baĢlık 3

H4: baĢlık 4

H5: baĢlık 5

H6: baĢlık 6

Sayfama hoĢ geldiniz

Takım Kadrosu

Takım Kadrosu

Fenerbahe Spor Kulübü 2006-2007 ġampiyonu

HTML'de Tablo

Üye Kayıt Formu

CSS Kullanımı

Web Teknikleri

Web Teknikleri

Web Teknikleri

Web Teknikleri

Bölüm içinde bir baĢlık

Bu baĢlık kırmızı olacak

Rastgele bir baĢlık

HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013 print "Merhaba Dünya!"; ?>

$metin

$metin

$metin

Adınız: $adi

1.:

2.:

3.:

4.:

Bu site 5 para etmez. BoĢuna zaman harcamayın!

Fenerbahe Spor Kulübü
2006-2007 ġampiyonu

HTML-CSS–PHP–MYSQL ve SQL Derleme : Ġbrahim Halil Kutluay- 2007-2013

print "Merhaba Dünya!"; ?>