WEB TASARIMWEB TASARIMTEMELLERİTEMELLERİ

Neden Web Siteniz Neden Web Siteniz OlmalıOlmalı Bir Web sayfası sadece onu incelemek isteyen “hedef Bir Web sayfası sadece onu incelemek isteyen “hedef

kitleye” ulaşır.kitleye” ulaşır. Web sayfaları oluşturmak için tek masrafınız telefon hat Web 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ğince Web 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 Web sayfalarınız 24 saat boyunca tüm dünyaya açık

olacak ve internet kullanıcılarına “etkileşimli” bir hizmet olacak ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir.verecektir.

Web sayfalarını kullanıcıların fikirlerini ve beklentilerini Web 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 Bazı Web Düzenleyicileri(Editör)Düzenleyicileri(Editör)

Microsoft Frontpage 2000:Microsoft Frontpage 2000: Microsoft firmasının, kendi ürünü olan Word’e Microsoft firmasının, kendi ürünü olan Word’e

benzerliğiyle dikkat çeken, bu nedenlede birçok benzerliğiyle dikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolay gelen düzenleyicisidir.kullanıcıya kullanımı kolay gelen düzenleyicisidir.

Artıları: Artıları: Frontpage en başta kullanması ve öğrenmesi Frontpage en başta kullanması ve öğrenmesi kolay bir düzenleyicidir.Ayrıca Microsoft’un ISS Web kolay bir düzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyla tümleşmesi çok iyidir.Frontpage görsel sunucusuyla tümleşmesi çok iyidir.Frontpage görsel arabilimi (tam olmasada WYSIWYG denebilir) arabilimi (tam olmasada WYSIWYG denebilir) sayesinde hiçbir HTML kodu yazmadan Web siteleri sayesinde hiçbir HTML kodu yazmadan Web siteleri oluşturabilmeyi sağlar.oluşturabilmeyi sağlar.

Eksileri: Eksileri: Frontpage, önceden sizin düzenlemiş Frontpage, önceden sizin düzenlemiş olabileceğiniz kodları, tekrardan düzenlemekte çok olabileceğiniz kodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenle sayfa kodlarına elle müdahale ısrarcıdır.Bu nedenle sayfa kodlarına elle müdahale etseniz bile, bir sonraki açışınızda bu ince ayarların etseniz bile, bir sonraki açışınızda bu ince ayarların silinme olasılığı yüksektir.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 En gelişmiş özelleştirebilme seçenekleri.Bir kod düzenleyicisi olsa da, sistemde IE4+ kod düzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlı miktarda görsel tasarıma izin yüklüyse, sınırlı miktarda görsel tasarıma izin vermektedir.Bütünleşik FTP istemcisi, şablonlama vermektedir.Bütünleşik FTP istemcisi, şablonlama desteği, siteleri projeler altında gruplandırma sistemi, desteği, siteleri projeler altında gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-VBScript-Java-CSS- SMIL-yazım kontrolü, Perl-PHP-ASP-VBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatik tanıma, ColdFusion gibi dilleri otomatik tanıma, Dreamweaver’la bütünleşme, istenen şekilde kodu Dreamweaver’la bütünleşme, istenen şekilde kodu girintileyebilme, çok iyi bir dokümantasyon, girintileyebilme, çok iyi bir dokümantasyon, Homesite’la tümleşik çalışan bir sürümüyle gelmesi.Homesite’la tümleşik çalışan bir sürümüyle gelmesi.

Eksileri:Eksileri: WYSIWYG düzenleyiler arayan kişiler için WYSIWYG düzenleyiler arayan kişiler için tam anlamıyla uygun olmaması, Windows 9x’de tam anlamıyla uygun olmaması, Windows 9x’de bellek kaçırması ve maalesef sadece Windows’ta bellek kaçırması ve maalesef sadece Windows’ta çalışması.çalışması.

Macromedia Dreamweaver:Macromedia Dreamweaver:Homesite’ın HTML kodu alanındaki liderliğini, Homesite’ın HTML kodu alanındaki liderliğini, WYSIWYG düzenleyiciler alanında paylaşan programWYSIWYG düzenleyiciler alanında paylaşan program

Artıları:Artıları: Dreamweaver’ın ilk göze çarpan özelliği, Dreamweaver’ın ilk göze çarpan özelliği, görsel düzenleyiciler arasında en iyi tablolama görsel düzenleyiciler arasında en iyi tablolama desteğini sunmasıdır.HTML koduna fazla müdahale desteğini sunmasıdır.HTML koduna fazla müdahale etmemesi, blokların kolayca seçilebilmesi, seçilen etmemesi, blokların kolayca seçilebilmesi, seçilen etiketlerin nerdeyse tüm özelliklerinin kolayca etiketlerin nerdeyse tüm özelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisi ve site ayarlanabilmesi, tümleşik FTP istemcisi ve site yönetimi,çok iyi DHTML ve Frame desteği, Internet yönetimi,çok iyi DHTML ve Frame desteği, Internet üzerinden de yüklenebilen etiketlerle üzerinden de yüklenebilen etiketlerle genişletilebilmesi, tabloları katmanlara, katmanları genişletilebilmesi, tabloları katmanlara, katmanları tablolara çevirebilmesi, rehber resim desteği, tablolara çevirebilmesi, rehber resim desteği, Homesite’la bütünleşme.Homesite’la bütünleşme.

