Web Tasarım Teknikleri-Web Sitesi Yapmak İsteyenlere Kaynak

Ekreizze · 2005-08-31T09:45:53.0000000+03:00

Webtasarım a başlangıç için rehber,yeniler için kaynaktır... Tamamını okumanız önerilir... Neden Web Siteniz Olmalı? *Bir Web sayfası sadece onu incelemek isteyen “hedef kitleye” ulaşır. *Web sayfaları oluşturmak için tek masrafınız telefon hat ücreti olacaktır. *Web sayfaları hazırlarken hayal gücünüzü olabilidiğince kullanabilirsiniz. *Web sayfaları kolayca düzeltilip tekrar yayınlanabilir. *Sayfalarınız zamanında etkisiyle yeniliklere uğrayacaktır. *Web sayfalarınız 24 saat boyunca tüm dünyaya açık olacak ve internet kullanıcılarına “etkileşimli” bir hizmet verecektir. *Web sayfalarını kullanıcıların fikirlerini ve beklentilerini öğrenmek için derleyebilirsiniz. *Web sayfalarının kaderi diğer medyalar gibi çöp kutusunda sonlanmaz. Web Editörleri ve İncelemeleri Herşeyden önce size gerekecek olan program, kullanıcıların izleyeceği Web sayfalarınızı hazırlayacağınız bir programdır. Bu tip programlar ile site içinde yer almasını istediğiniz resimleri, yazıları ve bağlantıları istediğiniz biçimde bir Web Browser'ı tarafından izlenecek şekilde tasarlayarak biraraya getirebilirsiniz. Bunun için önünüzde Allaire Homesite,Microsoft Frontpage, Netscape Composer, Adobe PageMill, Macromedia DreamWeaver, HotDog Pro gibi birçok program alternatifi bulunuyor. Bir Düzenleyici Hangi Özellikleri Desteklemeli Kolay Kullanım Site yönetimi ve dosyaların sunucuya kolayca aktarılması HTML dışında da farklı dosya tiplerini tanıyabilme Renkli kodlama İyi bir dokümantasyon Şablonlama ve proje desteği Özelleştirebilme CSS desteği Bazı Düzenleyicilerin İncelemeleri Microsoft Frontpage 2000: Microsoft firmasının, kendi ürünü olan Word’e benzerliğiyle dikkat çeken, bu nedenlede birçok kullanıcıya kullanımı kolay gelen düzenleyicisidir. Artıları: Frontpage en başta kullanması ve öğrenmesi kolay bir düzenleyicidir.Ayrıca Microsoft’un ISS Web sunucusuyla tümleşmesi çok iyidir.Frontpage görsel arabilimi (tam olmasada WYSIWYG denebilir) sayesinde hiçbir HTML kodu yazmadan Web siteleri oluşturabilmeyi sağlar. Eksileri: Frontpage, önceden sizin düzenlemiş olabileceğiniz kodları, tekrardan düzenlemekte çok ısrarcıdır.Bu nedenle sayfa kodlarına elle müdahale etseniz bile, bir sonraki açışınızda bu ince ayarların silinme olasılığı yüksektir. Allaire Homesite: Piyasadaki en iyi HTML kod düzenleyicisi. Artıları: En gelişmiş özelleştirebilme seçenekleri.Bir kod düzenleyicisi olsa da, sistemde IE4+ yüklüyse, sınırlı miktarda görsel tasarıma izin vermektedir.Bütünleşik FTP istemcisi, şablonlama desteği, siteleri projeler altında gruplandırma sistemi, yazım kontrolü, Perl-PHP-ASP-VBScript-Java-CSS- SMIL-ColdFusion gibi dilleri otomatik tanıma, Dreamweaver’la bütünleşme, istenen şekilde kodu girintileyebilme, çok iyi bir dokümantasyon, Homesite’la tümleşik çalışan bir sürümüyle gelmesi. Eksileri: WYSIWYG düzenleyiler arayan kişiler için tam anlamıyla uygun olmaması, Windows 9x’de bellek kaçırması ve maalesef sadece Windows’ta çalışması. Macromedia Dreamweaver: Homesite’ın HTML kodu alanındaki liderliğini, WYSIWYG düzenleyiciler alanında paylaşan program Artıları: Dreamweaver’ın ilk göze çarpan özelliği, görsel düzenleyiciler arasında en iyi tablolama desteğini sunmasıdır.HTML koduna fazla müdahale etmemesi, blokların kolayca seçilebilmesi, seçilen etiketlerin nerdeyse tüm özelliklerinin kolayca ayarlanabilmesi, tümleşik FTP istemcisi ve site yönetimi,çok iyi DHTML ve Frame desteği, Internet üzerinden de yüklenebilen etiketlerle genişletilebilmesi, tabloları katmanlara, katmanları tablolara çevirebilmesi, rehber resim desteği, Homesite’la bütünleşme. Eksileri: Homesite kadar iyi bir doğrudan HTML kodu yazımı olmaması ve maalesef sadece Windows ve MacOs’da çalışması. HotDog Pro: Birkaç yıl öncesine kadar görsel olmayan düzenleyiciler piyasasında Homesite’la başabaş giden bu program, yeni sürümlerinin sık sık göçmesi, firmanın yanlış taktikler izlemesi gibi nedenlerle popülerliğini yitirmiştir. Artıları: Birçok özelleştirebilme seçeneği, tablo ve frame’lerin yaratılmasında kullanılabilen sihirbazlar, tümleştirilebilentarayıcı desteği, site yönetimi, ftp istemcisi, renkli kodlama. Eksileri: Sık sık göçmesi, zayıf dokümantasyon ve çalışmayı engelleyici ses efektleri Web Sayfalarının Tasarlanması Yukarıda incelemesini yaptığımız birçok web editörü size HTML dilini bilmeden, HTML kodlarını kullanarak web sitesi yapma imkanı veriyor.Bu tip editörler sitenizde yaptığınız her adımı, otomatikman HTML koduna çeviriyor. Peki o zaman neden HTML öğrenmelisiniz?HTML öğrenmelisiniz çünkü: En basit neden; eğer iyi bir webmaster olmak istiyorsanız, ve HTML bilmeden sadece bu tür programları kullanmayı düşünüyorsanız, muhtemelen programın verdiği, programdan kaynaklanan en küçük bir hatada eliniz kolunuz bağlı kalacaktır. Lisans gerektiren programlar: Birçok kaliteli "HTML çevirici" programını kullanmak için, o programın lisansına sahip olmanız gerekir. Ve bu da genelde büyük paralar gerektirir. HTML Nedir? HTML, Hyper Text Mark-up Language'ın kısaltılmışıdır. Türkçe karşılığı Hiper Metin İşaretleme Dili'dir. Browserlar tarafından tanınıp yorumlanabilen metin tabanlı bir dildir ve metnin browser tarafından yorumlanması sonucu da web sayfaları elde edilir. Yazdığınız kodların browser tarafından alınıp yorumlanabilmesi için, dosyalarınızın uzantısının ".htm" veya ".html" olması gerekir. HTML de her işaretleme dilindeki gibi komutlardan oluşur, bu komutlara tag veya mark-up denir. Tag'ler herhangi bir metinden farklı oldukları browser tarafından anlaşılabilsin diye " " işaretlerinin arasına yazılır. Her tag'in bir başlangıcı ve bitişi vardır. Bitiş tag'lerinde, " CSS CSS (Cascading Style Sheets), Bir HTML dökümanındaki HTML takılarının sitillerini belirleyen tekniktir. CSS kodlarını web sayfası içerisinde 3 şekilde tanımlayabiliriz; HTML takılarının sitillerini, takıların içinde(Local) CSS öğreniyorum Sayfanın başında "" takıları arasında (Global) h1.buyukyazilar {font-family:verdana; color:yellow} h1.digerleri {font-family:arial; color:black} h2 {font-family:verdana; color:pink} Link olarak başka bir dosyadan alarak CSS Öğrenmenin avantajları: CSS, HTML takılarına, HTML ile yapılamayacak fakat işinizi kolaylaştıracak bir çok özellik katabilir. Örneğin; hemen 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ı hale getirebilir ve dosyanın yükünü hafifletebilirsiniz. Sayfalarınız için hazırlayacağınız bir CSS dosyasını kullanarak tüm sayfalarınıza aynı özellikleri verebilir, dolayısıyla hız ve tutarlılık sağlamış olursunuz. Tabiki CSS'in yapabilecekleri bunlarla sınırlı değildir. CSS öğrenilmesindeki kolaylığın aksine kapasitesi büyük bir dildir. Flash Flash, Macromedia tarafından geliştirilmiş Internet'te etkileşimli vektörel grafik ve animasyon hazırlanmasında kullanılan bir standarttır. Web tasarımcıları Flash'ı çekici, ölçümlendirilebilir, çok az yer kaplayan gezinilebilir yüzeyler, teknik canlandırmalar, uzun süreli animasyonlar ve diğer şaşırtıcı efektleri yapmak amacıyla kullanırlar. Kullanım Alanları: Flash ile en küçük reklam pankartından (banner), en karmaşık animasyonun yapılması, hatta bütün bir web sitesinin oluşturulması mümkündür. Interaktif CD'lerin hazırlanması, oyunlar, veritabanı uygulamaları, PHP ve XML gibi birçok dil ile kullanılabilme, Flash'ın ileri düzey maharetleri arasında sayılabilir. Flash ile ses ile biteşlemler (bitmap) birleştirilebilir. Yani bir dosyanın içine müzik yada ses efekti rahatlıkla gömebiliriz. Bu bize etkileşim daha üst seviyelere çekebilme şansını verir. 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üçük boyutlara sıkıştırılabilir. Bu sıkıştırma oranları program içerisinden kalitelerini değiştirmek suretiyle ayarlanabilir. Bö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. Macromedia Flash programı, macromedia'nın http://www.macromedia.com adresinden deneme amaçlı olarak indirilebilir. Bunun dışında tam kullanım için belirli bir ücret karşılığında macromedia'dan yada temsilciliklerinden temin edilebilir. Püf Noktalar Tasarımın en önemli unsurlarından biri tablolardır. Tabloları amacınıza uygun şekilde sayfaya yerleştirdiğinizde sayfanız, görsel açıdan daha üstün bir tasarıma sahip olacaktır. Çünkü hizalama, uygun yere uygun resmi yerleştirme gibi şeyler kod yazarak çok uzun sürebilir. Ama tablolar ile bu problemi aşabilirsiniz. Dikkat edilmesi gereken en önemli şeylerden biri de resim kullanımı. Sayfalarınızda mümkün olduğunca az resim kullanın. Şayet resim kullanırsanız, boyutları minimum, kaliteyi optimum düzeyde tutmaya özen gösterin. Çünkü Türkiye de internetin hızı malum. Teorik hızı 44.000 kb 'ı geçmeyen ziyaretçi, sayfanızın açılmasını dakikalarca bekleyemeyebiliyor. Sayfaların da daha çabuk açılması için akla gelen ilk şey de resimler oluyor. Eğer ki resimden başka Java Applet vs. varsa önceliği bunlara verin. İnternet üzerinde en çok kullanılan browser'lar IE ve Netscape Navigator ve Firefox dur. Büyük çoğunlukla da IE kullanılır. Sitenizin yapım aşamasında farklı browserlarda sitenizin nasıl göründüğünü test etmeniz gerekebilmektedir. Çünkü bazı tag'ler farklı browserlarda aynı etkiyi yaratamayabilmektedir. Bunun da çabuk fark edilmesi, sizi emek, zaman ve kaynak kaybından kurtarabilir. Sayfalarınızı, farklı ekran çözünürlüklerinde test edin. Optimum çözünürlükte karar kıldığınızda sayfaları bu ekran çözünürlüğünde tasarlayın. Bunu yapmanızdaki sebep şudur: Her kullanıcı sizinle aynı ekran çözünürlüğünü kullanmayabilir. Sizin 800*600 çözünürlükte yaptığınız site, browser'ınızda gayet güzel görünebilirken, 640*480 kullanan ziyaretçinin bilgisayarında dağınık ve biçimsiz görünebilir. Alıntıdır,Teşekkür Ediyoruz... Araş. Görv. Özgür ÇİNİ

