SlideShare une entreprise Scribd logo
1  sur  34
WEB TASARIMWEB TASARIM
TEMELLERİTEMELLERİ
Neden Web Siteniz OlmalıNeden Web Siteniz Olmalı
 Bir Web sayfası sadece onu incelemek isteyen “hedefBir Web sayfası sadece onu incelemek isteyen “hedef
kitleye” ulaşır.kitleye” ulaşır.
 Web sayfaları oluşturmak için tek masrafınız telefon hatWeb sayfaları oluşturmak için tek masrafınız telefon hat
ücreti olacaktır.ücreti olacaktır.
 Web sayfaları hazırlarken hayal gücünüzü olabilidiğinceWeb sayfaları hazırlarken hayal gücünüzü olabilidiğince
kullanabilirsiniz.kullanabilirsiniz.
 Web sayfaları kolayca düzeltilip tekrar yayınlanabilir.Web sayfaları kolayca düzeltilip tekrar yayınlanabilir.
 Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır.Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır.
 Web sayfalarınız 24 saat boyunca tüm dünyaya açık olacakWeb sayfalarınız 24 saat boyunca tüm dünyaya açık olacak
ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.
 Web sayfalarını kullanıcıların fikirlerini ve beklentileriniWeb sayfalarını kullanıcıların fikirlerini ve beklentilerini
öğrenmek için derleyebilirsiniz.öğrenmek için derleyebilirsiniz.
 Web sayfalarının kaderi diğer medyalar gibi çöp kutusundaWeb sayfalarının kaderi diğer medyalar gibi çöp kutusunda
sonlanmaz.sonlanmaz.
Bazı Web Düzenleyicileri(Editör)Bazı Web Düzenleyicileri(Editör)
Microsoft Frontpage 2000:Microsoft Frontpage 2000:
Microsoft firmasının, kendi ürünü olan Word’e benzerliğiyleMicrosoft firmasının, kendi ürünü olan Word’e benzerliğiyle
dikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolaydikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolay
gelen düzenleyicisidir.gelen düzenleyicisidir.
Artıları:Artıları: Frontpage en başta kullanması ve öğrenmesi kolay birFrontpage en başta kullanması ve öğrenmesi kolay bir
düzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyladüzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyla
tümleşmesi çok iyidir.Frontpage görsel arabilimi (tamtümleşmesi çok iyidir.Frontpage görsel arabilimi (tam
olmasada WYSIWYG denebilir) sayesinde hiçbir HTML koduolmasada WYSIWYG denebilir) sayesinde hiçbir HTML kodu
yazmadan Web siteleri oluşturabilmeyi sağlar.yazmadan Web siteleri oluşturabilmeyi sağlar.
Eksileri:Eksileri: Frontpage, önceden sizin düzenlemiş olabileceğinizFrontpage, önceden sizin düzenlemiş olabileceğiniz
kodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenlekodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenle
sayfa kodlarına elle müdahale etseniz bile, bir sonrakisayfa kodlarına elle müdahale etseniz bile, bir sonraki
açışınızda bu ince ayarların silinme olasılığı yüksektir.açışınızda bu ince ayarların silinme olasılığı yüksektir.
Allaire Homesite:Allaire Homesite:
Piyasadaki en iyi HTML kod düzenleyicisi.Piyasadaki en iyi HTML kod düzenleyicisi.
Artıları:Artıları: En gelişmiş özelleştirebilme seçenekleri.Bir kodEn gelişmiş özelleştirebilme seçenekleri.Bir kod
düzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlıdüzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlı
miktarda görsel tasarıma izin vermektedir.Bütünleşik FTPmiktarda görsel tasarıma izin vermektedir.Bütünleşik FTP
istemcisi, şablonlama desteği, siteleri projeler altındaistemcisi, şablonlama desteği, siteleri projeler altında
gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-
VBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatikVBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatik
tanıma, Dreamweaver’la bütünleşme, istenen şekilde kodutanıma, Dreamweaver’la bütünleşme, istenen şekilde kodu
girintileyebilme, çok iyi bir dokümantasyon, Homesite’lagirintileyebilme, çok iyi bir dokümantasyon, Homesite’la
tümleşik çalışan bir sürümüyle gelmesi.tümleşik çalışan bir sürümüyle gelmesi.
Eksileri:Eksileri: WYSIWYG düzenleyiler arayan kişiler için tamWYSIWYG düzenleyiler arayan kişiler için tam
anlamıyla uygun olmaması, Windows 9x’de bellek kaçırmasıanlamıyla uygun olmaması, Windows 9x’de bellek kaçırması
ve maalesef sadece Windows’ta çalışması.ve maalesef sadece Windows’ta çalışması.
Macromedia Dreamweaver:Macromedia Dreamweaver:
Homesite’ın HTML kodu alanındaki liderliğini, WYSIWYGHomesite’ın HTML kodu alanındaki liderliğini, WYSIWYG
düzenleyiciler alanında paylaşan programdüzenleyiciler alanında paylaşan program
Artıları:Artıları: Dreamweaver’ın ilk göze çarpan özelliği, görselDreamweaver’ın ilk göze çarpan özelliği, görsel
düzenleyiciler arasında en iyi tablolama desteğinidüzenleyiciler arasında en iyi tablolama desteğini
sunmasıdır.HTML koduna fazla müdahale etmemesi, bloklarınsunmasıdır.HTML koduna fazla müdahale etmemesi, blokların
kolayca seçilebilmesi, seçilen etiketlerin nerdeyse tümkolayca seçilebilmesi, seçilen etiketlerin nerdeyse tüm
özelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisiözelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisi
ve site yönetimi,çok iyi DHTML ve Frame desteği, Internetve site yönetimi,çok iyi DHTML ve Frame desteği, Internet
üzerinden de yüklenebilen etiketlerle genişletilebilmesi,üzerinden de yüklenebilen etiketlerle genişletilebilmesi,
tabloları katmanlara, katmanları tablolara çevirebilmesi, rehbertabloları katmanlara, katmanları tablolara çevirebilmesi, rehber
resim desteği, Homesite’la bütünleşme.resim desteği, Homesite’la bütünleşme.
Eksileri:Eksileri: Homesite kadar iyi bir doğrudan HTML kodu yazımıHomesite kadar iyi bir doğrudan HTML kodu yazımı
olmaması ve maalesef sadece Windows ve MacOs’daolmaması ve maalesef sadece Windows ve MacOs’da
çalışması.çalışması.
Netscape Composer:Netscape Composer:
Netscape Gold ve Communicator paketlerinin içinden çıkanNetscape Gold ve Communicator paketlerinin içinden çıkan
bir düzenleyicidir.Genel olarak, sayfalar WYSIWYG modundabir düzenleyicidir.Genel olarak, sayfalar WYSIWYG modunda
düzenlenir, ancak istenirse ekstra HTML kodu da sayfayadüzenlenir, ancak istenirse ekstra HTML kodu da sayfaya
eklenebilir.eklenebilir.
Artıları:Artıları: Sayfaları tek tuşa basarak bir Web sunucusunaSayfaları tek tuşa basarak bir Web sunucusuna
aktarabilirsiniz.Genel görünümü bir kelime işlemci programınaaktarabilirsiniz.Genel görünümü bir kelime işlemci programına
benzer.Yazım kontrolü desteği İngilizce bir sözlükle beraberbenzer.Yazım kontrolü desteği İngilizce bir sözlükle beraber
gelir, ancak kelimeleri öğrenme özelliği vardır.gelir, ancak kelimeleri öğrenme özelliği vardır.
Eksileri:Eksileri: Site yönetimi, dokümantasyon, özelleştirebilmeSite yönetimi, dokümantasyon, özelleştirebilme
seçenekleri yoktur.Ayrıca, tablo desteği gerçekten zayıf veseçenekleri yoktur.Ayrıca, tablo desteği gerçekten zayıf ve
kullanması da ayrıca zordur.HTML dışında hiçbir dosyakullanması da ayrıca zordur.HTML dışında hiçbir dosya
formatını da tanıyamaz.formatını da tanıyamaz.
HotDog Pro:HotDog Pro:
Birkaç yıl öncesine kadar görsel olmayan düzenleyicilerBirkaç yıl öncesine kadar görsel olmayan düzenleyiciler
piyasasında Homesite’la başabaş giden bu program, yenipiyasasında Homesite’la başabaş giden bu program, yeni
sürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesisürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesi
gibi nedenlerle popülerliğini yitirmiştir.gibi nedenlerle popülerliğini yitirmiştir.
Artıları:Artıları: Birçok özelleştirebilme seçeneği, tablo ve frame’lerinBirçok özelleştirebilme seçeneği, tablo ve frame’lerin
yaratılmasında kullanılabilen sihirbazlar,yaratılmasında kullanılabilen sihirbazlar,
tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi,tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi,
renkli kodlama.renkli kodlama.
Eksileri:Eksileri: Sık sık göçmesi, zayıf dokümantasyon ve çalışmayıSık sık göçmesi, zayıf dokümantasyon ve çalışmayı
engelleyici ses efektleri.engelleyici ses efektleri.
Web Sayfalarının TasarlanmasıWeb Sayfalarının Tasarlanması
Yukarıda incelemesini yaptığımız birçok web editörü sizeYukarıda incelemesini yaptığımız birçok web editörü size
HTML dilini bilmeden,HTML dilini bilmeden, HTMLHTML kodlarını kullanarak web sitesikodlarını kullanarak web sitesi
yapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız heryapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız her
adımı, otomatikmanadımı, otomatikman HTMLHTML koduna çeviriyor.koduna çeviriyor.
Peki o zaman nedenPeki o zaman neden HTMLHTML öğrenmelisiniz?öğrenmelisiniz?HTMLHTML
öğrenmelisiniz çünkü:öğrenmelisiniz çünkü:
 En basit neden; eğer iyi bir webmaster olmak istiyorsanız, veEn basit neden; eğer iyi bir webmaster olmak istiyorsanız, ve
HTMLHTML bilmeden sadece bu tür programları kullanmayıbilmeden sadece bu tür programları kullanmayı
düşünüyorsanız, muhtemelen programın verdiği, programdandüşünüyorsanız, muhtemelen programın verdiği, programdan
kaynaklanan en küçük bir hatada eliniz kolunuz bağlıkaynaklanan en küçük bir hatada eliniz kolunuz bağlı
kalacaktır.kalacaktır.
 Lisans gerektiren programlar. Birçok kaliteli "Lisans gerektiren programlar. Birçok kaliteli "HTMLHTML çevirici"çevirici"
programını kullanmak için, o programın lisansına sahipprogramını kullanmak için, o programın lisansına sahip
olmanız gerekir. Ve bu da genelde büyük paralar gerektirir.olmanız gerekir. Ve bu da genelde büyük paralar gerektirir.
HTML Nedir?HTML Nedir?
HTMLHTML, Hyper Text Mark-up Language'ın kısaltılmışıdır., Hyper Text Mark-up Language'ın kısaltılmışıdır.
Türkçe karşılığı Hiper Metin İşaretleme Dili'dir. BrowserlarTürkçe karşılığı Hiper Metin İşaretleme Dili'dir. Browserlar
tarafından tanınıp yorumlanabilen metin tabanlı bir dildir vetarafından tanınıp yorumlanabilen metin tabanlı bir dildir ve
metnin browser tarafından yorumlanması sonucu da webmetnin browser tarafından yorumlanması sonucu da web
sayfaları elde edilir.sayfaları elde edilir. Yazdığınız kodların browser tarafındanYazdığınız kodların browser tarafından
alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm"alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm"
veya ".html" olması gerekir.veya ".html" olması gerekir.
HTMLHTML de her işaretleme dilindeki gibi komutlardan oluşur,de her işaretleme dilindeki gibi komutlardan oluşur,
bu komutlarabu komutlara tagtag veyaveya mark-upmark-up denir. Tag'ler herhangi birdenir. Tag'ler herhangi bir
metinden farklı oldukları browser tarafından anlaşılabilsinmetinden farklı oldukları browser tarafından anlaşılabilsin
diye "<" ve ">" işaretlerinin arasına yazılır. Her tag'in birdiye "<" ve ">" işaretlerinin arasına yazılır. Her tag'in bir
başlangıcı ve bitişi vardır. Bitiş tag'lerinde, "<" işaretindenbaşlangıcı ve bitişi vardır. Bitiş tag'lerinde, "<" işaretinden
sonra tag'in bitiş tag'i olduğunu belirtmek için "/" işaretisonra tag'in bitiş tag'i olduğunu belirtmek için "/" işareti
kullanılır. Bir örnek ile göstermemiz gerekirse;kullanılır. Bir örnek ile göstermemiz gerekirse;
<P><P>Bu bir Paragraf tag'idir.Bu bir Paragraf tag'idir.</P></P>
Temel Komutlar:Temel Komutlar:
<HTML></HTML><HTML></HTML>
Tüm HTML dokümanını içine alan en temel tag'dir ve dokümanınTüm HTML dokümanını içine alan en temel tag'dir ve dokümanın
HTML ile yazıldığını browser'a bildirir.HTML ile yazıldığını browser'a bildirir.
<HEAD></HEAD><HEAD></HEAD>
Bu tag'in arasına yazılan her şey, sayfanın tanımını oluşturur.Bu tag'in arasına yazılan her şey, sayfanın tanımını oluşturur.
Buna sayfanın başlığı da dahildir. Ayrıca meta takıları da buBuna sayfanın başlığı da dahildir. Ayrıca meta takıları da bu
tag'in arasına yazılır:tag'in arasına yazılır:

<TITLE></TITLE> :<TITLE></TITLE> : Sayfa başlığıdır. Bu tag'in arasına yazılanSayfa başlığıdır. Bu tag'in arasına yazılan
her şey sayfamızın ismi olacak ve başlık çubuğundaher şey sayfamızın ismi olacak ve başlık çubuğunda
görüntülenecektir.görüntülenecektir.
 META Etiketi:META Etiketi: Arama motorlarında iyi bir sıralama kapmak içinArama motorlarında iyi bir sıralama kapmak için
meta etiketleri içerisine yazdığımız notlar çok önemlidir.meta etiketleri içerisine yazdığımız notlar çok önemlidir.
Örneğin bir sitesinin Meta etiketleri şöyle olabilir:Örneğin bir sitesinin Meta etiketleri şöyle olabilir:
<META name=“keywords” content=“Dokuz Eylül<META name=“keywords” content=“Dokuz Eylül
Üniversitesi,DEÜ,DEUU,Fakülteler,Yüksekokullar,Enstitüler,AkadeÜniversitesi,DEÜ,DEUU,Fakülteler,Yüksekokullar,Enstitüler,Akade
mik Takvim, Üniversite, dokuz eylul university, Turkey,mik Takvim, Üniversite, dokuz eylul university, Turkey,
University,education,campus,Türkiye, academics, students,University,education,campus,Türkiye, academics, students,
faculty>faculty>
Sayfanızda kullandığınız Türkçe karakterlerin başka bilgisayardaSayfanızda kullandığınız Türkçe karakterlerin başka bilgisayarda
bozuk şekillerde görülmemesi için:bozuk şekillerde görülmemesi için:
<meta http-equiv=“Content-Type” content=“text/html;<meta http-equiv=“Content-Type” content=“text/html;
charset=windoes-1254”>charset=windoes-1254”>
<BODY></BODY><BODY></BODY>
Sayfanın browser tarafından ekrana basılacak tüm kısımlarıSayfanın browser tarafından ekrana basılacak tüm kısımları
bu tag'in arasına yazılır. Ekrana basılacak kısmın içinebu tag'in arasına yazılır. Ekrana basılacak kısmın içine
metinler, resimler, formlar, tablolar vs. girer.metinler, resimler, formlar, tablolar vs. girer.
<html><html>
<head><head>
<title>İlk Sayfam</title><title>İlk Sayfam</title>
</head></head>
<body bgcolor="#e3e3e3"><body bgcolor="#e3e3e3">
<b>Web sayfama hoşgeldiniz</b><br><b>Web sayfama hoşgeldiniz</b><br>
<i>Web sayfama hoşgeldiniz</i><br><i>Web sayfama hoşgeldiniz</i><br>
<font face="Lucida Sans Unicode" size="+2" color="#297835">Web<font face="Lucida Sans Unicode" size="+2" color="#297835">Web
sayfama hoşgeldiniz</font><br>sayfama hoşgeldiniz</font><br>
<u>Web sayfama hoşgeldiniz</u><br><u>Web sayfama hoşgeldiniz</u><br>
<b><u><i>Web sayfama hoşgeldiniz</i></u></b><b><u><i>Web sayfama hoşgeldiniz</i></u></b>
<center><font face="Verdana" size="+2" color="#765678">Web sayfama<center><font face="Verdana" size="+2" color="#765678">Web sayfama
hoşgeldiniz</font></center><br>hoşgeldiniz</font></center><br>
</body></body>
</html></html>
Sonuç:Sonuç:
Web Grafiklerinin HazırlanmasıWeb Grafiklerinin Hazırlanması
 Zor olan işlem, sayfaların içine içeriğin yerleştirilmesi değil,Zor olan işlem, sayfaların içine içeriğin yerleştirilmesi değil,
bu içeriğin hazırlanmasıdır. Tahmin edebileceğiniz gibi,bu içeriğin hazırlanmasıdır. Tahmin edebileceğiniz gibi,
sayfalarda yer alan grafikler metinlerden daha da zorsayfalarda yer alan grafikler metinlerden daha da zor
hazırlanırlar. Çünkü sayfada yer alacak renkler ve grafikhazırlanırlar. Çünkü sayfada yer alacak renkler ve grafik
tasarımları sitenin genel çizgisini belirleyeceği için, özenle vetasarımları sitenin genel çizgisini belirleyeceği için, özenle ve
uyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ileuyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ile
hazırlanacak site grafiklerinde görselliğin yanında dikkathazırlanacak site grafiklerinde görselliğin yanında dikkat
edilecek bir başka unsur da grafik dosyalarının boyutlarınınedilecek bir başka unsur da grafik dosyalarının boyutlarının
küçük olmasıdır. Çünkü ne kadar fazla grafik kullanılırsa, siteküçük olmasıdır. Çünkü ne kadar fazla grafik kullanılırsa, site
o kadar yavaş açılacaktır ve bir site ne kadar görsel olursao kadar yavaş açılacaktır ve bir site ne kadar görsel olursa
olsun, eğer yavaş açılıyorsa pek de cazip olmayacaktır. Buolsun, eğer yavaş açılıyorsa pek de cazip olmayacaktır. Bu
tür çeşitli grafikleri tasarlamak için kullanabileceğiniz yeganetür çeşitli grafikleri tasarlamak için kullanabileceğiniz yegane
program Photoshop'dur. Ancak ücretli ve profesyonel birprogram Photoshop'dur. Ancak ücretli ve profesyonel bir
program olan Photoshop'un yerine buna çok yakın olanprogram olan Photoshop'un yerine buna çok yakın olan
tamamen bedava olarak dağıtılan Paint Shop Pro adlıtamamen bedava olarak dağıtılan Paint Shop Pro adlı
Shareware programı da kullanabilirsiniz. Bu ve buna benzerShareware programı da kullanabilirsiniz. Bu ve buna benzer
programlar ile rahatlıkla arka fonlar, Web tuşları, başlıklar veprogramlar ile rahatlıkla arka fonlar, Web tuşları, başlıklar ve
Banner'lar gibi sabit Web grafiklerini oluşturabilirsiniz.Banner'lar gibi sabit Web grafiklerini oluşturabilirsiniz.
Sayfaların Web Alanına GönderilmesiSayfaların Web Alanına Gönderilmesi
 Grafikleri tasarladınız ve metinleri hazırladınız. Bunları birGrafikleri tasarladınız ve metinleri hazırladınız. Bunları bir
Web tasarım programı ile Web sayfası haline getirdiktenWeb tasarım programı ile Web sayfası haline getirdikten
sonra hazırlamış olduğunuz Web sayfalarınısonra hazırlamış olduğunuz Web sayfalarını kullanıcılarakullanıcılara
ulaştırabilmeniz için bunları yerleştireceğiniz Internetulaştırabilmeniz için bunları yerleştireceğiniz Internet
üzerinde bir disk alanına yani Web alanına ihtiyacınızüzerinde bir disk alanına yani Web alanına ihtiyacınız
olacaktır. Bu işlem için en iyi çözüm yine Internet üzerindeolacaktır. Bu işlem için en iyi çözüm yine Internet üzerinde
size bedava sabitdisk alanı (host) sağlayan bir sunucu bulupsize bedava sabitdisk alanı (host) sağlayan bir sunucu bulup
sayfalarınızı oraya yerleştirmektir.Eğer alacağımız alanınsayfalarınızı oraya yerleştirmektir.Eğer alacağımız alanın
FTP desteği varsa, yaptığımız sayfaları CuteFTP gibi FTPFTP desteği varsa, yaptığımız sayfaları CuteFTP gibi FTP
programları ile sunucu üzerindeki alana gönderebilirsiniz.programları ile sunucu üzerindeki alana gönderebilirsiniz.
Ücretsiz Hosting Hizmeti VerenÜcretsiz Hosting Hizmeti Veren
Bazı Sitelerin İncelemeleriBazı Sitelerin İncelemeleri
 www.20m.comwww.20m.com
 Azbuz.comAzbuz.com
Sitenizin Barınacağı Sunucuyu SeçerkenSitenizin Barınacağı Sunucuyu Seçerken
Dikkat Etmeniz Gereken AyrıntılarDikkat Etmeniz Gereken Ayrıntılar
 Internet üzerinde yasal olmadığı kanıtlanmış MP3'ler,Internet üzerinde yasal olmadığı kanıtlanmış MP3'ler,
emülatör dosyaları, Crack, Hack, Warez, çalınmış şifreleremülatör dosyaları, Crack, Hack, Warez, çalınmış şifreler
ve benzeri içerikle Adult öğelere sitenizde yer vermektenve benzeri içerikle Adult öğelere sitenizde yer vermekten
kaçının.kaçının.
 Seçtiğiniz sunucunun teknik özelliklerini mutlaka dikkateSeçtiğiniz sunucunun teknik özelliklerini mutlaka dikkate
alın. Örneğin Frame yani çerçeveye izin vermeyen bazıalın. Örneğin Frame yani çerçeveye izin vermeyen bazı
sunucular, iki ya da daha fazla parçadan oluşmuş sitesunucular, iki ya da daha fazla parçadan oluşmuş site
tasarımınızı tam anlamıyla sunamayacaklardır.tasarımınızı tam anlamıyla sunamayacaklardır.
 Bunun yanında her sunucu çok serbest bir şekilde CGI,Bunun yanında her sunucu çok serbest bir şekilde CGI,
Perl gibi dillerin kullanılmasına izin vermeyebilir.Perl gibi dillerin kullanılmasına izin vermeyebilir.
 Unutulmaması gereken fazla disk alanı her zaman en iyiUnutulmaması gereken fazla disk alanı her zaman en iyi
şey değildir. Sınırsız bir alanda hiçbir özellikşey değildir. Sınırsız bir alanda hiçbir özellik
desteklenmeyeceği gibi, 3MB'lık bir alan sağlayandesteklenmeyeceği gibi, 3MB'lık bir alan sağlayan
sunucu, buna karşılık Frame'den CGI dilllerine kadar hersunucu, buna karşılık Frame'den CGI dilllerine kadar her
şeyi destekleyebilir.şeyi destekleyebilir.
Web Tasarımını DestekleyiciWeb Tasarımını Destekleyici
ProgramlarProgramlar
 PHPPHP
 ASPASP
 JAVA SCRIPTJAVA SCRIPT
 JAVA APPLETJAVA APPLET
 CSSCSS
 FLASHFLASH