Eksileri:Eksileri: Homesite kadar iyi bir doğrudan HTML kodu Homesite kadar iyi bir doğrudan HTML kodu yazımı olmaması ve maalesef sadece Windows ve yazımı olmaması ve maalesef sadece Windows ve MacOs’da çalışması.MacOs’da çalışması.

Netscape Composer:Netscape Composer:Netscape Gold ve Communicator paketlerinin içinden Netscape Gold ve Communicator paketlerinin içinden çıkan bir düzenleyicidir.Genel olarak, sayfalar çıkan bir düzenleyicidir.Genel olarak, sayfalar WYSIWYG modunda düzenlenir, ancak istenirse ekstra WYSIWYG modunda düzenlenir, ancak istenirse ekstra HTML kodu da sayfaya eklenebilir.HTML kodu da sayfaya eklenebilir.

Artıları:Artıları: Sayfaları tek tuşa basarak bir Web Sayfaları tek tuşa basarak bir Web sunucusuna aktarabilirsiniz.Genel görünümü bir sunucusuna aktarabilirsiniz.Genel görünümü bir kelime işlemci programına benzer.Yazım kontrolü kelime işlemci programına benzer.Yazım kontrolü desteği İngilizce bir sözlükle beraber gelir, ancak desteği İngilizce bir sözlükle beraber gelir, ancak kelimeleri öğrenme özelliği vardır.kelimeleri öğrenme özelliği vardır.

Eksileri:Eksileri: Site yönetimi, dokümantasyon, Site yönetimi, dokümantasyon, özelleştirebilme seçenekleri yoktur.Ayrıca, tablo özelleştirebilme seçenekleri yoktur.Ayrıca, tablo desteği gerçekten zayıf ve kullanması da ayrıca desteği gerçekten zayıf ve kullanması da ayrıca zordur.HTML dışında hiçbir dosya formatını da zordur.HTML dışında hiçbir dosya formatını da tanıyamaz.tanıyamaz.

HotDog Pro:HotDog Pro:Birkaç yıl öncesine kadar görsel olmayan Birkaç yıl öncesine kadar görsel olmayan düzenleyiciler piyasasında Homesite’la başabaş giden düzenleyiciler piyasasında Homesite’la başabaş giden bu program, yeni sürümlerinin sık sık göçmesi, bu program, yeni sürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesi gibi nedenlerle firmanın yanlış taktikler izlemesi gibi nedenlerle popülerliğini yitirmiştir.popülerliğini yitirmiştir.

Artıları:Artıları: Birçok özelleştirebilme seçeneği, tablo ve Birçok özelleştirebilme seçeneği, tablo ve frame’lerin yaratılmasında kullanılabilen sihirbazlar, frame’lerin yaratılmasında kullanılabilen sihirbazlar, tümleştirilebilentarayıcı desteği, site yönetimi, ftp tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi, renkli kodlama.istemcisi, renkli kodlama.

Eksileri:Eksileri: Sık sık göçmesi, zayıf dokümantasyon ve Sık sık göçmesi, zayıf dokümantasyon ve çalışmayı engelleyici ses efektleri.çalışmayı engelleyici ses efektleri.

Web Sayfalarının Web Sayfalarının TasarlanmasıTasarlanması

Yukarıda incelemesini yaptığımız birçok web editörü Yukarıda incelemesini yaptığımız birçok web editörü size HTML dilini bilmeden, size HTML dilini bilmeden, HTMLHTML kodlarını kullanarak kodlarını kullanarak web sitesi yapma imkanı veriyor.Bu tip editörler web sitesi yapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız her adımı, otomatikman sitenizde yaptığınız her adımı, otomatikman HTMLHTML koduna çeviriyor.koduna çeviriyor.

Peki o zaman neden Peki o zaman neden HTMLHTML öğrenmelisiniz? öğrenmelisiniz?HTMLHTML öğrenmelisiniz çünkü:öğrenmelisiniz çünkü: En basit neden; eğer iyi bir webmaster olmak En basit neden; eğer iyi bir webmaster olmak istiyorsanız, ve istiyorsanız, ve HTMLHTML bilmeden sadece bu tür bilmeden sadece bu tür programları kullanmayı düşünüyorsanız, muhtemelen programları kullanmayı düşünüyorsanız, muhtemelen programın verdiği, programdan kaynaklanan en küçük programın verdiği, programdan kaynaklanan en küçük bir hatada eliniz kolunuz bağlı kalacaktır. bir hatada eliniz kolunuz bağlı kalacaktır. Lisans gerektiren programlar. Birçok kaliteli "Lisans gerektiren programlar. Birçok kaliteli "HTMLHTML çevirici" programını kullanmak için, o programın çevirici" programını kullanmak için, o programın lisansına sahip olmanız gerekir. Ve bu da genelde lisansına sahip olmanız gerekir. Ve bu da genelde büyük paralar gerektirir. büyük paralar gerektirir.

HTML Nedir?HTML Nedir?