Giriş

Mesaj

redblodd

11 Mesaj

"er": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

28 Kasım 2007 12:43:48

Mesaj Linkini Kopyala
Şikayet

eline sağlık :-))

Bu mesaja 1 cevap geldi

penkala

Yarbay

3869 Mesaj

"müdavim": En az 5.000 mesaj yazdı. 3 seviyeli bu başarı rozetinin 2. seviyesine sahip.

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"gezgin": En az 50 foruma mesaj yazdı. 4 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"oyuncu": En az 100 oyun bölümü mesajı yazdı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

Tüm Başarılarını Gör

28 Kasım 2007 14:47:15

Mesaj Linkini Kopyala
Şikayet

sevgili arkadaşlar bu programları kullanmayı bilmeyenler ya da yeni başlayanlar için bazı e-booklar ve görsel eğitim setleri var...paylaşmak istedim....

Macromedia Fireworks8 "Kaynağından Eğitim"

.pdf formatında, Türkçe, kaynağından fireworks anlatımı...

Web Tasarım Teknikleri-Web Sitesi Yapmak İsteyenlere Kaynak

**** r@pidshare olacak...

Frontpage2002 e-book

**** r@pidshare olacak...

Dreamveaver e-book

**** r@pidshare olacak...

Programming Visual Basic.net

