Kendi BedavA Web SiteniZi KuruN = Mukemmel Anlatım Alıntı De

Web Sitesi Yapmak

Web site yapmak istiyorsanız ve nereden başlayacağınızı bilmiyorsanız doğru adresdesiniz. Web site yapmak için ihtiyaç duyacağınız programlar ve bilgilere bu sayfadan ulaşabileceksiniz. Uygulamalı olarak göstereceğim adımları izlediğiniz takdirde sizin de kaliteli bir web site sahibi olacaksınız. Ayrıca webmaster olmak için ilk adımları atacaksınız.



Site Tasarımı ve İçeriği

Sitenizin konusu, içeriği ve tasarımı ziyaretçi sayısını etkileyen en önemli etkendir. O yüzden konu, içerik ve tasarım belirlemek sanılandan daha ciddi bir iştir ve site yapmanın en önemli adımıdır.
Ön Hazırlık

Site yapımına başlamadan önce ne sitesi yapacağınıza karar verin ve yeterli içerik oluşturun. Kolay gibi görünse de web sitesi yapmak isteyenlerin çoğu hazırlık yapmadan site yapımına başladığı için zaman kaybediyor, zorluklar yaşıyor. O nedenle ön hazırlığınızı tamamlamanız, sitenizin planı, tasarımı ve içeriğini önceden oluşturmanız yararınızadır.
Site Konusu

İnternetteki binlerce websitesi birbirleri ile yarış halindeler. Her site arama motorlarındaki sıralamasını artırıp daha çok ziyaretçiye ulaşmaya çalışıyor. Bu durumda yeni açılan sitelerin üst sıraları alması ve ziyaretçi çekmesi zorlaşıyor. Üst sıralara çıkıp kolayca ziyaretçi çekmek istiyorsanız farklı konusu ve içeriği olan bir web sitesi açmalısınız. Örneğin arabalar hakkında site açmak yerine yerli arabalar veya modifiyeli arabalar gibi alt kategorilerden siteler açarsanız hedeflediğiniz ziyaretçilere daha kolay ulaşırsınız. Ayrıca çeşitli konular yerine tek konusu olan siteler daha başarılı olur. Örneğin hem download yapıp, hem bilgisayarlar hem arabalar hakkında bilgiler bulabileceğiniz web siteleri var. Ama download sitesi dendiği zaman akla sadece bir veya iki site gelir.
Hazır Web Sitesi Tasarımları - Şablonlar

Sitenizin tasarımına zaman harcamak istemiyorsanız veya iyi tasarım yapamayacağınızı düşünüyorsanız hazır site şablonlarını kullanabilirsiniz. Hazır site şablonları, iyi tasarım yapan kişilerin hazırladıkları site örnekleridir. Bu şablonları indirerek ve üzerinde değişiklikler yaparak sitenizi oluşturabilirsiniz. Şablonunuzu seçtikten sonra üzerinde ne gibi değişiklikler yapacağınızı düşünün. (Site Yapmak menüsü altındaki linki kullanarak Şablonlar sayfasına ulaşabilirsiniz.)
Site tasarımı ve içeriği ile ilgili hazırlığınızı tamamladıysanız kullanacağımız programları tanımak ve indirmek için Site Porgramları sayfasına geçebilirsiniz.

Site Programları

Web sitesi yapmak için iki çeşit programa ihtiyacımız olacak. Web sitemizin sayfalarını oluşturmak, sayfalarımızın tasarımını yapmak, sayfalarına resim müzik yazı, içerik eklemek için kullanacağımız bir html düzenleyici (html editör) ve hazırladığımız web sitesini internete bağlı bir sunucuya göndermek için kullanacağımız bir ftp programı. Şimdi web sitesi yapmak için en çok tercih edilen html editör programlarına bir göz atalım. (Sadece forum sitesi açmak istiyorsanız html editöre ihtiyacı olmayacak.)

HTML Editörler

Dreamweaver (Dw)

Webmasterlerin çoğu web sitesi yapmak için Dreamweaver'i tercih eder. Diğer html editörlere göre artılarının çok olması, yapımcısı Adobe firmasının diğer programları ile uyumlu çalışması ve WYSIWYG (What you see is what you get = Ne görürsen onu elde edersin) şeklinde çalışması nedeniyle en çok tercih edilen html editör programıdır. Belki çoğu özelliğini henüz keşfedemediğim için hak ettiği kadar övemiyorum ama Dreamweaver'i kullanmanızı tavsiye ederim.
Dreamweaver'in 30 günlük deneme sürümünü indirmek için tıklayın. Dreamweaver CS3 İndir Açılan sayfadan Free Trial linkine tıklayıp üye olduktan sonra deneme sürümünü indirebilirsiniz.
Microsoft FrontPage (FP)