HTMLHTML, Hyper Text Mark-up Language'ın , Hyper Text Mark-up Language'ın kısaltılmışıdır. Türkçe karşılığı Hiper Metin İşaretleme kısaltılmışıdır. Türkçe karşılığı Hiper Metin İşaretleme Dili'dir. Browserlar tarafından tanınıp yorumlanabilen Dili'dir. Browserlar tarafından tanınıp yorumlanabilen metin tabanlı bir dildir ve metnin browser tarafından metin tabanlı bir dildir ve metnin browser tarafından yorumlanması sonucu da web sayfaları elde edilir.yorumlanması sonucu da web sayfaları elde edilir. Yazdığınız kodların browser tarafından alınıp Yazdığınız kodların browser tarafından alınıp yorumlanabilmesi için, dosyalarınızın uzantısının yorumlanabilmesi için, dosyalarınızın uzantısının ".htm" veya ".html" olması gerekir. ".htm" veya ".html" olması gerekir.

HTMLHTML de her işaretleme dilindeki gibi komutlardan de her işaretleme dilindeki gibi komutlardan oluşur, bu komutlara oluşur, bu komutlara tagtag veya veya mark-upmark-up denir. Tag'ler denir. Tag'ler herhangi bir metinden farklı oldukları browser herhangi bir metinden farklı oldukları browser tarafından anlaşılabilsin diye "<" ve ">" işaretlerinin tarafından anlaşılabilsin diye "<" ve ">" işaretlerinin arasına yazılır. Her tag'in bir başlangıcı ve bitişi vardır. arasına yazılır. Her tag'in bir başlangıcı ve bitişi vardır. Bitiş tag'lerinde, "<" işaretinden sonra tag'in bitiş Bitiş tag'lerinde, "<" işaretinden sonra tag'in bitiş tag'i olduğunu belirtmek için "/" işareti kullanılır. Bir tag'i olduğunu belirtmek için "/" işareti kullanılır. Bir örnek ile göstermemiz gerekirse;ö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 Tüm HTML dokümanını içine alan en temel tag'dir ve

dokümanın HTML ile yazıldığını browser'a bildirir.dokümanın 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ı 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 oluşturur. Buna sayfanın başlığı da dahildir. Ayrıca meta takıları da bu tag'in arasına yazılır:takıları da bu tag'in arasına yazılır:

<TITLE></TITLE> :<TITLE></TITLE> : Sayfa başlığıdır. Bu tag'in arasına Sayfa başlığıdır. Bu tag'in arasına yazılan her şey sayfamızın ismi olacak ve başlık yazılan her şey sayfamızın ismi olacak ve başlık

çubuğunda görüntülenecektir.çubuğunda görüntülenecektir.

META Etiketi:META Etiketi: Arama motorlarında iyi bir sıralama Arama motorlarında iyi bir sıralama kapmak için meta etiketleri içerisine yazdığımız notlar çok kapmak için meta etiketleri içerisine yazdığımız notlar çok önemlidir.ö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,Üniversitesi,DEÜ,DEUU,Fakülteler,Yüksekokullar,Enstitüler,Akademik Takvim, Üniversite, dokuz eylul university, Akademik Takvim, Üniversite, dokuz eylul university, Turkey, University,education,campus,Türkiye, academics, Turkey, University,education,campus,Türkiye, academics, students, faculty>students, faculty>

Sayfanızda kullandığınız Türkçe karakterlerin başka Sayfanızda kullandığınız Türkçe karakterlerin başka bilgisayarda bozuk şekillerde görülmemesi için:bilgisayarda 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 Sayfanın browser tarafından ekrana basılacak tüm kısımları bu tag'in arasına yazılır. Ekrana basılacak tüm kısımları bu tag'in arasına yazılır. Ekrana basılacak kısmın içine metinler, resimler, formlar, tablolar vs. kısmın içine metinler, resimler, formlar, tablolar vs. girer.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" <font face="Lucida Sans Unicode" size="+2" color="#297835">Web sayfama hoşgeldiniz</font><br>color="#297835">Web 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" <center><font face="Verdana" size="+2" color="#765678">Web sayfama color="#765678">Web sayfama hoşgeldiniz</font></center><br>hoşgeldiniz</font></center><br></body></body></html></html>

Sonuç:Sonuç:

Web Grafiklerinin Web Grafiklerinin Hazırlanması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 zor sayfalarda yer alan grafikler metinlerden daha da zor hazırlanırlar. Çünkü sayfada yer alacak renkler ve grafik hazırlanırlar. Çünkü sayfada yer alacak renkler ve grafik tasarımları sitenin genel çizgisini belirleyeceği için, özenle tasarımları sitenin genel çizgisini belirleyeceği için, özenle ve uyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ile ve uyumlu bir şekilde hazırlanmalıdır. Bu tip programlar ile hazırlanacak site grafiklerinde görselliğin yanında dikkat hazırlanacak site grafiklerinde görselliğin yanında dikkat edilecek bir başka unsur da grafik dosyalarının boyutlarının edilecek 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, küçü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 site o kadar yavaş açılacaktır ve bir site ne kadar görsel olursa olsun, eğer yavaş açılıyorsa pek de cazip olursa olsun, eğer yavaş açılıyorsa pek de cazip olmayacaktır. Bu tür çeşitli grafikleri tasarlamak için olmayacaktır. Bu tür çeşitli grafikleri tasarlamak için kullanabileceğiniz yegane program Photoshop'dur. Ancak kullanabileceğiniz yegane program Photoshop'dur. Ancak ücretli ve profesyonel bir program olan Photoshop'un ücretli ve profesyonel bir program olan Photoshop'un yerine buna çok yakın olan tamamen bedava olarak yerine buna çok yakın olan tamamen bedava olarak dağıtılan Paint Shop Pro adlı Shareware programı da dağıtılan Paint Shop Pro adlı Shareware programı da kullanabilirsiniz. Bu ve buna benzer programlar ile kullanabilirsiniz. Bu ve buna benzer programlar ile rahatlıkla arka fonlar, Web tuşları, başlıklar ve Banner'lar rahatlıkla arka fonlar, Web tuşları, başlıklar ve Banner'lar gibi sabit Web grafiklerini oluşturabilirsiniz.gibi sabit Web grafiklerini oluşturabilirsiniz.

Sayfaların Web Alanına Sayfaların Web Alanına GönderilmesiGönderilmesi

Grafikleri tasarladınız ve metinleri hazırladınız. Grafikleri tasarladınız ve metinleri hazırladınız. Bunları bir Web tasarım programı ile Web sayfası Bunları bir Web tasarım programı ile Web sayfası haline getirdikten sonra hazırlamış olduğunuz Web haline getirdikten sonra hazırlamış olduğunuz Web

sayfalarınısayfalarını kullanıcılara ulaştırabilmeniz için bunları kullanıcılara ulaştırabilmeniz için bunları yerleştireceğiniz Internet üzerinde bir disk alanına yerleştireceğiniz Internet üzerinde bir disk alanına yani Web alanına ihtiyacınız olacaktır. Bu işlem için yani Web alanına ihtiyacınız olacaktır. Bu işlem için en iyi çözüm yine Internet üzerinde size bedava en iyi çözüm yine Internet üzerinde size bedava sabitdisk alanı (host) sağlayan bir sunucu bulup sabitdisk alanı (host) sağlayan bir sunucu bulup sayfalarınızı oraya yerleştirmektir.Eğer alacağımız sayfalarınızı oraya yerleştirmektir.Eğer alacağımız alanın FTP desteği varsa, yaptığımız sayfaları alanın FTP desteği varsa, yaptığımız sayfaları CuteFTP gibi FTP programları ile sunucu üzerindeki CuteFTP gibi FTP programları ile sunucu üzerindeki alana gönderebilirsiniz.alana gönderebilirsiniz.

Ücretsiz Hosting Hizmeti Ücretsiz Hosting Hizmeti Veren Bazı Sitelerin Veren Bazı Sitelerin

İncelemeleriİncelemeleri www.20m.com Azbuz.comAzbuz.com

Sitenizin Barınacağı Sunucuyu Sitenizin Barınacağı Sunucuyu SeçerkenSeçerken

Dikkat Etmeniz Gereken Dikkat Etmeniz Gereken AyrıntılarAyrıntılar

Internet üzerinde yasal olmadığı kanıtlanmış Internet üzerinde yasal olmadığı kanıtlanmış MP3'ler, emülatör dosyaları, Crack, Hack, Warez, MP3'ler, emülatör dosyaları, Crack, Hack, Warez, çalınmış şifreler ve benzeri içerikle Adult öğelere çalınmış şifreler ve benzeri içerikle Adult öğelere sitenizde yer vermekten kaçının. sitenizde yer vermekten kaçının.

Seçtiğiniz sunucunun teknik özelliklerini mutlaka Seçtiğiniz sunucunun teknik özelliklerini mutlaka dikkate alın. Örneğin Frame yani çerçeveye izin dikkate alın. Örneğin Frame yani çerçeveye izin vermeyen bazı sunucular, iki ya da daha fazla vermeyen bazı sunucular, iki ya da daha fazla parçadan oluşmuş site tasarımınızı tam anlamıyla parçadan oluşmuş site tasarımınızı tam anlamıyla sunamayacaklardır. sunamayacaklardır.

Bunun yanında her sunucu çok serbest bir şekilde Bunun yanında her sunucu çok serbest bir şekilde CGI, Perl gibi dillerin kullanılmasına izin CGI, Perl gibi dillerin kullanılmasına izin vermeyebilir.vermeyebilir.

Unutulmaması gereken fazla disk alanı her zaman Unutulmaması gereken fazla disk alanı her zaman en iyi şey değildir. Sınırsız bir alanda hiçbir özellik en iyi şey değildir. Sınırsız bir alanda hiçbir özellik desteklenmeyeceği gibi, 3MB'lık bir alan sağlayan desteklenmeyeceği gibi, 3MB'lık bir alan sağlayan sunucu, buna karşılık Frame'den CGI dilllerine sunucu, buna karşılık Frame'den CGI dilllerine

kadar her şeyi destekleyebilir.kadar her şeyi destekleyebilir.