**** r@pidshare olacak...

Baştan Sona Visual Basic 6

Visual Basic 6 ile ilgili çok kapsamlı, a'dan z'ye tam 894 sayfalık eşsiz bir Türkçe kaynak...

**** r@pidshare olacak...

Visual Basic 2005 Görsel Türkçe Dersler

**** r@pidshare olacak...

Bu mesaja 1 cevap geldi

Ekreizze

Yarbay

2398 Mesaj

"konu açıcı": En az 250 konu açtı. 4 seviyeli bu başarı rozetinin 2. seviyesine sahip.

"müdavim": En az 10.000 mesaj yazdı. 3 seviyeli bu başarı rozetinin 3. seviyesine sahip.

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"gezgin": En az 100 foruma mesaj yazdı. 4 seviyeli bu başarı rozetinin 2. seviyesine sahip.

Tüm Başarılarını Gör

28 Kasım 2007 22:46:46 Konu Sahibi

Mesaj Linkini Kopyala
Şikayet

güzel paylaşımlar penkala, saolasın

M.E.H.

6 Mesaj

"er": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

01 Aralık 2007 12:59:05

Mesaj Linkini Kopyala
Şikayet

TeşekkürLer

~~emrecarter~~

Süresiz olarak uzaklaştırıldı.

01 Aralık 2007 14:52:41