Microsoft Office programı olan FrontPage, web sitesi yapmak için en çok tercih edilen html editörlerden biridir. Yeni başlayanlar için kullanımı kolay olması ve tasarımcıya kolaylık sağlayan araçlarının olması nedeniyle tercih edilen bir html editördür. Frontpage'de önce bir site haritası oluşturup bu haritaya sayfalar ekliyorsunuz. Daha sonra bu sayfalara içerik ekleyerek web sitenizi oluşturuyorsunuz. Sitenizin sayfalarını birbirine bağlamak gibi şeylerle uğraşmanıza gerek kalmıyor. Çünkü Frontpage, site haritasına göre sitenizin sayfalarını bağlıyor, menü oluşturuyor. Size sadece oluşturulacak menüdeki butonların şeklini seçmek kalıyor.
Fp, Office programları arasında kurulmuş olabilir. Başlat>Microsoft Office>Microsoft FrontPage yolunu izleyerek FP'yi çalıştırabilir, web sitesi yapımına başlayabilirsiniz.
FTP Programı

Web sitesi yapmak için ihtiyaç duyacağımız diğer program ise sitemizi internetteki bir sunucuya göndermek için kullanacağımız ftp programı. Ftp programı olarak Firefox'un bir eklentisi olan FireFtp'yi kullanacağız. Tamamen ücretsiz bir program olan FireFTP, bir Firefox eklentisi olduğu için önce Firefox'u bilgisayarımıza yüklemeliyiz. (Eğer bilgisayarınızda Firefox yüklü ise buraya tıklayarak FireFtp programını indirebilirsiniz.)
Hala Internet Explorer kullanıyorsanız Firefox'u ücretsiz indirin ve size sağlayacağı kolaylıkları keşfedin derim. Firefox ile web sayfalarını daha hızlı ve güvenli bir şekilde dolaşabilirsiniz. Firefox, sayfaları seklemelerde açarak görev çubuğunda fazla yer kaplamıyor, çeşitli eklentiler sayesinde daha hızlı ve güvenli sörf yapmanızı sağlıyor, sık kullanılan sitelere daha kolay ulaşmanızı sağlıyor. Firefox'un iyi yönlerini Microsoft da görmezden gelmemiş ve Internet Explorer'in yeni versiyonlarını Firefox benzeri hale getirmiş. Ödüllü tarayıcı olan Firefox'un nasıl göründüğünü ve sağladığı kolaylıklardan bazılarını buraya tıklayarak görebilirsiniz.
Firefox'u buraya tıklayarak indirebilirsiniz. Ama Firefox ile Google Araç çubuğunu da indirmenizi tavsiye ederim. Böylece Firefox yanında Google Araç Çubuğu'nun da sağladığı kolaylıklardan faydalanabileceksiniz. Örn: Google aramalarınızı kolaylaştıracak, tek tık ile Gmail hesabınıza ulaşabilecek, web sitelerinin Page Rank değerini öğrenebileceksiniz. Aşağıdaki banner bağlantıyı kullanarak Google Araç çubuğu ile birlikte Firefox'u bilgisayarınıza indirebilirsiniz.

Firefox'u indirdiyseniz buraya tıklayarak FireFtp'yi indirebilirsiniz.
Gerekli programları indirdikten sonra site yapımına başlayabilirsiniz. Her iki program ile nasıl site yapılacağını ve nasıl forum sitesi kurulacağını anlatmaya çalıştım. Tabiki bu sitedeki bilgilerle yetinmeyip zamanla programların diğer özelliklerini öğrenerek kendinizi geliştirebilirsiniz. www.bedavasiteyapmak.com'u oluşturmak için aşağıdaki Dreamweaver anlatımı ve resimleri düzenlemek için biraz Fireworks bilgisi yeterli olmuştu.



Dreamweaver ile Site Yapımı


Webmasterlerin çoğu, site yapımı için Dreamweaver'i tercih eder. Bunun sebebi çok özelliği olması, tek başına yapabileceği çok şey olması ve web sitesi yapmak için kullanılan Adobe firmasının diğer programları ile uyumlu çalışmasıdır. Bu nedenle html editör dendiğinde akla gelen ilk program genellikle Dreamweaver olur. Bu, Dreamweaver'in rakiplerine oranla daha çok tercih edilmesini sağlar ancak bu kadar çok özelliği ve yeteneği olan bir program bir çok ayar gerektirdiğinden ve araç içerdiğinden çoğu kullanıcıya göre kullanımı zor veya karmaşık gelmektedir. Ben de ilk başta Frontpage ile başladığım site yapımına tavsiyeler üzerine Dreamweaver ile devam etmeye karar verdim. Öğrenmeye başladığım sıralarda yaşadığım zorlukların artık hiç birini yaşamıyorum. Ben de size Dreamweaver kullanmanızı tavsiye ederim. Lafı uzatmadan Dreamweaver ile sitemizi nasıl oluşturacağız beraber bakalım.
Dreamweaver'in çalışma alanı görünümü aşağıdaki gibidir. Lütfen resmi inceleyin.
Aşağıda gördüğünüz şablonu kullanarak fıkralar ve komik resimler içeren bir web sitesi açacağım. Site yapımına başlamadan önce web siteme ekleyeceğim fıkraları ve komik resimleri hazırladım. Anasayfaya bir fıkra ve bir komik resim ekleyip altına fıkralar ve komik resimler sayfalarına giden linkler ekleyeceğim. Şablonun solundaki bölüme site sayfalarına giden linkleri sağındaki bölüme ise reklam kodlarını ekleyeceğim.
Şimdi bu şablonu kullanarak sitemizi hazırlayalım. (Sayfanın sağındaki şablonlar bağlantısını kullanarak yüzlerce şablon içerisinden seçtiğim hazır site şablonlarını indirebilir, beğendiğiniz bir tanesini kullanarak sitenizi oluşturabilirsiniz.) Şablonun içerisinde olduğu klasörü kopyalayıp C diskine yapıştırıyorum ve klasöre "Site" adını veriyorum. Bu klasör "kök klasör" olarak adlandırılır.(1) Kök klasörün içinde index.html dosyası ve images klasörü bulunur. (2) Sitemizi oluşturup yeni sayfalar oluşturdukça bu sayfaları kök klasöre, sitemizde kullanacağımız resimleri de images klasörüne koyacağız.
1.Sitemizi Dreamweaver'e tanıtalım.