Web Tasarımını Web Tasarımını Destekleyici ProgramlarDestekleyici Programlar

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 Html 'nin geliştirilmesinin çok eski zamanlara dayanmasından mıdır? yoksa o zaman ki şartlarla dayanmasından mıdır? yoksa o zaman ki şartlarla düşünülmediği için midir? bilinmez ama html bazı düşünülmediği için midir? bilinmez ama html bazı yönden eksik bir dildir. İşte bu eksikliklerin anlaşıldığı yönden eksik bir dildir. İşte bu eksikliklerin anlaşıldığı dönemlerde, herkesin anlayabileceği ve kısa sürede dönemlerde, herkesin anlayabileceği ve kısa sürede öğrenilebileceği bir dil yaratma çabasında olan öğrenilebileceği bir dil yaratma çabasında olan Rasmus Lerdorf tarafından düşünülmüş ve Perl Rasmus Lerdorf tarafından düşünülmüş ve Perl dilinden esinlenilerek yapılmaya başlanmış bir dildir dilinden esinlenilerek yapılmaya başlanmış bir dildir Php. Php.

Php 'nin yaptığını kısaca anlatmak gerekirse; Web Php 'nin yaptığını kısaca anlatmak gerekirse; Web sayfası isteminde bulunan kullanıcılara, istenilen sayfası isteminde bulunan kullanıcılara, istenilen dosya içerisinde Php ile ilgili satırları işleyerek dosya dosya içerisinde Php ile ilgili satırları işleyerek dosya içeriğini kullanıcının Browser ' ının anlıyabileceği html içeriğini kullanıcının Browser ' ının anlıyabileceği html formatında sunan bir programlama dilidir diyebiliriz. formatında sunan bir programlama dilidir diyebiliriz. Bu genel anlamda Server-Side ( Server-Taraflı ) Dil Bu genel anlamda Server-Side ( Server-Taraflı ) Dil olarak anılır.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 En yakın rakibi ASP ile performans ve fiyat açısından açık farklılar vardır. Fiyat konusu haricinde ( açısından açık farklılar vardır. Fiyat konusu haricinde ( Php ücretsiz dağıtılmaktadır. ) ASP kullanıcılarının Php ücretsiz dağıtılmaktadır. ) ASP kullanıcılarının kabul etmedikleri şey hız faktörüdür. Belkide en çok kabul etmedikleri şey hız faktörüdür. Belkide en çok tartışılan bu konu hakkında en basit karşılaştırma; tartışılan bu konu hakkında en basit karşılaştırma; PHP + MySql ve ASP + MSSQL oranlarında PHP + MySql ve ASP + MSSQL oranlarında çıkmaktadır. Elde edilen verilere göre 5000 satırlık bir çıkmaktadır. Elde edilen verilere göre 5000 satırlık bir bilgiyi database’ e; aynı makina üzerinde Php ve bilgiyi database’ e; aynı makina üzerinde Php ve MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28 MySql 3 ( Üç ) saniyede girerken, ASP + MSSQL 28 saniyede girmektedir.saniyede girmektedir. Php 'nin açık kaynak kodlu oluşu, hataların veya Php 'nin açık kaynak kodlu oluşu, hataların veya yeni özelliklerin güncellenmesi/eklenmesi gibi yeni özelliklerin güncellenmesi/eklenmesi gibi olaylarda büyük avantajlar sağlamaktadır.olaylarda büyük avantajlar sağlamaktadır. Kişisel kullanıcılar; Php ile web sayfalarında daha Kişisel kullanıcılar; Php ile web sayfalarında daha çok kullanıcı etkileşimli kodlar kullanmaktadır. Örnek çok kullanıcı etkileşimli kodlar kullanmaktadır. Örnek olarak; Ziyaretçiler için oluşturulan, forum, sayaç, olarak; Ziyaretçiler için oluşturulan, forum, sayaç, anket gibi kodlarda Php çok rağbet görmektedir.anket gibi kodlarda Php çok rağbet görmektedir.

Peki bu dilin dezavantajları Peki bu dilin dezavantajları nelerdir?nelerdir?Günümüzde büyük şirketlerde internet ve intranet Günümüzde büyük şirketlerde internet ve intranet uygulamalarda , büyük paya sahip Microsoft firması, uygulamalarda , büyük paya sahip Microsoft firması, kendi ürünü olan ASP için büyük çabalar kendi ürünü olan ASP için büyük çabalar sarfetmektedir. Yeni teknolojiler ( Özellikle .Net ) ile sarfetmektedir. Yeni teknolojiler ( Özellikle .Net ) ile ASP ye hergün yeni zeminler hazırlamakta ve iş ASP ye hergün yeni zeminler hazırlamakta ve iş istihdamı konusunda ASP yi bir adım öne istihdamı konusunda ASP yi bir adım öne taşımaktadır. Sunucu fiyatları olarak Php 'ye göre taşımaktadır. Sunucu fiyatları olarak Php 'ye göre yerine göre üç kat daha fazla oranda olmasına yerine göre üç kat daha fazla oranda olmasına rağmen, büyük şirketler tarafından tercih rağmen, büyük şirketler tarafından tercih edilmektedir.edilmektedir.