Mesaj Linkini Kopyala
Şikayet

yeni baslayanlar için nvu diye bi program var ben onu kullanıyorum bende acemiyim ama çok güzel bi program türkçeside mevcut ücretsiz olarak indirebilirsiniz.

Ekreizze

Yarbay

2398 Mesaj

"konu açıcı": En az 250 konu açtı. 4 seviyeli bu başarı rozetinin 2. seviyesine sahip.

"müdavim": En az 10.000 mesaj yazdı. 3 seviyeli bu başarı rozetinin 3. seviyesine sahip.

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"gezgin": En az 100 foruma mesaj yazdı. 4 seviyeli bu başarı rozetinin 2. seviyesine sahip.

Tüm Başarılarını Gör

14 Aralık 2007 23:55:51 Konu Sahibi

Mesaj Linkini Kopyala
Şikayet

Bunu bir ppt dosyası olarak bulmuştum netten. Özgür çini arkadaşımız düzenlemişti, bunu buraya aktardım ve şu anda bir çok forumda dolaşıyor, hemde kaynak belirtilmeden.

İşte hırsızlığın boyutunun ne kadar olduğunu görmek bu kadar kolay.

Bu mesaja 1 cevap geldi

WarSaw

Yarbay

8029 Mesaj

"konu açıcı": En az 100 konu açtı. 4 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"çok beğenilen": En az 5.000 beğeni aldı. 7 seviyeli bu başarı rozetinin 6. seviyesine sahip.

"müdavim": En az 10.000 mesaj yazdı. 3 seviyeli bu başarı rozetinin 3. seviyesine sahip.

"takdirci": En az 1.000 beğeni verdi. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

Tüm Başarılarını Gör

15 Aralık 2007 02:37:28

Mesaj Linkini Kopyala
Şikayet

konu çok faydalı bilgiler içeriyor konuyu açan ve katkıda bulunan diğer arkadaşlarında ellerine sağlık

< Bu mesaj bu kişi tarafından değiştirildi WarSaw -- 15 Aralık 2007; 2:37:56 >

Bu mesaja 1 cevap geldi

~~liselicarsi~~

Süresiz olarak uzaklaştırıldı.

21 Aralık 2007 02:07:46

Mesaj Linkini Kopyala
Şikayet

Kitap linkleri kırıkkkkk

Bu mesaja 1 cevap geldi

~~Manifot United~~

Süresiz olarak uzaklaştırıldı.

18 Ocak 2008 09:52:43

Mesaj Linkini Kopyala
Şikayet

Teşekkürler..

Bu mesaja 1 cevap geldi

caspertxt

Yüzbaşı

666 Mesaj

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"yüzbaşı": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

02 Şubat 2008 20:31:44

Mesaj Linkini Kopyala
Şikayet

arkadaşlar yukarıdakı link leri yenıliyecek bırı yokmu bende fena halde bozmuş durumdayım wep tasarım işine
....

MerX

Çavuş