PHP (Personal Home Page)PHP (Personal Home Page)
Html 'nin geliştirilmesinin çok eski zamanlara dayanmasındanHtml 'nin geliştirilmesinin çok eski zamanlara dayanmasından
mıdır? yoksa o zaman ki şartlarla düşünülmediği için midir?mıdır? yoksa o zaman ki şartlarla düşünülmediği için midir?
bilinmez ama html bazı yönden eksik bir dildir. İşte bubilinmez ama html bazı yönden eksik bir dildir. İşte bu
eksikliklerin anlaşıldığı dönemlerde, herkesin anlayabileceğieksikliklerin anlaşıldığı dönemlerde, herkesin anlayabileceği
ve kısa sürede öğrenilebileceği bir dil yaratma çabasındave kısa sürede öğrenilebileceği bir dil yaratma çabasında
olan Rasmus Lerdorf tarafından düşünülmüş ve Perl dilindenolan Rasmus Lerdorf tarafından düşünülmüş ve Perl dilinden
esinlenilerek yapılmaya başlanmış bir dildir Php.esinlenilerek yapılmaya başlanmış bir dildir Php.
Php 'nin yaptığını kısaca anlatmak gerekirse; Web sayfasıPhp 'nin yaptığını kısaca anlatmak gerekirse; Web sayfası
isteminde bulunan kullanıcılara, istenilen dosya içerisindeisteminde bulunan kullanıcılara, istenilen dosya içerisinde
Php ile ilgili satırları işleyerek dosya içeriğini kullanıcınınPhp ile ilgili satırları işleyerek dosya içeriğini kullanıcının
Browser ' ının anlıyabileceği html formatında sunan birBrowser ' ının anlıyabileceği html formatında sunan bir
programlama dilidir diyebiliriz. Bu genel anlamda Server-Sideprogramlama dilidir diyebiliriz. Bu genel anlamda Server-Side
( Server-Taraflı ) Dil olarak anılır.( Server-Taraflı ) Dil olarak anılır.
Php 'yi rakiplerinden ayıran özellikler?Php 'yi rakiplerinden ayıran özellikler?
 En yakın rakibi ASP ile performans ve fiyat açısından açıkEn yakın rakibi ASP ile performans ve fiyat açısından açık
farklılar vardır. Fiyat konusu haricinde ( Php ücretsizfarklılar vardır. Fiyat konusu haricinde ( Php ücretsiz
dağıtılmaktadır. ) ASP kullanıcılarının kabul etmedikleri şeydağıtılmaktadır. ) ASP kullanıcılarının kabul etmedikleri şey
hız faktörüdür. Belkide en çok tartışılan bu konu hakkında enhız faktörüdür. Belkide en çok tartışılan bu konu hakkında en
basit karşılaştırma; PHP + MySql ve ASP + MSSQLbasit karşılaştırma; PHP + MySql ve ASP + MSSQL
oranlarında çıkmaktadır. Elde edilen verilere göre 5000oranlarında çıkmaktadır. Elde edilen verilere göre 5000
satırlık bir bilgiyi database’ e; aynı makina üzerinde Php vesatırlık bir bilgiyi database’ e; aynı makina üzerinde Php ve
MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28
saniyede girmektedir.saniyede girmektedir.
 Php 'nin açık kaynak kodlu oluşu, hataların veya yeniPhp 'nin açık kaynak kodlu oluşu, hataların veya yeni
özelliklerin güncellenmesi/eklenmesi gibi olaylarda büyüközelliklerin güncellenmesi/eklenmesi gibi olaylarda büyük
avantajlar sağlamaktadır.avantajlar sağlamaktadır.
 Kişisel kullanıcılar; Php ile web sayfalarında daha çokKişisel kullanıcılar; Php ile web sayfalarında daha çok