Web sitemizin sorunsuz çalışması için sitemizi Dreamweaver'e tanıtmamız gerekir. Site>New Site>Advanced yolunu izleyelim ve aşağıdaki resimde gördüğünüz gibi ilk satıra sitenizin adını, ikinci satıra da sitenizin kök klasörünü, son olarak üçüncü satıra ise kök klasörünüzün içinde bulunan images klasörünü yazın ve Ok'a basın. Böylece sitemizi Dreamweaver'e tanıtmış olduk.
2. Türkçe Karakter Ayarını Yapalım

Şimdi Dreamweaver'in Türkçe karakterleri sorunsuz göstermesi için gereken ayarları yapalım.
Ana menü yardımıyla Edit>Preferences>New ********>Default Encoding>Türkçe(windows) seçip Ok butonuna tıklayarak işlemi tamamlayalım.
Yaptığımız son işlemle ç,ş,ö gibi Türkçe karakterlerin sitemizde sorunsuz görünmesini sağladık. Şimdi şablonumuzu açalım ve sitemizdi oluşturmaya başlayalım.
File>Open yolunu izleyerek (veya files panelindeki index.html'ye çift tıklayarak) index.html dosyasını açalım.
Web sayfalarının uzantısı html dir. Örneğin müzik dosyalarının uzantısı genellikle mp3, resim dosyalarının uzantısı genellikle jpeg olur. Web sayfalarının uzantısı da genellikle html veya htm olur. Hazırlayacağımız her sayfanın sonuna .html ekleyeceğiz. Örn: fikralar.html
index.html dosyasını anasayfanız olarak tasarlayın ve sayfa adını değiştirmeyin. Çünkü bir siteye girdiğinizde, tarayıcınız size o sitenin index.html sayfasını gösterir. Örneğin Internet Explorer'de www.siteadi.com yazarsanız tarayıcınız www.siteadi.com/index.html adresini açar. Daha sonra oluşturacağınız sayfalarınız için farklı isimler yazacaksınız örneğin: sayfaadi.html gibi... Oluşturduğunuz sayfalara isim verirken veya site içerisinde kullandığınız resimlerin adlarında Türkçe karakter veya boşluk kullanmamaya dikkat edin. Örneğin ödev.html isimli bir sayfa yaparsanız bu sayfa görüntülenemez.
3. Tabloları Kullanmak

Daha önce de belirttiğim gibi hazırladığımız sayfalar html formatındadır. Html dilinde her satıra sadece bir içerik ekleyebilirsiniz. Ekleyeceğiniz iki farklı içerik hataya sebep olabilir. Örneğin bir satıra hem yazı hem resim ekleyemezsiniz. Eklemek istediğinizde aşağıdaki resimde görülen problem ile karşılaşırsınız.
Bu problemi aşmak için bir bir satıra resim ve yazı eklemek yerine, bir tane tablo ekleyeceğim. Ama bu tablonun iki tane sütunu olacak. Tablonun sol sütununa resmi, sağ sütununa ise yazıyı ekleyeceğim. Bu yöntemle bir satıra sadece bir tablo ekleyerek hem resim hem yazıyı yanyana koyabileceğim.
Yukarıda gördüğünüz gibi tablo kullanarak resim ile yazıyı yanyana ekleyebildim. Bu örnekte tablonun görülebilmesi için çerçevelerin kalınlığını artırdım ve rengini beyaz yaptım. Siz çerçeve kalınlığını sıfır yaparak tabloları gizleyebilirsiniz. Sayfaların sorunsuz çalışması için tabloları kullanmalısınız. Çoğu web sitesi tablolar üzerine kuruludur. Bu sitelerde sayfa görünümü ile ilgili hatalar en az seviyededir. Örneğin tablolar üzerine kurulmamış bir site, farklı çözünürlük ayarlarına sahip bilgisayarlarda sorun yaratabilir. Örn: resimlerle yazıların iç içe geçmesi gibi..
Ekleme menüsünü (veya Insert>Table yolunu) kullanarak tablo ekleyebilirsiniz. Tablo eklemek istediğinizde açılan sayfadan tablodaki satır sayısını, sütun sayısını ve benzeri diğer özellikleri ekleyebilirsiniz.