52 Mesaj

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"çavuş": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

02 Şubat 2008 21:04:18

Mesaj Linkini Kopyala
Şikayet

Güzel kaynak çok saol

odokmetas

13 Mesaj

"er": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

29 Mart 2008 16:22:26

Mesaj Linkini Kopyala
Şikayet

Selam
Arkadaşlar ben bir site yaptım henüz yayınlamadım sitemin içinde anket sayfası var ve gönder butonu birtürlü ayarlayamadım bunu nasıl yaparım yardım ederseniz çok sevinirim

Bu mesaja 1 cevap geldi

hamza35

Onbaşı

33 Mesaj

"onbaşı": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

10 Temmuz 2008 17:48:40

Mesaj Linkini Kopyala
Şikayet

quote:

Orjinalden alıntı: crazyssonline

arkadaslar bana acilen Macromedia Flash 8 setup lazım bana yardımcı olurmusunuz arakdaslar..

googleden aratırsana bişler çıkartı yani
www.downloadtr.com/program.asp?id=4541 - 14k

< Bu mesaj bu kişi tarafından değiştirildi hamza35 -- 10 Temmuz 2008; 17:49:56 >

Bu mesaja 1 cevap geldi

hamza35

Onbaşı

33 Mesaj

"onbaşı": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

10 Temmuz 2008 17:52:18

Mesaj Linkini Kopyala
Şikayet

web tasarımı için frontage, dreamweaver programlarında başlanabilir

zekeriyas

1 Mesaj

"er": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

07 Ağustos 2008 09:02:01

Mesaj Linkini Kopyala
Şikayet

öncelikle bu güzel çalışma için tşk. ederim ben bir site yapıyorum
dreamweaver 8 site yaptım ama iletişm formunda takıldım iletişim formunda submit tuşu için php tanıttım internet explorer açtığımda submit tuşuna bastığımda ekrana kaydet tuşu çıkıyor

yardımlarınız için teşekkürler.......

< Bu mesaj bu kişi tarafından değiştirildi zekeriyas -- 7 Ağustos 2008; 9:02:35 >

oralunal

Yarbay

2205 Mesaj

"konu açıcı": En az 250 konu açtı. 4 seviyeli bu başarı rozetinin 2. seviyesine sahip.

"müdavim": En az 1.000 mesaj yazdı. 3 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"vefalı": En az 50 mention yanıtladı. 1 seviyeli bu başarı rozetinin 1. seviyesine sahip.

"gezgin": En az 50 foruma mesaj yazdı. 4 seviyeli bu başarı rozetinin 1. seviyesine sahip.

Tüm Başarılarını Gör

07 Ağustos 2008 10:01:02

Mesaj Linkini Kopyala
Şikayet

Tasarım ve Grafik forumuna bu tarz bilgi paylaşımları gerçekten gerekliydi... Çok saol

Web tasarımına başlıyorum diyen arkadaşların muhakkak okuması gerekiyor...

Bu mesaja 1 cevap geldi

cengolassa

Onbaşı

32 Mesaj

"onbaşı": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

26 Ağustos 2008 14:44:41

Mesaj Linkini Kopyala
Şikayet

ben yeni başlıyorum html kodlarını öğrenmeye çalışıyorum şimdi çok güzel olmuş teşekkürler

Bu mesaja 1 cevap geldi

kingspc

4 Mesaj

"er": Geleneksel rütbe sistemi koşulları geçerlidir.

Tüm Başarılarını Gör

10 Eylül 2008 11:04:39

Mesaj Linkini Kopyala
Şikayet

site yapabilmek için sql server bilmemiz gerekiyormu.

< Bu mesaj bu kişi tarafından değiştirildi kingspc -- 10 Eylül 2008; 11:19:49 >

Bu mesaja 1 cevap geldi

~~z-turk~~

Süresiz olarak uzaklaştırıldı.

19 Eylül 2008 09:59:17

Mesaj Linkini Kopyala
Şikayet

yeni başlayanlar için faydalı bi konu olmuş

~~z-turk~~

Süresiz olarak uzaklaştırıldı.

19 Eylül 2008 10:02:49

Mesaj Linkini Kopyala
Şikayet

quote:

Orjinalden alıntı: kingspc

site yapabilmek için sql server bilmemiz gerekiyormu.

veri tabanı olacaksa evet veri tabanı olmıcaksa hayır bilmesende olur

yeni mesaja git

Web Tasarım Teknikleri-Web Sitesi Yapmak İsteyenlere Kaynak (11. sayfa)