ASP (Active Server Pages)ASP (Active Server Pages)Sunucu taraflı bir teknoloji olan ASP, (Active Server Sunucu taraflı bir teknoloji olan ASP, (Active Server Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına Pages/Aktif Sunucu Sayfaları) kullanıcı tarafına etkileşimli, dinamik Web sayfaları göndermek için etkileşimli, dinamik Web sayfaları göndermek için kullanılır. ASP, Web programcılarına HTML, scripting kullanılır. ASP, Web programcılarına HTML, scripting ve kullanıcıdan bağımsız veritabanı uygulamalarını ve kullanıcıdan bağımsız veritabanı uygulamalarını özgürce kullanma fırsatı verir. ASP programlama özgürce kullanma fırsatı verir. ASP programlama ortamının özgür olmasının sebebi tüm derleme ortamının özgür olmasının sebebi tüm derleme işleminin sunucu tarafında bitmesi ve kullanıcının işleminin sunucu tarafında bitmesi ve kullanıcının

sadece sonuçta oluşan HTML sayfalarını görmesidir.sadece sonuçta oluşan HTML sayfalarını görmesidir.

ASP’nin Kullanım Amaçları ve ASP’nin Kullanım Amaçları ve AvantajlarıAvantajları Çok geniş bir kullanım alanı olan ASP, scripting Çok geniş bir kullanım alanı olan ASP, scripting diye tabir edilen VBScript, JavaScript gibi her türlü diye tabir edilen VBScript, JavaScript gibi her türlü ham kodu kullanabilir, sunduğu kolay anlaşılır doğal ham kodu kullanabilir, sunduğu kolay anlaşılır doğal dili ile orta derece HTML bilen kimseler tarafından dili ile orta derece HTML bilen kimseler tarafından

bile kolayca kavranabilir.bile kolayca kavranabilir. ASP'nin Netscape Navigator / Internet Explorer ASP'nin Netscape Navigator / Internet Explorer /Opera gibi Web tarayıcılarından bağımsız olmasının /Opera gibi Web tarayıcılarından bağımsız olmasının yanısıra en büyük avantajlarından biri kullandığınız yanısıra en büyük avantajlarından biri kullandığınız teknolojilerin, scriptlerin saklı kalmasıdır. teknolojilerin, scriptlerin saklı kalmasıdır. ASP ile hazırlanan projeler kaynakların yönetimi, ASP ile hazırlanan projeler kaynakların yönetimi, kontrolü ve uzaktan sistem yönetimine imkan verir. kontrolü ve uzaktan sistem yönetimine imkan verir. Şirketler arası bilgi paylaşımı için ideal bir ortam Şirketler arası bilgi paylaşımı için ideal bir ortam oluşturur.oluşturur.

JAVA SCRIPTJAVA SCRIPTJava Script Java Script Netscape tarafından geliştirilmiş bir script tarafından geliştirilmiş bir script dilidir. Düz yazı formundadır. Browserlara bağlıdır ve dilidir. Düz yazı formundadır. Browserlara bağlıdır ve yorumlanır. HTML'nin içine katılır. Etiketi yorumlanır. HTML'nin içine katılır. Etiketi <script>...</script> şeklindedir.<script>...</script> şeklindedir.

Java Script; etkileşimli web sayfası yapımında Java Script; etkileşimli web sayfası yapımında HTML'nin yetersiz kalması nedeniyle C/C++ dilleri baz HTML'nin yetersiz kalması nedeniyle C/C++ dilleri baz alınarak geliştirilen, "düz yazı" formunda bir script alınarak geliştirilen, "düz yazı" formunda bir script (komutlar dizisi) dilidir. Java Script kodları herhangi bir (komutlar dizisi) dilidir. Java Script kodları herhangi bir metin editörü (Win 95/98 Not defteri vb.) ile düz yazı metin editörü (Win 95/98 Not defteri vb.) ile düz yazı formunda yazılabilir. Bu şekilde yazılmış Java Script formunda yazılabilir. Bu şekilde yazılmış Java Script kodları istemci tarafında, yani ziyaretçinin web kodları istemci tarafında, yani ziyaretçinin web tarayıcısı tarafından yorumlanır ve yaptırılmak tarayıcısı tarafından yorumlanır ve yaptırılmak istenen işlemler gerçekleşir. Ama bu işlemlerin istenen işlemler gerçekleşir. Ama bu işlemlerin gerçekleşmesi için mutlaka bir olay gereklidir. gerçekleşmesi için mutlaka bir olay gereklidir. (Örneğin, sayfanın açılması-kapanması, ziyaretçinin (Örneğin, sayfanın açılması-kapanması, ziyaretçinin sayfada herhangi bir yeri tıklaması veya klavyede sayfada herhangi bir yeri tıklaması veya klavyede herhangi bir tuşa basması gibi...) herhangi bir tuşa basması gibi...)

Java Script kodlarını web sayfası içerisinde 2 şekilde Java Script kodlarını web sayfası içerisinde 2 şekilde tanımlayabiliriz;tanımlayabiliriz;

1.1. HTML kodları içerisinde HTML 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 ve Düz yazı formunda ve .js.js uzantısı ile farklı bir uzantısı ile farklı bir dosya oluşturup, bu dosyaya HTML içerisinde link dosya oluşturup, bu dosyaya HTML içerisinde link vererek.vererek. <SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> <SCRIPT LANGUAGE="javaScript" src="inc/navbar.js"> </SCRIPT></SCRIPT>

JAVA APPLETJAVA APPLETJava (yani Java Applet), Java (yani Java Applet), Sun Microsystems tarafından tarafından geliştirilmiş nesneye yönelik programlama dilidir ve geliştirilmiş nesneye yönelik programlama dilidir ve işletim sistemlerinden bağımsız olarak çalışır. HTML'nin işletim sistemlerinden bağımsız olarak çalışır. HTML'nin bir parçası olamaz. Etiketi <applet>...</applet> bir parçası olamaz. Etiketi <applet>...</applet> şeklindedir.şeklindedir.Java Applet hazırlayabilmeniz için Sun firmasının Java Applet hazırlayabilmeniz için Sun firmasının ücretsiz olarak dağıttığı JDK (Java Development Kit – ücretsiz olarak dağıttığı JDK (Java Development Kit – Java Geliştirme Ortamı) programını download etmeniz Java Geliştirme Ortamı) programını download etmeniz gerekmektedir.gerekmektedir.

<APPLET code=hotbutton.class height=20 <APPLET code=hotbutton.class height=20 width=122>width=122>

<PARAM NAME="clıp" VALUE=""><PARAM NAME="clıp" VALUE=""><PARAM NAME="actıveshadow" <PARAM NAME="actıveshadow"

VALUE="fff9e3">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>

CSSCSSCSS (Cascading Style Sheets), Bir CSS (Cascading Style Sheets), Bir HTML dökümanındaki HTML takılarının sitillerini belirleyen dökümanındaki HTML takılarının sitillerini belirleyen tekniktir. tekniktir.

CSS kodlarını web sayfası içerisinde 3 şekilde CSS 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 style= font-family:Verdana,Arial> CSS öğreniyorum </h1></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; h1.buyukyazilar {font-family:verdana; color:yellow}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" <link rel="stylesheet" type="text/css"

href="sitillerim.css">href="sitillerim.css">

CSS Öğrenmenin avantajları:CSS Öğrenmenin avantajları:CSS, HTML takılarına, HTML ile yapılamayacak fakat CSS, HTML takılarına, HTML ile yapılamayacak fakat işinizi kolaylaştıracak bir çok özellik katabilir. Örneğin; işinizi kolaylaştıracak bir çok özellik katabilir. Örneğin; hemen hemen tüm web sayfalarında gördüğünüz hemen hemen tüm web sayfalarında gördüğünüz değişik link sitilleri, CSS kullanılarak yapılmıştır. CSS değişik link sitilleri, CSS kullanılarak yapılmıştır. CSS ile sayfalarınızı daha hızlı hale getirebilir ve dosyanın ile sayfalarınızı daha hızlı hale getirebilir ve dosyanın yükünü hafifletebilirsiniz. Sayfalarınız için yükünü hafifletebilirsiniz. Sayfalarınız için hazırlayacağınız bir CSS dosyasını kullanarak tüm hazırlayacağınız bir CSS dosyasını kullanarak tüm sayfalarınıza aynı özellikleri verebilir, dolayısıyla hız sayfalarınıza aynı özellikleri verebilir, dolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'in ve tutarlılık sağlamış olursunuz. Tabiki CSS'in yapabilecekleri bunlarla sınırlı değildir. CSS yapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindeki kolaylığın aksine kapasitesi büyük öğrenilmesindeki kolaylığın aksine kapasitesi büyük bir dildir. 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 RehberiCSS RehberiCSS Rehberi  

CSS RehberiCSS Rehberi CSS RehberiCSS Rehberi

FlashFlashFlash, Macromedia tarafından geliştirilmiş Internet'te Flash, Macromedia tarafından geliştirilmiş Internet'te etkileşimli vektörel grafik ve animasyon etkileşimli vektörel grafik ve animasyon hazırlanmasında kullanılan bir standarttır. Web hazırlanmasında kullanılan bir standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir, çok az tasarımcıları Flash'ı çekici, ölçümlendirilebilir, çok az yer kaplayan gezinilebilir yüzeyler, teknik yer kaplayan gezinilebilir yüzeyler, teknik canlandırmalar, uzun süreli animasyonlar ve diğer canlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcı efektleri yapmak amacıyla kullanırlar.şaşırtıcı efektleri yapmak amacıyla kullanırlar.

Kullanım Alanları:Kullanım Alanları: Flash ile en küçük reklam pankartından (banner), en Flash ile en küçük reklam pankartından (banner), en karmaşık animasyonun yapılması, hatta bütün bir web karmaşık animasyonun yapılması, hatta bütün bir web sitesinin oluşturulması mümkündür. Interaktif CD'lerin sitesinin oluşturulması mümkündür. Interaktif CD'lerin hazırlanması, oyunlar, veritabanı uygulamaları, PHP ve hazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XML gibi birçok dil ile kullanılabilme, Flash'ın ileri XML gibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetleri arasında sayılabilir.düzey maharetleri arasında sayılabilir. Flash ile ses ile biteşlemler (bitmap) birleştirilebilir. Flash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani bir dosyanın içine müzik yada ses efekti rahatlıkla Yani bir dosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Bu bize etkileşim daha üst seviyelere gömebiliriz. Bu bize etkileşim daha üst seviyelere çekebilme şansını verir.çekebilme şansını verir.         

Flash içerisinde bulunan bütün görüntü, ses, text Flash içerisinde bulunan bütün görüntü, ses, text elemanları flash'a özgü bazı sıkıştırma teknikleri elemanları flash'a özgü bazı sıkıştırma teknikleri sayesinde çok küçük boyutlara sıkıştırılabilir. Bu sayesinde çok küçük boyutlara sıkıştırılabilir. Bu sıkıştırma oranları program içerisinden kalitelerini sıkıştırma oranları program içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir. Böylece örneğin 1 değiştirmek suretiyle ayarlanabilir. Böylece örneğin 1 birim tutan bir ses/görüntü dosyası 0.1 ile 0.9 birim tutan bir ses/görüntü dosyası 0.1 ile 0.9 arasında boyutlarda son kullanıcıya ulaştırılabilir.arasında boyutlarda son kullanıcıya ulaştırılabilir.           Macromedia Flash programı, macromedia'nın Macromedia Flash programı, macromedia'nın http://www.macromedia.com adresinden deneme adresinden deneme amaçlı olarak indirilebilir. Bunun dışında tam kullanım amaçlı olarak indirilebilir. Bunun dışında tam kullanım için belirli bir ücret karşılığında macromedia'dan yada için belirli bir ücret karşılığında macromedia'dan yada temsilciliklerinden temin edilebilir. temsilciliklerinden 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 sayfaya Tabloları amacınıza uygun şekilde sayfaya yerleştirdiğinizde sayfanız, görsel açıdan daha yerleştirdiğinizde sayfanız, görsel açıdan daha üstün bir tasarıma sahip olacaktır. Çünkü hizalama, üstün bir tasarıma sahip olacaktır. Çünkü hizalama, uygun yere uygun resmi yerleştirme gibi şeyler kod uygun yere uygun resmi yerleştirme gibi şeyler kod yazarak çok uzun sürebilir. Ama tablolar ile bu yazarak çok uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz.problemi aşabilirsiniz.

Dikkat edilmesi gereken en önemli şeylerden biri Dikkat edilmesi gereken en önemli şeylerden biri de resim kullanımı. Sayfalarınızda mümkün de resim kullanımı. Sayfalarınızda mümkün olduğunca az resim kullanın. Şayet resim olduğunca az resim kullanın. Şayet resim kullanırsanız, boyutları minimum, kaliteyi optimum kullanırsanız, boyutları minimum, kaliteyi optimum düzeyde tutmaya özen gösterin. Çünkü Türkiye de düzeyde tutmaya özen gösterin. Çünkü Türkiye de internetin hızı malum. Teorik hızı 44.000 kb 'ı internetin hızı malum. Teorik hızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızın açılmasını geçmeyen ziyaretçi, sayfanızın açılmasını dakikalarca bekleyemeyebiliyor. Sayfaların da daha dakikalarca bekleyemeyebiliyor. Sayfaların da daha çabuk açılması için akla gelen ilk şey de resimler çabuk açılması için akla gelen ilk şey de resimler oluyor. Eğer ki resimden başka Java Applet vs. oluyor. Eğer ki resimden başka Java Applet vs. varsa önceliği bunlara verin. varsa önceliği bunlara verin.

İnternet üzerinde en çok kullanılan browser'lar IE İnternet üzerinde en çok kullanılan browser'lar IE ve Netscape Navigator'dır. Büyük çoğunlukla da IE ve Netscape 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 browserlarda sitenizin nasıl göründüğünü test etmeniz gerekebilmektedir. Çünkü bazı tag'ler farklı etmeniz gerekebilmektedir. Çünkü bazı tag'ler farklı browserlarda aynı etkiyi yaratamayabilmektedir. browserlarda aynı etkiyi yaratamayabilmektedir. Bunun da çabuk fark edilmesi, sizi emek, zaman ve Bunun da çabuk fark edilmesi, sizi emek, zaman ve kaynak kaybından kurtarabilir.kaynak kaybından kurtarabilir.

Sayfalarınızı, farklı ekran çözünürlüklerinde test Sayfalarınızı, farklı ekran çözünürlüklerinde test edin. Optimum çözünürlükte karar kıldığınızda edin. Optimum çözünürlükte karar kıldığınızda sayfaları bu ekran çözünürlüğünde tasarlayın. Bunu sayfaları bu ekran çözünürlüğünde tasarlayın. Bunu yapmanızdaki sebep şudur: Her kullanıcı sizinle yapmanızdaki sebep şudur: Her kullanıcı sizinle aynı ekran çözünürlüğünü kullanmayabilir. Sizin aynı ekran çözünürlüğünü kullanmayabilir. Sizin 800*600 çözünürlükte yaptığınız site, 800*600 çözünürlükte yaptığınız site, browser'ınızda gayet güzel görünebilirken, 640*480 browser'ınızda gayet güzel görünebilirken, 640*480 kullanan ziyaretçinin bilgisayarında dağınık ve kullanan ziyaretçinin bilgisayarında dağınık ve biçimsiz görünebilir.biçimsiz görünebilir.