kullanıcı etkileşimli kodlar kullanmaktadır. Örnek olarak;kullanıcı etkileşimli kodlar kullanmaktadır. Örnek olarak;
Ziyaretçiler için oluşturulan, forum, sayaç, anket gibiZiyaretçiler için oluşturulan, forum, sayaç, anket gibi
kodlarda Php çok rağbet görmektedir.kodlarda Php çok rağbet görmektedir.
Peki bu dilin dezavantajları nelerdir?Peki bu dilin dezavantajları nelerdir?
Günümüzde büyük şirketlerde internet ve intranetGünümüzde büyük şirketlerde internet ve intranet
uygulamalarda , büyük paya sahip Microsoft firması, kendiuygulamalarda , büyük paya sahip Microsoft firması, kendi
ürünü olan ASP için büyük çabalar sarfetmektedir. Yeniürünü olan ASP için büyük çabalar sarfetmektedir. Yeni
teknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminlerteknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminler
hazırlamakta ve iş istihdamı konusunda ASP yi bir adım önehazırlamakta ve iş istihdamı konusunda ASP yi bir adım öne
taşımaktadır. Sunucu fiyatları olarak Php 'ye göre yerine göretaşımaktadır. Sunucu fiyatları olarak Php 'ye göre yerine göre
üç kat daha fazla oranda olmasına rağmen, büyük şirketlerüç kat daha fazla oranda olmasına rağmen, büyük şirketler
tarafından tercih edilmektedir.tarafından tercih edilmektedir.
ASP (Active Server Pages)ASP (Active Server Pages)
Sunucu taraflı bir teknoloji olan ASP, (Active ServerSunucu taraflı bir teknoloji olan ASP, (Active Server
Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına etkileşimli,Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına etkileşimli,
dinamik Web sayfaları göndermek için kullanılır. ASP, Webdinamik Web sayfaları göndermek için kullanılır. ASP, Web
programcılarına HTML, scripting ve kullanıcıdan bağımsızprogramcılarına HTML, scripting ve kullanıcıdan bağımsız
veritabanı uygulamalarını özgürce kullanma fırsatı verir. ASPveritabanı uygulamalarını özgürce kullanma fırsatı verir. ASP
programlama ortamının özgür olmasının sebebi tüm derlemeprogramlama ortamının özgür olmasının sebebi tüm derleme
işleminin sunucu tarafında bitmesi ve kullanıcının sadeceişleminin sunucu tarafında bitmesi ve kullanıcının sadece
sonuçta oluşan HTML sayfalarını görmesidir.sonuçta oluşan HTML sayfalarını görmesidir.
ASP’nin Kullanım Amaçları ve AvantajlarıASP’nin Kullanım Amaçları ve Avantajları
 Çok geniş bir kullanım alanı olan ASP, scripting diye tabirÇok geniş bir kullanım alanı olan ASP, scripting diye tabir
edilen VBScript, JavaScript gibi her türlü ham koduedilen VBScript, JavaScript gibi her türlü ham kodu
kullanabilir, sunduğu kolay anlaşılır doğal dili ile orta derecekullanabilir, sunduğu kolay anlaşılır doğal dili ile orta derece
HTML bilen kimseler tarafından bile kolayca kavranabilir.HTML bilen kimseler tarafından bile kolayca kavranabilir.
 ASP'nin Netscape Navigator / Internet Explorer /Opera gibiASP'nin Netscape Navigator / Internet Explorer /Opera gibi
Web tarayıcılarından bağımsız olmasının yanısıra en büyükWeb tarayıcılarından bağımsız olmasının yanısıra en büyük
avantajlarından biri kullandığınız teknolojilerin, scriptlerinavantajlarından biri kullandığınız teknolojilerin, scriptlerin
saklı kalmasıdır.saklı kalmasıdır.
 ASP ile hazırlanan projeler kaynakların yönetimi, kontrolüASP ile hazırlanan projeler kaynakların yönetimi, kontrolü
ve uzaktan sistem yönetimine imkan verir. Şirketler arasıve uzaktan sistem yönetimine imkan verir. Şirketler arası
bilgi paylaşımı için ideal bir ortam oluşturur.bilgi paylaşımı için ideal bir ortam oluşturur.
JAVA SCRIPTJAVA SCRIPT
Java ScriptJava Script NetscapeNetscape tarafından geliştirilmiş bir script dilidir.tarafından geliştirilmiş bir script dilidir.
Düz yazı formundadır. Browserlara bağlıdır ve yorumlanır.Düz yazı formundadır. Browserlara bağlıdır ve yorumlanır.
HTML'nin içine katılır. Etiketi <script>...</script> şeklindedir.HTML'nin içine katılır. Etiketi <script>...</script> şeklindedir.
Java Script; etkileşimli web sayfası yapımında HTML'ninJava Script; etkileşimli web sayfası yapımında HTML'nin
yetersiz kalması nedeniyle C/C++ dilleri baz alınarakyetersiz kalması nedeniyle C/C++ dilleri baz alınarak
geliştirilen, "düz yazı" formunda bir script (komutlar dizisi)geliştirilen, "düz yazı" formunda bir script (komutlar dizisi)
dilidir. Java Script kodları herhangi bir metin editörü (Windilidir. Java Script kodları herhangi bir metin editörü (Win
95/98 Not defteri vb.) ile düz yazı formunda yazılabilir. Bu95/98 Not defteri vb.) ile düz yazı formunda yazılabilir. Bu
şekilde yazılmış Java Script kodları istemci tarafında, yanişekilde yazılmış Java Script kodları istemci tarafında, yani
ziyaretçinin web tarayıcısı tarafından yorumlanır veziyaretçinin web tarayıcısı tarafından yorumlanır ve
yaptırılmak istenen işlemler gerçekleşir. Ama bu işlemlerinyaptırılmak istenen işlemler gerçekleşir. Ama bu işlemlerin
gerçekleşmesi için mutlaka bir olay gereklidir. (Örneğin,gerçekleşmesi için mutlaka bir olay gereklidir. (Örneğin,
sayfanın açılması-kapanması, ziyaretçinin sayfada herhangisayfanın açılması-kapanması, ziyaretçinin sayfada herhangi
bir yeri tıklaması veya klavyede herhangi bir tuşa basmasıbir yeri tıklaması veya klavyede herhangi bir tuşa basması
gibi...)gibi...)
Java Script kodlarını web sayfası içerisinde 2 şekildeJava Script kodlarını web sayfası içerisinde 2 şekilde
tanımlayabiliriz;tanımlayabiliriz;
1.1. HTML kodları içerisindeHTML kodları içerisinde <SCRIPT>....</SCRIPT><SCRIPT>....</SCRIPT>
etiketleri arasında yazarak,etiketleri arasında yazarak,
<script><script>
<!--<!--
JavaScript kodlarıJavaScript kodları
-->-->
</script></script>
2.2. Düz yazı formunda veDüz yazı formunda ve .js.js uzantısı ile farklı bir dosyauzantısı ile farklı bir dosya
oluşturup, bu dosyaya HTML içerisinde link vererek.oluşturup, bu dosyaya HTML içerisinde link vererek.
<SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT><SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT>
JAVA APPLETJAVA APPLET
Java (yani Java Applet),Java (yani Java Applet), Sun MicrosystemsSun Microsystems tarafındantarafından
geliştirilmiş nesneye yönelik programlama dilidir ve işletimgeliştirilmiş nesneye yönelik programlama dilidir ve işletim
sistemlerinden bağımsız olarak çalışır. HTML'nin bir parçasısistemlerinden bağımsız olarak çalışır. HTML'nin bir parçası
olamaz. Etiketi <applet>...</applet> şeklindedir.olamaz. Etiketi <applet>...</applet> şeklindedir.
Java Applet hazırlayabilmeniz için Sun firmasının ücretsizJava Applet hazırlayabilmeniz için Sun firmasının ücretsiz
olarak dağıttığı JDK (Java Development Kit – Java Geliştirmeolarak dağıttığı JDK (Java Development Kit – Java Geliştirme
Ortamı) programını download etmeniz gerekmektedir.Ortamı) programını download etmeniz gerekmektedir.
<APPLET code=hotbutton.class height=20 width=122><APPLET code=hotbutton.class height=20 width=122>
<PARAM NAME="clıp" VALUE=""><PARAM NAME="clıp" VALUE="">
<PARAM NAME="actıveshadow" VALUE="fff9e3"><PARAM NAME="actıveshadow" VALUE="fff9e3">
<PARAM NAME="shadowcolor" VALUE="ffedaf"><PARAM NAME="shadowcolor" VALUE="ffedaf">
<PARAM NAME="alıgn" VALUE="icon"><PARAM NAME="alıgn" VALUE="icon">
</APPLET></APPLET>
CSSCSS
CSS (Cascading Style Sheets), BirCSS (Cascading Style Sheets), Bir HTMLHTML dökümanındakidökümanındaki
HTML takılarının sitillerini belirleyen tekniktir.HTML takılarının sitillerini belirleyen tekniktir.
CSS kodlarını web sayfası içerisinde 3 şekildeCSS kodlarını web sayfası içerisinde 3 şekilde
tanımlayabiliriz;tanımlayabiliriz;
 HTML takılarının sitillerini, takıların içinde(Local)HTML takılarının sitillerini, takıların içinde(Local)
<h1 style= font-family:Verdana,Arial> CSS öğreniyorum </h1><h1 style= font-family:Verdana,Arial> CSS öğreniyorum </h1>
 Sayfanın başında "" takıları arasında (Global)Sayfanın başında "" takıları arasında (Global)
<style><style>
h1.buyukyazilar {font-family:verdana; color:yellow}h1.buyukyazilar {font-family:verdana; color:yellow}
h1.digerleri {font-family:arial; color:black}h1.digerleri {font-family:arial; color:black}
h2 {font-family:verdana; color:pink}h2 {font-family:verdana; color:pink}
</style></style>
 Link olarak başka bir dosyadan alarakLink olarak başka bir dosyadan alarak
<link rel="stylesheet" type="text/css" href="sitillerim.css"><link rel="stylesheet" type="text/css" href="sitillerim.css">
CSS Öğrenmenin avantajları:CSS Öğrenmenin avantajları:
CSS, HTML takılarına, HTML ile yapılamayacak fakat işiniziCSS, HTML takılarına, HTML ile yapılamayacak fakat işinizi
kolaylaştıracak bir çok özellik katabilir. Örneğin; hemenkolaylaştıracak bir çok özellik katabilir. Örneğin; hemen
hemen tüm web sayfalarında gördüğünüz değişik link sitilleri,hemen tüm web sayfalarında gördüğünüz değişik link sitilleri,
CSS kullanılarak yapılmıştır. CSS ile sayfalarınızı daha hızlıCSS kullanılarak yapılmıştır. CSS ile sayfalarınızı daha hızlı
hale getirebilir ve dosyanın yükünü hafifletebilirsiniz.hale getirebilir ve dosyanın yükünü hafifletebilirsiniz.
Sayfalarınız için hazırlayacağınız bir CSS dosyasınıSayfalarınız için hazırlayacağınız bir CSS dosyasını
kullanarak tüm sayfalarınıza aynı özellikleri verebilir,kullanarak tüm sayfalarınıza aynı özellikleri verebilir,
dolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'indolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'in
yapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindekiyapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindeki
kolaylığın aksine kapasitesi büyük bir dildir.kolaylığın aksine kapasitesi büyük bir dildir.
Örnek KullanımÖrnek Kullanım::
<html><html>
<head><head>
<title>REHBERİM ONLINE</title><title>REHBERİM ONLINE</title>
<style><style>
h1.secici1 { font-family: ARIAL; font-size: 12pt; color:orange}h1.secici1 { font-family: ARIAL; font-size: 12pt; color:orange}
h1.secici2 { font-family: ARIAL; font-size: 8pt; color:red }h1.secici2 { font-family: ARIAL; font-size: 8pt; color:red }
#ID1 { font-family: Verdana; font-size: 10pt; color:blue }#ID1 { font-family: Verdana; font-size: 10pt; color:blue }
#ID2 { font-family: Verdana; font-size: 8pt; color:black}#ID2 { font-family: Verdana; font-size: 8pt; color:black}
</style></style>
</head></head>
<body><body>
<h1 class="secici1"> CSS Rehberi </h1> <h1 class="secici1"> CSS Rehberi </h1> 
<h1 class="secici2"> CSS Rehberi </h1><h1 class="secici2"> CSS Rehberi </h1>
<span id="ID1"> CSS Rehberi </span><br><span id="ID1"> CSS Rehberi </span><br>
<span id="ID2"> CSS Rehberi </span><span id="ID2"> CSS Rehberi </span>
</body></body>
</html></html>
CSS RehberiCSS Rehberi
CSS RehberiCSS Rehberi   
CSS RehberiCSS Rehberi
CSS RehberiCSS Rehberi
FlashFlash
Flash, Macromedia tarafından geliştirilmiş Internet'te etkileşimliFlash, Macromedia tarafından geliştirilmiş Internet'te etkileşimli
vektörel grafik ve animasyon hazırlanmasında kullanılan birvektörel grafik ve animasyon hazırlanmasında kullanılan bir
standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir,standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir,
çok az yer kaplayan gezinilebilir yüzeyler, teknikçok az yer kaplayan gezinilebilir yüzeyler, teknik
canlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcıcanlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcı
efektleri yapmak amacıyla kullanırlar.efektleri yapmak amacıyla kullanırlar.
Kullanım Alanları:Kullanım Alanları:
 Flash ile en küçük reklam pankartından (banner), enFlash ile en küçük reklam pankartından (banner), en
karmaşık animasyonun yapılması, hatta bütün bir webkarmaşık animasyonun yapılması, hatta bütün bir web
sitesinin oluşturulması mümkündür. Interaktif CD'lerinsitesinin oluşturulması mümkündür. Interaktif CD'lerin
hazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XMLhazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XML
gibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetlerigibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetleri
arasında sayılabilir.arasında sayılabilir.
 Flash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani birFlash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani bir
dosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Budosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Bu
bize etkileşim daha üst seviyelere çekebilme şansını verir.bize etkileşim daha üst seviyelere çekebilme şansını verir.
        
 Flash içerisinde bulunan bütün görüntü, ses, text elemanlarıFlash içerisinde bulunan bütün görüntü, ses, text elemanları
flash'a özgü bazı sıkıştırma teknikleri sayesinde çok küçükflash'a özgü bazı sıkıştırma teknikleri sayesinde çok küçük
boyutlara sıkıştırılabilir. Bu sıkıştırma oranları programboyutlara sıkıştırılabilir. Bu sıkıştırma oranları program
içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir.içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir.
Böylece örneğin 1 birim tutan bir ses/görüntü dosyası 0.1 ileBöylece örneğin 1 birim tutan bir ses/görüntü dosyası 0.1 ile
0.9 arasında boyutlarda son kullanıcıya ulaştırılabilir.0.9 arasında boyutlarda son kullanıcıya ulaştırılabilir.
         Macromedia Flash programı, macromedia'nınMacromedia Flash programı, macromedia'nın
http://www.macromedia.comhttp://www.macromedia.com adresinden deneme amaçlıadresinden deneme amaçlı
olarak indirilebilir. Bunun dışında tam kullanım için belirli birolarak indirilebilir. Bunun dışında tam kullanım için belirli bir
ücret karşılığında macromedia'dan yada temsilciliklerindenücret karşılığında macromedia'dan yada temsilciliklerinden
temin edilebilir.temin edilebilir.
Püf NoktalarPüf Noktalar
 Tasarımın en önemli unsurlarından biri tablolardır.Tasarımın en önemli unsurlarından biri tablolardır.
Tabloları amacınıza uygun şekilde sayfayaTabloları amacınıza uygun şekilde sayfaya
yerleştirdiğinizde sayfanız, görsel açıdan daha üstün biryerleştirdiğinizde sayfanız, görsel açıdan daha üstün bir
tasarıma sahip olacaktır. Çünkü hizalama, uygun yeretasarıma sahip olacaktır. Çünkü hizalama, uygun yere
uygun resmi yerleştirme gibi şeyler kod yazarak çokuygun resmi yerleştirme gibi şeyler kod yazarak çok
uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz.uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz.
 Dikkat edilmesi gereken en önemli şeylerden biri deDikkat edilmesi gereken en önemli şeylerden biri de
resim kullanımı. Sayfalarınızda mümkün olduğunca azresim kullanımı. Sayfalarınızda mümkün olduğunca az
resim kullanın. Şayet resim kullanırsanız, boyutlarıresim kullanın. Şayet resim kullanırsanız, boyutları
minimum, kaliteyi optimum düzeyde tutmaya özenminimum, kaliteyi optimum düzeyde tutmaya özen
gösterin. Çünkü Türkiye de internetin hızı malum. Teorikgösterin. Çünkü Türkiye de internetin hızı malum. Teorik
hızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızınhızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızın
açılmasını dakikalarca bekleyemeyebiliyor. Sayfaların daaçılmasını dakikalarca bekleyemeyebiliyor. Sayfaların da
daha çabuk açılması için akla gelen ilk şey de resimlerdaha çabuk açılması için akla gelen ilk şey de resimler
oluyor. Eğer ki resimden başka Java Applet vs. varsaoluyor. Eğer ki resimden başka Java Applet vs. varsa
önceliği bunlara verin.önceliği bunlara verin.
 İnternet üzerinde en çok kullanılan browser'lar IE veİnternet üzerinde en çok kullanılan browser'lar IE ve
Netscape Navigator'dır. Büyük çoğunlukla da IENetscape Navigator'dır. Büyük çoğunlukla da IE
kullanılır. Sitenizin yapım aşamasında farklıkullanılır. Sitenizin yapım aşamasında farklı
browserlarda sitenizin nasıl göründüğünü test etmenizbrowserlarda sitenizin nasıl göründüğünü test etmeniz
gerekebilmektedir. Çünkü bazı tag'ler farklı browserlardagerekebilmektedir. Çünkü bazı tag'ler farklı browserlarda
aynı etkiyi yaratamayabilmektedir. Bunun da çabuk farkaynı etkiyi yaratamayabilmektedir. Bunun da çabuk fark
edilmesi, sizi emek, zaman ve kaynak kaybındanedilmesi, sizi emek, zaman ve kaynak kaybından
kurtarabilir.kurtarabilir.
 Sayfalarınızı, farklı ekran çözünürlüklerinde test edin.Sayfalarınızı, farklı ekran çözünürlüklerinde test edin.
Optimum çözünürlükte karar kıldığınızda sayfaları buOptimum çözünürlükte karar kıldığınızda sayfaları bu
ekran çözünürlüğünde tasarlayın. Bunu yapmanızdakiekran çözünürlüğünde tasarlayın. Bunu yapmanızdaki
sebep şudur: Her kullanıcı sizinle aynı ekransebep şudur: Her kullanıcı sizinle aynı ekran
çözünürlüğünü kullanmayabilir. Sizin 800*600çözünürlüğünü kullanmayabilir. Sizin 800*600
çözünürlükte yaptığınız site, browser'ınızda gayet güzelçözünürlükte yaptığınız site, browser'ınızda gayet güzel
görünebilirken, 640*480 kullanan ziyaretçiningörünebilirken, 640*480 kullanan ziyaretçinin
bilgisayarında dağınık ve biçimsiz görünebilir.bilgisayarında dağınık ve biçimsiz görünebilir.

Contenu connexe

Similaire à Web Tasarım Teknikleri

Web 2.0 teknolojileri
Web 2.0 teknolojileriWeb 2.0 teknolojileri
Web 2.0 teknolojileriMeriç Olgun
 
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar Yaratın
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar YaratınYazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar Yaratın
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar YaratınYusuf Ozbay
 
Web tasarimda-temel-i̇lkeler
Web tasarimda-temel-i̇lkelerWeb tasarimda-temel-i̇lkeler
Web tasarimda-temel-i̇lkelertuckerboi
 
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye Giriş
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye GirişPhoneGap/Cordova ile Mobil Uygulama Geliştirmeye Giriş
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye GirişEgemen Mede
 
Web tasarim-teknikeri
Web tasarim-teknikeriWeb tasarim-teknikeri
Web tasarim-teknikerisersld82
 
Wordpress
WordpressWordpress
Wordpressankr06
 
Wordpress
WordpressWordpress
Wordpressankra06
 
Wordpress
WordpressWordpress
Wordpressankr06
 
Çok Kapsamlı SEO Rehberi - Dijitalzade
Çok Kapsamlı SEO Rehberi - DijitalzadeÇok Kapsamlı SEO Rehberi - Dijitalzade
Çok Kapsamlı SEO Rehberi - DijitalzadeOskayGnaar
 
sunu (Frontpage-1)
sunu (Frontpage-1)sunu (Frontpage-1)
sunu (Frontpage-1)Merve Aydın
 
Dijital Akademi SEO Eğitimi
Dijital Akademi SEO EğitimiDijital Akademi SEO Eğitimi
Dijital Akademi SEO EğitimiAykut Aslantaş
 
Dijital Çözümler
Dijital ÇözümlerDijital Çözümler
Dijital ÇözümlerPiasoft
 
Joomla kursu-atasehir
Joomla kursu-atasehirJoomla kursu-atasehir
Joomla kursu-atasehirsersld62
 

Similaire à Web Tasarım Teknikleri (20)

PHP Sunusu - 2
PHP Sunusu - 2PHP Sunusu - 2
PHP Sunusu - 2
 
Web 2.0 teknolojileri
Web 2.0 teknolojileriWeb 2.0 teknolojileri
Web 2.0 teknolojileri
 
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar Yaratın
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar YaratınYazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar Yaratın
Yazılım Yetekenleri İle Teknik SEO Dünyasında Harikalar Yaratın
 
Ürünümüz Hakkında
Ürünümüz Hakkında Ürünümüz Hakkında
Ürünümüz Hakkında
 
Turkuvazsoft
TurkuvazsoftTurkuvazsoft
Turkuvazsoft
 
Web tasarimda-temel-i̇lkeler
Web tasarimda-temel-i̇lkelerWeb tasarimda-temel-i̇lkeler
Web tasarimda-temel-i̇lkeler
 
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye Giriş
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye GirişPhoneGap/Cordova ile Mobil Uygulama Geliştirmeye Giriş
PhoneGap/Cordova ile Mobil Uygulama Geliştirmeye Giriş
 
sunu (Html-1)
sunu (Html-1)sunu (Html-1)
sunu (Html-1)
 
Web tasarim-teknikeri
Web tasarim-teknikeriWeb tasarim-teknikeri
Web tasarim-teknikeri
 
Wordpress
WordpressWordpress
Wordpress
 
Wordpress
WordpressWordpress
Wordpress
 
Wordpress
WordpressWordpress
Wordpress
 
Wordpress
WordpressWordpress
Wordpress
 
Web Tasarım Hakkında En Çok Sorulan Sorular
Web Tasarım Hakkında En Çok Sorulan SorularWeb Tasarım Hakkında En Çok Sorulan Sorular
Web Tasarım Hakkında En Çok Sorulan Sorular
 
Çok Kapsamlı SEO Rehberi - Dijitalzade
Çok Kapsamlı SEO Rehberi - DijitalzadeÇok Kapsamlı SEO Rehberi - Dijitalzade
Çok Kapsamlı SEO Rehberi - Dijitalzade
 
sunu (Frontpage-1)
sunu (Frontpage-1)sunu (Frontpage-1)
sunu (Frontpage-1)
 
Dijital Akademi SEO Eğitimi
Dijital Akademi SEO EğitimiDijital Akademi SEO Eğitimi
Dijital Akademi SEO Eğitimi
 
Wordpress nedir
Wordpress nedirWordpress nedir
Wordpress nedir
 
Dijital Çözümler
Dijital ÇözümlerDijital Çözümler
Dijital Çözümler
 
Joomla kursu-atasehir
Joomla kursu-atasehirJoomla kursu-atasehir
Joomla kursu-atasehir
 

Web Tasarım Teknikleri

  • 2. Neden Web Siteniz OlmalıNeden Web Siteniz Olmalı  Bir Web sayfası sadece onu incelemek isteyen “hedefBir Web sayfası sadece onu incelemek isteyen “hedef kitleye” ulaşır.kitleye” ulaşır.  Web sayfaları oluşturmak için tek masrafınız telefon hatWeb sayfaları oluşturmak için tek masrafınız telefon hat ücreti olacaktır.ücreti olacaktır.  Web sayfaları hazırlarken hayal gücünüzü olabilidiğinceWeb sayfaları hazırlarken hayal gücünüzü olabilidiğince kullanabilirsiniz.kullanabilirsiniz.  Web sayfaları kolayca düzeltilip tekrar yayınlanabilir.Web sayfaları kolayca düzeltilip tekrar yayınlanabilir.  Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır.Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır.  Web sayfalarınız 24 saat boyunca tüm dünyaya açık olacakWeb sayfalarınız 24 saat boyunca tüm dünyaya açık olacak ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.  Web sayfalarını kullanıcıların fikirlerini ve beklentileriniWeb sayfalarını kullanıcıların fikirlerini ve beklentilerini öğrenmek için derleyebilirsiniz.öğrenmek için derleyebilirsiniz.  Web sayfalarının kaderi diğer medyalar gibi çöp kutusundaWeb sayfalarının kaderi diğer medyalar gibi çöp kutusunda sonlanmaz.sonlanmaz.
  • 3. Bazı Web Düzenleyicileri(Editör)Bazı Web Düzenleyicileri(Editör) Microsoft Frontpage 2000:Microsoft Frontpage 2000: Microsoft firmasının, kendi ürünü olan Word’e benzerliğiyleMicrosoft firmasının, kendi ürünü olan Word’e benzerliğiyle dikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolaydikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolay gelen düzenleyicisidir.gelen düzenleyicisidir. Artıları:Artıları: Frontpage en başta kullanması ve öğrenmesi kolay birFrontpage en başta kullanması ve öğrenmesi kolay bir düzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyladüzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyla tümleşmesi çok iyidir.Frontpage görsel arabilimi (tamtümleşmesi çok iyidir.Frontpage görsel arabilimi (tam olmasada WYSIWYG denebilir) sayesinde hiçbir HTML koduolmasada WYSIWYG denebilir) sayesinde hiçbir HTML kodu yazmadan Web siteleri oluşturabilmeyi sağlar.yazmadan Web siteleri oluşturabilmeyi sağlar. Eksileri:Eksileri: Frontpage, önceden sizin düzenlemiş olabileceğinizFrontpage, önceden sizin düzenlemiş olabileceğiniz kodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenlekodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenle sayfa kodlarına elle müdahale etseniz bile, bir sonrakisayfa kodlarına elle müdahale etseniz bile, bir sonraki açışınızda bu ince ayarların silinme olasılığı yüksektir.açışınızda bu ince ayarların silinme olasılığı yüksektir.
  • 4. Allaire Homesite:Allaire Homesite: Piyasadaki en iyi HTML kod düzenleyicisi.Piyasadaki en iyi HTML kod düzenleyicisi. Artıları:Artıları: En gelişmiş özelleştirebilme seçenekleri.Bir kodEn gelişmiş özelleştirebilme seçenekleri.Bir kod düzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlıdüzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlı miktarda görsel tasarıma izin vermektedir.Bütünleşik FTPmiktarda görsel tasarıma izin vermektedir.Bütünleşik FTP istemcisi, şablonlama desteği, siteleri projeler altındaistemcisi, şablonlama desteği, siteleri projeler altında gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP- VBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatikVBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatik tanıma, Dreamweaver’la bütünleşme, istenen şekilde kodutanıma, Dreamweaver’la bütünleşme, istenen şekilde kodu girintileyebilme, çok iyi bir dokümantasyon, Homesite’lagirintileyebilme, çok iyi bir dokümantasyon, Homesite’la tümleşik çalışan bir sürümüyle gelmesi.tümleşik çalışan bir sürümüyle gelmesi. Eksileri:Eksileri: WYSIWYG düzenleyiler arayan kişiler için tamWYSIWYG düzenleyiler arayan kişiler için tam anlamıyla uygun olmaması, Windows 9x’de bellek kaçırmasıanlamıyla uygun olmaması, Windows 9x’de bellek kaçırması ve maalesef sadece Windows’ta çalışması.ve maalesef sadece Windows’ta çalışması.
  • 5. Macromedia Dreamweaver:Macromedia Dreamweaver: Homesite’ın HTML kodu alanındaki liderliğini, WYSIWYGHomesite’ın HTML kodu alanındaki liderliğini, WYSIWYG düzenleyiciler alanında paylaşan programdüzenleyiciler alanında paylaşan program Artıları:Artıları: Dreamweaver’ın ilk göze çarpan özelliği, görselDreamweaver’ın ilk göze çarpan özelliği, görsel düzenleyiciler arasında en iyi tablolama desteğinidüzenleyiciler arasında en iyi tablolama desteğini sunmasıdır.HTML koduna fazla müdahale etmemesi, bloklarınsunmasıdır.HTML koduna fazla müdahale etmemesi, blokların kolayca seçilebilmesi, seçilen etiketlerin nerdeyse tümkolayca seçilebilmesi, seçilen etiketlerin nerdeyse tüm özelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisiözelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisi ve site yönetimi,çok iyi DHTML ve Frame desteği, Internetve site yönetimi,çok iyi DHTML ve Frame desteği, Internet üzerinden de yüklenebilen etiketlerle genişletilebilmesi,üzerinden de yüklenebilen etiketlerle genişletilebilmesi, tabloları katmanlara, katmanları tablolara çevirebilmesi, rehbertabloları katmanlara, katmanları tablolara çevirebilmesi, rehber resim desteği, Homesite’la bütünleşme.resim desteği, Homesite’la bütünleşme. Eksileri:Eksileri: Homesite kadar iyi bir doğrudan HTML kodu yazımıHomesite kadar iyi bir doğrudan HTML kodu yazımı olmaması ve maalesef sadece Windows ve MacOs’daolmaması ve maalesef sadece Windows ve MacOs’da çalışması.çalışması.
  • 6. Netscape Composer:Netscape Composer: Netscape Gold ve Communicator paketlerinin içinden çıkanNetscape Gold ve Communicator paketlerinin içinden çıkan bir düzenleyicidir.Genel olarak, sayfalar WYSIWYG modundabir düzenleyicidir.Genel olarak, sayfalar WYSIWYG modunda düzenlenir, ancak istenirse ekstra HTML kodu da sayfayadüzenlenir, ancak istenirse ekstra HTML kodu da sayfaya eklenebilir.eklenebilir. Artıları:Artıları: Sayfaları tek tuşa basarak bir Web sunucusunaSayfaları tek tuşa basarak bir Web sunucusuna aktarabilirsiniz.Genel görünümü bir kelime işlemci programınaaktarabilirsiniz.Genel görünümü bir kelime işlemci programına benzer.Yazım kontrolü desteği İngilizce bir sözlükle beraberbenzer.Yazım kontrolü desteği İngilizce bir sözlükle beraber gelir, ancak kelimeleri öğrenme özelliği vardır.gelir, ancak kelimeleri öğrenme özelliği vardır. Eksileri:Eksileri: Site yönetimi, dokümantasyon, özelleştirebilmeSite yönetimi, dokümantasyon, özelleştirebilme seçenekleri yoktur.Ayrıca, tablo desteği gerçekten zayıf veseçenekleri yoktur.Ayrıca, tablo desteği gerçekten zayıf ve kullanması da ayrıca zordur.HTML dışında hiçbir dosyakullanması da ayrıca zordur.HTML dışında hiçbir dosya formatını da tanıyamaz.formatını da tanıyamaz.
  • 7. HotDog Pro:HotDog Pro: Birkaç yıl öncesine kadar görsel olmayan düzenleyicilerBirkaç yıl öncesine kadar görsel olmayan düzenleyiciler piyasasında Homesite’la başabaş giden bu program, yenipiyasasında Homesite’la başabaş giden bu program, yeni sürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesisürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesi gibi nedenlerle popülerliğini yitirmiştir.gibi nedenlerle popülerliğini yitirmiştir. Artıları:Artıları: Birçok özelleştirebilme seçeneği, tablo ve frame’lerinBirçok özelleştirebilme seçeneği, tablo ve frame’lerin yaratılmasında kullanılabilen sihirbazlar,yaratılmasında kullanılabilen sihirbazlar, tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi,tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi, renkli kodlama.renkli kodlama. Eksileri:Eksileri: Sık sık göçmesi, zayıf dokümantasyon ve çalışmayıSık sık göçmesi, zayıf dokümantasyon ve çalışmayı engelleyici ses efektleri.engelleyici ses efektleri.
  • 8. Web Sayfalarının TasarlanmasıWeb Sayfalarının Tasarlanması Yukarıda incelemesini yaptığımız birçok web editörü sizeYukarıda incelemesini yaptığımız birçok web editörü size HTML dilini bilmeden,HTML dilini bilmeden, HTMLHTML kodlarını kullanarak web sitesikodlarını kullanarak web sitesi yapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız heryapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız her adımı, otomatikmanadımı, otomatikman HTMLHTML koduna çeviriyor.koduna çeviriyor. Peki o zaman nedenPeki o zaman neden HTMLHTML öğrenmelisiniz?öğrenmelisiniz?HTMLHTML öğrenmelisiniz çünkü:öğrenmelisiniz çünkü:  En basit neden; eğer iyi bir webmaster olmak istiyorsanız, veEn basit neden; eğer iyi bir webmaster olmak istiyorsanız, ve HTMLHTML bilmeden sadece bu tür programları kullanmayıbilmeden sadece bu tür programları kullanmayı düşünüyorsanız, muhtemelen programın verdiği, programdandüşünüyorsanız, muhtemelen programın verdiği, programdan kaynaklanan en küçük bir hatada eliniz kolunuz bağlıkaynaklanan en küçük bir hatada eliniz kolunuz bağlı kalacaktır.kalacaktır.  Lisans gerektiren programlar. Birçok kaliteli "Lisans gerektiren programlar. Birçok kaliteli "HTMLHTML çevirici"çevirici" programını kullanmak için, o programın lisansına sahipprogramını kullanmak için, o programın lisansına sahip olmanız gerekir. Ve bu da genelde büyük paralar gerektirir.olmanız gerekir. Ve bu da genelde büyük paralar gerektirir.
  • 9. HTML Nedir?HTML Nedir? HTMLHTML, Hyper Text Mark-up Language'ın kısaltılmışıdır., Hyper Text Mark-up Language'ın kısaltılmışıdır. Türkçe karşılığı Hiper Metin İşaretleme Dili'dir. BrowserlarTürkçe karşılığı Hiper Metin İşaretleme Dili'dir. Browserlar tarafından tanınıp yorumlanabilen metin tabanlı bir dildir vetarafından tanınıp yorumlanabilen metin tabanlı bir dildir ve metnin browser tarafından yorumlanması sonucu da webmetnin browser tarafından yorumlanması sonucu da web sayfaları elde edilir.sayfaları elde edilir. Yazdığınız kodların browser tarafındanYazdığınız kodların browser tarafından alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm"alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm" veya ".html" olması gerekir.veya ".html" olması gerekir. HTMLHTML de her işaretleme dilindeki gibi komutlardan oluşur,de her işaretleme dilindeki gibi komutlardan oluşur, bu komutlarabu komutlara tagtag veyaveya mark-upmark-up denir. Tag'ler herhangi birdenir. Tag'ler herhangi bir metinden farklı oldukları browser tarafından anlaşılabilsinmetinden farklı oldukları browser tarafından anlaşılabilsin diye "<" ve ">" işaretlerinin arasına yazılır. Her tag'in birdiye "<" ve ">" işaretlerinin arasına yazılır. Her tag'in bir başlangıcı ve bitişi vardır. Bitiş tag'lerinde, "<" işaretindenbaşlangıcı ve bitişi vardır. Bitiş tag'lerinde, "<" işaretinden sonra tag'in bitiş tag'i olduğunu belirtmek için "/" işaretisonra tag'in bitiş tag'i olduğunu belirtmek için "/" işareti kullanılır. Bir örnek ile göstermemiz gerekirse;kullanılır. Bir örnek ile göstermemiz gerekirse; <P><P>Bu bir Paragraf tag'idir.Bu bir Paragraf tag'idir.</P></P>
  • 10. Temel Komutlar:Temel Komutlar: <HTML></HTML><HTML></HTML> Tüm HTML dokümanını içine alan en temel tag'dir ve dokümanınTüm HTML dokümanını içine alan en temel tag'dir ve dokümanın HTML ile yazıldığını browser'a bildirir.HTML ile yazıldığını browser'a bildirir. <HEAD></HEAD><HEAD></HEAD> Bu tag'in arasına yazılan her şey, sayfanın tanımını oluşturur.Bu tag'in arasına yazılan her şey, sayfanın tanımını oluşturur. Buna sayfanın başlığı da dahildir. Ayrıca meta takıları da buBuna sayfanın başlığı da dahildir. Ayrıca meta takıları da bu tag'in arasına yazılır:tag'in arasına yazılır:  <TITLE></TITLE> :<TITLE></TITLE> : Sayfa başlığıdır. Bu tag'in arasına yazılanSayfa başlığıdır. Bu tag'in arasına yazılan her şey sayfamızın ismi olacak ve başlık çubuğundaher şey sayfamızın ismi olacak ve başlık çubuğunda görüntülenecektir.görüntülenecektir.
  • 11.  META Etiketi:META Etiketi: Arama motorlarında iyi bir sıralama kapmak içinArama motorlarında iyi bir sıralama kapmak için meta etiketleri içerisine yazdığımız notlar çok önemlidir.meta etiketleri içerisine yazdığımız notlar çok önemlidir. Örneğin bir sitesinin Meta etiketleri şöyle olabilir:Örneğin bir sitesinin Meta etiketleri şöyle olabilir: <META name=“keywords” content=“Dokuz Eylül<META name=“keywords” content=“Dokuz Eylül Üniversitesi,DEÜ,DEUU,Fakülteler,Yüksekokullar,Enstitüler,AkadeÜniversitesi,DEÜ,DEUU,Fakülteler,Yüksekokullar,Enstitüler,Akade mik Takvim, Üniversite, dokuz eylul university, Turkey,mik Takvim, Üniversite, dokuz eylul university, Turkey, University,education,campus,Türkiye, academics, students,University,education,campus,Türkiye, academics, students, faculty>faculty> Sayfanızda kullandığınız Türkçe karakterlerin başka bilgisayardaSayfanızda kullandığınız Türkçe karakterlerin başka bilgisayarda bozuk şekillerde görülmemesi için:bozuk şekillerde görülmemesi için: <meta http-equiv=“Content-Type” content=“text/html;<meta http-equiv=“Content-Type” content=“text/html; charset=windoes-1254”>charset=windoes-1254”>
  • 12. <BODY></BODY><BODY></BODY> Sayfanın browser tarafından ekrana basılacak tüm kısımlarıSayfanın browser tarafından ekrana basılacak tüm kısımları bu tag'in arasına yazılır. Ekrana basılacak kısmın içinebu tag'in arasına yazılır. Ekrana basılacak kısmın içine metinler, resimler, formlar, tablolar vs. girer.metinler, resimler, formlar, tablolar vs. girer. <html><html> <head><head> <title>İlk Sayfam</title><title>İlk Sayfam</title> </head></head> <body bgcolor="#e3e3e3"><body bgcolor="#e3e3e3"> <b>Web sayfama hoşgeldiniz</b><br><b>Web sayfama hoşgeldiniz</b><br> <i>Web sayfama hoşgeldiniz</i><br><i>Web sayfama hoşgeldiniz</i><br> <font face="Lucida Sans Unicode" size="+2" color="#297835">Web<font face="Lucida Sans Unicode" size="+2" color="#297835">Web sayfama hoşgeldiniz</font><br>sayfama hoşgeldiniz</font><br> <u>Web sayfama hoşgeldiniz</u><br><u>Web sayfama hoşgeldiniz</u><br> <b><u><i>Web sayfama hoşgeldiniz</i></u></b><b><u><i>Web sayfama hoşgeldiniz</i></u></b> <center><font face="Verdana" size="+2" color="#765678">Web sayfama<center><font face="Verdana" size="+2" color="#765678">Web sayfama hoşgeldiniz</font></center><br>hoşgeldiniz</font></center><br> </body></body> </html></html>
  • 14. Web Grafiklerinin HazırlanmasıWeb Grafiklerinin Hazırlanması  Zor olan işlem, sayfaların içine içeriğin yerleştirilmesi değil,Zor olan işlem, sayfaların içine içeriğin yerleştirilmesi değil, bu içeriğin hazırlanmasıdır. Tahmin edebileceğiniz gibi,bu içeriğin hazırlanmasıdır. Tahmin edebileceğiniz gibi, sayfalarda yer alan grafikler metinlerden daha da zorsayfalarda yer alan grafikler metinlerden daha da zor hazırlanırlar. Çünkü sayfada yer alacak renkler ve grafikhazırlanırlar. Çünkü sayfada yer alacak renkler ve grafik tasarımları sitenin genel çizgisini belirleyeceği için, özenle vetasarımları sitenin genel çizgisini belirleyeceği için, özenle ve uyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ileuyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ile hazırlanacak site grafiklerinde görselliğin yanında dikkathazırlanacak site grafiklerinde görselliğin yanında dikkat edilecek bir başka unsur da grafik dosyalarının boyutlarınınedilecek bir başka unsur da grafik dosyalarının boyutlarının küçük olmasıdır. Çünkü ne kadar fazla grafik kullanılırsa, siteküçük olmasıdır. Çünkü ne kadar fazla grafik kullanılırsa, site o kadar yavaş açılacaktır ve bir site ne kadar görsel olursao kadar yavaş açılacaktır ve bir site ne kadar görsel olursa olsun, eğer yavaş açılıyorsa pek de cazip olmayacaktır. Buolsun, eğer yavaş açılıyorsa pek de cazip olmayacaktır. Bu tür çeşitli grafikleri tasarlamak için kullanabileceğiniz yeganetür çeşitli grafikleri tasarlamak için kullanabileceğiniz yegane program Photoshop'dur. Ancak ücretli ve profesyonel birprogram Photoshop'dur. Ancak ücretli ve profesyonel bir program olan Photoshop'un yerine buna çok yakın olanprogram olan Photoshop'un yerine buna çok yakın olan tamamen bedava olarak dağıtılan Paint Shop Pro adlıtamamen bedava olarak dağıtılan Paint Shop Pro adlı Shareware programı da kullanabilirsiniz. Bu ve buna benzerShareware programı da kullanabilirsiniz. Bu ve buna benzer programlar ile rahatlıkla arka fonlar, Web tuşları, başlıklar veprogramlar ile rahatlıkla arka fonlar, Web tuşları, başlıklar ve Banner'lar gibi sabit Web grafiklerini oluşturabilirsiniz.Banner'lar gibi sabit Web grafiklerini oluşturabilirsiniz.
  • 15. Sayfaların Web Alanına GönderilmesiSayfaların Web Alanına Gönderilmesi  Grafikleri tasarladınız ve metinleri hazırladınız. Bunları birGrafikleri tasarladınız ve metinleri hazırladınız. Bunları bir Web tasarım programı ile Web sayfası haline getirdiktenWeb tasarım programı ile Web sayfası haline getirdikten sonra hazırlamış olduğunuz Web sayfalarınısonra hazırlamış olduğunuz Web sayfalarını kullanıcılarakullanıcılara ulaştırabilmeniz için bunları yerleştireceğiniz Internetulaştırabilmeniz için bunları yerleştireceğiniz Internet üzerinde bir disk alanına yani Web alanına ihtiyacınızüzerinde bir disk alanına yani Web alanına ihtiyacınız olacaktır. Bu işlem için en iyi çözüm yine Internet üzerindeolacaktır. Bu işlem için en iyi çözüm yine Internet üzerinde size bedava sabitdisk alanı (host) sağlayan bir sunucu bulupsize bedava sabitdisk alanı (host) sağlayan bir sunucu bulup sayfalarınızı oraya yerleştirmektir.Eğer alacağımız alanınsayfalarınızı oraya yerleştirmektir.Eğer alacağımız alanın FTP desteği varsa, yaptığımız sayfaları CuteFTP gibi FTPFTP desteği varsa, yaptığımız sayfaları CuteFTP gibi FTP programları ile sunucu üzerindeki alana gönderebilirsiniz.programları ile sunucu üzerindeki alana gönderebilirsiniz.
  • 16. Ücretsiz Hosting Hizmeti VerenÜcretsiz Hosting Hizmeti Veren Bazı Sitelerin İncelemeleriBazı Sitelerin İncelemeleri  www.20m.comwww.20m.com  Azbuz.comAzbuz.com
  • 17. Sitenizin Barınacağı Sunucuyu SeçerkenSitenizin Barınacağı Sunucuyu Seçerken Dikkat Etmeniz Gereken AyrıntılarDikkat Etmeniz Gereken Ayrıntılar  Internet üzerinde yasal olmadığı kanıtlanmış MP3'ler,Internet üzerinde yasal olmadığı kanıtlanmış MP3'ler, emülatör dosyaları, Crack, Hack, Warez, çalınmış şifreleremülatör dosyaları, Crack, Hack, Warez, çalınmış şifreler ve benzeri içerikle Adult öğelere sitenizde yer vermektenve benzeri içerikle Adult öğelere sitenizde yer vermekten kaçının.kaçının.  Seçtiğiniz sunucunun teknik özelliklerini mutlaka dikkateSeçtiğiniz sunucunun teknik özelliklerini mutlaka dikkate alın. Örneğin Frame yani çerçeveye izin vermeyen bazıalın. Örneğin Frame yani çerçeveye izin vermeyen bazı sunucular, iki ya da daha fazla parçadan oluşmuş sitesunucular, iki ya da daha fazla parçadan oluşmuş site tasarımınızı tam anlamıyla sunamayacaklardır.tasarımınızı tam anlamıyla sunamayacaklardır.
  • 18.  Bunun yanında her sunucu çok serbest bir şekilde CGI,Bunun yanında her sunucu çok serbest bir şekilde CGI, Perl gibi dillerin kullanılmasına izin vermeyebilir.Perl gibi dillerin kullanılmasına izin vermeyebilir.  Unutulmaması gereken fazla disk alanı her zaman en iyiUnutulmaması gereken fazla disk alanı her zaman en iyi şey değildir. Sınırsız bir alanda hiçbir özellikşey değildir. Sınırsız bir alanda hiçbir özellik desteklenmeyeceği gibi, 3MB'lık bir alan sağlayandesteklenmeyeceği gibi, 3MB'lık bir alan sağlayan sunucu, buna karşılık Frame'den CGI dilllerine kadar hersunucu, buna karşılık Frame'den CGI dilllerine kadar her şeyi destekleyebilir.şeyi destekleyebilir.
  • 19. Web Tasarımını DestekleyiciWeb Tasarımını Destekleyici ProgramlarProgramlar  PHPPHP  ASPASP  JAVA SCRIPTJAVA SCRIPT  JAVA APPLETJAVA APPLET  CSSCSS  FLASHFLASH
  • 20. PHP (Personal Home Page)PHP (Personal Home Page) Html 'nin geliştirilmesinin çok eski zamanlara dayanmasındanHtml 'nin geliştirilmesinin çok eski zamanlara dayanmasından mıdır? yoksa o zaman ki şartlarla düşünülmediği için midir?mıdır? yoksa o zaman ki şartlarla düşünülmediği için midir? bilinmez ama html bazı yönden eksik bir dildir. İşte bubilinmez ama html bazı yönden eksik bir dildir. İşte bu eksikliklerin anlaşıldığı dönemlerde, herkesin anlayabileceğieksikliklerin anlaşıldığı dönemlerde, herkesin anlayabileceği ve kısa sürede öğrenilebileceği bir dil yaratma çabasındave kısa sürede öğrenilebileceği bir dil yaratma çabasında olan Rasmus Lerdorf tarafından düşünülmüş ve Perl dilindenolan Rasmus Lerdorf tarafından düşünülmüş ve Perl dilinden esinlenilerek yapılmaya başlanmış bir dildir Php.esinlenilerek yapılmaya başlanmış bir dildir Php. Php 'nin yaptığını kısaca anlatmak gerekirse; Web sayfasıPhp 'nin yaptığını kısaca anlatmak gerekirse; Web sayfası isteminde bulunan kullanıcılara, istenilen dosya içerisindeisteminde bulunan kullanıcılara, istenilen dosya içerisinde Php ile ilgili satırları işleyerek dosya içeriğini kullanıcınınPhp ile ilgili satırları işleyerek dosya içeriğini kullanıcının Browser ' ının anlıyabileceği html formatında sunan birBrowser ' ının anlıyabileceği html formatında sunan bir programlama dilidir diyebiliriz. Bu genel anlamda Server-Sideprogramlama dilidir diyebiliriz. Bu genel anlamda Server-Side ( Server-Taraflı ) Dil olarak anılır.( Server-Taraflı ) Dil olarak anılır.
  • 21. Php 'yi rakiplerinden ayıran özellikler?Php 'yi rakiplerinden ayıran özellikler?  En yakın rakibi ASP ile performans ve fiyat açısından açıkEn yakın rakibi ASP ile performans ve fiyat açısından açık farklılar vardır. Fiyat konusu haricinde ( Php ücretsizfarklılar vardır. Fiyat konusu haricinde ( Php ücretsiz dağıtılmaktadır. ) ASP kullanıcılarının kabul etmedikleri şeydağıtılmaktadır. ) ASP kullanıcılarının kabul etmedikleri şey hız faktörüdür. Belkide en çok tartışılan bu konu hakkında enhız faktörüdür. Belkide en çok tartışılan bu konu hakkında en basit karşılaştırma; PHP + MySql ve ASP + MSSQLbasit karşılaştırma; PHP + MySql ve ASP + MSSQL oranlarında çıkmaktadır. Elde edilen verilere göre 5000oranlarında çıkmaktadır. Elde edilen verilere göre 5000 satırlık bir bilgiyi database’ e; aynı makina üzerinde Php vesatırlık bir bilgiyi database’ e; aynı makina üzerinde Php ve MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28 saniyede girmektedir.saniyede girmektedir.  Php 'nin açık kaynak kodlu oluşu, hataların veya yeniPhp 'nin açık kaynak kodlu oluşu, hataların veya yeni özelliklerin güncellenmesi/eklenmesi gibi olaylarda büyüközelliklerin güncellenmesi/eklenmesi gibi olaylarda büyük avantajlar sağlamaktadır.avantajlar sağlamaktadır.  Kişisel kullanıcılar; Php ile web sayfalarında daha çokKişisel kullanıcılar; Php ile web sayfalarında daha çok kullanıcı etkileşimli kodlar kullanmaktadır. Örnek olarak;kullanıcı etkileşimli kodlar kullanmaktadır. Örnek olarak; Ziyaretçiler için oluşturulan, forum, sayaç, anket gibiZiyaretçiler için oluşturulan, forum, sayaç, anket gibi kodlarda Php çok rağbet görmektedir.kodlarda Php çok rağbet görmektedir.
  • 22. Peki bu dilin dezavantajları nelerdir?Peki bu dilin dezavantajları nelerdir? Günümüzde büyük şirketlerde internet ve intranetGünümüzde büyük şirketlerde internet ve intranet uygulamalarda , büyük paya sahip Microsoft firması, kendiuygulamalarda , büyük paya sahip Microsoft firması, kendi ürünü olan ASP için büyük çabalar sarfetmektedir. Yeniürünü olan ASP için büyük çabalar sarfetmektedir. Yeni teknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminlerteknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminler hazırlamakta ve iş istihdamı konusunda ASP yi bir adım önehazırlamakta ve iş istihdamı konusunda ASP yi bir adım öne taşımaktadır. Sunucu fiyatları olarak Php 'ye göre yerine göretaşımaktadır. Sunucu fiyatları olarak Php 'ye göre yerine göre üç kat daha fazla oranda olmasına rağmen, büyük şirketlerüç kat daha fazla oranda olmasına rağmen, büyük şirketler tarafından tercih edilmektedir.tarafından tercih edilmektedir.
  • 23. ASP (Active Server Pages)ASP (Active Server Pages) Sunucu taraflı bir teknoloji olan ASP, (Active ServerSunucu taraflı bir teknoloji olan ASP, (Active Server Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına etkileşimli,Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına etkileşimli, dinamik Web sayfaları göndermek için kullanılır. ASP, Webdinamik Web sayfaları göndermek için kullanılır. ASP, Web programcılarına HTML, scripting ve kullanıcıdan bağımsızprogramcılarına HTML, scripting ve kullanıcıdan bağımsız veritabanı uygulamalarını özgürce kullanma fırsatı verir. ASPveritabanı uygulamalarını özgürce kullanma fırsatı verir. ASP programlama ortamının özgür olmasının sebebi tüm derlemeprogramlama ortamının özgür olmasının sebebi tüm derleme işleminin sunucu tarafında bitmesi ve kullanıcının sadeceişleminin sunucu tarafında bitmesi ve kullanıcının sadece sonuçta oluşan HTML sayfalarını görmesidir.sonuçta oluşan HTML sayfalarını görmesidir.
  • 24. ASP’nin Kullanım Amaçları ve AvantajlarıASP’nin Kullanım Amaçları ve Avantajları  Çok geniş bir kullanım alanı olan ASP, scripting diye tabirÇok geniş bir kullanım alanı olan ASP, scripting diye tabir edilen VBScript, JavaScript gibi her türlü ham koduedilen VBScript, JavaScript gibi her türlü ham kodu kullanabilir, sunduğu kolay anlaşılır doğal dili ile orta derecekullanabilir, sunduğu kolay anlaşılır doğal dili ile orta derece HTML bilen kimseler tarafından bile kolayca kavranabilir.HTML bilen kimseler tarafından bile kolayca kavranabilir.  ASP'nin Netscape Navigator / Internet Explorer /Opera gibiASP'nin Netscape Navigator / Internet Explorer /Opera gibi Web tarayıcılarından bağımsız olmasının yanısıra en büyükWeb tarayıcılarından bağımsız olmasının yanısıra en büyük avantajlarından biri kullandığınız teknolojilerin, scriptlerinavantajlarından biri kullandığınız teknolojilerin, scriptlerin saklı kalmasıdır.saklı kalmasıdır.  ASP ile hazırlanan projeler kaynakların yönetimi, kontrolüASP ile hazırlanan projeler kaynakların yönetimi, kontrolü ve uzaktan sistem yönetimine imkan verir. Şirketler arasıve uzaktan sistem yönetimine imkan verir. Şirketler arası bilgi paylaşımı için ideal bir ortam oluşturur.bilgi paylaşımı için ideal bir ortam oluşturur.
  • 25. JAVA SCRIPTJAVA SCRIPT Java ScriptJava Script NetscapeNetscape tarafından geliştirilmiş bir script dilidir.tarafından geliştirilmiş bir script dilidir. Düz yazı formundadır. Browserlara bağlıdır ve yorumlanır.Düz yazı formundadır. Browserlara bağlıdır ve yorumlanır. HTML'nin içine katılır. Etiketi <script>...</script> şeklindedir.HTML'nin içine katılır. Etiketi <script>...</script> şeklindedir. Java Script; etkileşimli web sayfası yapımında HTML'ninJava Script; etkileşimli web sayfası yapımında HTML'nin yetersiz kalması nedeniyle C/C++ dilleri baz alınarakyetersiz kalması nedeniyle C/C++ dilleri baz alınarak geliştirilen, "düz yazı" formunda bir script (komutlar dizisi)geliştirilen, "düz yazı" formunda bir script (komutlar dizisi) dilidir. Java Script kodları herhangi bir metin editörü (Windilidir. Java Script kodları herhangi bir metin editörü (Win 95/98 Not defteri vb.) ile düz yazı formunda yazılabilir. Bu95/98 Not defteri vb.) ile düz yazı formunda yazılabilir. Bu şekilde yazılmış Java Script kodları istemci tarafında, yanişekilde yazılmış Java Script kodları istemci tarafında, yani ziyaretçinin web tarayıcısı tarafından yorumlanır veziyaretçinin web tarayıcısı tarafından yorumlanır ve yaptırılmak istenen işlemler gerçekleşir. Ama bu işlemlerinyaptırılmak istenen işlemler gerçekleşir. Ama bu işlemlerin gerçekleşmesi için mutlaka bir olay gereklidir. (Örneğin,gerçekleşmesi için mutlaka bir olay gereklidir. (Örneğin, sayfanın açılması-kapanması, ziyaretçinin sayfada herhangisayfanın açılması-kapanması, ziyaretçinin sayfada herhangi bir yeri tıklaması veya klavyede herhangi bir tuşa basmasıbir yeri tıklaması veya klavyede herhangi bir tuşa basması gibi...)gibi...)
  • 26. Java Script kodlarını web sayfası içerisinde 2 şekildeJava Script kodlarını web sayfası içerisinde 2 şekilde tanımlayabiliriz;tanımlayabiliriz; 1.1. HTML kodları içerisindeHTML kodları içerisinde <SCRIPT>....</SCRIPT><SCRIPT>....</SCRIPT> etiketleri arasında yazarak,etiketleri arasında yazarak, <script><script> <!--<!-- JavaScript kodlarıJavaScript kodları -->--> </script></script> 2.2. Düz yazı formunda veDüz yazı formunda ve .js.js uzantısı ile farklı bir dosyauzantısı ile farklı bir dosya oluşturup, bu dosyaya HTML içerisinde link vererek.oluşturup, bu dosyaya HTML içerisinde link vererek. <SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT><SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT>
  • 27. JAVA APPLETJAVA APPLET Java (yani Java Applet),Java (yani Java Applet), Sun MicrosystemsSun Microsystems tarafındantarafından geliştirilmiş nesneye yönelik programlama dilidir ve işletimgeliştirilmiş nesneye yönelik programlama dilidir ve işletim sistemlerinden bağımsız olarak çalışır. HTML'nin bir parçasısistemlerinden bağımsız olarak çalışır. HTML'nin bir parçası olamaz. Etiketi <applet>...</applet> şeklindedir.olamaz. Etiketi <applet>...</applet> şeklindedir. Java Applet hazırlayabilmeniz için Sun firmasının ücretsizJava Applet hazırlayabilmeniz için Sun firmasının ücretsiz olarak dağıttığı JDK (Java Development Kit – Java Geliştirmeolarak dağıttığı JDK (Java Development Kit – Java Geliştirme Ortamı) programını download etmeniz gerekmektedir.Ortamı) programını download etmeniz gerekmektedir. <APPLET code=hotbutton.class height=20 width=122><APPLET code=hotbutton.class height=20 width=122> <PARAM NAME="clıp" VALUE=""><PARAM NAME="clıp" VALUE=""> <PARAM NAME="actıveshadow" VALUE="fff9e3"><PARAM NAME="actıveshadow" VALUE="fff9e3"> <PARAM NAME="shadowcolor" VALUE="ffedaf"><PARAM NAME="shadowcolor" VALUE="ffedaf"> <PARAM NAME="alıgn" VALUE="icon"><PARAM NAME="alıgn" VALUE="icon"> </APPLET></APPLET>
  • 28. CSSCSS CSS (Cascading Style Sheets), BirCSS (Cascading Style Sheets), Bir HTMLHTML dökümanındakidökümanındaki HTML takılarının sitillerini belirleyen tekniktir.HTML takılarının sitillerini belirleyen tekniktir. CSS kodlarını web sayfası içerisinde 3 şekildeCSS kodlarını web sayfası içerisinde 3 şekilde tanımlayabiliriz;tanımlayabiliriz;  HTML takılarının sitillerini, takıların içinde(Local)HTML takılarının sitillerini, takıların içinde(Local) <h1 style= font-family:Verdana,Arial> CSS öğreniyorum </h1><h1 style= font-family:Verdana,Arial> CSS öğreniyorum </h1>  Sayfanın başında "" takıları arasında (Global)Sayfanın başında "" takıları arasında (Global) <style><style> h1.buyukyazilar {font-family:verdana; color:yellow}h1.buyukyazilar {font-family:verdana; color:yellow} h1.digerleri {font-family:arial; color:black}h1.digerleri {font-family:arial; color:black} h2 {font-family:verdana; color:pink}h2 {font-family:verdana; color:pink} </style></style>  Link olarak başka bir dosyadan alarakLink olarak başka bir dosyadan alarak <link rel="stylesheet" type="text/css" href="sitillerim.css"><link rel="stylesheet" type="text/css" href="sitillerim.css">
  • 29. CSS Öğrenmenin avantajları:CSS Öğrenmenin avantajları: CSS, HTML takılarına, HTML ile yapılamayacak fakat işiniziCSS, HTML takılarına, HTML ile yapılamayacak fakat işinizi kolaylaştıracak bir çok özellik katabilir. Örneğin; hemenkolaylaştıracak bir çok özellik katabilir. Örneğin; hemen hemen tüm web sayfalarında gördüğünüz değişik link sitilleri,hemen tüm web sayfalarında gördüğünüz değişik link sitilleri, CSS kullanılarak yapılmıştır. CSS ile sayfalarınızı daha hızlıCSS kullanılarak yapılmıştır. CSS ile sayfalarınızı daha hızlı hale getirebilir ve dosyanın yükünü hafifletebilirsiniz.hale getirebilir ve dosyanın yükünü hafifletebilirsiniz. Sayfalarınız için hazırlayacağınız bir CSS dosyasınıSayfalarınız için hazırlayacağınız bir CSS dosyasını kullanarak tüm sayfalarınıza aynı özellikleri verebilir,kullanarak tüm sayfalarınıza aynı özellikleri verebilir, dolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'indolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'in yapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindekiyapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindeki kolaylığın aksine kapasitesi büyük bir dildir.kolaylığın aksine kapasitesi büyük bir dildir.
  • 30. Örnek KullanımÖrnek Kullanım:: <html><html> <head><head> <title>REHBERİM ONLINE</title><title>REHBERİM ONLINE</title> <style><style> h1.secici1 { font-family: ARIAL; font-size: 12pt; color:orange}h1.secici1 { font-family: ARIAL; font-size: 12pt; color:orange} h1.secici2 { font-family: ARIAL; font-size: 8pt; color:red }h1.secici2 { font-family: ARIAL; font-size: 8pt; color:red } #ID1 { font-family: Verdana; font-size: 10pt; color:blue }#ID1 { font-family: Verdana; font-size: 10pt; color:blue } #ID2 { font-family: Verdana; font-size: 8pt; color:black}#ID2 { font-family: Verdana; font-size: 8pt; color:black} </style></style> </head></head> <body><body> <h1 class="secici1"> CSS Rehberi </h1> <h1 class="secici1"> CSS Rehberi </h1>  <h1 class="secici2"> CSS Rehberi </h1><h1 class="secici2"> CSS Rehberi </h1> <span id="ID1"> CSS Rehberi </span><br><span id="ID1"> CSS Rehberi </span><br> <span id="ID2"> CSS Rehberi </span><span id="ID2"> CSS Rehberi </span> </body></body> </html></html> CSS RehberiCSS Rehberi CSS RehberiCSS Rehberi    CSS RehberiCSS Rehberi CSS RehberiCSS Rehberi
  • 31. FlashFlash Flash, Macromedia tarafından geliştirilmiş Internet'te etkileşimliFlash, Macromedia tarafından geliştirilmiş Internet'te etkileşimli vektörel grafik ve animasyon hazırlanmasında kullanılan birvektörel grafik ve animasyon hazırlanmasında kullanılan bir standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir,standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir, çok az yer kaplayan gezinilebilir yüzeyler, teknikçok az yer kaplayan gezinilebilir yüzeyler, teknik canlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcıcanlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcı efektleri yapmak amacıyla kullanırlar.efektleri yapmak amacıyla kullanırlar. Kullanım Alanları:Kullanım Alanları:  Flash ile en küçük reklam pankartından (banner), enFlash ile en küçük reklam pankartından (banner), en karmaşık animasyonun yapılması, hatta bütün bir webkarmaşık animasyonun yapılması, hatta bütün bir web sitesinin oluşturulması mümkündür. Interaktif CD'lerinsitesinin oluşturulması mümkündür. Interaktif CD'lerin hazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XMLhazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XML gibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetlerigibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetleri arasında sayılabilir.arasında sayılabilir.  Flash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani birFlash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani bir dosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Budosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Bu bize etkileşim daha üst seviyelere çekebilme şansını verir.bize etkileşim daha üst seviyelere çekebilme şansını verir.         
  • 32.  Flash içerisinde bulunan bütün görüntü, ses, text elemanlarıFlash içerisinde bulunan bütün görüntü, ses, text elemanları flash'a özgü bazı sıkıştırma teknikleri sayesinde çok küçükflash'a özgü bazı sıkıştırma teknikleri sayesinde çok küçük boyutlara sıkıştırılabilir. Bu sıkıştırma oranları programboyutlara sıkıştırılabilir. Bu sıkıştırma oranları program içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir.içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir. Böylece örneğin 1 birim tutan bir ses/görüntü dosyası 0.1 ileBöylece örneğin 1 birim tutan bir ses/görüntü dosyası 0.1 ile 0.9 arasında boyutlarda son kullanıcıya ulaştırılabilir.0.9 arasında boyutlarda son kullanıcıya ulaştırılabilir.          Macromedia Flash programı, macromedia'nınMacromedia Flash programı, macromedia'nın http://www.macromedia.comhttp://www.macromedia.com adresinden deneme amaçlıadresinden deneme amaçlı olarak indirilebilir. Bunun dışında tam kullanım için belirli birolarak indirilebilir. Bunun dışında tam kullanım için belirli bir ücret karşılığında macromedia'dan yada temsilciliklerindenücret karşılığında macromedia'dan yada temsilciliklerinden temin edilebilir.temin edilebilir.
  • 33. Püf NoktalarPüf Noktalar  Tasarımın en önemli unsurlarından biri tablolardır.Tasarımın en önemli unsurlarından biri tablolardır. Tabloları amacınıza uygun şekilde sayfayaTabloları amacınıza uygun şekilde sayfaya yerleştirdiğinizde sayfanız, görsel açıdan daha üstün biryerleştirdiğinizde sayfanız, görsel açıdan daha üstün bir tasarıma sahip olacaktır. Çünkü hizalama, uygun yeretasarıma sahip olacaktır. Çünkü hizalama, uygun yere uygun resmi yerleştirme gibi şeyler kod yazarak çokuygun resmi yerleştirme gibi şeyler kod yazarak çok uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz.uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz.  Dikkat edilmesi gereken en önemli şeylerden biri deDikkat edilmesi gereken en önemli şeylerden biri de resim kullanımı. Sayfalarınızda mümkün olduğunca azresim kullanımı. Sayfalarınızda mümkün olduğunca az resim kullanın. Şayet resim kullanırsanız, boyutlarıresim kullanın. Şayet resim kullanırsanız, boyutları minimum, kaliteyi optimum düzeyde tutmaya özenminimum, kaliteyi optimum düzeyde tutmaya özen gösterin. Çünkü Türkiye de internetin hızı malum. Teorikgösterin. Çünkü Türkiye de internetin hızı malum. Teorik hızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızınhızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızın açılmasını dakikalarca bekleyemeyebiliyor. Sayfaların daaçılmasını dakikalarca bekleyemeyebiliyor. Sayfaların da daha çabuk açılması için akla gelen ilk şey de resimlerdaha çabuk açılması için akla gelen ilk şey de resimler oluyor. Eğer ki resimden başka Java Applet vs. varsaoluyor. Eğer ki resimden başka Java Applet vs. varsa önceliği bunlara verin.önceliği bunlara verin.
  • 34.  İnternet üzerinde en çok kullanılan browser'lar IE veİnternet üzerinde en çok kullanılan browser'lar IE ve Netscape Navigator'dır. Büyük çoğunlukla da IENetscape Navigator'dır. Büyük çoğunlukla da IE kullanılır. Sitenizin yapım aşamasında farklıkullanılır. Sitenizin yapım aşamasında farklı browserlarda sitenizin nasıl göründüğünü test etmenizbrowserlarda sitenizin nasıl göründüğünü test etmeniz gerekebilmektedir. Çünkü bazı tag'ler farklı browserlardagerekebilmektedir. Çünkü bazı tag'ler farklı browserlarda aynı etkiyi yaratamayabilmektedir. Bunun da çabuk farkaynı etkiyi yaratamayabilmektedir. Bunun da çabuk fark edilmesi, sizi emek, zaman ve kaynak kaybındanedilmesi, sizi emek, zaman ve kaynak kaybından kurtarabilir.kurtarabilir.  Sayfalarınızı, farklı ekran çözünürlüklerinde test edin.Sayfalarınızı, farklı ekran çözünürlüklerinde test edin. Optimum çözünürlükte karar kıldığınızda sayfaları buOptimum çözünürlükte karar kıldığınızda sayfaları bu ekran çözünürlüğünde tasarlayın. Bunu yapmanızdakiekran çözünürlüğünde tasarlayın. Bunu yapmanızdaki sebep şudur: Her kullanıcı sizinle aynı ekransebep şudur: Her kullanıcı sizinle aynı ekran çözünürlüğünü kullanmayabilir. Sizin 800*600çözünürlüğünü kullanmayabilir. Sizin 800*600 çözünürlükte yaptığınız site, browser'ınızda gayet güzelçözünürlükte yaptığınız site, browser'ınızda gayet güzel görünebilirken, 640*480 kullanan ziyaretçiningörünebilirken, 640*480 kullanan ziyaretçinin bilgisayarında dağınık ve biçimsiz görünebilir.bilgisayarında dağınık ve biçimsiz görünebilir.