Arkadaşlar bir web sitesi yapmak istiyoruz kişisel bir web sitesi yapıyoruz kendimize ve html yapacağız sitemizi
bunun için öncelikle sahip olmamız araç gereçler ve bilmemiz gerekn bazı şeyler var
bilmemiz gereken şeyler :
1 - Hosting : Hosting demek sitemizin internetteki deposu demek kısaca sitemizi internette yayınlamamız için bir hosting hesabımız olması gerekiyor bunun için bedava hosting hizmeti veren şirketler ve siteler var biz bunu yapmıyoruz sitemize özen göstermek istiyoruz ve bir hosting şirketinden hesap açtırıyoruz
Öneri Hosting Şirketleri : ******* Türkiye' nin en kaliteli host şirketlerinden burdan bir hesap seçip satın alabilirsiniz bunun için bilgiler adresteki sitede var
2 - Domain : Domain Demek sitemizin adresi demek örneğin böcekbisikletekibi.com veya .net veya .org bunlar ücretli domainler yani isimlerdir. Bunların yıllık ücreti maksimum 15 ytl civarındadır hosting ve domaini aynı şirketten alabilirsiniz ***** ' den diyelimki ikisinide aldık
başka bir hosting şirketide seçebilirsiniz kendinize arkadaşlar
bu satın alma işlemleri bittikten sonra bize bir hesap açılacak ve bilgiler gönderilecektir.
bu bilgiler arasında ftp bilgileri diye bir döküman olur ftp bilgileri sayesinde host umuza sitemizi yükleyeceğiz
-------------------------
şimdi birde diyelimki ücretsiz hosting şirketleri ile çalışmak istiyoruz
bunun dezavantajı nedir ? sitenizde istemediğiniz reklam bannerları olur felan
ama genede bunu istiyoruz o zaman
www.brinkster.com
www.freewebpage.org
bu sitelerden birini ziyaret edip üye oluyoruz bu sitelerde bize bir host alanı açacaktır ve ftp bilgilerimiz burda' da olacaktır.
dikkat : ücretsiz yer veren sitelerde adresiniz .com .net olmaz
bunlar sitemizi internette yayına sokma hakkındaki bilgilerdi bunları en son yapacağımız için şimdilik geçiyoruz
-----------------
Bize Lazım Olacak Araçlar
1 - Dreamweaver programı
(link)
bu adresten kayıt oluyoruz ücretsiz ve programın ücretsiz versiyonunu indiriyoruz 30 günlük kullanım zamanı vardır
isteyenler full versiyonunu bilgisayrcılardan alabilirler de
2 - Photoshop
bu program çoğu lişide vardır zaten olmayanlar için yukarıdaki linkteki sitede download bölmünde trial versions da bulabilirsiniz bilgisayarcılardan alabilirsiniz de
offf bu işler çok sıkıcı değilmi biz artık porgramlar felan tamamsa geçelim asıl işimize
----------------------
Adım 1 -bilgisayarımızda bir klasör açalım sitemiz bu klasörde olacak klasöre herhangi bir isim verebilirsiniz
Adım 2 - bu klasörün içine ismi images olan bir klasör daha açalım ve sitemizde kullanacağımız bütün resimleri bu images klasörüne kopyalayalım
Adım 3 - Dreamweaver ı açıyoruz karşınıza resimde gördüğünüz ekran geliyor resimdeki gibi html seçeneğini seçiyoruz.
http://img254.imageshack.us/img254/3029/27192491sc3.jpg
Adım 4 - Evet boş bembeyaz bir sayfa açıldı artık bunu biz güzelleştireceğiz
şimdi ilk olarak page properties adlı butonumuza tıklıyoruz alttaki blok da olacak
http://img267.imageshack.us/img267/1027/51799663qo9.jpg
burada sayfamızın bazı gene ayarlarını yapacağız arkadaşlar şimdi burda kırmızı ile numaralandırdığım bölümlerin açıklamasını yapacağım hemen size
1 - Sayfamızda kullanacağımız yazı tipini seçeceğimiz bölüm ben verdana öneririm
2 - Sayfamızda kullanacağımız fontun boyutu 12 veya 10 öneriyorum
3 - Sayfamızda kullanacağımız fontun rengi burdan herhangi bir renk seçeceğiz
4 - Sayfa Arka planı rengini seçeceğimiz yer
5 - Sayfamızın arka planı resim olsun istiyorsak burdan gözat butonuna basıyor ve sitemizin dosyalarını kaydetmek için oluşturduğumuz klasördeki images klasöründen bir resim seçiyoruz
Sol taraf ta hemen catogory yazıoyor bu konsolda orda links yazan yere geldiğimizde ise sitemizde olucak linklerimizin renklerini ayarlayabiliriz gene aynı mantıkla
ben arka plan rengimi siyah yazı rengimi beyaz seçtim verdana font ve 12 pt boyut yaptım apply ve sonrsında ok butonuna bastım ve ayarlarımı kaydettim
Sayfam beyazdı siyah oldu şimdi her sitede yapılır genellikle isterseniz siz yapmazsınız bir logo yapacağız
bunun için photoshopumuzu açıyoruz
1- Resimdeki gibi logomuz için bir çalışma tablosu oluşturacağız resimleri takip ediniz
aşağıdaki resimdeki gibi önce file sonra new tıklıyoruz
http://img267.imageshack.us/img267/240/68016689aa0.jpg
burası new e tıkladıktan sonra açılan yer burdan yapacağımız logomuzun büyüklüğünü giriyoruz ben 600 * 140 girdim iyi bi boyut ok butonuna basıyoruz sonra
http://img267.imageshack.us/img267/2218/68387827id2.jpg
burda gördüğünüz görüntü ok butonuna bastıktan sonraki solda bir araç çubuğumuz var burdan T ye basarsak yazı yazmamızı sağlar
hade canım sende
http://img267.imageshack.us/img267/9116/77115997en3.jpg
evet burda artık yazınızı yazıyorsunuz t ye basınca yukarıda font seçimi yapacağınız bi yer çıkıyor yaptıkmı logomuzu basit bişey yaptım bile ben siz uyuyun
bu gördüğünüz resim sitemizde kullanacağımız logo olsun
http://img295.imageshack.us/img295/388/32683202kw4.jpg
bunu yaptık şimdi photoshopta sıra kaydetmeye geldi
oda şöyle oluyor
gördüğünüz üzere file sonrasında save as tıklıyoruz
http://img295.imageshack.us/img295/1839/69798595pl4.jpg
sonra böyle bir pencere açılıyor burda kaydedeceğimiz yer resmimizi sitemiz için oluşturduğumuz klasörün içindeki images klasörü olmalıdır hatırlarsanız söylemiştik sitemizde kullanacağımız tüm resimleri öyle bir yere kaydetmeliyiz diye ve çok dikkat edelim sitemizde kullanacağımız hiçbir resim isminde türkçe karakter olmasın boşluk olmasın
yani örnek
alı.jpg > YANLIŞ
ali.jpg > DOĞRU
ali bak.jpg > YANLIŞ
alibak.jpg > DOĞRU
bu şekilde logomuzu kaydettikmi arkadaşlar
http://img124.imageshack.us/img124/6928/28280939ff1.jpg
şimdi tekrar dreamweaver ımıza dönüyoruz
bu resimdeki olayda şu okla gösterilen 1 numaralı buton a tıklıyoruz sayfamıza resim eklemek için hep
2 numaralı yer ise Sayfamızın Başlığını yazacağımız yer yani örnek bisiklet forum - Türkiyenin en bütük bisiklet forumu ... forumumuzda ki yukarıda olan yazının olduğu yerde gözükür bu yazı
http://img295.imageshack.us/img295/5215/80658709dz3.jpg
sonra bir numaralı butona bastık ve bir pencere çıktı gene burdan sitemizin klasörünü seçtik images içine girdik ve logomuzu seçip ok tuşuna bastık sitemize yerleşti logomuz
dreamweaver sayfasının aşağısında bir blok var orda yazıyuı ortalamak için veya resmi iconlar var onlara basıyoruz logomuzu ortalıyoruz
sonracığıma gelelim link yapmaya ve sayfalar oluşturmaya
ŞİMDİ GÖRDÜĞÜNÜZ GİBİ SAYFAMIZ DA LİNKLER OLUŞTURUYORUZ ÖNCELİKLE BU LİNKLERİN İSİMLERİNİ YAZDIK BU LİNKLE SİTEMİZDE YER ALICAK SAYFALAR AYNI ZAMANDA
http://img295.imageshack.us/img295/7498/10cp0.jpg
ANA SAYFA LİNKİNİ SEÇİYORUZ MOUSE İLE ve ok la gösterilen Link isimli ikince yere
index.html yazıyoruz
ana sayfamızın adını standart index.html yapıyoruz
diğer sayfaların isimleri ne olursa olsun uzantıları .html olacak bu arada
index.html yazdık kutucuğa enter a bastık diğer bölümlerede bunu uyguluyoruz resim galerisi mesela onada resimgalerisi.html gireceğiz mantık aynı mantık diğer linklerimizede bunu yapıyoruz
unutmadan bir önemli nokta daha .html kaydediyoruz ama bu linklerde kaydederken sakın gene türkçe karakter kullanmayın sayfada kullanabilirsiniz ama link yazna boşlukta mutlaka kullanmayın
örnek : iletisim.html > doğru
iletişim.html > Yanlış
ve sonra resimler ekleyeceğiz
gene iki üç önceki resimde gösterdiğimiz gibi sayfamıza resim eklemek için kullandığımız butona basıyoruz ve gene images klasörümüzden bir resim alıyoruz
ve arkadaşlar burdaki resimde görüyorsunuz bi resim ekledik sayfamıza onu küçültüp büyültebiliyoruz mouse ile
http://img443.imageshack.us/img443/3238/11tu3.jpg
sonra da aşağıdaki konsolda ok ile gösterdiğimiz bir yer var gördüğünüz üzere SRc yazıyor o kutunun içinde resmin uzantısı var ordaki yazıyı komple seçip bir altındaki link bölümüne kopyalayıp enter a bastığınız takdirde resminizin üsten gelindiğinde tıklandığında resminiz orjinal boyutunda açılacak büyüyecektir.
ve yaptığımız sayfayı kaydediyoruz
önce file > save as diyoruz sonra bu pencere çıkıyor
http://img443.imageshack.us/img443/1132/12hg7.jpg
sitemizin olduğu klasöre index.html olarak kaydettik diğer sayfalarıda yaptığımızda gene onlara index sayfamızı yaparken verdiğimiz link isimler örnek resimler.html resim galerisi bölmüünü yaptığımızda gene resimler.html diye kaydediyoruz böylelikle sayfalar arası geçiş sağlanmış oluyor
arkadaşlar temel mantığı size anlattım sonrası sizin hayal gücünüze kalmış oluyor çok yüzeysel anlattım ama bu işinize yarayacaktır. mutlaka siz bir başlayın aklınıza takıldığınız ne geliyorsa sorun burdan bana hepsini cevaplıyalım siteyi upload etme hakkındaki bilgiyide yarın yazayım çok yoruldum
bunun için öncelikle sahip olmamız araç gereçler ve bilmemiz gerekn bazı şeyler var
bilmemiz gereken şeyler :
1 - Hosting : Hosting demek sitemizin internetteki deposu demek kısaca sitemizi internette yayınlamamız için bir hosting hesabımız olması gerekiyor bunun için bedava hosting hizmeti veren şirketler ve siteler var biz bunu yapmıyoruz sitemize özen göstermek istiyoruz ve bir hosting şirketinden hesap açtırıyoruz
Öneri Hosting Şirketleri : ******* Türkiye' nin en kaliteli host şirketlerinden burdan bir hesap seçip satın alabilirsiniz bunun için bilgiler adresteki sitede var
2 - Domain : Domain Demek sitemizin adresi demek örneğin böcekbisikletekibi.com veya .net veya .org bunlar ücretli domainler yani isimlerdir. Bunların yıllık ücreti maksimum 15 ytl civarındadır hosting ve domaini aynı şirketten alabilirsiniz ***** ' den diyelimki ikisinide aldık
başka bir hosting şirketide seçebilirsiniz kendinize arkadaşlar
bu satın alma işlemleri bittikten sonra bize bir hesap açılacak ve bilgiler gönderilecektir.
bu bilgiler arasında ftp bilgileri diye bir döküman olur ftp bilgileri sayesinde host umuza sitemizi yükleyeceğiz
-------------------------
şimdi birde diyelimki ücretsiz hosting şirketleri ile çalışmak istiyoruz
bunun dezavantajı nedir ? sitenizde istemediğiniz reklam bannerları olur felan
ama genede bunu istiyoruz o zaman
www.brinkster.com
www.freewebpage.org
bu sitelerden birini ziyaret edip üye oluyoruz bu sitelerde bize bir host alanı açacaktır ve ftp bilgilerimiz burda' da olacaktır.
dikkat : ücretsiz yer veren sitelerde adresiniz .com .net olmaz
bunlar sitemizi internette yayına sokma hakkındaki bilgilerdi bunları en son yapacağımız için şimdilik geçiyoruz
-----------------
Bize Lazım Olacak Araçlar
1 - Dreamweaver programı
(link)
bu adresten kayıt oluyoruz ücretsiz ve programın ücretsiz versiyonunu indiriyoruz 30 günlük kullanım zamanı vardır
isteyenler full versiyonunu bilgisayrcılardan alabilirler de
2 - Photoshop
bu program çoğu lişide vardır zaten olmayanlar için yukarıdaki linkteki sitede download bölmünde trial versions da bulabilirsiniz bilgisayarcılardan alabilirsiniz de
offf bu işler çok sıkıcı değilmi biz artık porgramlar felan tamamsa geçelim asıl işimize
----------------------
Adım 1 -bilgisayarımızda bir klasör açalım sitemiz bu klasörde olacak klasöre herhangi bir isim verebilirsiniz
Adım 2 - bu klasörün içine ismi images olan bir klasör daha açalım ve sitemizde kullanacağımız bütün resimleri bu images klasörüne kopyalayalım
Adım 3 - Dreamweaver ı açıyoruz
karşınıza resimde gördüğünüz ekran geliyor resimdeki gibi html seçeneğini seçiyoruz.http://img254.imageshack.us/img254/3029/27192491sc3.jpg
Adım 4 - Evet boş bembeyaz bir sayfa açıldı artık bunu biz güzelleştireceğiz
şimdi ilk olarak page properties adlı butonumuza tıklıyoruz alttaki blok da olacak
http://img267.imageshack.us/img267/1027/51799663qo9.jpg
burada sayfamızın bazı gene ayarlarını yapacağız arkadaşlar şimdi burda kırmızı ile numaralandırdığım bölümlerin açıklamasını yapacağım hemen size
1 - Sayfamızda kullanacağımız yazı tipini seçeceğimiz bölüm ben verdana öneririm
2 - Sayfamızda kullanacağımız fontun boyutu 12 veya 10 öneriyorum
3 - Sayfamızda kullanacağımız fontun rengi burdan herhangi bir renk seçeceğiz
4 - Sayfa Arka planı rengini seçeceğimiz yer
5 - Sayfamızın arka planı resim olsun istiyorsak burdan gözat butonuna basıyor ve sitemizin dosyalarını kaydetmek için oluşturduğumuz klasördeki images klasöründen bir resim seçiyoruz
Sol taraf ta hemen catogory yazıoyor bu konsolda orda links yazan yere geldiğimizde ise sitemizde olucak linklerimizin renklerini ayarlayabiliriz gene aynı mantıkla
ben arka plan rengimi siyah yazı rengimi beyaz seçtim verdana font ve 12 pt boyut yaptım apply ve sonrsında ok butonuna bastım ve ayarlarımı kaydettim
Sayfam beyazdı siyah oldu
şimdi her sitede yapılır genellikle isterseniz siz yapmazsınız bir logo yapacağız bunun için photoshopumuzu açıyoruz
1- Resimdeki gibi logomuz için bir çalışma tablosu oluşturacağız resimleri takip ediniz
aşağıdaki resimdeki gibi önce file sonra new tıklıyoruz
http://img267.imageshack.us/img267/240/68016689aa0.jpg
burası new e tıkladıktan sonra açılan yer burdan yapacağımız logomuzun büyüklüğünü giriyoruz ben 600 * 140 girdim iyi bi boyut ok butonuna basıyoruz sonra
http://img267.imageshack.us/img267/2218/68387827id2.jpg
burda gördüğünüz görüntü ok butonuna bastıktan sonraki solda bir araç çubuğumuz var burdan T ye basarsak yazı yazmamızı sağlar
hade canım sende
http://img267.imageshack.us/img267/9116/77115997en3.jpg
evet burda artık yazınızı yazıyorsunuz t ye basınca yukarıda font seçimi yapacağınız bi yer çıkıyor yaptıkmı logomuzu basit bişey yaptım bile ben
siz uyuyun bu gördüğünüz resim sitemizde kullanacağımız logo olsun
http://img295.imageshack.us/img295/388/32683202kw4.jpg
bunu yaptık şimdi photoshopta sıra kaydetmeye geldi
oda şöyle oluyor
gördüğünüz üzere file sonrasında save as tıklıyoruz
http://img295.imageshack.us/img295/1839/69798595pl4.jpg
sonra böyle bir pencere açılıyor burda kaydedeceğimiz yer resmimizi sitemiz için oluşturduğumuz klasörün içindeki images klasörü olmalıdır hatırlarsanız söylemiştik sitemizde kullanacağımız tüm resimleri öyle bir yere kaydetmeliyiz diye ve çok dikkat edelim sitemizde kullanacağımız hiçbir resim isminde türkçe karakter olmasın boşluk olmasın
yani örnek
alı.jpg > YANLIŞ
ali.jpg > DOĞRU
ali bak.jpg > YANLIŞ
alibak.jpg > DOĞRU
bu şekilde logomuzu kaydettikmi arkadaşlar
http://img124.imageshack.us/img124/6928/28280939ff1.jpg
şimdi tekrar dreamweaver ımıza dönüyoruz
bu resimdeki olayda şu okla gösterilen 1 numaralı buton a tıklıyoruz sayfamıza resim eklemek için hep
2 numaralı yer ise Sayfamızın Başlığını yazacağımız yer yani örnek bisiklet forum - Türkiyenin en bütük bisiklet forumu ... forumumuzda ki yukarıda olan yazının olduğu yerde gözükür bu yazı
http://img295.imageshack.us/img295/5215/80658709dz3.jpg
sonra bir numaralı butona bastık ve bir pencere çıktı gene burdan sitemizin klasörünü seçtik images içine girdik ve logomuzu seçip ok tuşuna bastık sitemize yerleşti logomuz
dreamweaver sayfasının aşağısında bir blok var orda yazıyuı ortalamak için veya resmi iconlar var onlara basıyoruz logomuzu ortalıyoruz
sonracığıma gelelim link yapmaya ve sayfalar oluşturmaya
ŞİMDİ GÖRDÜĞÜNÜZ GİBİ SAYFAMIZ DA LİNKLER OLUŞTURUYORUZ ÖNCELİKLE BU LİNKLERİN İSİMLERİNİ YAZDIK BU LİNKLE SİTEMİZDE YER ALICAK SAYFALAR AYNI ZAMANDA
http://img295.imageshack.us/img295/7498/10cp0.jpg
ANA SAYFA LİNKİNİ SEÇİYORUZ MOUSE İLE ve ok la gösterilen Link isimli ikince yere
index.html yazıyoruz
ana sayfamızın adını standart index.html yapıyoruz
diğer sayfaların isimleri ne olursa olsun uzantıları .html olacak bu arada
index.html yazdık kutucuğa enter a bastık diğer bölümlerede bunu uyguluyoruz resim galerisi mesela onada resimgalerisi.html gireceğiz mantık aynı mantık diğer linklerimizede bunu yapıyoruz
unutmadan bir önemli nokta daha .html kaydediyoruz ama bu linklerde kaydederken sakın gene türkçe karakter kullanmayın sayfada kullanabilirsiniz ama link yazna boşlukta mutlaka kullanmayın
örnek : iletisim.html > doğru
iletişim.html > Yanlış
ve sonra resimler ekleyeceğiz
gene iki üç önceki resimde gösterdiğimiz gibi sayfamıza resim eklemek için kullandığımız butona basıyoruz ve gene images klasörümüzden bir resim alıyoruz
ve arkadaşlar burdaki resimde görüyorsunuz bi resim ekledik sayfamıza onu küçültüp büyültebiliyoruz mouse ile
http://img443.imageshack.us/img443/3238/11tu3.jpg
sonra da aşağıdaki konsolda ok ile gösterdiğimiz bir yer var gördüğünüz üzere SRc yazıyor o kutunun içinde resmin uzantısı var ordaki yazıyı komple seçip bir altındaki link bölümüne kopyalayıp enter a bastığınız takdirde resminizin üsten gelindiğinde tıklandığında resminiz orjinal boyutunda açılacak büyüyecektir.
ve yaptığımız sayfayı kaydediyoruz
önce file > save as diyoruz sonra bu pencere çıkıyor
http://img443.imageshack.us/img443/1132/12hg7.jpg
sitemizin olduğu klasöre index.html olarak kaydettik diğer sayfalarıda yaptığımızda gene onlara index sayfamızı yaparken verdiğimiz link isimler örnek resimler.html resim galerisi bölmüünü yaptığımızda gene resimler.html diye kaydediyoruz böylelikle sayfalar arası geçiş sağlanmış oluyor
arkadaşlar temel mantığı size anlattım sonrası sizin hayal gücünüze kalmış oluyor çok yüzeysel anlattım ama bu işinize yarayacaktır. mutlaka siz bir başlayın aklınıza takıldığınız ne geliyorsa sorun burdan bana hepsini cevaplıyalım
siteyi upload etme hakkındaki bilgiyide yarın yazayım çok yoruldum 
