ELEKTRONİK YAYıNCıLıK

ELEKTRONİK YAYıNCıLıK
ve
WEBTASARıM
Yrd. Doç. YusufKeş
içiNDEKİLER
TEŞEKKÜR
.iii
içiNDEKiLER
v
ÖNSÖZ
xi
ÖZET
xiii
i. BÖLÜM
Anneme...
ELEKTRONiK YAYıNCıLıK
1
Lı ELEKTRONiK YAYıNCıLıK
1
1.2 ELEKTRONiK YAYıNCILlCINGELİşi!\1İ
3
1.3 iNTERNET ORTAMINDA E-YAYINCIUCIN
GELişiM EVRELERi
1.3.11-istserv ilc
ı
..4
Yayıncılık
4
.3.2 FTP ile Yayıncılık
1.3.3 Gopher ile
.5
Yayıncılık
6
1.3.4 WWW ile Yayıncılık
7
1.4 ELEKTRONiK YAYıNCıLICIN OLUMLU YÖNLERİ...
9
1.5 ELEKTRONiK YAYlNCILlCIN OLUMSUZ YÖNLERi..
l2
1.6 TÜRKiYE'DE ELEKTRONiKYAYıNCıLıK
13
1.7 ELEKTRONiK YAYıN ARAÇLARı
1.7.1 E·kitaplal'
:
16
: 17
1.7.2 istek Üz.erine BasIrn
17
1.7.3 Sayısal içcri!'
18
1.7,4 E-Mürekkep
18
1.7.5 E-posta Yayıncılığı
18
1.7.6 E-bültcı!. Yaj'lncı1ığı
1~
1.7.7 Web yayıncılığı
19
1.7.8 E-dergiler
20
AKADEMİK DERGİ yAyıNCıLIGI
20
2.5.2.8 Site Haritaları ..•.....................................................•.............................68
24
2.5.2.9 Bir Pencere İçindeAçılan Menüler ···································
68
2.5.2.10 Rehber Turn ...............•........................•..........•....................................69
BÖLÜM
2.5.2.11 Arama Motorları
"EKTRONİKYN,tIN ORTAMı, WEB
27
2.5.3
'AKADEMİK ELEKTRONİK DERGİLERİN ÜRETİM SÜRECİ...
i
WEB TASARıM İLKELERİ
1.1
Yalııılık
l.2
Tutarlılık
Görsel
Devamlılık
l.3 Açıklık
70
2.6 WEB SAYFALARıNDAARADIGIN! KOLAY BULADİLlI,m
71
27
2.7 WEB SAYFALARıNDAHlZLl İNDİRİLEBİLİRLİK
72
28
2.8 WEB SAYFALARıNDAERİşiLEBİLİRLİK
73
29
32
L.4 Denge
69
İyi Bir Dolaşımın Özellikleri
33
3. BÖLÜM
36
ELEKTRONİKYAYıNLARDAGRAFİK TASARıM SORUNLARI
77
1.6 Vurgu
.37
3.1 LAYOUT SORUNU
77
1.7 Ritim
38
3.1.1 Layout'un Görsel Hiyerarşisi
83
40
3.1.2 Kontrastlık
86
.42
1.5 Görsel
1.8 Oran i
Hiyerarşi
Orantı
1.9 Uyum ve Bü/ilnlük
2 WEB
SAYFALARıNDAKULLANıLıRLIK
:
3.1.3 Layout'larda Kontrastlık Ölçümü
89
43
3.1.4 Layout'larda Görsel Algıyı Güçlendiren İlkeler
90
3.1.4.1 Gruplama
91
2.1
Kuııanılırlık Araştırma
Yöntemleri
46
2.2
Kullanırlığın Sağladığı
Yararlar
47
3.1.4.2 Yakınlık
91
.48
3.1.4.3 Benzerlik
93
3 WEB
SAYFALARıNDAOKUNURLUK
4 WEB SAYFALARı İçİN TARANABİLİRMETiN YAZIMI
5 WEB
SAYFALARıNDADOLAŞıM
53
3.1.4.4 Süreklilik ..·
·
··..·
·
·..·
93
56
3.1.4.5 Tümleme
94
5.1 Yönlendirme Biçimleri
61
3.1.4.6 Rizalama
97
5.2 Yönlendirme Araçları
62
3.1.5 Sayfa Boyutunun Layou!'a Etkisi
99
62
3.2 LAYOUT'LARDA TİPOGRAFi
100
.5.2.2 Aşağı Doğru Açılan Menüler
63
3.2.1 Yazı Karakterinin Seçimi
100
.5.2.3 Grafık Görünlülü Yönlendirme Düğmeleri
ll4
3.2.2 Yaygın Web Fontlan
103
65
3.2.3 Hizalama Sorunları
105
.5.2.5 Metin i Sözcük Bağlantıları
ii6
67
3.2.4 V!.!.rg!!
325B'"
..
uyu'"k- K'"uçu"kH arf Kullanınn
107
.5.2.6 Ekmek Kırıntısı izi Dolaşımı
.5.2.7 Sekmeler
67
3.2.6 Yazı Ölçüsünün Sayfa Yapısına Etkisi
.5.2.1
Dolaşım Çubukları
.5.2.4 Görüntü
Haritaları
H
109
111
3.2.7 Harf Aralığı, Satır Aralığı ve Satır Uzunluğu
112
5.1 UYGULAMAALANI SEçİi\1İ
161
3.2.8 Zemlu Yazı İlişkisı
114
5.2 SİTENİN İÇERİGİ VE ORGANİZASYONYAPıSı
161
3.2.9 Tlpografi ve Tutarlılık
114
5.3 UYGULAMANıN İRDELENMESİ
164
3.3 LAYOUT'LARDA RENK
114
5.3.1 Sitenin Görsel Kimliğinin Oluşnmu
164
3.3.1 Renk Kuramı
114
532
. . Sitenin Dolaşımı ve E r III
Ş e bT
ı ır r-'
ıgı
166
3.3.2 Rengin Kullanım Sorunları
1IS
5.3.3 Layout
169
3.4 LAYOUTLARDA GÖRÜNTÜ KULLANIMI
129
5.3.4 Tipograrı ve Okunurluk
174
3.4.1 Görüntü Dosyalama Biçimleri
130
5.3.5 Renk Kullanımı
176
3.4.2 Görüntü Çözünürlüğü
133
5.3.6 Görüntü Kullanımı
176
3.4.3 Göruntüde Renk Derinliği
133
5.3.7
3.4.4 Görüntülerde Anti-Aliasing ve Hale Etkisi
135
5.4. UYGULAMA SAYFALARıNDANÖRNEKLER
178
3.5 LAYOUTLARDA ÇOKLU ORTAM EKLENTILERİ
136
3.5.1 Plug-in'ler
SUNUÇ
183
3.5.2 Ses Eklentileri
136
13 6
3.5.3 Film ve Video Görüntülerinin Kullanımı
EK:DERGİ DEGERLENDİRMEKRİTERLERİ
185
137
3.5.4 ADlma'yon Kullanımı
138
KAYNAKÇA
187
4. BÖLÜM
AKADEMİKE-DERGİLERİNİRDELENMESİ
141
4.1 DİJİTAL WEB MAGAZİNEwww.digitaı-web.eom
141
4.2E-SOSDER.COM ELEKTRONİKSOSYAL BİLİMLER DERGİSİ
www.e-sosder.com
144
4.3 MUZİKBİLİM.cOM ELEKTRONİK MüzİK VE BİüM DERGİSİ
www.murlkbilim.eom
150
4.4 FİRSTMONIJAY.ORG ELEKTRONİK İNTERNET DERGİSİ
www.firstmonday.org
157
5. BÖLÜM
"e-grafik.net" UYGULAiVIA ÇALIŞMASI
i vili
161
Diğer
Sorunlar
178
Iaşım ve erişilebilirlik açısındıın irdelenip sorunlar belirlenmeye çalışılınıştır.
L.BÖLÜM
19iye erişim, kolay kullanım-dolaşım, estetik değer ve rahat okunurluk gibi işlevsellik
ELEKTRONİKYAYıNCıLıK
:nitelikle ilgili ölçütlertasanın kurallarına uyuldukça oluşur. Son bölümde ise bu savı
:sıeldeyici nitelikte tasarlanan"e-grafik.net" elektronik grafik tasarım dergisinin lasanm
1.1
ireci ve çözümlemesi yapılarak; iyi bir web sitesi ııısanmı için yöntemler belirlemneye
Yayıncılık;
,lışılmıştır.
ELEKTRONİK YAYıNCıLıK
okurlara
jpografi, Renk
anıştııma
sunmaktır (GüıSoy, ı 999.
yazılırnın
nahtar Sözcükler. Elektronik Yayıncılık, Web Tasarun İlkeleri, Grafik Tasarım, Layout,
dergi, gazete, kitap,
ya da
sanatın,
raporu gibi ürünleri basım yoluyla çoğaltarak
5.42 ı). Elektronik yayıncılık (e-yayıncılık) ise bilginin,
diğer elektronik araçlar yardııruyla
Internet, CD-Rom ya da
elektronik olarak üretilmesi ve izleyiciye ulaştmlmasıdır (Ebookcrossroads, 2005). Etüm bilgi hizmetlerinde (bilginin alınması, işlenmesi, depolanması ve
yayıncılık aynca
dağıtımı vb.)
bilgisayann bilgi teknolojisinin öngördüğü biçimde
kapsayan bir bütün olarak da algııanabiliL
E-yayıncıllkta ilk aşama,
getirilmesidir. Sonraki
bilimsel
aşama
işlemin yapıldığı yayıncılık
bilimsel
yapdan
bir
çalışmanın bir
ku1ianılması işlemlerini
kelime işlemci ile metin haline
ağ ortamında editörlük
ve hakem denetimi gibi bir dizi
sürecinden geçerek kullameılanı sunulmasıdu. E-yayıncılık
ile diğer kişiler arasında elektronik iletişim kullamlarak
çalışmayı üreten kişi
yayıncılık (Ağır,
bilgisayar ve
1997, s.l 1) olarak da
tanımlanabilir. Kısaca e-yayıncılık,
ağları ara.cılığıyla üretilip yayılması
sürecidir. E-
yayınc\lıkta
bilginin
bilgisayardan
yararlanma biçimleri iki şekilde görülebilir. Bu aşamalardan birincisi yayının ha7lrlanış
aşaması, bir diğeri ise kullanıcılara ulaştırılması aşamasıdır. Bir yazarın çalışmasını bir
kelime
işlemcide oluşturması birinci aşamaya,
tabanında
hizmete
sunulması
lGörüntü: l)
yazann çalışmasının tam metin bir veri
ise ikinci aşamaya örnek olarak gösterilebilir (Görtinru: i) .
E-yayıncılığın oluşum
sürectni gösteren grafik
şema.
Bilindiği
gibi, bilginin kullanıcılara ulaştırılması teknolojik olarak farklı şekillerde de
olabilmektedir. Bilgi, bilgisayar ağları aracılığıyla taşınabileçeği gibi optik (CD-ROM ve
dısk (Disket)
DVD-ROM) napy
taşınabilmektedir. Aynca
ve
ta~Jllabilir bellekler
gibi fizikselortamlarda da
bilgisayarlar arasında kurulan elektronik: posta ağları üzerinden
metinlerin dağılımı da elektronik yayıncılığın kapsamına girmektedir (Amiran ve
diğerleri,
2005).
E- yayıncılık yalnızca CD-ROM ya da Internet kanalıyla yaptlan
genel
bağlamda
elektronik araçlarla yapılan bütün yayııılan da
yayıncılık olmayıp,
kapsamaktadır. Fax,
1.2
ELEKTRONİK YAYINCILIGIN GELİşİMİ
Elektronik yayıncılığık tarihi geleneksel yayıncılıkhı karşılaştınldığmdakısa zamanda
hızlı ve önemli gelişmeler göstem1İştir.
E-yayıncıl.ık denemelerinin temel aracı olan "e-posta iletisİ i 964'lerde MIT (Massachusset
Institute of Technoıogy) ye Cambridge tniversitelerinde kullamlmıştır" (Tonta, 2000,
5.89). 197ü'leriıı başından beri ue akauemik lopluluklar tarafından yoğun olarak c-posta
kUIl2111lmaktadır (Yar, 2004,
,A50).
televizyon gibi araçlar elektronik yayıncılığınkapsamına girse de, günümüzde elektronik
yayıncılık denilince
web sitelerinde çevrim içi (online)
gelmektedir. Bununla birlikte, Internet'ten yüklenilen
ınetrajlı ~iIlcmillar,
panltIlı
video klipler (hareketli
kısa
İlk e-yayıncılık, e-postaUa düz metin biçiminde 1980'lerde F-Posta listesi aracılığıyla liste
yapılan yayıncilık akla
sayısal
seskfc
salıip olan
uzun
görtintüler) üç boyutlu harekeli görüntüler,
parça görüntüler (flash klipler), saydam gösterileri ve web sayfalan elektronik
yayınlardır (Clyde
ve Alojipan, 2005).
Gazete ve dergiler
nasıl basılı yayın araçlan
belgenin, bir sanat yapıtının ve
hareketlı
ise
aşağıda sıralanan araçlar
görüntünün yer
da bilginin,
aldığı t:-yayın araçlandır;
sürdüTÜmcülerine gönderilmiştir. Düz metinJerin, sununı olarak oldukça kötü, şekil ve
resim açısından ise yetersiz kaldıklan bilinmektedir. ilk yıllarda yayınlardakı tablolar ve
formÜller oldukça karmaşıktır ve UygUll bir yolla kontrol altında tutmak ve yönetmek
oldukça zor olmuştur (Petlenati, 2001, s.1-2).
i 980'1i yıllarda "Hem basılı hem de elektronik kopyalann birlikte yayınlanmasıanıamina
gelen "paralel yayıncılık" denemesi gerçekleştirilmiştir.Paralel yayıncılık., 1983'de,
Amerikan Kimya Kurumu (American Chemical Society)'nun yayınlamış olduğu
dergilerinin ti::lID metinlerini bir ticari şirket (Dibliographic Rctricval Scrviccs, BRS)
• E-dergiler
o
Aslı basılı
•
Aslı
•
Yalnızca
ama elektronik olarak yayımlanan (koşut yayıncılık),
elektronik az miktarda da
basılı yayımlananlar,
"soğuk fii.zyon" olayından sonra hız kaz~nmıştır (Yar, 2004, s.45U).
1990'!ı yıUann başlarında CD-ROM/lar e-yayıncılık için etkili bir araç olarak. görülmeye
baş1.aml~ıır. Çllrtl...'ii CD-ROM'lann resim ve şekilleri yüksek nitelikte saklayabildikleri,
• Web sayfalan
Tartışma
aracılığıyla gerçek anlamda elektronik yayıncılık yapma projeleri] 989'da meydana gelen
elektronik olarak yayımlanan dergiler.
• E· bültenler
•
aracılığıyla mnnete sunmasıyJaba~ıarnıştır. Ancak Internet Ye diğer ilgili akademik ağlar
uzun ömürlü olduklan ve düşük maliyetli olduklan bilinmektedir. E-yayıneılığın bu çeşidi
listeleri i haber öbekleri belgelikleri (Archin:s: Belgelik).
özeL yayınlar için (sözlük., atlas, ansiklopedi) hala kullanılmaktadırve uzun yıllar da
• E-gazete, magazin
kullanılacağı tahmin edilmektedir. CD- ROM 'lan etkin kılan özelliklerinden bir diğeri de
• E- posta grubu
kapasitesi, yüksek güvenilirliği ve bununla birlikte çoklu ortamı taşıyabilecek yapıda
olmasıdır.
• E-kitap
<a
E-haber bültenleri mektup
yaymcılığı, (icrdt,
2004; Ebookcrossroads, 2005)
E-yayın, yukarıda sıralanan yayımlanma biçİmlerininyanı sıra
İzleyiciye/o!l..--uyucuyaweb yayıncılığı,
kablosuz
bilgiye
yayıncılık, tale"be
göre
ulaşmak isteyen
yaymı:ılık., e-
mürekkep gibi yöntemlnle (bkz. 16-20) ulaştmIır. E-yayıncılık, içeriği okuyucuya etkili ve
çabuk iletmek için yeni teknolojiyi
12
hllanır (Ebookcrossroads,
2005).
Ancak, çok geçmeden CD-RüM'lann da bazı sakmcalan görülmiiştür. Sakıncalardanen
temel olanı her bir yayın için ayn kurulum gerektirmesidir. Bu durum kütüphaneler için
CD-ROM koleksiyonlannı idare edilemez duruma getırnıiştir. Kütüphaneler hem güncel
kalabilmek, hem de bu donanımlann ve kurulumiann gerektirdiğibakım işlerini (CDROM, LAN-Local Area Network sunucu bağlantısı gibi) kolaylaştırmak için erişimi
güçlendiricİ çeşitli araçlar geliştirmişlerdir(Pettenati, 2001, 5.1-2).
3
dergi ilk 1994-95 yıllannda yayınlanmıştır. lEE (Institution of Electrical Engineers)
'afından dağıtılmış olan ilk e-dergi, çevrimiçi elektronik mektuplardan oluşmaktadır
leetronics Letters Online). Elektrik Mühendisleri Kurumu OCLC aracılığıyla bu
:rginjn dağıturum yapmıştır. OCLC okuyucu istasyonuna kurulabiten Guidon adlı bir
olanaklardan faydalanabilir. Listserv komutlanyla ağ üzerindeki aboneleri bulmak,
onların
geçmiş tartışma konularına erişmek ve tartışma yöneticisinin sunduğu dosyalara erişmek
olanaklıdır.
BlTNET
Bütün Listserv listeleri Bitnet düğümünde yer
ağıyla özdeştir (Ağır,
aldığından tarihselolarak
1997, s.23).
temeı icat etmiştir. Guidon zengin bir fonksiyonu olan mükemmel bir araç olmasına
Ülkemizin de içinde ulunduğu 30 ülkede, 250 den fazla sitede Listserv bulunmaktadır.
ğmen, web tabanh bir araç değildir. E-dergilerin dağıtımı için web kullanıhr
Bunlardan bazılan şunlardır:
ınanılmaz, onun modası da geçmiştir (Pettenati, 2001, s. 1-2).
LİSTSERV
ÜLKELER
ıyük gazete (The Washington Post, Time, Mirror, Tribune dahil) baskıya hazır
EARN.EGE.EDU.TR
EARNCC.EARN.NET
TÜRKİYE
FRANSA
ıyfalarını çevrimiçi olarak amnda ak.ta1IDak için Yeni yüzyıl yayın ağı adıyla şirket
VM.GMDDE
ALMANYA
urarak haber yayıncılığına başlamışlardır (Onursoy. 2001, s. 5).
HEARN.NIC.SURFNET.NL
HOLLANDA
Veb paylaşımı ve yayıncı1ıgı 1995-96 yıllarında başlamış ve büyük bir başan sağlamıştır.
SEARı'l.SUNET.SE
iSVEÇ
I/eb'in, çoklu ortam araçlanmn kullanımına olanak tanıma~ı" (metin, ses ve hareketli
BITNIC.CERN.NET
ABD
azetelerin elektronik sürlımleri 1995 yılında ABD'de görülmeye başlamıştır. Sekiz
;örüntünün aktarırnı) PDf biçimini kullanması ve metin içinde bağlantılan sağlama
ılanak.lanyla e-yaymcılığın gelişİmine katkıda bulunmuştur.
İnternet ağları üzerinde elektronik dergiler (e-dergi) yayıncılık faaliyetlerinde Listserv'ü
kuııanmı:;;lardır. Listsenı"de en
çok yayınlanan yayımlar; haber büıtenleri (News bulletin),
~-yayıncılık, İnternet'in gelişimine paralel olarak; List,;en'er (liste sunucusu), FTP (File
dergiLer (journals), hakemli dergiler, ve basılı karşılığı bulunmayan yeni tür yayınlardır.
fransfer Protokol-Dosya Değişim Protokolü), Gopher ve web ile yayıncılık evrelerini
Listserv sayesinde binlerce sürdürümcüye e-posta yoluyla e-dergiler ya da
~eçinniştir.
bir şekilde iletilmektedir. Bu
1.3
gelişme e-yayıncılığayeni
bir ivme kazandırrnıştır.
İletişim ve yayım aracı olarak kullanılan listeler, Liste yöneten programlarla yönetilider.
İNTERNET ORTAMINDA E-YAYINCILIGIN GELİşİM
Bu programlara LlSTSERV, COMSERVE, MAJORDOMO, LlSTPROC, MAILBASE,
EVRELERİ
MAILSERV programları örnek olarak gösterilebiEr. Bugün birçok tartışma listesi İnternet
üzerinden hizmet vermektedir.
1.3.1
e~yayınlar hızlı
Listserv ile Yayıncılık
[nternet ortamında, belli bir konuda yazışmak isteyen ak.ademisyenler ve diğer
K.ullanıcılann haberleşmesine yönelik listeler, ilan tahtalan gibi yönetim paketleri
bulunmaktadır (Akgül, 1999, 8.49). Listserv diye adlandmlan bu yönetim paketi
Yalnızca
LlSTSERV ile yönetilen listelerin
2002 tarihi itibariyle 55.823 adettir (Hundie, 2002, s. 157). Listelerle ilgili
sayısı 22
Nisan
aynntılı bilgi
alınabilecek web sitelerinden bazılarına, "The Reference to İnternet Discussİon and
Information Lists http://tile.netllists/ , The CataList http://www.lsoft.com/Hsts/listref.html
gösterilebilir.
sayesinde, bilimsel ve akademik iletişim kU1IDak isteyen kullanıcılar liste haline
FTP ile Yayıncılık
getirilmekte, oluşturulan bu listelere e-posta aracılığw1a iletiler belli bir yerde toplandıktan
1.3.2
sonra dağıtılmaktadır. E- yayıncılığın iTh: gelişim evreleri bu şekilde başlamıştır.
File Transfer Protocol baş harflerinin bir araya getirilmesinden
Listserv yazılımı, uluslararası NJE ağındaki ıEARı~-EuropenAcadeınic Research
Netw"orkl BlTNET) IBM VM/CMS sistemleri üzerinde çalışır. Herhangİ bir
EARN/Bitnet adresine e-posta yollayabilen herkes, yazışma listelerine katılabilir, sunduğu
4
oluşan
FTP ya da dosya
taşuna protokolü İnternet üzerindeki bilgisayar sistemleri arasında dosya alışverişini
sağlayan bir
hizmettir. Dosya alışverişIeri düzenleyen FTP programlan sayesinde bir
kullanıcı kişisel bilgisayarınaİnternet'e bağlı dünyanın herhangi bir yerindeki bir
51
bilgisayardan dosya çekebilir veya diğer kullanıcınınbilgisayarına dosya gönderebiliL
Ağ
üzerindeki kullamcılann biıgisayarlanna ulaşnıak için güvenlik engellerini aşmak
gerekir. Karşı kullanıcı şayet izin verirse (kullanıcı kodu ve şifresini verirse) onun
bilgisayarına ya
da FTP adresine girebilirsiniz. Ancak genel kullanıma yönelik dosyaların
Anahtar kelimeleri arama menüsüne yazarak taramalar
yapılabilmekte aynca, diğer bilgi
hizmet sağlayıcılan (WWW. WAiS, Archie, WHOIS) ya da internet hizmet
sağlayıcılanna (Telnet,
FTP) Gohper yolu ile
geçiş yapılabilmektedir.
Gopher getinnış olduğu arayüz modeli ile e-yaynıcılığın
gelişinıine
büyük katkıda
paylaşımı için "İnternet üzerinde kurulan "Anonyınous FTP" (anonim FTP) hizmeti ile
bulunmuştur. Aboneler ve kullanıcılar, sahip olduklan bu yazılım yardımı ile İnternet
kullanıcı kodu ve şifre gibi engeller kaldınlmış ve dQsya paylaşımında İnternet üzerinde
ağındaki dergilere ulaşıp
en çok kullanılan hizmetlerden biri haline
gelmiştir" (Çağıltay,
materyalleri
incelcyebilmişlerdir.
1995, s. 27).
WWW ile Yayıncılık
Kullanıcılar e-dergilere FTP hizmeti sunan sitelerle ulaşabilmektedirler. E-dergilerin web
1.3.4
sitesi yöneticileri, FTP hizmeti sağlayan sitelere dergideki makaleleri dosyalar halinde
WWW, bilgisayar ağlan üzerinde bilgiyc erişimi rahat ulaşmak amacıyla geliştirilmiş bir
bırakmakta, sürdürümcüler
de bu sitelere girerek yayınlan kendi bilgisayarlarına
aktarabilmektedir. Aynca masaüstü yayıncılıkta da yazarlar ve tasanmcılar tarafından
kullanılmakta,basılacak makale
ya da tasanmlar FTP ile karşı bilgisayarlara
aktarılabilmektedir.
FTP,yayın malzemelerinın metin
araçnr. "İlk olarak Mart 1989'da "Yüksek Enerji Fiziği" konusunda etkin ve kolay bir
haberleşme düzlemi
olarak Tim Bamers-Lee tarafından CERN'de
başlanmıştir" (Ağır,
1997, s_25). Tim ve
üstmetin i
biçimli saklanmasının yeterli olmadığı durumlarda e-
dergilere kolaylıklar sunmaktadır. Özellikle matematik, fizik, kimya gibi dergiler biçimleri
bağlatilı
metin (hypertext)
adı
geliştirilmeye
arkada.5lannıntasarladığı haberleşmc platformu
verilen bir yöntem üzerinde
çalışmaktadır.
İnternet üzerinde düşünülen bu yeni dizge iki ana bölüm halinde ortaya konulmaktadır;
Birincisi İnternet üzerinde kullanılmak üzcrc geliştirilen yeni metin yöntemi HTML
ve dosya yapısı bozulmadan FTP sayesinde kullanıcılara aktarılabilmektedir.
(Hypertext Markup Language) üstmeün işaretlerne dilidir. Diğeri isc İnternet üzerinden
Matematik alanında yayınlanan ilk dergilerin yayınlanmasında kullanılan FTP günümüzde
üstmetin (hypertext) belgelerinin bilgisayarlar arasında aktanlmasını sağlayan I-ITTP
de bilgisayar yazılımlarınınindirilınesinde, tez, rapor, kitap, resim ve ses dosyalarmm
aktanmında kullanılmal...-tadır(Çağıltay,
1995, s. 27).
(hyper text transfer protokol) üsİnıctin aktanm ve
Bu iki temel nokta WWW
1.3.3
Gopher ile Yayıncılık
Gopherl, 1992 yılında Minnesota üniversitesinde, önceleri yerleşke içerisinde küçük çaplı
dosya/belgelere bakmak-almak amacıyla geliştirilmiş bir yazılımdır. Diğer bir deyişle,
"dağınık noktalardaki dokümanlara (bu noktalar farklı ülke ve kıtalarda da olabilir) menü
temelli bir arayüz yardımıyla ulaşılmasırrı sağlayan bir İnternet hizmetidir" (Çağıltay,
1995, s.53). Gophertin menü temelli arayüzü kullanıcılarakolaylıklar sağlamıştır. Bu
sayede kullanıcının komutlar yazmasına gerek kalmamaktadır. Arama menüsÜTIe
iletişim kuralıdır (Ustaoğlu, 2001,
8.55).
şey
çalışma sistemini oluşturur.
HTML adı verilen bir yazılıın dilindc yazılmış düz
HTML dosyalan
WWW üzerinde
yazı
gördüğümüz her
dosyalanndan
oluşur.
WWWtarayıcılantarafından bağlanılan sW1uculardan alınır
sayfası görünümünü
belirlemede kullanılır. Web sunumu için
Bu
ve bir web
geliştirilen ilk program
"Mosaic" tir ve minois Üniversitesi'ndcki araştırmacılar tarafından tasarlanmıştır.
Güriümüzde ise birçok internet gezgini ve tarayıcısı tarafından kullanılmaktadır. En
yaygın olarak kullanılanlar, Microsoft İnternet Explorer ve Netscape Navigator'dır(Ağır,
1997,5.26).
aranılacak konu ile ilgili anahtar kelime yazıldıktan sonra İnternet kullanıcısı arama
yapmaktadır. Kullanıcı imleç ve ok tuşlan sayesinde taradığı metin ya da dosya içerisinde
WWW, dünyadaki en büyük üstmetin yazılım projesi olarak gösterilebilir. WWW
ileri geri gidebilmektedir.
işlevsellik açısından Gopher
Gopher'ın kullamcıya sunduğu diğer hizmet ise, text veya binaI)' dosyaları, ses ya da
görüntü içeren bilgilerin karşı bilgisayardan kişisel bilgisayarlara kopyalanabilmesidir.
servisine benzemektedir. Ancak hem üstrnetin yazılım temelli
bir İnternet servisi olması, hem de grafık öğelerle bir bütün olarak tasarlanması nedeniyle,
kullanıcı
ile daha uyumlu (user friendly) ve
işlevseldir. Gopher'ın menü
temelli yapısmdan
farklı
olarak kullanıcı WWW tarafından önüne getirilen belgeyi incelerken bağlantı
noktalanna tıklayabilmekte ve
dönebilmektedir. WWW
işlemeye uygım
sağlamış olduğu arayüzler,
tekrar aynı belgeye
resim, hareketli görüntii ve sesi
yayınlamrken, diğer stifeli yayınlar
teknolojik olanaklan e-dergiler,
da bu ortamda yerlerini
e~kitaplar, e-bülten1er
almaktadırlar. Web'in
ve e-magazinler için uygun ortam
sunar.
bir yapıdadır (Çağıltay, 1995, s.62).
WWW ilk başlarda bilgi ve
yaygın
diğer bağlantı noktalanna ul~ıp
kendi yayın kategorilerini geliştümektedirler. Gazeteler günlük olarak İnternet üzerinden
düşüncelerin paylaşımı
olarak kullarulan bir kitle
iletişim aracı
olarak
tasarlanmış olsa
da,
artık
olma yolunda hızla ilerlemektedir. Gazete,
televizyon ve radyodan sonra" en yaygın iletişim aracıdrr.
1.4
ELEKTRONiK YAYINC1LIGIN OLUMLU YÖNLERİ
Bu yüzyılın bilgi tlretme, yayma ve paylaşma aracı olarak. bilinen İnternet, kuşkusuz
sağlamış olduğu bu
olanaklarla rakip~iz görünmektedir. Bilgisayar ortamına alışkın
kuşakların yetiştiği göz
önüne
alındığında, geleneksel yayıncılık. anlayışından e-
yayıncılığa doğru geçişin katlanarak hızlandığı görülmektedir. Görsel-işitsel bütün iletişim
WWW sayesinde ücretsiz ola.rak gazete ve dergiler rahat bir
şekilde okwıabilmekte, çeşitli
bilgi bankalan ve kütüphanelere rahat bir şekilde erişiJebilmektedir. Bu durum
araştırmacılar için zaman ve para açısında büyük tasarruf sağlamaktadır. Akademik
araçlan İnternet ortamına hızla aİctanlmalctadır.
TI-yayıncılığın, gdeneksel yayımcılığa göre
önemlileri
arasında kağıt
tüketimi ve posta ücretlerinden kaynaklanan giderlerin azalması,
çalışma yapanlar birçok makaleye bu sayede ulaşabilmekte yenilikleri izleyebilmektedir.
aynca, yayınlanacak. olan makalenin
internet ve Vı.WW'mn bilgi hizmetlerinde sunduğu olanaklan aşağıdaki gibi sıralanabilir;
azaltılmış olmasıdır.
• Kültürel
değerlerin ve
Şüphesiz e-yaymların
bilgilerin yayılmasını sağlamak
• Eğitim,
• Sanat ve beşeri bilimler (mimari, görsel sanatlar, edebiyat vb.),
• Ticaret ve ekonomi
(yatınm,
alışveriş),
pazarlarna, reklam, uzaktan
gazetelerin okurlanyla sürekli
• Resmi ya da idari konularda bilgilendirmek.
• Bilgisayar destekli
sosyoloji vb.)
çalışmalar,
• Elektronik sanal kütüphaneler,
Coğrafya
etkileşim
halinde olduklan
görüıtlr.
Okur bir
tıklama
ile
dikkatini
çekmişse o
olduğu
sayfaya tekrar dönebilmektedir. E-gazeteler web
olanaklar, ses, resim, hareketli görüntü sayesinde
okuyucusmmn dikkatni çekip onunla etkileşim sağlamaktadır. Aynca sıklıkla ve kolayca
paylaşımı,
• Oyun ve eğlence,
• Elektronik. yayıncılık (güncel haberler, dergi, ,gazete vb.)
•
yönlerine e-gazetecilik yönünden bakıldığında; e-
bilgiye ya da habere kolayca ulaşabilmekte, sayfalar arasında kolaylıkla dolaşabilmekte,
teknolojisinin getirmiş
çalışımılann (antropoloji,
probleminin
okuyucu i izleyiei kitleye getirdiği olumlu ve olumsuz yönler
okuduğu metin
• Toplumbilimse!
kullanıcılara ulaştmlmasında zaman
bulunmaktadır. E-yaymcılığın olumlu
• Fen bilimleri, (fizik, kimya, biyoloji, astronomi ve diğer bilim dalları)
• Sağlıkla ilgili konularda bilgilendirmek ve eğ~tmel<.,
birçok avantajı vardır. Bu avantajlardan en
güncellenebilir olması da onu bash
Daha genel
yayına göre
bağlamda e-yayınçıilğın olanakları
üstün kılmaktadır (Onursoy, 2001, s.ll).
Slfalanacak olursa;
1- Java programlama dili ve çoklu ortamın kullanımı için gerekli
bilgisayara yüklendiğinde
yazı ve
yazılınılar
görüntünün yanma ses de elc1enebilmektedir.
bilgisi, (ülkeler, bölgeler coğrafyası vb.)
2~ Uluslararası etkileşim:
Bu kadar geniş bir alana hizmet vermesinin yanında web, yayıncılık için de dinamik: bir
ortamdır. Web'in dinamikliği onun metin ve görüntünün birlikte kullanımı, etkileşinıliliği,
grafık arayüz
sayesinde,
Java programı ve COl (Computer Oraphic Interface)
şekiller ve
göriintüler kullanılarak. okur yönlendirilebilir
(uzaktan eğitiın).
çoklu ortam ve üç boyutlu görüntülerin kulhm!mı özelliğinden kaynaklanmaktadır. Bı.! tür
E~yayınlarda
özellikler Web'i yayıncılık a\ôrunda da çekiei kılmaktadır. Web yayıncılan geleneksel
3-
yöntemlerle basıp yayınladıklan ürünlerini eş zamanlı olarak Web'e aktarmakta ya da
yapılabilmektedir.
is
amaca uygun bilimsel bilgi, ürün
çalışması ve dağıtımı
daha hızlı
Kağıt kullan.ımma bağlı
çevresel yıkıma katkıda bulunmaz. (Onursoy, 2001,
4- Üstmetinler / bağlantılı metinler (Hypertexl) sayesinde, Küresel ağda yayınlanan
15-
makaleden, atıfta bulunulmuş diğer e-bilgiye ulaşabilmektediL
s.14; Gürçan ve Batu. 2001; Kutup ve Benli, 2005)
5- Araştırma zenginliği; araştırmalarda bilimsel kolaylık, genü;üik, editöre mektup
Aynca akademik e-dergileıin geçmiş
ile tartışma konulan yaratılarak bu zenginlik hayata geçirilebilir.
yapılabilmektedir.
6- E-yayın araçlan bilgiye erişimi kolaylaştırmakta ve yöntem geliştinne zenginliği
E-yaymlardan olan
sağlamaktadır. Günümüzde WAP (Kaplosuz erişim protokolü) ıeknolojisinin
gelişimi ıle cep telefonlarına e-yayın yapılabilmektedir. Bu duruma en güzel örnek
Turkcell'in
"Şubuo"
hizmetidir.
da kendi biçimine uygun olumlu yönleri
anlatan raporlara ulaşabilmektedir.
8- Okur açı:;ından yine önemli bir neden, e-gazetelerin ücretsiz olmasıdır (bazı
gazeteler, sürdürümcü (abone) yayın yapsa da).
bulunmaktadır;
1. Kütüphanelerde buıunan ve İnternet aracılığıyla erişilebilen başvuru e-kitaplar
sayesinde öğrenciler okııla gitmeden araşlırmaları ile ilgili
indirebilmekte, yine kütüphanenin
7- E-gazeteler sayesinde, okur aynntılı hava tahminlerine, yol ve deniz
durumlarını
E-kitapların
sayılanna belgeliklerden ulaşıp taranın
kitabı
sağlamış olduğu yazılım
masa üstüne
sayesinde
okuyabilmektedir.
2.
E-yayınlarda kullanılan
öğrenciler
çoklu ortam (Multimedia) özellikleri sayesinde e-kitap,
için daha cazip hale gelmektedir. Okur hem görüntülü hem
şekilde kitabı
se.~li
bir
okuyabilmektedir. Birçok duyu organı kullanılarak elde edilen bilgi
daha bılıcı olmaktadu.
9- Evrensel düzeyde yayınları izleyebilme olanagı sağlayabilmektedir. Okur,
Kağıt
edinebilmektedir.
açısmdan pahalı olmasına rağmen e-kitaplar bunların çoğundan
ortamında yürütüldüğü için yayım
Kolay depolanabilmekte,
kağıt
ve
saklanması
3.
10- Zaman tasarrufu sağlar. Çalışmalar ve iletişimin büyük kısmıinternet
kitaplar,
yırtılıp, dağılabilir, taşınması
dünyanm herhangi bir yerinde yayın yapan e-dergi ya da e-gazeteden hi19i
gibi yıpranmnmakta, fiziksel
z'or, aynca üretim
etkilenmemektedir.
açıdan
fazla zarar
gönnemcktedir.
süreci çok daha kısa sürede
gerçekleştirilebilmektedir.
11- Coğrafi kısıtlamaları ortadan ka-IdmL Dağıtım sorunu, baskı masrafları,
kurumsal giderler yoktur. Sermay~ bağ!mh1ığı olmaksızın yayıncılık yapılabilir.
12. Basılı yayıncılığa oranla, çok daha büyük okur kitlelerine u.laşılabilmektediL
4. Bir diğer olumlu yanı da 24 saat istenilen yerden erişim
Aynı kaynağı, aynı
anda birden fazla
kişi
olanağının bulunmasıdır.
kullanabilmektedir.
5_ Elektronik yayıneılıkta, özellikle de İnternet süe1erinde, okuyucuya sunduğUTIuz
sayfalar sürekli elinizin
yapılan
bir hat.aya
altında
anında
ve
sizİn
denetiminizde
olduğu
için
sayfalannızda
müdahale edebilir, herhangi bir sayfadaki
13- Baskı maliyeti olmadığı için çok daha kapsamlı ve zengin içeriğe sahİp olabilir.
dilediğiniz
zaman düzeltebilirsiniz.
Özellikle fotoğraf dergiciliğinde, basılı yayınlardan çok daha fazla fotoğraf
basıldıktan
sonra hataları düzeltmenin yolu yoktur, Ancak bir sonraki
yayımlama olanağına
sahiptir.
düzeItme metni
sıkışanlabilir
yayınlanabilir ya
Basılı yayınlarda
hatayı
da derginin
ise,
ar~sında
yayın matba<:ıda
sayıda
ek olarak bir düzeltme kağıdı
(Clyde, 2005; Dede, 2005).
14- Dayanışmacı ve işbirlikçi bir kültürün oluşturulması için daha uygundur. Kitle
1
10
iletişim alanındaki seçenekli yayıncılık. arayışlarına yanıt vemıe gizil gücü
İnternet'in bilgi teknolojisine getirmiş olduğu yenilikler bilgiye erişim işlemlerinde büyük
yüksektir. Elektronik. yayıncılık, bireylerin doğrudan katılımına dayalı olması ve
avantajlar sağlamıştır. Elektronik yayıncılık, bilimsel bilgiye erişim açısından birçok yeni
"doğrudan demckrasi"ye yönelik siyası:ı.! ve kültürel açıhilllar içern:!es! nedeniyle,
olanak sağ!am~kt:'ldır. Elektronik ~/<,.Y1!1cıll.lC a.lc~demik düny<'.ya,
entelektüel etkinlikleri, seçkin. dar grup sınırlamalarının dışına çıkararak
kurmak,
kitleselleştirme
kütüphanelerin çevrimiçi kataloglanna, tam metin ve
potansiyeline sahiptir.
taslakiarı
<ıraştmnacıbrla iletişim
birbirine göndermek ye geri bildirim almak olanaklarmın yanı
sayısal verİ
sıra,
tabanIanna, elektronik
II
i
kitaplara, elektronik ansiklopedilere, uygulama
belgeliklerine,
araştırma raporlanna,
yazıhmlarına, elektronik
ön bası
8.
Yayın
yapan
şirketin kapanması.
teknik raporlara, elektronik tezlere ve elektronik
dergilere ulaşma şansını da vermektedir (İnceelli ve diğerleri, 2005).
9. E~kitabı İnternet'ten indinnek ve okumak için uygun yazılıma gereksinim vardır
Birçok ulusal ya da uluslararası dergi lnternet üzerİnden yayınlanmakta, makale kabul
10. Bilimsel
değerlendirmeıerini de İnternet
etmekte, editorial süreçleri ve hakem
gerçekleşlinnekıedir (Pleksus,
1.5
üzerinden
(('.ıÜrcan
olunısuz yönler
fiziksel ve teknolojik birçok olumsuz yön de
bulunmaktadır.
1.6
Bu
maddeler halinde sıralanacak olunursa:
1. İnternet gazetesi okurunun tavrı, başlıklara şöyle bir göz atan geleneksel gazete
yüklenme, ol-uma
doğasından kaynaklanan farklılıkları
ilgisinin geleneksel gazetede
güçlüğü
olduğundan
TÜRKİYEDE ELEKTRONİK YAYıNCıLıK
Türkiye' de elektronik yayıncılık., gazete, dergi ve diğer yayın araçlannın İnternet
Akademik çe\ITeyi temsil eden üniversiteler de bilimsel
yayınlarım e-ortama aktararak bilimin, düşüncenin ve sanatın hızlı bir şekilde
yayılmasını sağlamışlardır.
söz
konusudur. Öte yandan okuru başka sayfalara yönelmeyi teşvik. eden çok fazla
bağlantı, yavaş
olmamaktadır.
ve Birsen, 2000; Clyde, 2005).
ortamına taşınmasıyla başla..ıııştır.
okurunun ta\ITından hiç farklı değildir. Ancak İnternet gazetesinde yer alan bir
haberin en basit düzeyde bile olsa aracın
güvenilir
i ı. E-ortamlarda ışığın keskinliği uzun metinlerin l1kunmasını güçleştilTIlektedir
2004).
ELEKTRONİK YAYINClLlGIN OLUMSUZ YÖNLERİ
E-yayınlara erişimde,
çalışmalarda kullanılan alıntılar yeterince
gibi teknolojik problemler de okurun
çok daha çabuk. dağılmasına neden .
E~ yayı:r:ı- ilk olarak dergi ve gazetenin, İnternet ortamına aktarılmasıyla başlamıştır.
"Türkiye'de gazeteler 1995 yılında lnternet yayımına başlamışlardır. llk basın
kuruluşlarından Aktüel dcrgisi (l9 Temmuz 1995 Boğaziyİ Üniversitesi Bilgi İşlem
Merkezi üzerinden ınternet'e ginniş ve ilk günde II bin 500 bağlantı gerçekleştirmiştir) ve
olmaktadır.
Z3man gazetesi (2 Arahk 1995)
2. Telefon hat1annda
yayına erişiIni
çıkacak
bir sorun bağlantıyı etkileyebilmektedir. Bu durum e-
olumsuz yönde etkilemektedir.
olmuştur"
(Onursoy, 2001. s.12).
İzleyen yıllarda bütün ulusal düzeyde yayın yapaıı gazete, dergi, radyo televizyon
kuruluşlan e-yayıneılığa başlamışlardır. E-yayınlar ülkemizde de ilk yıllarda basılı yayınm
3.
E-yayınlar, basılı yayınlara
oranla daha az ciddiye
alınmaktadırlar.
4. Telifhaklannm korunması konusunda hii li yeterli teknolojik. yazılım ve hukuki
düzenleme
sağlanamamıştır.
yayıncılık. çoğu e-dergilerde devam etmektedir (Doğu Batı, Sanat Dünyamız. Varlık. gibi).
Bazı e-dergiler ise basılı derginin adeta tanıtıcısı olup okuyucuya mak3lelerin ön bilgisi
5. E- yayınlardan yararlanabilmek için teknolojik altyapı desteği (en azından bir
verilip derginin basılısım almaya yönlendirici konumundadır (Doğu Batı dergisi ve Yapı
bilgisayar ve internet erişimi) vc belirli bir seviyede bilgisayar kullammı bilgisine
Kredi Yayınları'nın dergilerinde bu durum gözlemlenmektedir).
gereksinim vardır. Özellikle gelişmekte olan ülkelerde eğitim ve ekonomik
nedenlerin etkisiyle bilgisayara sahip olma oranı ve İnternet olanağı hii Iii yeterince
gelişmemiştir.
Hürriyet gazetesi yazarlarından Serdar Turgut 1999 yılında yayınladığı bir yazı.sında
Türkiye'deki e-yayıncılığın (e-gazetecilik) 1995 yıllarında yazılı basının e-medyaya kendi
ürii.nlerinİ aktanırak başladığını vurgulamaktadır. Ayrıca bağımsız olarak yalnızca e-haber
6. Ekonomik. açıdan ha la basılı yayıncılık kadar karlı bir ticari yatırım seçe.neği
yayıncıltğı yapan iki sitenin de Türkiye'deki ilk örnekleri olduğunu söylemektedir.
değildir.
nabertürk ve Medyakronik e-yayıncılığın son derece başanh iki örneğidir (Turgut, 1999).
7. Sunum
\ ıı
web sayfasına aktanlması konumunda olmuştur. Günümüzde ise bu durum değişmekte,
sürekli güncellenen yapısıyla biraz olsun paralel yayıncılıktan sıynImaktadır. Paralel
sağlayan aracın hizmet dışı olması.
Ayrıca, «Dördüncü Kuvvet Medya" e-gazetesi de İnternet ortamında bilinirliği hızla artan
bir e-yayın olmaktadır.
farklı coğrafyalardan, farklı
Tolga Çevikel 2003 yılında yapmış olduğu çalışmasında Türkiye'deki haber sitelerini
(www.fotografya.gen.tr).
incelemiş ve bunlardan 22 tanesinin medya guruplanndan bağımsız, yalmzca İnternet
gruplarından, farklı eğitim alanlarından
tamamen imece usulüyle
ortammda var olmaları, içeriklerini kendi ürettikleri ve düzenli ve ciddi bir şekilde
yayımlanmaya başladığında,
verilmiştir.
Türkiye'nin ilk ve en kapsanılı sanal
önündeki tek örnek basılı
yayımt:ılık olduğu
için format olarak bunları örnek almıştır. İnternet yayıncılığının sağladığı
pek çok olanak bulunmasına rağmen, binlerce
Bağımsız İletişim Ağı
Adresi
htlp:l/www.bianet.org
Digi Medya
http://www.digimedya.com
değiştirmeyerek tutucu
E Haber
http://www.ehaber.net
aykırı
Haber i
http://vvww.haberl.com
2005).
Haber 3
http://www.habed.com
Haber A
http://www.habera.com
Haber Analiz
http://www.haberanaliz.com
Haber Gazete
http://www.habergazete.com
HaberMetre
http://www.habcrrnetre.com
Haber Türkiye
hltp)/ı;vww.habcrturkiye.çom
Haber Vitrini
hnp://www.habervitrini.com
Haber X
http://www.haberx.com
Havadis
http://www.havadis.net
i Medya
http://wvıw.imedya.com
Internet Haber
http://www.internethaber.com
Net i TV
http://www.netlho-.com
Net Gazete
http://www.netgazete.com
basılı
Net Haber
http://www.nethaber.com
Türkçe Süreli
Objektif Haber
http://www.objektitbaber.com
Olay Haber
http://www.olayhaber.com
Press Türk
http://vvww.pressturk.com
Sansürsü7.
http://vvww.sansursuz.com
Haber Sitesi
yaş
fotograf dergisidir. Alanında ilk olması nedeniyle, İmemet ortamında
güncelleme yaptıklarını tespit etmiştir (Çevikel, 2003). Aşağıda bu sitelerin adları ve
adresleri
çıkarılan
cinsiyet ve
bir grup gönüllü tarafından,
Türkiye'de e-yayıncılığm geliştiği bir diğer alan da e-dcrgiciliktir. Farklı içerik ve
kültüre
Diğer
alışıldtk
nedeniyle derginin
biçcmini
davramnalda birlikte, içerik konusunda her zaman
ve yenilikçi bir tavır koyarak bu ikisini dengeledik" (Kutup ve Benli,
bir örnek de "Dergibi" dergisidir. Kültür sanat-edebiyat alanında yayın yapan ve
yalnızca
olarak
yatkın koşullanmalarımız
yıldır aşina olduğumuz basılı
e-ortamda yayınlanan "Dergibi" (dergibi.com) 1999 yılından bu yana e-dergi
yayınlanmaya
devam etmektedir. Bu derginin
tarafuıdan 2005 yılında
aym zamanda okunan dergi
ilk üç
yılında
bir özelliği de Yazarlar
ilk kez uygulamaya koyduğu en iyi
ödüllendirilmesidir. Dergibi, tasanm
hayatının
diğer
olduğu
aylık.
iki
bağlamında değil,
için
ödüllendirilmiş
periyotlarla
sonra periyodik olarak. yayınlanmaktan
sürecine
girmiştir. Yavaşça
kategorisinde
içerik ye en çok ziyaret edilen,
olabilir. Söz konusu dergi
yayınlanan bir
yılından
e-yayın
Birliği
yayın
olmasına rağmen
dergi
vazgeçilmiş, sık
2001
güncellenen bir yayın
e-dergi biçiminden çıkıp kültür-sanat
anakapısına (Portaı:
İnternet anakapısı) kaymıştır (Dergibi, 2005).
Ülkemizde yayımlanan elektronik yayın yapan akademik dergiler incelendiğinde çoğu
dergilerin elektronik ortama aktarılması şeklinde olduğu görülür. ULAKBİM
Yayınlar
Listesi 'ndc
yaklaşık. 20
ade/. web
sayfası
olan, makalelerin
özetlerine ya da tam metinlerine erişim sağlanan Türkçe dergi bulunmaktadır. TÜBİTAK.
tarafından yayımlanan
popüler Bilim ve Teknik Dergisi'nin
(http//www.biltek.tubitak.gov.tr)vefizik.matematik. yer bilimleri gibi 12 dalda
yayımlanan
bilim dergilerinin elektronik kopyalarına TüBİTAK'm web sayfasından
(http://joumals.tubitak.gov.tr)
erişilebilmektedir.
aralıksız yayımlanan
Türk Kütüphaneciler
Derneği tarafından
konularda yaym yap::ın e-dergiler vardır. Özellikle tanınırlığı çok yüksek olan Fotografya
1952 yılından bu yana
dergisinin öyküsünü derginin yazarıan şöyle aktannaktadırlar:
makalelerin tam metinlerine de, ..http://www.kutuphancci.org.tr.. adresinden
erişilebilmektedir (Tonta,
Türk Küruphaneciliği dergisinde
ç~kan
tüm
2002).
"Türkiye' de, İnternet'te, sanal bir fotograf dergisi yayınlama konusundaki
yıllarda
ilk girişimi "Fotografya" nın ftkir babası ve kurucusu S. Ugur OKÇU
Son
başlattı. 13 Mayıs 1998' de internette yayın hayatına başlayan
dergilere
ülkemizde az
rastlanımıktadır.
sayıda
da olsa sadece elektronik olarak
1997 yılında Ankara Tabipler Odası
yayımlanan
akademik
tarafından Turkish
Eleetronie Journal of Medicine
1.7.1
(http://bilgi.umedia.org.tr/yayin/tejm)yayımlanmaya
başlanmış ancak günümüze dek yayım sürdürülernemiştir. Hacettepe Üniversitesi Sosyal
Bilimler Enstitüsülnün E-dergisi (http://www.sosyalbilimler.hacettepe.edu.tr/dergi) ve
E-kitaplar
E-kitaplar, normal bildiğimiz kitapların, tüketiciye sayısal (digital) biçimlerde sunulmuş
. haliilir. Bu sayısal biçim, sunuluş şekline göre çeşithk göstennektedir. E-kitaplar, CD-
2000 Ocak ayında yayın hayatına başlayan Anadolu Üniversitesi'nin Turkish Online
ROM' da yayınlanabileeeği gibi İnternet ortamında da e-kitap sİteleri üzerinden
Journal of Distancı~ Edueation lhttp://tojde.anadolu.edu.tr) adlı hakemli dergileri bunlara
yayınlanabilmektedir ve
örnek olarak verilebilir (Tonta, 2002). Aynea e-sosder (elek"tonik sosyal bilimler dergisi)
HTML ve XML
(http://www.e~sosder.com)yalnızca
yanı sıra
e-ortamda yayınlanan bir dergi olup,
uluslararası
okumak için indirilebilmektedir (Clyde, 2005, s. 45). E-kitaplar
(Uzatılabiliri Genişletilebilir
Biçimlerne Dili) biçiminde sunulmasımn
okuyueulann bu tür kitaptan rahatça okuyabilmeleri için birçok üTÜn
hakemli dergi statüsünde, indekslere (Social and Human Sciences Online Periodicals
geliştirilmiştir. Kitabın 'vey,a belgenin sayfalarım
Index) giren bir dergidir. Aynı zamanda YÖK
özel yazılımlar yazılım firmalan
yaymlatlan yazılan doçentlik
sınavında
örnek de müzik alamnda akademik
(wwvı.t1lÜZikbilim.com). Bu
(Yükseköğretim Kurulu)
bu dergide
akademik yayın olarak kabul etmektedir.
yayın
Diğer
bir
aylannda yılda iki defa yayınlanmaktadır. Oeak
ayında dergide yayınlanan
makaleler kitap
haline getirilmektedir. Bu yönüyle Müzik ve Bilim dergisi koşut yayıncılığın
boyutunu sergilemektedir (e-ortamdan>
basılı
farklı
MMicrosoft Readerndır. Adobe ve Microsoft web sitelerin Reader yazılımlarını
ücretsiz olarak
dergi uluslararası hakemli bir dergi olup mart ve eylül
bir
sunmaktadırlar. Ayrıca
kullanımını arttınnak
microsoft web sitesinde "Microsoft Reader"
için ücretsiz olarak e-book (e-kitap) yayınlamaktadır. Son yıllarda
e-kitap yazılımları için açık kod kaynaklı bir ölçüt olan DEB (üpen eBook i Açık e-kitap)
geliştirilmiştir.
ortama).
süriilmektedir. Bu yazılımlardan biri
Adobelnin üretmiş olduğu PDP biçiminde "Adobe Reader", diğeri ise Microsoft fimıasınm
ürettiği
yapan müzik ve bilim dergisidir
ekranda daha kolay okunmasını sağlayan
tarafından piyasaya
sağlamıştır.
E-kitap yazılımlanDdaki gelişmeler gücü gizli bir pazar oluşumunu
Her ne kadar yazılı basını terk etmeme konusunda ciddi direnmeler olsa da
Ülkemiz açısından değerlendirildiğinde, e-yayıncılığın henüz tam anlamıyıa otunnadığı
toplumun önemli bir kesimi e-kitaplann yararına inanmaktadır. E-kitaplar toplumsal
gözlemlenrnektedir. Yalnızca İnternet ortamında yayın yapan gazete, dergi ve diğer
eğilimi yakalamış
iletişim
sayılarında olmazsa olmıız aksesuarları arasında e-kitap
araçlan yok denecek kadar azdır. Sevindirici nokta, basılı ürünlerİn hızla İnternet
ortamına
aktanlarak sayısal bilgi birikimi ve deneyiminin
geliştirilmesidir.
Aslında
T.C.
üniversitelerinde de akademik e-dergi yayıncılığımn hızla geliştiği gözlemlemnektedir.
E-yayınlar, okuyuculara
bilimsel ve
kullanmaktadırlar. Yayıncılarbıı
şekilde erişebilmektedirler.
araçlarıyla
okuma biçimini de
içerikleri
getinniştir.
etkilemiştir.
biçimleri görülmektedir.
yayınlama biçimini
diğer
ulaştırmak
teknoloji sayesinde okura
Bu hızlı ve etkili
büyük değişiklikıeri beraberinde
aktarım
şimdiden
ELEKTRONİKYAYINARAÇLARI
için son
artık
teknoıojileri
ve teknoloji
endüstrisinde
Tüm bu gelişmeler, yeni donanım ve
Son on yılda elektronik yayınlann
yazılım
çeşitli
çok geniş bir kavramdır ve birçok
farklı
içerir; ki bunlar arasında elektronik kitaplar, istek üzerine basım
(PO 0- Print-on-demand), e-posta yayıncılık, e-bülten, e-mürekkep, e-dergi ve web
yayıncılığıdır. Yakın
zamanda daha da
şirketleri
ölçütün başarılı
bu
işe akıl
olacağını
almaz derecede yatmm yapmışlardır.
ve insanlanil
e-kitııplara ne
zaman alışacağını
kestirebilmek olası değlldir. E-kitapları okumada, kullanılacak cihazlann 50
USD altına düşmesiyle, daha kolay benimseneceği yadsınamaz bir gerçektir
(Desktoppub.about, 2004).
daha hızlı ve verimli bir
erişme isteği basım yayım
E-yayıncılık
okuyuculan da almış durumdalar.
bu pazar, beklenenden fazlasını da verebilir; çürn..'"Ü pazann önd", ge(en
basımevleri
Açıkçası hangi
1.7
görünmektedir. Yaygın olarak bilinen kadın dergisi "Vogue" nun son
farklı e-yayın tekniklerİ geliştirilebilir.
1.7.2
İstek Üzerine Basım
Yeni olan bu yöntem kitabın bir defalığına ya da talep üzerine basmıını ifade eder. Bu
yöntem sayesinde serbest yayıncıların gereğinden fazla baskısı önlenebilir. Bu yöntem
lazer baskı sistemleri ve yazıcılann okuyabileceği elektronik biçimlerini içerir. birçok
yayıncı
bu yöntemle daha az sayıda kitap basarak daha fazla gelir sağlayabileceğini
düşünmektedir. Kullanılan teknoloji şimdilik pahalıdır.
Newyork Times'da yayınlanan
habere göre, e-kitapta öncü şirkçtlerden biri oian Ligiuening Source Ine. yayıncılardan
kitap başına 4 USD'dan fazla bir ücret almaktadır. Bu da az miktarda seri üretime göre
yiıksek bir fiyattır.
i 16
Teknolojinin ucuzlanıası ise daha çok yayıneının bu sisteme geçmesine
bağlı. Aslında bu yöntem nonnal kitaplarla elektronik olanlar arasında bir geçiş basamağı
olduğu metilİ biıı1en.:e kişiye aynı
olarak da düşünülebilir.Yine de bu yöntem eskisi gibi kağıt sayfaları kullandıgı için, e~
Farklı
kitaplar gibi hızlı ve ucuz biçimde ruketkiye ulaştırılaınamakt.ave uzun vadede şöhretini
aracı
yitirebilmektedir. Tüketicilerin e-kitap yazılımlan ve donanımlanna alıştıklan
biçim ve tarzlarda yapılanan E-posta yayıncl1ığ] gitÜkçe büyüyen bir yayıncılık
olarak görülmektedir. Oldukça farklı konularda bültenler vardır, bazılan çeşitli özel
konular üzerinedir.
düşünülürse, talebe göre baskı yöntemi öneminj yitirecektir (Desktoppub.about, 2004).
anda gönderir (Desktoppub.abouL, 2004).
Bazı
e-posta bültenleri basılı bültenlerle ya da küçük dergllerle benzer
içerik ve türdcdir. E-postalar,
e-yayınların özetlerinİn stirdürümcwere dağıtıldıgı
araçtır. İntemet'inkullamldığı ilk yıllarda, bilim insanım tarafından rnak(jlt:
1.7.3
bir birleri
Sayı.al İçerik
arasında paylaşımında kullanılmıştır. Günümüzde
sürdüriimcülere günlük ve
Sayısal içerik kitaptan daha kı3fL olan her türlü yazılı bdge anlamina gelmektedir.
haftalık
de
e~yayınların
ye
bir
özetlerin
içerik özetleri
obrak e-posta aracılığıyla ulaştırtlmaktadır
(Writerswrite, 2005).
Yayıncılar bu içeriği tüketicilerin el bilgisayarı ve diğer kablosuz araçlarına
göndcrebilmektedider. Bu tür içeriğin gönderilmesinde kunarulan teknoloji Adobe, PDF,
HTML, Wap ve diğer tekniklerdir. Verinin paylaşımı süresince "güvenliği"sağlama,
1.7.6
yayınlann en büyük endişesidir. çünkü içeriğin kopya1anması ve yasa dışı olarak satılması
E-posta yayıncılığına benzer e~bülten yayıncılığı İntcrnet iş dünyaslilın vazgeçilme:z
önemli bir tehdit teşkil etmektedir. içeriğin tüketicinin tdefoıılarına, ccp biıgisayarlarına
yayınlarından
hatta elbiselerine aktaran kablosuz içerik pazarı, gücü t.am olarak bilimeyen çok büyük bir
da bir farklılık oluşturur. Bültenler e-posta ile aboneye Uıaştmlır ve magazin,
pazardu. Bu gerçek, önde gelen birçok medya şirketleriyleyayıncı firmalann dikkatini
listesi gibi
çekmektedir (de>ktoppub.about., 2(04).
vazgeçebilir. Ticaret
yapılmış
1.7.4
biridir.
Hızl1
işlevi vardır.
Ve kolayoluşunun
yanında
konuya
E-bültenlerde de zorlama yoktur.
dünyasında yaygın
Kişi
yaklaşım biçimi
ve
tarzıyla
tartışma
isterse abonelikten
olarak kullanıjan e-biiltenler,
müşterilere
olunan yenilikleli haber vermek için kullanılır. E-bülten yayınc1lığmda ticari
kaygılarla yayın yapılmaktadır (Ebookcrossroads,
E-mürekkep
2005). Aynca uzun sürcli etkinlikler de
de e-bülten yayıncılığı kullanılabilmektedir. Omeğin; Mimarlar kongresinin e-bülteninin
E-mürekkep teknolojisi, medya ve yayıncılarm ilgisini çeken gelişmckte olan bir
yöntemdir. Bu yöntem kendi kendini güncelleyebilen gazete ve kitap yaratmad~
E-bülten Yayıncılığı
yayın hayatı,
.
kullanılmaktadır. Aynca içerik. istenilen zamanda değişmesi için programlımabılmcktedır.
Sür:;;kli olarak farklı görıl.'1tiiler sergileyen reklam ve ilan panolan bunlara örnek olarak
gösterilebilir. Xerox ve ciddi yatırımcılardanoluşan e-mürekkep şirketleri şu anda tüm
hızla bu teknik üzerine çalışmaktadırlar (Desktoppub.about, 2004).
kongrenin amblem yarışmasındanbaşlayarak etkinlik bitinceye
yaklaşık
üç yıl devam
ı. 7.7
Web Yaymcılığı
Web
yayıncılığı yayın
değin
etmiştir.
endüstrisi ve yazarlar üzelinde güçlü bir etkiye sahiptir. çünkü
birçok radyo ve televizyon haber hizmeti
sağlayanlarda olduğu gibi
(NBS, CNN vs.)
hemen hemcn bütün gazeteler çevrimiçi (online) uyarlamaya sahiptir. Magazinlerin çoğu -
1.7.5
E-posta Yaymcılığı
baskı uyarlarnalannın dışında~
özgün web içeriklerine sahip olmaya başlamışlardu. Bu
E-posta yayıncılığı, haber, makale ve kısa bilgilendirme iletilerinin kolaylıkla "e-
gelişmeler [nternet üzerinde olmayan şirketleri elektronik yayıncılık dünyasına girmeye
postalarından" almaktan hoşnut olan ınsanlar İçin gayet bilinen bir seçenektir. Buna
zorlarnıştır. Bütün
benzerbilgi iletilerin üretimi ve tüketiciye ulaştmlması, hemen her türlü konuda tartışma
de
ve e-posta listelerinin oluşmasına sebep olmuştur. Hatta iş çevrelerinde. tüketiciye bu
Web yazarlar için birçok fırsat sunmuştur; artım okuyucu kitlesiyle,
büyük
şirketler v·,.-cb
müşterilerinin sorunlarını
sitelerini, hem ÜTÜn ve hizmetlerini taultmak hem
giderme ve
satışlan
destekleme
amacıyla kullanmışlardır.
işlerini sergileyeceği
şckilde ulaşmak üzere birimler oluşturulmuştm.Bu tür iletiler ay:-:.ca r:::.edya şirketler~"'1ç,;
iJir viuin ve
kendi İnternet hizmetlerini tamamlamak için kullanılmaktadır. birçok yazar okuyucu
siteleriyle
kitlesini arttırmak, yeni kitapıarını duyunnak ve imza günlerini bildirmek için yazmış
atabilmektedirler. Bu yönüyle web yayıncılığı bireysel yayın yapabilme
118
ayı.1l
zamanda bir iş
aianı olmuştur. Aynca
çevrimİçi yayınlanm yapabilmekte
yazarlar sahıp oldukları web
ve web yayıneılıkdünyasına kolayca ad1ID
özgürlüğü de
getirnuştir. Bir yazar alan adı ve alan kirası satıu alarak web yaymı yapabilir,
düşüncelerini diğer web okurları ile paylaşabilir. Aynı zamanda kitabını kişisel web
yayıncılığı 30 yıllık
yayınlarını
bir geçm.işe sahiptir.
hızlı
daha etkili ve
bir
E-yayıncılık, ak.ademisyenlerİn birbirleri
şekilde paylaşabilme
istekleri sayesinde
ile
gelişmiştir.
sİtesinde e-kitap olarak yayınlayabitir. Wcb yayıncılığı, bütün e-yayın araçlanm (e~
1989 yılındaADüNISı projesi ile basılı akademik dergi makaleleri CD-ROM üzerinde
dergiler, anakapılar, e-posta servisleri gibi) ıçinde barındıran bir yapıya sahiptir
gÖ1Üntiilü olarak
(Writerswrite, 2005).
(Amerika) ve Right Page TM service AT&T Bell laboratuarlannda benzer çalışmalar
saklanmış
ve
yayınlamıştır.
Daha yakın bir zamanda Elsevier TULlP
denenmiştir. Aynca Tilburg Üniversitesi Elselvier ile birlikte kiitüphanelenle taramış
1.7.8
E-dergiler
E~dergilef sosyal, kültürel, siyasi, spor, edebiyat, sanat gibi konularda, makaleler, deneme,
oldukları basılı yayınlan bilgisayar aracılığıylakullanıcılara sunmuşlardır. Bu başlangıç
aşamasındaki yuh-;;malar
paralel
yayıncıhga örneictir (Ağır:
1997, 5.43).
araştırma, röportaj şeklinde yazılann yayınlandığı e-ortam1ardır: E-d~rgjler magazinel ve
Son beş yıl içerisinde basılı akademik dergiler ile elektronik akademik dergiler arasındaki
gü!ıcel olabHeceği gibi bilimsel ya da akademik de olabilmekted!r. internet onamı
aynm giderek azalmaktadır (Valauskas, 19(7). Bunun en belirgin kamtı ise
incelendiğinde çoğu dergilerin basılı uyarlamasımn İnternet'e ta~ınmış hali olduğunu
akademik dergiler ile elektronik akademik dergiierin editörlük sürecindeki farklı
görülmektedir. Yeni yeni oluşan güvenle birlikte akademik dergiler sadece elektronik
olarak yayınlanmaya başlamıştır. Bilim adamları ve akademisyenıer İnternet'i yalnızca
işleyiş1t.nnin ortadan kalkması, eş deyişle, her
izlemesidir. Bu durum,
geleceğin genç araştırmacılan
haberleşmek için kulhmmayıp bilimsel yayınlannı yayınlayabileeekleri ortam olarak da
araştırmalanın sergilemek
kullanmaya başlamışlardır.
iktişim kanalı yaratması açılarından
İnternet'in e-yayıncılık üzerindeki etkisi teknolojik gelişmelerle birlikte sürekli
artmaktadır. E-kitaplar ve kablosuz içerik yakın tarihte hayatınıızda daha çok önemli roller
alacaktır. E-yayıncılık teknolojik gelişirole birlikte birçok yeni araçları da gündeme
taşıyacak toplum ihtiyacı olan bilgiyi, eğlenceyi ihtiyacı olan çoğu şeyi e-yayınlar
sayesinde alabilecektir.
Elektronik
ve
yayınlarnaIı: açısından
yayıncıılk. alanında son
yayınlann sunduğu
ikisinin de
editörtük sürecini
için daha fazla
yayın ortamında
daha geniş olanaklar sunması ve
olumlu bir gelişme olarak
birkaç yılda gözlenen hızlı
değerlendirilmektedir.
gelişmelere ve
yeni olanaklara rağmen, akademik çevreler elektronik
kolay kabullenememektedirler. 1992 YillOda yapılan bir
araştırmacıların
aynı
basılı
elektronik
yayınlan pek
araştırmada üniversitede
görevli
bilgisayar ağlannı çoğunlukla elektronik posta amacıyla kullandıkları
ortaya çıkmıştır. Bu
araştırmacTların%7
gibi çok küçük bir bölümü bilgisayar ağlarını
biigi edinme ya da bilimsel makalelerini yayımlamak amacıyla kullanmışlardır
1.8
AKADEMİK El,EKTRONİK DERGi YAyıNCıLlG!
(Tonla, ı 997).
Akademisyenlerin bilimsel içerik taşıyan çalışmalarının akademik dergilerde yayınlanması
Angell ve Smith'in 1998
sürecinin tüm basamaklannda elektronik ortam ve araçlannın kullanıldığı yayıncılığa
Dergi
"Mademik Elektronik Dergi Yayıneılığı" adı verilir. Elektronik akademik yaYıllvıiık basjt
Editörlerinin
ve kısa olarak; beni aralıklarla İnternet ortammda makale, araştırma ve diğer akademik
özellikle akademik elektronik dergilerin diğer elektronik dergilere oranla finans
bilgilerin; dergi. yönetimince belirlemniş değerlendinne ilkeleri açısından yine o derginin
sorumlu ve göre·vIi editörlerinin süzgecindcn geçerek dergide yayınlann:asıdlf (Valau~kas,
yılmda
Karşısında Elektronik
Göıiişleri" adlı
40 elektronik dergi
editöıii
ile
gerçekleştirdiği "Basılı
Dergilerin Maliyeti ve Yaradan Açısından Elektronik Vergi
makalelerinde eleletranik dergilerin geleceğine ilişkin
açısından
pek şanslı olmadıklannı vurgulamaktadıdar. Örneğin akademik. el~ktronik dergilerin
sınırlı
ve özel konularda akademik hedefkitleleri bulunmaktadır. Bu nedenle bu tür dergi
1997). Derginin akademik bir dergi olduğunu derginin yayınkunılu, alanmdaki hakemleri
yöneticilerinin rastgele reklam alma
ve bilimsel çevrelercc kabul gönncsi belirler. Basılı akademik dergiIerle aynı süreci
birlikte gelecekte akademik. elektronik dergiler, editoriaI
yaşayan elektronik akademik dergiler, elektronik ortamın verdiği avantajlan
editörkriTIi alz..-ıda bilinenler içerisiaJeli ve olabildiğince de ~n iyilerini seçmelidirler. Aksi
kullanmaktadırlar.
durumda akademik bir dergi olmak yerine, sıradan ve resmi olmayan (informal) bir
E-yayıncılığın, gelişim sürecinde de belirtildiği gibi. e-posta ile başlayan e-akademik dergi
mektup
120
şeklinde çıkan
olanakları olmadığına değinmektedirler. Bununla
sÜI~ylerini
güçlendirmeli.
gazete (newsIcttcr) olmaktan öteye giclilemeyeceginden söz
21
i
etnıektedirler (Angeıı
Abant İzzet Baysal Üııiversitesi Düzee Tıp Fakültesi Dergi!;İ
ve Smith, 1998).
Akadernık elektronik dergi yayıncılığında Jhon I-Iopkins Üniversitesi tarafından yürütülen
http://www.dtip.edu.tr~joumal.hım
MUSE projesi, Elselver Science ve 9liniversite ile yiiıiitülen Tulip projesi ayrıca MİT
Adnan Menderes Üniversitesi Tıp Fakültesi Dergisi
(Massachussets Institute of Technology) yayın evinin
http:/ıtip.adıı.eu u.ıridergi/
ilerlemeler
altmda
kaydedilmiştir. Bu
toplayıp yayınım
elektronik olarak
özelliği
birden fazla e-dergiyi
aynı çatı
yapabilmesidir. Tulip projesi Elsetver Science'in e·dergi
yayıncılığını yüriittüğü ticari
ücretli olarak
projelerin en önemli
yapmış olduğu çalışmalarla önemli
bir projedir.
Fizik~mühendislik alanında yüzlerce
yaymlanmasım sağlamaktadır. Dergiler şu
derginin
anda HTML biçiminde ve
yayınlamaktadır. E~dergi yayıncılığına diğer güzel
bir örnek ise yalnızca
elektronik olar<ık iki ayda bir yayınlanan Newcmtle ÜniversiLesi Web Jounıa! Current
Akademi Dergisi/ Kocaeli Üniversitesi
http:/.. www.koıı.edıı.trlhasindakou/akademilindex.htm
Akdeniz Üniversitesi tktisadi İdari Bilimler Fakültesi Dergisi
http://www.akdeniz.edu.tr/iibVyenilgeneVdergi/index.htm
Legal lssue dergisidir. Postmodern Culture ve J(lmna! of Elektronie Publlshing İnterrıet
Ankara Ünİversile:ii Tıp Fakültesi Mecmuası
ortamında HTML biçimind~ yayın yapan
http://www.ankara.edu.tr/reetorate/kutuphaneiYayinlar/dergi!er/tip.htm
örnek dergilerden
bazılarıdır (Agır,
1997, s.71-
72).
Balıkesir Üniv. Fen Bilimleri Enstitüsü Dergisi
Elektronik Akademik dergilerin
oluşumılmasınınnedeni,
Üre-lilmesİni. yayılmasını, kullanılmasını geliştirmek ve
duyurmak
isteğidir.
bilginin dizgesel olarak
bilgiyi daha
geniş
kitlelere
E-ortam, bunu kısıtlamadan, hızlı bir şekilde yapıImasına olanak
sağlamaktadır. Aynca aranılan bilginin hızlı buJunması ve
de
paylaşılması diğerbir
http://the.balikeslr.edu.tr!dergi.htm
Boğaziçi Üniversitesi Eğitim Dergisi
http://edjoumaLboun.edu. tr/
özelliktir.
CelaL. Bayar Üniversitesi Sosyal Bilimler Enstitüsü Dergisi
Elektron.ik akademik dergiler, İnternet. üzerinde en çok kul\anı!an WWW ıle HTML ve
http://www.bayar.edu.tr/%ı
7 Esosy aVdergi/
SGML (Standart General:ized
Mıırkup
Language) biç.iminde
yayınlanmaktadır.
Aynca
sayfa düzenleme biçimlerinde de; Adobe Acrobat PDF format, Corel Ventura , CoıTImon
Ground
Çukurova Üniversıtesi İİBF Dergisi
http://idari.eu.edu.tr/dergi!
gibı yazılımlar kullanılmaktadır.
Dokuz Eylül Üniversitesi Tıp Fakültesi Dergisi
E~dcrgi yayıncılığı -UZerine araştırma
üniversitelere ait
etmiştir.
tıp,
yapan Ali Yar Ttirkiye'de 2003
yılı
verilerine göre
Devlet kUfLunlarına ait 38,
diğer vakıf /
demek ve ticari
kunıml:ua ait
232
derginin yayında olduğu belirtilmektedir (Yar, 2004, s.450-453). Üniversitelerin yayın
organı
http://WW"".Y.·.tip.deu.edu.tr/dergi.!
sosyal bilimler ve mühendislik alanlannda LLS adet e-dergi tespit
olan e-dergilerin
çoğu, basılı dergilerin
(paraleı yayıncılık). Yalnızca e-dergi
e-ortama aktanlmasındanoluşturulmuştur
olarak çıkanların sayısı yok denecek kadar azdır.
Anadolu Üniversitesi'nden Turkish Online Journal of Distanee Edueation
Eastem Journal of Medidne/Yüzüncü Yıl Üniversitesi
http://ejm.yytl.edu.tr/
Gazi Üniversitesi Fen Bilimleri Dergisi
http://www.gujs.urg/
(http://tojde.anadolu.edu.tr) sadece elektronik ortamda yayın yapan akademik elektronik
Gazi Üniversitesi Üniversite ve Toplum Dergisi
yayınc\lığına bir
http;/!www.universite-toplunı.urg/index.phpJ?code"'UT
örnektir.
Aşağıda e-yayın yapan bazı
adresleri
verilmiştir;
üniversitelerin elektronik akademik dergilerinin Internet
Hacettepe Üniversitesi Eczacılık Fakültesi Dergisi
http://wv.w.fanna.hacettepe.edu.tr/dergi!dergi.shtml
İstanbul Kültür Ürriversit~si Hukuk Fakültesi Dergisi
için kullanılan standart!kayna..\c bulucu)
http://y.,ww.iku.edu.tr/gunce/Gunce.asp
aracılığıyla erişilir
E-dergilerde genel anlamda üretim süreci
İTÜ Dergisi Seri C: Fen Bilimleri
a) Hazırlık: Yazar
http://www.itudergisi.itu.edu.tr/itudergie.htrn
Journal of American Studies of Turkey / Bilkent Üniversitesi
http://www.wincscope.ı..:omJsiteihabı:r_detay.asp?haber_id=20
1&ay_no=404
çaltşma makal~
('Ireloar, 2(05).
aşağıdaki bölünüerden olu~ur:
metnini
y3ymcıya verir.
b) Gözden geçirme ve düzenleme:
Danışma
t<ırafından makale
Hakt:ınlcrin görüşüne
metni incelenir.
kurulundaki uzman hakemler
göre ya çalışma kabul
edilir ya da reddedilir veya düzeltmeler yapması için yazara geri gönderilir.
Journal of Sports Science & Medicine !Uludağ Üniversitesi)
c) Yayınlanma süreci: Kabul gören içerik ve görsel malzemeler e-ortamda
http://www.kobi-efor.com.tr/haber_detay.asp?id=590
yayınlanmak üzere
Ağ ortamında yayınlanmak üzere
düzenlenir.
sunucuya
konulur.
1.9. AKADEMiK ELEKTRONİKDERGİLERİNÜRETİM SÜREci
d) Aboneleri haberdar etme: Bu
Akademik elektronik yayıncılık, basılı dergi yayıncılığına benzer süreçleri elektronik
ortamın verdiği
olanaklara göre
biçimIerne, haberdar etme,
Biçimlerne: Bilgi
aktanmı
gerçekleştiımektedir. Her
Web üzerinden akademik dergi yayıncılığının yayınlanı:;; biçimi
takım
metni kopyala
makalelerine ekleyebilmektedir.
zorundadır tTreloar,
yapıştır
biçimleniş, zengin
şeklinde
basılı yayıncılığa göre
Basılı yayıncılıkta, doğrudan alıntı
bir
tekrar yazılmak
2005).
Haberdar etme: Ak.ademisyenler çoğu zaman yayınlardan haberdar olamamaktadır.
Dergilerdeki makalelerden haberdar olabilmeleri içİn ya dergiye abone olmaları ya da
E~dergiıerde
i5e akademisyenler e-
posta aracılığıyla yayınlardan haberdar edilmekte ya da İnternet ortamında erişim için
dizinlere arama motorları aracılıyla da ulaşabilmektedir (Treıoar, 2005).
Erişim:
Geleneksel basılı yayınC1lıkta dergi abonelerine posta yoluyla yollanır. Ahone
olınayen n!~ştLT'!l1ô\.o:~!ar
ise kütüp:h.!!!1ele!~le!l
sf'..!e!~ ·Y~Yl!!.?l1!;:ı.ş!d<ır.
Elektr,,:)ni"\.:: ::ıhıdemik
dergilere ulaşmak ise Listserv'larda bulunan dergilere e-posta ile, FTP, Gopher ve web
üzerinde bulunanlara ise URL (enifonn Resouree Locator /
kaynağın
uygun biçimde
adresini belirtmek
Geçmiş sayılar
sonradan
sürdüıümeülerin
5unucuda beıgeliklendirilebilir (Ağır, 1997,s: 67).
Üretim aşaması yukarıdaki gibi genel başlık altıo;cla wplansa da, her bir a;.amanın kendi
içinde
de olabilir.
yöntemi ile referans göstererek kendi
kütüphaneye gidip tarama yapmalan gerekmektedir.
erişebjlmeleri için
Akademik e-dergilerde
avantajlar sağlamaktadır. Akademişyenler, doğrudan alıntı yapacaklan zaman e-
yayından alıntı yaptıkları
e) Belgeliklerne ve dizinlerne:
ister akademik olsun isterse magazinsel olsun stmulduğu aracın
bir biçimlerne dili olan HTML olaeağı gibi Adobds Acrobat (PDF)
sayısının SUDUCUda
sürdürümeüye de yollanabilir.
erişimd~r.
bilgi e-ortamın sunmuş olduğu olanaklara göre biçimlenmektedir. Bu
derginin yeni
y~yınlandığınm e-posta aracılığıyla duyurulmasıdır. Dergi
iki ortamın da ortak noktası;
yapısına göre şekil almaktadır. Basılı yayıncıhbaki kağıdın aksine
işlem
farklı işleyişleri vardır. Aynı
göstennektedir.
Yayınlanına süreci
zamanda bu
dergilerin
işleyiş dergiden
yayın politikasına
Elektronik dergilerin de diğer basılı yayınlardaki gibi bir yayın
dergiye de
farklılık
göre değişmektedir.
politikası
ve gizlilik ilkesi
vardır. ltgili yasalar ve yönetmeliklerin öngördüğü bir şekilde her yayınevi yönetmeliğiııi
hazırlar, dergisinde
Basılı
yazar ve izleyici kitlesine bildirir.
dergilerdeki gibi e-dergilerin de
kılavuzlannda
derginin biçimsel ve içerik özellikleri belirlenir.
metinlerinde kullanılan yazı
ince
ayrıntısına
yayın
çeşidinden büyüklüğüne,
Kılavuzda
maK.ale
dipnot ve kaynakça gös1erimine, en
kadar belinilir. Aynca makalenin hakemler tarafından onay ölçütleri de
ilkeleri içinde belirlenir.
bilimsel
yayın kılavuzları bulunmaktadır. Yayın
çalışmasıili editöre
Yazarların bu yayın
göndermesiyle
işleyiş şeması verilmiştir (Görüntü:
2).
ilke ve blavuzuna göre hazırladığı
sÜfeı; başlar.
AIka sayfada bir e-derginin
(abul .:diler
'11ai<.aie
e,cergide
:
!!
!
~
ı_
r
i Ham!21l'"ın i
// i
i <v.j
~
i makaJe i
i yı;neoci ı
L
~e,!(r-e[ere 1
'
~,,)
V.:ı'i:~
i
YOiJec:cı
dt'I"etll1'li
~
~
,
<.."dıtbre
ı tönderiliı
,
karşılaştırıldığmda, (nispeten) yeni bir tasanm alanı olduğu görülür. "Birçok tasaIl;m
disiplini gibi. web
__,---+-t
t
---11
...__._---_ .. ~._.J
i
~
Edilür
i
~
j
~1akcrie
1
~c:ıteke
,
;Cı~t:-E'rıilf
i
1
""a!<.al€'j' ı
1-"'
1 ...e ,,"crlar
~
Editar
özelliklerden
Web
tasarımı, tasanın alanlan
Ayrıca tasanın,
sanat
Yenr
(e--littera dergisinin broşüründen alınmıştır).
içinde grafik tasarımın bir aIt disipli.ni olarak
alanları içinde bİr
disiplin olarak da görülebilir (Bu
diğer
sanat
açıklanabilir.
açıdan bakılırsa;
sanat ve
tasanın açısından diğer
ilkeleri paylaşır. Web tasanm ilkeleri de
olarak
t.asarım dallannın
formlarının tasanm
mirası ü:ıerine gelişmiştir (McClıırg, 200Sb) .
Estetik nitelikleri olan web siteleri için, genel
ilkeleri
geliştirilmiştir.
1- YalınıOk
Tutarlılık
4- Denge
8- Oran /
Orantı
9- Uyum, Bütünlük
20
bir yayın aracıdır"(McClurg, 2005b).
biçimsel farklılık gösterse de, temel
buluştuğu ortak
7- Ritm
ı
dolayı farklı
tasarıım, nitelik
6- Vmgıı
akış şema:,1l
dolayı _farklı
resim, illüstrasyon ve heykd de bir tasarım ürünüdür). Web
5- Görsel hiyerarşi
(Görüntii:2) E-derginin
zOlunluluklardan
anlayışınakişisel farklılıklar ve yaratıcı zenginlikler kazandınnaktadır .
3- Açıklık
"'-ilkem Ccwete
yanıt
ekranın getirdiği
biçimi vardır. Web. görüntü sıkıştırma, eklemeli renk alanlan, ekran
çözünürıük1çrİ gibi
2evet
denetimı
de
SOLL
(~
)
işleyiş
tasanın sürecinde
Bilgisayar donanımı ve İnternet teknolojilerinde .sağlanan gelişmeler, web sayfa tasarımı
rııakaie
hakkında
i
./
havır
Yeni bir iletişim aracı olarak var olan web siteleri' diger iletişim tasarım .biçimleri ile
lD<-'ger't-~:-:iMi
ev€t
..lakale
~-_
WEB SAYFA TASAlUM İLKELERİ
2.1
,~
haY!{~
WEB
i
".
.
"V
ELEKTRONİKYAYINLARIN YAYıNLANDlGI ORTAM:
yaymtarı~
n·
~ 1 nı,r<2'ES;f'" i .., ------------ii··
i
i tıaı:rrar
~
,i
i
"'~
i
i ri!ıClr
2. BÖLÜM
L
Bu tasanın ilkekr!
tasarım ilkelerine koşut web
şunlardır;
sayfa tasarım
içinde
Yalınlık
2.1.1
Görşel iletişim tasarımı
ürünlerinde,
ilc hedefkitleye uygunluğu vb.
l<ısanm ürününün özgünLüğü, dikkat çekiciliği, mesajı
dışında,
aktanlrnası ve anlaşılır kılınması da
biçinıde aktarılabilmesi için bazı
görsd / süzel iletinin kolay bir bıçimde
önemlidir. Aşağıda görsel i sözel iletinin etkili bir
kaybolması
engelknir. Çok kabul edilebilir bir tasarım ilh:si
vardır:
"Az daima
çoktur". Bu tasanın ilkesine göre harcket edilirse, web arayüzlerinde ortalama ekran
yoğunluğu tutturulur.
Yoksa kaımaşa ve kaos oluşur (Görüntü: 4). Ayrıca içerik ve görsel
öğelerin aşm rrıikta~da bilinçsiz kullanımı kaydımıa çubuğunu etkilemektedir
(Edtech.yt,
(ty*)).
ön0riler verilmiştir. Bunlar:
• iletmek istenilen (görsel/sözel) öge kadar grafık ve metin kullanılmalıdır.
• Gereksiz
grafık ögeler,
görsel
algıyı
olumsuz etkiler,
• Renk ve metinlerin aşın çeşitliliği, öğrenmeye yardımcı olmaktan çok insan
zihııini karıştırır.
• Canlandırma ve ses gibi çoklu ortam araçlan iletiyi destekleyecek nitelikte
kullanılmalıdır.
•
Kullanılan
görüntü ögeleri yı;; mdinler uygun ve net olmalıdır.
• Kullanıl:m görüntü ögelerinin (fotoğraf, illüstrasyon vb.) ne içinkullanıldığı
daima belirtilmelidir.
• Görüntü ögeleri ve metinler, kolayokunabilir Ye
anlaşılabilir olmalıdır
(Görüntü: 4) Görüntü ve reliklerin yoğun olarak kullanıldığı
www.an...ıysganıge.com (Edtech v( (ty)).
(usask.ca,
200Sb. (pcttersson, 2002, s. 50).
Yalınltk ilkesi,
web tasammnda kul1amlan
ögelerın,
iletinin daha
kolayalgılanması'Ye
2.1.ı
iletilmes! içın uygularur. Görüntü ögeleri ve metinleri kullanırken anlaşılırlığa, iletiyi
Tutarlılık, çoklu
ilkesidir.
kuııanılmalıdır. Hedefkitlenin
zihnini kanştıracak ve görsel/zihinsel
içinde dolaşım kolaytığ1 sağlamaktr,.dır. ParkCL web sayfa
zorlaştıracakher
ve
türlü
gösteriş
karmaşadan kaçınılmalıdır (Görüntü:
3).
bir site:
Tutarhlık-CörselSüreklilik
aktaruken rahat algılanılabilirliğe dikkat edilnıeli~ basit, yalın bir anlatım dili ve biçimi
algılamasını
kann.Jşık
ortam ve web sayfa tasarımında en dikkat edilmesi gereken hir
Tasanında h.ıtarlılık, izleyıciye ya
da drur3 okuma- izleme 'ıe tasarlanan ürün
"sayfalar arasında farklı bir görsel dil kullanarak ani
tö:),mm\a.rındaki tutarlığı,
değişiklerle siteyi
kullanıctnın, şaşrr1ılmamasl" olarak tanımlamaktadır (Parker,
Gazete, dergi,
broşür
ziyaret eden
1999, s.111).
gibi sayfa tasarımının yapıldığı grafik ürünlerde
numarasınınbulunduğu yer, başlıklann
ta,;rırırn
puntosu, yeri ve rengi,
yazı
nıtadılık, sayfa
karakterinin seçimi,
görüntü ögelerinin yerleşirni, kullanılan metin sütunlanrun sayısı, vb. dummlarla
sağlanmaktadır. Benzeri
durum web siteleri için de geçerlidir. Web sitesi
kullanıcının rahat dolaşımı
tutarIJ bir tasanmla
tasarımında da
sağlanmaktadır (Grantasticdesigns,
lOOSd).
Etkile~imli ortam ürünleri ve İnternet üzerindeki web sayfaıarının farklı bir dolaşım
(Görüntü: 3)
Yalın bir
site
öme~i
dizgesi
wWW".boo.com(Edtech.vt,(ty)).
olduğundan, tasarlanan
sayfalar
arasında tutarlılık aşağıda belinilen
özelliklerle
sağlanmaktadır;
Yalınlığın
ve basitliğin
karşıtı yoğunluk ve karmaşadır.
Nitelikli bir web arayüzü
tasarımı
•
Ardıl
olan
sayf::ılardan diğer
için yoğunluktan kaçtnılmalıdır. Görüntü ögeleri ve metinler, verilmek istenen ileti / içerik
site .sanki tek elden çıkmış gibi
için etkili olarak kullanılırsa, kullanıcının web saytasmı algılaması kolaylaşır ve sayfanın
yazım dili kullanılmamalıdır.
bir
~~yfay).\ gcçer"'en
olmalı sayfanın
sl.mum
biı;imi ÇlJ:r:r.eı.lııJu.
birinde resmi diğerinde argo bir
* ty; "tarih yok" anlamında kısaltma, web sitelerinden alınan görüntü ve yazılarda eğer
y",yınlanma
yanına
"(ty)"
ve güncellcnme
tarihı belırtihnemışse, atıfta
kısalıması konulmuşnu.
Büti'l!:l
bulunulan
kaynağın adının
•
Kul1aıncmııı
siteyi ilk ziyaret
değiştirilmemeli
araçlarlInn
işlevleri
dolaşım
yönergesi gibi maddelerin
araçlan,
kullanıcı girdileri,
geribildirim ya da
puntosu gibi) ve
Web
tutarlılık sağlanmalıdır (Usask,
sayfası tasarımında, "grafık
yerleştirilme
biçimi, görsel
görünüm,
yardım
bulunduğu
kenarına, altına
yerleri bilmesi,
tutarlılığı
yerleştirilmiş
özel etki olarak gölge düşünne kullanılıyorsa, bütün madde imlerinde
düşürme
tutarlı tasanının
olan dolaşım seçeneklerinin
olumlu etkilemektedir (Usask, 200Sb).
yazı
Ayrıca
biçim,
renk, tarz benzerliği tutarlılığı arttlffi (Görüntü: 5-6).
etkisi kullanılmalıdır" (Grantasticdesigns, 200Sd). Metin içinde
renkleri, web
sayfasının
sayfalarında mtadılığı sağlamak
Web
aynı tutarhlıkta olması
her yerinde
gerekir.
ailesi ve arka plan renklerinin tııt<.U"lılığı web sitesinin etkisini güçlendirir.
için renk kodları kullanılır. Renk
kodları
sayesinde
ve arka pLan renklerinde t.utarlıhk sağlanmakladır. Tutarlılık, ayrıca ana metindeki
hizalaına, y;:ı.zı
etkileşimi sağlayan düğme gruplanması,
bilgilerinin uyumu, sayfa duzeni,
/ üstüne
Aynca
yazı
lOOSb).
önemli unsurlarıdır" (Özcan, 2003, s59). örneğin sitede, her bir sayfa içinde aym yerlere,
sayfanm sağ i sol
imleıinde
aym gölge
kullanılan bağlantı
yerleşiminde,
• Renkleıin kullanımında,
• İşaretlerin ve yazınm kullanımında (y<'!zını rengi, kalınlığı inceliği, eğikIiği,
• Grafiklerin biçiminde
r-Aetin ve simgelerde dil bjrlikte1iğini sağlamak, tutadığı güçlendirmektedir. "Örneğin,
madde
ve tutarlılıkları sağlanmalıdır.
• Yönlendirme bilgileri,
işletim
ettiğinde öğrendiği etkileşim
ailesi, başlıklar, arka plan etkileri ve
aynı kalmasıyla sağlanır.
diğer
sayfalarda
içeriğe
En iyi web araylizleri,
grafık
ögeleri
Tasanmda genel tasanm iskeleti /
çatısı
üzeıindeki
özel etkilerin
bozulmamak
koşuluyla
uygun renkler kullanılabilir (Ggrantast.icdesigns', 200Sd).
rotarlılığın!
koruyan ve genel. görünümünü
diğer sayfalara
da
yansıtan araYÜZlerdir. Özellikle, dolaşım için kullanılan simgeler, kı.ıllal1Jcılan
şaşırtmakt.an kaçmacak
bir durumu sÜfdünnek
gibi "yeni bir ünite, konu. bölüm için
sonuna kadar aym font
olacakıır"
;::ıilesini
zorundadır. Aşağıdaki
işaretlerne değiştirilmedikçe
örnekte
arayüzün
görüldüğü
başından
benzer renk düzenini (annanisini) kullamnak akJllıca
(Edtech.vt, (Iy» (Görüntü 7-8).
-Q.."..
"=,~~"",,,:,
,~"','''''',''''.1 "~'';''
-,",,,_,.c·
....,
~
&oiı<"u.,.-ıt"~~'·';;';""d
"',.....',..,"''''".c.,.__.•..
>ill~.;
..
':#~;'" "'.'~~"'.""'""
i:;;4'1'l,......".'.,;"""'..,.. :>,,~.
:1Çjy'
t~t:C
ı,
.._... i'''''
"-"" ,...."'...."',
="..
""V"4'" _~, . .
i
i
i,i
-.-
..". _ ......
:;:;:;;;.'~:;.:;.~;:h
., o·.··"
( )'
_ _ ..'"'" ....
.....
:;':.:-:;~.:"::::':;' }''';'S::..~_
....."".. _-, ~ .. '~ '"-,'......
.
""'~~.,
~.<.
:'~~~;~!:~;:r:~~.
..'
;.~~.-:;:.
...... ..,",.,
~
j . .,
-':r?t'.::;t__
...
,~
~.",...,..
....
?'=~~~~'!E.~:~·;~:;?iS~~!q&
,_ _it'O......_
..."""',.,..~"'.....
I""'_
·"'"'.""~'''•• _''''''~'''o
.....""'~__
.....-JoIi~
.........."',....<j
ESaS:~~1S:=~S~f:'
\''''''''-''''~---
i
(Görüntü: 5-6) w·~.,ıw.cabedge.com sitesinde tutarlıılı\.; biçim, tarz ve renk benzerliği ile sağlanmıştu'
(Cabcdge (Iy)).
(Görüntü 7-8) Fault Line (http://www.exploratorium.cdU/faultline/index.html) sitesinde tutarlılık
aynı yazı çeşidi ve geri plan dokusu kullanılarak sağlamlmışbr (Edtech.vt, (ty)).
31
i
Gazete, dergi, bülten, web
sayfası
vb. bütün tasanın ürünlerinde
kolayalgııama ve öğrenme sağlayacağı
tutarlılık, kullanıcıya,
• Alıcmın sosyokültürel düzeyi ile uyumlu metin ve görsel dil kullanılmalıdır.
gibi insanlara okuduğu metni ya da "sörf' yaptığı
• Bozuk şive ve aşırı bilimsel dilden kaçınılmalıdır (İzleyiciniz aksini
belirtmedikçe).
sayfada hızlı bir şekilde gezinmesini ve zaman kazanmasını da sağlar. Tutarsızlık ise,
• Özlü fikirler sunulmalıdır.
kullanıcıya aradığını nasıl bıılabileceğini, görebileceğini, öğreneblleceğini,
dolaşabileceğini göstereınez
ve zaman kaybına neden olur. Bununla birlikte
tasarıma profesyoneljik
yerine
çıktıklarını sanmalarına
da neden olabilir.
belirli bir görsel ve yazım dili
gelişi
güzellik getirdiği gibi kullanıcılann site
Tutarlılık, ardıllık
birlikteliğinin
• Kısa, anlaşılır ve devrik olmayan cümleler kullanılmalıdır.
tutarsızlık,
• Mümkün olduğu kadar işaret biçimi (listelerin başına konulan noktalar gibi)
dışına
kullanılmalıdır.
gerektiren tasanmlar için
• Mürnkün olduğu kadar negatif değerlerden kaçınılmalıdır.
ya da sü;tematiğinin sağlanması ile
• Resmi olmayan dil kullanılmalıdır.*
ohışruaktadır.
• İşaret zamirlen kullanılmalıdır.
• Gerektiği kadar bol örnek kullanılmalıdır.
2.1.3
Açıklık
Açıklık,
tasanmda kullandan metin ve görsellerin okunabilir,
otma'iıdır. Açıklık
ilkesi, içerikte kullanılan dil ile
okunurluğu için kullanılan yazı
rahatlıkla algılanabilecek ve
i1işkilendirilebileceği gibi,
karakteri ve puntosu ile de
• Toplumun hcr kesimini kapsayan bir dil kullanılmalıdır (Usask, 2005b).
anlaşılabilir ve algılanabilir
ilişkilidir.
metnin
Bu yüzden mctinde,
okunabilecek ideal bir ölçü ve yazı karakteri kullanılması
Sonuç olarak "Açıklık" ilkesi, metnin ve görselin anlaşılır bir şekilde izleyiciye
aktanlmaya çalışılmasıdır. Açıklık, içerik için görsel dilin doğru kul1anımtyla, metinsel
dilin de yazı karakteri ve puntosunun okunabilir olmasıyla sağlanmaktadır.
gerekir. Örneğin kitapta yazının okunabilmesi için 9-12 punto etkili iken, ekran için biraz
dah~
büyük
olması gerekir
(B Im. 48-51).
Ayrıca bilbTilendirme açısından
öğelerinin de okunurluğa gereksinimi vardır
"YVilemanla göre görüntü ögelerinin
yanıtlarla
görüntü
2.1.4
(Pettersson, 2002, s. 48).
algılanırlık sorunu aşağıdaki
Denge
Denge, götüntü öğelerinin sayfa içindeki fiziksel yapısıyla ortaya çıkan bir değerlendirme
sorularla vcrileeek
ve sonuçtur. Denge, kompozisyon içindeki nesnelerin bL""aktığı görsel ağırlıkla da ilişkili
olarak, verilen tasarım içindeki nesnelerin düzenlenmesidir (McClurg, 200Sb). Diğer bir
giderilebilir;
deyişle denge, görüntünün (resim, yazı ve şekil) sayfanın içindeki ağıdığı, kütlesi ve
etkidiL
.. Görüntü ögeleri ve sözcükler gönnek için yeteri kadar geniş mi?
bulundUğu yerin bıraktığı
• Görüntü ögeleri ve sözcükler görmek için yeteri kadar çarpıcı mı?
•
Şckil
Tasanıncı, layout üzerinde herhangi bir yere bir görsel öğeyi yerleştirdiğinde, merkeze
ile zemin arasında yeteri kadar kontrasthk var mı?
• GÖrf:.el, hedefkitlenin
eğilimi
yakın ya da uzak olan bir önceki öğenin durumuna göre (büyük ya da küçük) diğer görsel
için uygun mu?
• İzleyicinin dikkatini çekmek için görsel araç olarak ne kullanıyorsun?
ögerrin konumuyla dengeyi sağlar. Denge, sadece nesnelerin ölçi'ısüyle değil, aynı
• Görsel içerik. bilgi için önemli midir'!
zamanda onların değerleriyle de ilgilidir (görsel ağırlıklan, açıklık - koyuluklar gibi)
(Usask, 2005b),
• Kannaşık fikirlerin sunumu için uygun ardışık görseller kullanılabilir mi?
(Penersson. 2002, s. 49)
Bilgi tasanml ve
diğer tasanın alanlarında yukandaki
sorular sorularak
"açıklık"
ilkesiyle
görsel tasannılar güçlendirilebilir.
İçerik açısından "açıklık" ilkesini geliştirmek için aşağıdaki ilkelerin dikkate alınması
gerekir.
Tasanmm etkili olmasını sağlayan denge, genellikle bakışımh ve bakışıffisız olmak üzere
iki biçimde oluşur.
Bakışımlı denge; ;'kompozisyonun ağırlıgı yatay ya da dikeyeksen etrafında tarafsızca
dağıtıldığı zaman oluşur. Bakışımlı dengede nonnal durum, eksenin her iki yanındaki
.. Schwier ve Misancltuk, "Etkileşimli Çoklu Ortam Yanergesi" makalesinde genel anlamda
web sayfalannda kullanılan dil ile ilgili açıklık ilkesini belirtmişlerdir. Akademik dergiler için
resmi olmayan dil kullanımı düşünülemez. Ancak ticari web siteleri için böyle bir dil kullanımı
söz konusu olabilir
331
özdeş
formlar
olduğu
zaman
sağlanır"
(McClurg, 2005b).
"(ieçmişte
Yunan ve Roma
mimarisinde bakışıınlı denge belirleyici bir unsur olarak kullanmıştır" (Haşimata, 2003,
~.47). Günümüzde "Resmi denge"
olarak da adlandınlanbakışımlı denge, tasanında kolay
bir çözüm olması açısmdan sıklıkla kullanılır (Görüntü: 9). çoğu zaman görsel ögeler,
baskın
biçime göre küçLU..:: biçimlerin yakınlaştınlıp uzaklaştırılması ile
sağlanır
(Görüntü: i i ). Genelolarak. bakışımsız kompozisyonlar izleyicide büyük bir görsel
gerilim uyandırır. Bakışımsız denge "G::ıyıi. Resmi" denge olarak da hilinir (Mcelurg,
2005b).
yatay, yaklaşık yatay. ışınsal bakışım kullanılarak düzenlenmektedir (Görüntü: 1O).
(Görüntü: 11) B*-ışımsız denge (McClurg, 200Sb) .
..•~
"Bakışıınh
dengede
olduğu
gibi bakJşnnsız dengede de bir optik
ağırlık
merkezi vardır. Ama bu merkez geometrik merkezden farklı bir
koııumdadır. Bakışımsız düzenIemenin ha~ansı, cesur ve sorgulayıcı
olmasına bağlıdır. Başka bir deyişle; bakışımsız
dışavurumcudur"
denge duygu yüklü ve
(Becer. 2005, s.66).
Tasarlanan yüzey üzerinde görsel öğeler, kompozisyanun optik
ağırlığına-uzaklıkları
görsel açıdan dik..ımt edilerek- yerleştLrilir. Tasarıma hareket verme duygusu için yapılan
bu eylemde görsel
f'7,:::C::~;:Z::::"Eii:;:~:~:"~;T<B~~~~;;~:;;~.,",i];
-. [filizret"?
5"TYıf;ı:.~'l~~~-:-~3
(Görüntü: 9) Bakışıınh (jenegeye örnek birtasanm; www.eye4u.comwebsitesi(Eye4u,(1)')).
öğelerin yerleşirninden oluşacak
somnlar, yine ögelerin konumlanyla
oynanarak bakışunsız denge arayışlanna gidilir (Görüntü: ı 2). Tasarlanan yüzeydeki
görüntülerin dengesi duyguları olumlu ya da olumsuz yönde etkileyebilir. Dengelenmemiş
bir
tasarımda görsel öğeler,
dı:nge, uuyguhıll.
devingen
sanki
devrilecekmiş
gibi gerilim hissi yaratabilir.
tuıarken yapıı/H.! tasarımı da
lekdü-zdikkn
Bakışımsız
kurtarır.
(Görüntü: 10) Yatay bakışımlı denge (Horizontal symmctry) (soldaki), 2) Yaklaşık. yatay bakışımh denge
(Approximate horizonta! syınmetry) (ortadaki), 3) Işınsal bakışınılı denge CRadial symınetry) (sağdaki),
(McClurg, 2005b).
Bakışımsız denge; merkezi ekseııin etrafında kompozisyonun ağırlığı tarafsızca
dağıtılmadığı zaman oluşur. Kompozisyon içinde farklı ölçüdeki objelerin
düzenlenmesini içerir. Görsel ağırlıklan farklı olan nesnelerin düzenlemesindeki denge;
(Görüntü: 12) Bakışınısız dengeye örnek bir site; WW'1N.hobartdesign.com (Hobartdesign, (ty»
35)
çoğu
20 yy. modern tasanrncı ve sanatçıları, görsel ilginin içselliğine bakışımsız dengenin
(bakışımsız düzen) verdiği etkinlik ve büyük canlıl\ğ\ keşfetmişlerdir (Usask, 1005b).
Tasanmcılar baloşıffisız düzenle,
ana tasanm ögelerinin değer, konum, ölçü
dengeleycrek izleyicinin dikkatini iletilerine çekmeyi
lıiyerarşi,
hazırlar.
öncelikler dizgesidir.
istediği
büyüklük,
Aynı
zamanda görsel
Tasanmcı, yapmış olduğu
hiyerarşi. dünyayı
görsel
iletiye göre öncelikleri belirler ve tasarımını ona göre
Tasanm süreci içerisinde görsel
Vurgu
Her türIn görsel tasarım, etkin bir vurgu öğesine gereksinim duyar. Vurgu etkisi boyut,
ölçülendinne anlamına gelir" (Becer, 2005, s.69).
tasanmIarda vennek
rahat bir şekilde aktarabilir ve görsel algısm1 tasarım üzerine yönlendirebilme olanağı
bulabilir.
2.1.6
"tasanm içindeki. görsel unsurlan, vurgulamak istenen mesaja göre
algılama biçiminıizdeki
etkili bir şekilde kullanabilirse, iletisini izleyicisine daha
başannışlardır.
Görsel Hiyerarşi
2.1.5
Görsel
farklı1ık~arım
Tasarımcı, görseı hiyemrşiyi
hiyerarşiyi
etkileyen özellikler vardır; renk.,
açıkhk-koyuluk, uzaklık-yakınlık ve konıım
titreşim, renk,
doku ile sağlanabileceği gibi beyaz alan kullanılarak da sağlanabilir (Uçar,
2004, s.155). Vurgu,
tasarım
içindeki görsel ağırlığı belirıer, görüş açısını ve
baskı ortamı tasanmlarındahem
de dijitalortam tasarımlarındavurguya ihtiyaç
duyulmaktadır.
gibi (Uçar, 2004, s.154) (Görüntü
13). Görsel ögeler bu saymış olduğumuz'özellikler sayesinde tasanm
aşamasında sayısız
Bir tasanmda
vurgulayıcı unsurun
ne olacağını saptamak başlı başına bir sanındur.
seçenek sunnıamıza olanak sağlar. Örneğin; "bazı tasarımlarda fotoğraf ya da illüstrasyon
VurgulayıcıılııSunl, iletilmek istenen
büyük boyutlarda kullanılarak vurgulayıcı unsur haline dönüştürülür, kimi tasarımlarda ise
vurgunun tasarımın neresinde
tİpografi, hatta
alması yetinde
bazen beyaz boşluk ön plana çıkarılabilir" (Becer, 2005, s.(9). Boyut
dışında renk kontrastlıldan ile tasanma hem o:.::anlılık getirilebilir hem de a\gılamada
seçiciiik
boşluğu
kurar, ve bir tasanma bakıldığı zaman ilk göz hareketlerinin oldnğu yeri netleştirir. Hem
iletinin önemi belirler. Diğer önemli bir nokta da
kullamlacağıdıL
Vurgunun
tasanmın
optik merkezinde yer
bir karardır (Becer, 1005, s.74) (Görüntü 14). iletinin daha çabuk ve etkili
iletilınesini kolaylaştırır.
arttınlabi.Er.
., ,...2
.ja.__ .. "1.J'
)--
:-.
,'
.
..
w:;';;wi;:W77fp~;~%ifflii'
'WWW,';:;
(Görüntü: 13) Görsel hiyer.:ırşi ilc algılatmak istenilen ön plana çıkanlabilir
Hakim biçim ve renk; hiyerarşinin sağlaıunasına etki eder (Microsoft, (ty)).
(Görüntü: 14) Tasanında algılatılmak istenilen görsel eleman; renk, büyüklük, kontrastlık ve konumla
ön plana çıkanlabilir (Lexus, (ty)).
Tasarımda
vurgularna
yüzeyde her
yapılırken bazı
noktalara dikkat edilmesi gerekir. Tasarlanan
şeyaynı anda vurgulanmamalıdır.Genelde yapılan en
büyük. hClta budur.
Tasanm bilgisinden yoksun olan kişilerin yapmış olduğu web sayfalanna
bakıldtğında her
şeyin vurgulanmak istenip hiçhir şeyin vurgulanamadıgı görülür. Önemli olan etkili bir
iletişim aracı tasıırlamaktır. Vurgulama
kalması gereken
da çizgi
unsur
kontrastı
ile
arasında gerçekleştirilecekbir
sağlanabilir"
Vurgu, tasanm içinde derecelerin
ve üçüncü! derecede
,"ön plana çıkarılacak unsur ile arka planda
değişkeuliği ile ilişkilidir. Vurguda; baskın, altbaskın,
basknılık olarak
derecelendirme
baskınltk yakınlık, büyüklük
ve ren...tele
sağlanır.
ya da görsel
ağırlığt
veren
öğeıerdir
Alt baskınlık; kompozisyomm orta
yerindeki öğeler, ikincil vıırgu öğeıeridir. Üçüncül derecede baskıultk.; kompozisyomm
geri
planına doğnı
çekilen, üçüncü! vurgu
Aşağıdaki örnekte görüldüğü gibi;
en arkadaki
dağlarda üçüncül
öğesi,
öndeki üç
derecede
Aşamalı
rasIlanmaktadır.
ritim (Progressive): Aşamalı basamaklar boyunca biçimlerin ardıllığını
gösterir (McClurg, 2üü5b) (Görüntül7).
Önemli bir tasamu öğesi olan ritim, izleyicinin ilgisini çckmek, onu konuya yönlendirmek
için kullanılır. izleyicinin tasanm içinde rahat dolaşırnı görsel devamlılıkıa sağlanır. Emre
en az görsel
ağaç baskın,
ağırlık veren
objedir.
cv ve tepeler ikincil derecede,
baskın elemanlardır (Görüntü
aşağıdaki yöntemlerle sağlanabileceğinibelirtmektedir;
• Görsel unsurlar gözün normal hareketlerine uyacak bir yönde yerleştirilmelidir.
•
yapılabilir. Baskınlık;
öğesİ
•
Becer ritim duygusunun
(Becer, 2005, s.74).
kompozisyonun önüne doğru ilerleyen ilk vurgu
ve
yön, boyut, biçim, doku, renk, ton ya
organik olarak
Algılama
• Göz.
yönü, okuyucunun dikkatini
düzenlerune1idir.
yön izler.
Gözün yatay hareketi dikey harekete göre daha kıvnık ve hızlıdır. Ayrıca göz
büyükten
küçüğe kQYu
tondan
açık tona.
alışılmış olana doğru bir algılama izler
ii
." .:_..~.,.
renkliden renksize,
ahşı1.ı-narmş olandan
(Becer, 2005, s.70).
a
li
15) (McClurg,
200Sb).
dağıtmayacak biçimde
alışkanlık gereği soldan sağa ve yukarıdan aşağıya doğru bir
o
-
..
//
(Görür:tü:IS)Vı:rgununbasit
2.1.7
bir çizenekle
an!!!t~rm
(l'1cClurg, 2005b).
Ritim
Ritim, tekrar ya da
tasarım öğeıerinin birbirini izlemeSİ, tasarım ögeleri arasıııdaki
aralıklar ve ardındalıklar olarak
da
açıklanabilir. Ritm. ayın
zamanda gözün, tasanm
(Görüntü: 16) Ritmin uygulandığt güzel bir site örneği; Wolvesburrow. Aşağıya doğru
tasanma hareket katmıştır (Wolvesburrow, (ty)).
kalın
çizgiler
yüzeyinde bir görsel elemandan diğer görsel elemana kesintisiz geçiş yaptmlıp
devamlılığın sağlanmasıdır (Becer, 2005, s. 70). Ritim, desen ve doku oluşturmakla
birlikte tasarımda güçiü bir hareket duygusu yaratabilir (Görüntü 16). Bakıldığında farklı
duygular
uyandırııcak bir kaç
ritim
çeşidi vardır;
• Düzenli ritim (Regular): Benzer ağırlık ve şekildeki elem.anlann arasında düzenli
aralıklar varsa düzenli ritm oluşur.
• Akan ritim (Flowing): Akan ritm, hareket duygusunu verir vc sıklıkla doğada
(Görüntü: 17) Düzenli (soldaki), Akan (ortadaki) ve
•
Aşamalı (sağdaki)
(McChırg,l005b).
ritmin grafiksel anlatımı
Ritim,
ıııısılınüzikte İnsanın
tasarımda da
ruhunda hareketler olu~twup canlılık sağlayabiliyorsa, görsel
çizgi, desen, doku ile oluşturulan ritim aynı duygusal
Bütün
tasaDlncı ve sanatçılann
ilham
orantısal ilişkiler bulundurmaktadır.
çağrışımları
ağaçların gÖ'vdesi
0111ştunnak1adır.
kaynağı
olan duğa, kendi içinde daima
uyunılu
Bir salyangozun kabuğunda, kar tanesinin
ve dalları arasındaki uyumda hep
ve
yapısmda,
orantıyı görürüz. Doğadaki nesnelerin
kendi içindeki uyumundan sunatçı1ar, "Altın Oran"ı bulmuşlar ve birçok eserlerinde bu
oranı yansıtmışlardır. Rönesans
Oran i Orantı
2.1.8
Tasarımı oluşturmak
ve mimar,
için bir araya getirilen görsel ögeler
farklı
boyutlarda olduklan için
birbirlerini, etkilemektedirler. Bu etkiler tasanmeuıın karşısına orun ve
olarak çıkmaktadır. "Oran, görsel
elemanların, büyüklük,
orantı sorunları
nicelik, derece
bakımından,
parça-bütün arasındaki bağıntı, orunu ise tasarıını oluşturan parçalann kendi
bütün
arasındaki uygunluğu, karşılaştınlabilir ilişkilerdir"
görsel
formların dağılımı
ya da
yapıtlanndu "Altın
ustalan, kübist ressamlar, birçok ünlü
Oran" ilkelerinden
yararlanmış'lardır. "Bir
yerinden bölündüğünde~ küçük parçanın büyük parçaya
oranına eşittir, sözü
şehir planlamacısı
oranı,
çizgi herhangi bir
büyük parçanın bütüne
ile açıklanan "Altın Oran" sayısalolarak 3:5, 5:8, 8: 13 gibi diziler ile
gösterilebilir" (Becer. 2005, s. 68) (Göruntü:19).
arasında 'veya
tSeylan, 2005, 5,158).
boyutların kur~ılaştırılınasıdır.Kısaca, parçalar
Onınh,
ile bütünün
arasındaki ilişkidir.
"Tasarımcı açısından orantı,
boyutlar arası ilişkidir. Tasarım yüzeyinin eni
ile boyu, görsel unsurların genişlikleri ve yükseklikleri ile bir arada
oluşturdukları kitlelerin boyutları arasında daima orantıya dayalı ilişkiler
vardır.
Bir görsel unsurun tasarım içindeki diğer unsurlarla kurduğu
orantısa! ilişkiler vardır.
[Bu dumm] algı ve iletişimi doğrudan etkiler"
(Becer, ZOOS, s,68).
iletişim tasanmı ürünlerinde özellikle afişlerde algılamayı güçlendinnek bazen yazı bazen
de görseller,
abartılı
uma birbiriyle
Bir kompozisyon içindeki
orantısal bir ilişki içerisinde kullanılır.
oranların furklılığı,
dengenin
farklı çeşitleri
ile
ilişkilendirilebilir. Oranlann farklılığı görsel ağırlığın ve derinliğin kurulmasınu
yardım
edebilir.
Aşağıdaki
görüntü
itilmekte, büyük ögeler de öne
önce
algılanacağı anlanıına
öğesinde olduğu
doğru harekct
gelmez,
farklı
gibi, küçük ögeler geriye
da
doğnı
(Göruntü:19)
Tasanmında "Altın Oranı"
içindeki
kızm
uygulayan güzel bir sitc; www.nike.com. Dikdörtgen fonn
arka plana göre kapladığı alan 3:5 oranındadır (Nike, (ty)).
etmektedir. Ama her zaman büyük olanın
renk
kontrastlıkları ile algılamanın boyutu
Tasarımlardauyumu
değişebilir (Görüntü: ı 8).
yakalayabilmek için parça ile bütün
arasındaki uyuma dikkaİ
edilmelidir. Başanlı bir tasanında görsel uyumlu bir orantıya ulaşabilmek için matem;,ıti..\
verilerden ymarIanabilir. Ama bu ilk bakışta hissedilmeyecek biçimde gizlenmelidir.
birçok tasanm ve sanat eserini izlediğimizde tasarımemın bilinçli ya da bilinçsiz bir
•
biçimde
altın oranı kullandığım görüıüz.
(Görüntü: 18) Büyük öğenİn küçük öğeye oranı, büyük olan öge çoğu zaman öncelikli algılanır
resim; Saul Steinberg'in "The Fishennan" adlı çahşması The Labyrinth yayınlanmıştır.).
(Sağdaki
41
i
2.1.9
Tasamnda bütünlük oluşturmak için bazı
Uyum / Bütünlük
Grafik tas<ınm ilkelerinden olan uyum ve bütünlük, birbirini tamamhtyan ilke gibidir.
Bazen uyurnun yerine bütünlük (birlik) terimi kullanılmaktadır. Farklı kaynaklarda uyum,
birlik olarak açıklarısa da, her ikisi birbirini tamamlayan kavramlardır (Hasmınoto 2003,
~.26
göre,
Tasarım
öğelerin
görsel
yöntemlerden yararlanılabilir. Becer'e
yüzeyini çerçeveleycn bordür birlik-bütünlük
algısını rahatlatır.
Bir
tasarımın amacı
tasarım
içinde
estetik ve
farklı
işlevsel açıdan
görsel bütünlüğü ve düzeni
sağlamaktır.
görsel öğeler, bütüniıik oluşturacak şekilde bir araya
getirildiğinde, kompozİsyondaki dağınıklık ve parçalanmanın oIliine geçilmiş
Kompozisyon içinde bir araya getirilen ögeler
bir bütün
oluştumlur (Becer
gnıplandırılnıasıdır (Istek,
gnıplanarak ve
uyum
ıçinde
kompozisyon
ve ahenginin oluşmasında önemli bir roloynar ve bütünlük
oluştunııada etkili
biryöntemdir. Bu yöntem,
olur.
ve
düşey doğrulara
es<ısma dayanır
göre hizalanarak
yerleştirilmesi ve
açıklayabileceğimiz
uyum ilkesi, tasanmda en önemli etkendir.
parçaların net zıtlıklar ve çelişkiler göstennernesidir
gelişinde
geometrik benzerlikleri,
aralık
olması,
yan yana gelen
(Atalayer, 1994,s.123). Biçimlerin bir
Ölçüleri, renklerin frekans
değerlerinin
birlikte obje ve nesnelerin bir araya gelişinde de doku ve selttik
değerlerinin benzer yapılaşması, biçimlerin
tekrarlar uyum ve allellgi
yaratır
değerlerdenoluşm<ı8ı olarak
böylece
kmtam
öğelerin-yatay
bütünlüğün sağlannıssı
Tasa:danan yüzeyde birlik/bütünlük, benzer yazı tipi, renk ve konuyu tamamlayan
aralannda içsel değerleriyle etki-yapı-ilgi olarak birbirine uygun
yakınlığı, bununla
tasarımı tekdüzelikten
2005, s.72). Bütünlük, benzer yapı içindeki öğelerin
2004, s.81).
Uyum, bir bütünü oluşturan parçalar arasındski benzerlik ve ilgiliılkıir. Öğelerin kendi
araya
nokt.1 yöntemi;
(Becer 2005. s, 72-73).
görüntü ögeleri, aym tonda grafiklerle
Görsel bütünlük. şeklinde
sağlayan üç
vc dinamik bir etki kazandınr. Eksen yöntemi ise. tasanmda yer alan görsel
düzenlenerek
Görsel
ve okuyucumm
Benzer şekilde, tasarlanan yüzeyde bordür etkisi yaratan beyaz
sezgisini güçlendirir. Gözün tasarım üzerinde harekctini
Grafik
sağlamads kullanılır.
kullanıldığmda tasarımda bütünlüğü sağlar
benzerlikleri bordürle
boşluk, sayfalar arasında uyum
'l.
farklı
birbirlerine bağlanı~lannda ise dizgesel
(Atalayer, 1994, s.123). Uyum Ve aheng dizgenin yakm
sayfalarm kendi içinde uyum ve
(çizimleı-'l sağlanır.
bütünlüğü, her
Web site tasanmlannda ise
bir sayfadaki içerik ve
diğer görsel
öğelerin yerlerinin tutarlılığıyla sağlsnrr. Örneğin: Dolaşım düğmelerinin aynı ycrde
bulunması,
seçilen renk ve yazı biçimlerinin değişmemcsi sitenin
sitelerinde renk,
önemlidir.
siteyi
yazı
bütünlüğünü korur.
ve grafik tasanm biçİminin korunma.sı görsel kimlik
Oluşturulan görsel
Web
açısmdan
kimlik, benzer sayfalar arasında bütünlük hissi verir ve bir
diğerine bağlar. Ayrıca web
sitelerinde uyum Ve birlik yaratmak için ana sayfrı
belirleyicilerinin sitenin bütün sayfalarında
kullanım ve
estetik açıdan tckrar edilmesi
gerekir.
da açıklanabilir (Görüntü: 20).
2.2
WEB
SAYFALARıNDAKULLANlURLIK
Günlük ya~amda, araç ve gereçler kullanılırken bazen
VISUAL DeSIGN
FUNDAMENTALS:
A Oi9i1c:1I Ap:ıroCJch
VISUAL DESIGN
FUNDAMENTALS:
A ~giktı Ap':lfOııch
onların kullanışlı olmadığından
şikayet edilir. Örneğin: Otomobil panelinde göstergelerin okunarnaması ya da asansörde
bir
işlevi
yerine getirecek düğmeye dobınıılarnamas] gibi birçok neden olabilir. Teknik ya
da teknolojik ürünlerin kolay kullanilabilmesi için birçok deneme ve
(GÖTÜntü:20) Bütünlüğün uasll sağlandığını gösteren basit geometrik biçiml~r (Hashimoto, 2003, s.27-3 I).
araştırnıadan
geçmesi gerekmektedir. Bir ürün tasarlanırken kullanıcısmın onu rahat, kolay ve verimli
kullanması düşünülmelidir.
Bütün bunlar kullanılırııkla ilişkilidir.
Bütünlük, görsel benzerliği olan öğelerdc vardır. Aynı temel boyuta, dokuya, biçime,
renge ve duyguya sahip unsurlar; bir tasarımda ideal bütünlüğü
oluştururlar
ı 994,s.123).
düzelik
Fakat uyum ve bütünlük
sağlanırken tasarımda tek
düşülmemelidiL Uyum oluştunnak içİn
karakterde, tüm bÇy<JL alanlar aynı
olacaktır.
duyarlı
(Atalayer,
tüm ögeler aynı boyda, tüm yazılar
ve
sırutlan
Yerinde ve uygun miktarda kuHamlan renk zıtlıklan, farklı yazı karakterinin
bir şekilde kullanımı uyumlu bir tasanm ohL.5tıınılabilir.
gelişim
süreci boyunca
araç ve ürünler oluşturmak.
doğrudan kullamcınm geribildiriminc
dayanan bir ürün geliştimıe yaklaşımıdır" (Upassoc, 200Sb). Diğer bir deyişle,
aynı
hadınde yapıiandlı'lldığmuJ tasarıOl sıracı
Kullanılırlık, "kullanıcı gereksinimlerini karşılamak için
giderleri azaltmak için
l:uzağına
kullanılırlIk., yatıınn, doııarum
ve bunun gibi
şeylerin
kolay kullanımını ve kullananlara
yararlı olmasını sağlayan ölçümdÜL Kullamlırlık, ıirünün niteliği
kullanıcı
için verimli ve memnun edici olup
olmaması
ve özellikleri yanı
ile ilgilidir.
"KUllanılırlık,
sıra
daha
.kunanı~1ı iliiiıılet;n yaratılmasımı yardımcı
olmak
içİn geliştirilen
özelliği.dir (Nilsen,
bir tçknikler grubu
olarak adlandırılmaktadır" (Upassoc, 2005h).
Kullanılabilirlik
ve kullamcı-merkezli
2004). Bu kullanılırlık kalitc
öğrenim
• Çabuk ve kolay
tasarımın
iki
uluslararası
• Etkili
belirlenmiş.
kullanım
9~41-11" Kullanııırlık,
özel amaçlan başarmak için, etkili, yeterli
bu tasanm
başaracaklar'?
işlerini yapabilme hızını
• Kolay hatırlama (Memorability):
Tasarımı
ve memnun edici bir şekilde uzman kullanıcılar tarafından bir ürünün
tekrar ayın tasanma döndüklerinde kolay
kullanılmasıdrr.
• Hatalann düzeltimi (Errors):
ağırlığı nedir?
2- "ISO 13407" İnsan-kullanıcı merkezli tasanm; çok disiplinli tasarım,
tasarım
çözümlerinin yenilenmesi,
kullanıcı
çözüm,
kullameınm anlaşılması
işinin
kullanıcı etkenliği
ile
ve
ve teknoloji
1S09241-l1 ölçütlerinde belirtilen kullanılırlık tanımının yanı
tanımlayan
Kullanılırllk: üzerİne araştımıahır yapan
•
sıra
web sitelerinde,
etkili deyişler kullanılmıştır.
Redish ve Dumas (Redish ve Dumas, 20(5),
kul1aıulır1ığı, imanlann işlerinin üstesinden
şekilde kullanabilmeleri
Yukarıda
(Upassoc, 2005a).
gelebilmek için ürünü kolay ve
hızlı
bir
Kullanıcılar, planlarını
•
Kullanıcılar eğer
felsefe ile
•
önemli
çalışırken meşguldürler/ kullammdadırlar.
başlar. Tasanmın kullanınnın ihtiyaçlarını karşılaması
•
kullanıiırl~k
belirtilmesi ile
siircci, kullanıcı onlann
başlar (Quesenbeıy,
2005).
Bu yüzden ürünün nasıl kullanıldığı ve öğrenildiği
2005). Her şeyden öte,
kuııanılabilirliğin anlamı
her şeyin
yolunda olmasıdır. İster web site~i ister araba olsUlı önemli olan kulıanılabilirliğin amaca
uygun olmasıdır.
Kullanılırlık, arayüz kullanıcılarının nasıl
diğer bir özellik
ya da
içeriği
ise
tasanmın
çeşitli
kullanacak kişileri
taslak ve gelişme sürecinin öncesi ve somasmtla üTÜn ile
gözlemlenmesini kapsar.
Tasarım; etkileşim, iletişim
ve bilgiyi içerir. Birçok uzman grup
çözüm1emecisi, bilgi mimari arabirim
wsanmcısı,
(kullanılabilirlik:
web tasanmcısı,
teknik yazılımcısı vb.) kullanılırlık çalışma.<;mı yukanda sayılan farklı çalışma
etkinliklerine bölmüştür (Upassoc, 2005e).
ve
ölçülebilir bir özelliktir. Bununla birlikte bir kııllanıcının ürünü ile nasıl
olmaktadır (Axup,
ilgili
Kullanılırlık :'>mall1ası;
çalışacak kullanıctlann
uygulayıcısı,
bağlıdır.
cevap almabiliyorsa ürüuün k1.!llanılırlığıyla
~ Kullanıcı anıştırmatan; kullanılacak ürünü
ürünün kullammı kolay ise kunanmaya karar verirler (Redish
amaçları, ihtiyaçları ve kullanılacak tekniklerin
da
eğer
araştırır.
için özel bir süreç ve yöntem gerekmektedir. Y ı;:nİ
etkileşim kurduğuna
sRyrlan bileşenler ve soruhmna
memnun edid olur? (Nilsen, 2004).
araştırmalarından elde edilen ürünü kullanmaktadır. Kullaıulırlık etkinlikleri
gruplara aynImıştır.
deneyim yaratması gibi bir inanç vDrdl!. Ama kullanılabilirliğinamacını gerçekleştirmek
Kuııanılırlık,
Tasarım, nasıl
gözlem ya da planlama sırasında kullanıcı
ve DUffias, 2005).
Kullanılırlık,
ne kadar hata yapabilir? Bu hatalann
Kulhınabilirlik uzmanlan, üıiin tasarımı,
merkezlidir.
tamamlamaya
hatırlayabilecekler mi?
Kullanıcılar
Kullanılırlıkıa
• İnsanlar üıilnleri üretici olabilmek için kullanırlar.
•
ne kadar etkileyecek?
kullanmaya belli bir sL'lrc ara verip
ilgili sorunlar en aza -indirgenmiş sayılır.
ü;,levselliğini kapsayan faydalılıktır.
olarak tanımlamışlar ve 4 önemli noktaya dayandırmışlardır:
Kullanıhrlık, kullanıcı
kullanacaklanm
Bu hatalan nasıl kolay telafi edebilirler?
• Memnuniyet (Satisfaction):
uygun
gereksinimlerinin gideri~esi,
şekillendirilmesidir"
makale ve kitaplarda kulhım~abi1irliği
arasındaki
Kullanıcılar, tasarımla karşılaştıkları
Kullanıcılar tasarımı na~ıl
(Efficiency):
öğrendikten sonra,
"1 ~ "ISO
(Leamability):
zaman temel görevlerini ne katlar kolay
ölçüt ile çerçevesi
özel!iğinin bcş bileşenleri vardır:
Shahizan Hassan ve Feng Li tarafından, web sitc1erinin içerik ve kullanılıdığı üzerine bir
araştırma yapılmıştır.
ve
Malezya'dan seçilen siteler üzerinde uzman katılımcılara site
kullanışlılığına ilişkin
7 ana grupta (ekran göriinümii,
kullanırm, etkileşim, tutarlılık,
getirilmiştir.
Bu
araştırma
hazırlarken, içeriği
erişim, dolaşım,
içeriği
med.va
içerik) sorular somlmuş ve 57 ölçüt mmmlaması
sonuçlanna gôre;
Kullanılırlık
için etkili bir ekran görönümü
çevreleyen beyaz boşluğun kullanımına, farklı ekran tipleri ve ekran
ayarları 2.çısır.d3!l dik..\:.at edilrr.~1i:li.r.
Web
sıtesinin hazırlamş amacı,
müddin olduğu
kadar çok ziyaretçinin o siteye erişebilınesidir. Kullanılırlık ilke~ine göre en etkili erişim,
kolay kullanacağı değerini gösteren kalitcnin
yükleme süresinin
azaltılması, tarama yeterliliği
ve arama kolaylığı ile
sağlanır.
Sitenin
görsel göriinümünden daha önemli olan şey sitenin
dolaşımıdır.
çalışmasını içerir.
dolaşım
Web sitesinde
Nielse!1, bilgisayar ::rrayüzle~nin gelişL.'1lL."lin k8rş:laşt:ğı
yapan kişi bilgiye en kısa zamanda ulaşmak ister. iyi bir dola~ım sistemi, kullal1lcımn
sorunları
nerede olduğunu ve nereye
denetleme listesi, tasarım yaparken
gidebileceğini
görüntü, video ve ses gibi çoklu ortam
daha etkili
olmaktadır. Kullanıcının
eklenilen görsel,
amacı,
işitsel
etkili bir şekilde yönlendirmelidir. Hareketli
araçları,
sözcüklerin yeterli
olmadığı
durumlarda
yardımcı
hoparlör gibi araçlara sahip olmanıası durumunda
(aUdiovisual) sunular
işe yaramayacaktıf. Web
gereksinim duydukları içeriğe eıişmek ve diğer kullanıcılarla
sitesi
tasarlanuştır.
"Sezgisel"
adı
verilen bu
düşünmeyeceğiniz şeyleri hatıdamamza
olur. Nielsen'in Heuristic'i web için oldukça
uygundtır*.
3. Hızlı ön ürün (prototip): Üçüncü metot ise; kullanıcıların ön ürün dizgelerinın
kullanıcıların
etkileşime
inceleyen bir denetleme listesi
hazırlanışı
ve onlann tasarımdili işlevlerinin incelenmesi ilc
oluşmaktadır.
geçmektir.
Bu yüzden içerik hazırlanJTken, iletişimsel bir görsel dil kuHanunma. dil bilgisine ve
okunurluga önem verilmelidir. Sitenin canlı ve
ziyaretçi defteri ve net forum gibi
kullanılırlığı
ile ilgili
etkileşim özellileri
öğrenmelerini hızlandırdıgı
boşluk
bir site olabilmesi için de. e-posta,
siteye eklenebilir. Web sitelerinin
yapılan araştırmalarda tasarımdaki tutarhltğının, kullanıcıların
konusunda etkili
olduğu kanıtlanmıştır.
tasarımcılanntutarlıllğı sağlamak için başlık,
renk, ölçü,
yaşayan
kuııanımıyla
ve fontlanIl
\Urgulamaktadır\ar. Shalıizan Hassan
alt başlık, arka plan,
Tüm uzmanlar,
dolaşım ağları,
ilgili görsel düzenlerin önemli
ve Fcng Li
tarafından
Kullanılırlık
çıkmıştır
web için çok gereklidir.
siteyi kullanmak istemezler.
kuııanıcılar siteyi
Eğer web
yaptıklan
içeriğini açıkça belirtmiyorsa,
yine
web sitesi oldukça fazladır. Ama kullanıcılar zorluklarla karşılaştıklarında
(Britsİos,
Kullanıcılar
• Site ile
ilgi
terk ederler. Bununla birlikte, sitedeki bilgiler ok'Unamayaeak kadar
tek şey, siteyi terk etmektir
•
ve
sağlamaktadır.
site ya da üründen memnun olurlar.
etkileşirnde
•
Amaçlarını
•
Kullanıcılar
olmaktan
hoşnut olurlar.
etkili vc verimli bir
şekilde gerçeldeştirirler.
web sitelerine ve üretime
karşı rahatlık
ve güven duygusu
hissederler (Britsios, 2005).
sitesinin knllanınu zor ise insanlar bu
ana sayfa,
taydalar da
Kullanıcılar açısından kullanırlığın yararlan:
web siteleri ile ilgili yapılan
koHanışsız ya da kullanıcılann llgisini çekmiyorsa okuyucular siteden aynlırlar. iyi
tasarlanmış
kumluşlar açısından birçok
(Sbabizan & Li., 2005).
Aynı şekilde
Yararlar
Kullanılırlık araştırmalan ve (asarımların kullanırlığı, kullanıcılar. üretici kurunı
olduğunu
araştumada, kullanılırlığı etkileyen öğelerin en önemlileıinin başında tasanınla
sorunlar olduğu sonucu ortaya
ikonlar,
Kullamrlığm Sağladığı
2.2.2
Eğer kullamcınız sitenizden memnun olursa, kullanıcılannız size sadık kalacak ve sizi
diğer
servislere ve kişilere tavsiye edecektir.
Üretici ve servis sağlayıcı olarak kullanırlılığın sağladığı yararlar ise şunlardır:
2005).
• Zaman ve ücret giderlerinin azalması,
• Sponsor masrafların kısıtlanması,
2.2.1
Kullanılırllk Araştırma
Nielsen,
Kuııanılırlık
Web sitesindeki
üzerine
sayfaların
Yöntemleri
araştırma metotlan geliştirIııiştir. Bu
metotlar sayesinde
eskizine başlamadan önce, ilk oluşum evrelerinde,
kolaylıkla açıklanabileceğini söylemektedir
metotları aşağıdaki
• Kullanıcı hatalannm azaltılması,
(Usask, 200Sc). Nilsen'in
•
hataların
Kullanım zamanının
ve ücretln kısıtlanması ve
" Kazanç elde ebne gibi yararlan vardır (Britsios, 2005).
Kullanılırlık
Kullanıcı yararına yapılan bütün uğraşlar kullamrlığı kapsamaktadır. Bir web sitesi
gibidir;
tasarlanırken estetik değerlerin yanı sıra
1. Sayfa maketi (Paper lV.lockups): Tipik. kullanıcılann ekranlarda sayfa
layoutunun nasıl
göstenne~c için.
çalıştığı
ile ilgili sorular sorrnasını ya da neler
yüksek sesle dile
ge~jrmeyi
yöntemle, belirsiz dolaşım seçenekleri ve
içeren bi! ~mam::ı.
sınınandınna
diişündük.1crini
6meğid.!!'.
göz
ardı
içerik, kolay
dolaşım gibi işlevsel
özelliklerin de
edilmemesi gerekir. Bilgi aramak için belli bir zaman ayıran kııllanıcılann bu
ortamda rahat, etkili ve verimli
dolaşımı sağlanmalıdır.
Bu
sorunlan tannnlanabilir.
2. Sezgisel / buluşsal (Henristies): İkinci yöntem; sezgisel kullamlan tasanmın
'" Daha geniş bilgi için, Jakob Nielsen "How to Condue! a Heuristic Evaluariaıı" [Sezgisel
YönetiLir.] makaıe~>ine bakınız. bttp://www.useit.eomlpapcrs/heuristic/
DeğerlendirmeNasıl
2.3. WEB SAYFALARINDA OKUNURLUK
sonncunda en kullamşh dizilim beyaz ü7erine siyah, en kul1anışsız iki dizilİm ise yt:şil
Web siteleriQin en önemli amaçlanndan biri de bilgiyi aktarmak ve
Bu da
içeriğin etkili
iletişimi sağlamaktır.
sunumu ve verilen metnin okunmasıyla mümkün
olmaktadır.
üzerine kırrmzı ve mavi üzerine mor dizilİm olarak belirlenmiştir (Demircan, 2001, s.86).
En kötü renk uyumu ise; pembe metnin yeşil arka zemin üzerinde olmasıdır. Kırmızı-yeşil
Bilgisayar ekranının yaydığı parlak ışıktan dolayı İnternet kullanıcılarının metni
renk kullanımı renkkörü kullanıcılar içİn okumayı imkansız hale getirmektedir (Nıelsen,
ob..-umaları güçleşmekredir.Teknik açıdan bakıldığında, "bilgisayar ekranından metni
2000, s.125-126). Mavi üzerine beyaz ve san üzerine kırmızı gayet yüksek değerler
okuma.
kağıt üzerindeki
metni okumaktan %25 daha
yavaştır ve
gözler için daha
içerirken san üzerine yeşil ve mor üzerine beyaz gayet düşük değerler içt=rnıektedir.
yorucudur" (Nidsen, 2005).
Deneylerden elde edilen diğer bir sonuçta, yazımn açık renk alan üzerinde koyu
Web sitelerinde oku~abilirlik sonmhın; rengin,
yazının,
kenar
boşluklanllInknllarumıyla
kuııanılması, koyu arka plan üzerinde açık kullanılmasından daha okunur olduğunu
göstermektedir ( beyaz üzerine mavi, mavi üzerine beyazdan daha okunurdur) (Demircan.
giderilebilir.
2001, s.86). Metin ve zeminlerin kontrastlıkdeğerlerindeki küçük değişikliklerle
Web sitesi tasarımında akunuduk, arka plan ve metin arasında uyumlu renklerin ve
okunurluk artmlabilir, örneğin metnin koyuluk değeri. tam koyudar. %10 daha. düşük
koutrastlıklaruı oluşrurulmasıyla sağlanmaktadır.
olduğu zaman özellikle, arka plan safbeyaz yerine %10 grileştirildiğinde,okunabilirlik
Renk kontrastlıgı ile ilgili
araştırma
denemelerinde ekranda yapılan okumalarda yüksek kontrasth negatif ve pozitif
aydınlatmalarlaoklinurluk
kontrastlı değerlerde "negatif aydmlatma"
metinlerde hem de resimlerde keskin
değerin
bu
artmaktadır tNielsen,
2000, 5.125-126)
etkisi ölçülmeye çalışılmış, deneyler sonucunda, yüksek
görüş sağlamış,
olduğu saptanmıştır. Ekranda
Genelde, ana HTML metninde en yüksek renk kontrastlığınıyakalamanın yolu, beyaz bir
( beYiız zemin üzerine siyah yazı} hem
yükst=k
bilgi alışverişi ve
değt:rli
iletişimde en
iyi
"pozitif aydınlatma" (siyah zemtn
fon üstüne siyah metin kullanmaktır.Diğer renk kanşımlan, daha çok başlıklarda.
dQğrudan başlıklarda (manşetlerde), yan
çubuklarda, yönlendirıne düğmelerinde ve
üzerine beyaz YazJ.) k'llllanıldığında okuma, anlama ve görsel iletişimde önemli düşfişler
görüntli haritalannda kullamlır. Arka planda (zeminde) grdii.k görüntüleri kuııanmak: web
olduğu gözlemlenmiş ayrıca cevap
sitesinde bazen hQş gÖıünebilir (Grantasticdesigrıs.com,20üSb). Ama kanşık doku ve
verme tepki süresinin
aşm yavaşladığı
tespit
edilmiştir
(Demircan 2001, s.86). Siyah - beyaz renk kontrastlıklmnınyam sıra diğer uygun renk
biçimlerden oluşan arka plan resimleri sitenin okunurluğunugüçleştimıektedir. "Aynı
kontrastlıklan da,
zamanda konturln, gölgeli yazı.lar da oknnurluğuazaltmaktadır" (pektaş 2003, s.146).
parlak: san ve koyu mavidir (Görüntii:2l) (Grantasticdesigns, 2005b).
Yazının büyüklüğü, karakteri, kalm-ince, eğik olması hizalanması, satır l.lZUnluğu vb.
okunurlıığu etkileyen
özelliklerdir.
Yazının büyüklüğü; Web sitesinde okunurluk yazının büyüklüğünün iyi ayarlanmasıyla
sağlanmaktadır. Jakop Nielsen bu konuda, çok mükemmel bir görünüme sahip olm::ısalar
bile yeterince büyük [ontlar kullanmasını önermektedir. Aynca küçük ölçekli [ontların ise
hemen hemen kimsenin okuma ihtimali olmayan dipnotlarda kullanılması gerektiğini
vurgulamakt.8dır (Nielsen, 2000, s.125-126). Önemli olan yazının büyüklüğünün
(GÖTÜntü:21) Okunurluk için uygun renk kontrasthklan (Graotasticdesigns, 20G5b)
Değişik arka plan ve yazı renkleri ile yapılan deneylerde İnternet kullanıcılannın tepkileri,
okuduğunu anlama zamanları ve
Kullanılan renkler
(dithering)
okuma süreleri
temel renklerden
oluşturabileceği etkinin
ölçülmüş,
sonuçlar kayda
geçirilmiştir.
okunurluğagöre ayarlanmasıdır. Küçük puntohı metnin (harf ölçü birimi) okunması güç
iken, çok büyük puntolu metnir, de ziyul'etçiniü görsel algısıOl olumsuz etkiler. Harf
ölçülerinin aşm büyüklüğü, bağıran bir görüntii sunmasıyla ziyaretçiyi rahatsız eder
(Grantasticdesigns,2005E).
seçilmi.ş ve noktaeık\ann i kıpırtılandırmanın
önüne geçilmeye çalışılmıştır. Bu renk: deneyinin
YazlOm boyutu ve satır aralığı ile ilgili araştırma denemelerinde; Tek, 1,5 ve çift olmak
üzere üç çeşit satır arahğı ve 10, 12, 14 olmak üzere üç farklı punto metin kullanılmıştır.
10 punto yazmm okunuduğu hayli düşük oldugu gözlemlenmiştir. Tek ve 1,5 aralıklı
(Görüntü 23) (grantasticdesigns, 2005b). 9- 10 punto
okumalarda ı4 punto. çıft aralıklı okumalarda ise 12 punto degeri ile en iyi sonuç
okunurIuğu tırnakslZ yazı
tipi ilc
saghınabilir
büyüklüğündeki metinlerin
(Nielsen, 2000, s.125-126).
alınmıştır. Tek ve ı,5 satır aralıgı ıo punto için en kötü değeri verirken aralık sayısı
eg=-
amınldığında okunabilir hale gelmektedir. Eğcr tasarım yaparken CSS (Casecade StilI
Sheets) ile satır aralığı 1,75 yapılırsa 12 ve 14 punto için uygun ayar yakalanabiliT
T,I'IHl!o Plew RilImolo",. ıı LLL
(Demircan 200\,5.86).
Yazının okı.ınurluğunu etkileyen diğer biT öge de yazının hareketli kullanımıdır. Metin
sabit kılmınahdır. Hareket eden. büyüyüp küçmen yazılar, metnin okmınıasıru
zorlaştırnıakıadır. (Nielsen,
Ari~l.
kurakterlerinin aynı büyüklükte okunuduluklarıfarklıdır. Bilgisayar
ekranında .AIieI, Timesra göre daha okunurdU! (Grantasticdcsigns, lOOSb).
2000, s.125- 126).
Yazının hizalanınası ve okunurlukj bütün metinler sol tarafa dayalı olmalıdır. Gözün
başlama noktası için sabit olan bir yerden başlamak, metnin ortada ya da sağa ctayalı
olmasından daha fazla okunabilirliğini arttımıalctadır. Metnin ortadan blok ya da sağa
dayalı blok olması, kabul edilebilir bir yapıdır ama çok fazla blok kullaııılmaması
geTekmektedir. Aynı şekilde, listeler ya da uzun metinler sola dayalı olduğu zaman
12 pL
(GÖrüntü:ı.3) F<ırk.1ı yazı
Font biçimi terimlerinde. eğikleştiriimiş ve daralhlmı~ (condensed) yazılar, ölçünlii y~zı
karakteTlerinden daha güç okunurlaT (grantas!icdesıgns, 2005b) (Görüntü 24). Ayrıca
nonnaI ve
yazllar,
eğik yazılan
metinlerin
eğik yazılan yazılardan
okunurIuğu sınama sonuçlarında da;
normal yazılan
daha okunaklıdır (Demircan, 2001, s.86).
taranabılirliğikolaylaştınnaktadır. (Nielsen, 2000, s.125-126).
Helvetica Scld, 14 pl. .ı4JÜiJ)lt'l'j-'"
Yazı kaTakterlerinin seçimi; web sayfalannda "en okunur yazı karakterleri, ölçünlü tırnaklı
He/velica. Bold. !taNe. 14 pt.
(genellikle Times) ve tırnaksız (sans-seri!) (genellikle Arial ya da Helvetika) fondan"
He(vetıca. Bold. Ob"que. 14 pt.
(Grantasticdesigrıs,2005b) olarak belirtilse de, tırnaksız yazı karakterleri daha
Heıvetıca Condense{'! Bald. 104 pt
okuneıklıdır. Dekoratif ya da ı..."1lr~iffontlar çok daha güç abırırnaktadır (Görüntü 22). Eğer
ı
web sayfa tasanmında logo ve slogan gibi metinlerde dekoratif ya da kursifbir yazı
rHelvellCa Cand,n.ed. Bold
karakteri kullanılacaksa, grafik görüntli olarak kullanmalı ya da büyük kullamlmalıdır
I. Helveli" Cand.n.ed. ~Old. 00110U6,
(GrantasticdesigHs,2005b).
(Görüntü:l4) Ay01 yazı
karakteıinin aynı
farklıdır.
This is 16 pt Arlal Black.
lhh i... L6 pl t~)ıd lim ..,s.
7u.. ~ 16 ~
~"",..S1tl-~.
(Görüntü:22) Yazı karakterinin seçimi ve büyüklüğü akıınıırluğu etkiler (Grantasticdesigns, lOOSb)
Yazı aianı genişliği
ve
sağ
sol
inç boşluklu ve 4 inç (lO cm)
JI.ılc
14 pt
i
14 pl
puntoda, kalın. eğik ve d:ıraltılıruş biçimlerinin
(Grantasticdesigns, lOOSb).
boşJuklar;
ilgili
araştırmada
en iyi sonuçlar, 0,5, i ve 1,5
genişliğinde yazılarak elde edilmiştir.
kaynaklar ise 60 harften oluşan yazılanıı daha iyi
okunurluğu
Bununla birlikte bazı
okunduğunu belirtmektedir (Demircan
.
,
2001,5.86).
çözünürlüğü düşük olan bilgisayarlar da, küçük metinler "Verdana" gibi tırnaksız (s31ıs­
serif) yazı tiplerinde daha okunabilir olmaktadır. Bazen, tırnaksız yazı karakterleri,
kaTakter bOYL.l (puı"ll:osu) k~içi'ık olCıuğ~mdü tı"iTıa!.d.ı (serifE) Y~L !c:::ı.r:l.'<.terkri-r.den daha
okunakIı olur. Aşağıdaki grafık. imge aynı puntoda iki yaygın yazı karakterini gösteriyor
ı 50
Büyük harflerin kullanlDll; "okunabilirJik rehberleri, metin için büyük harf
kullanımındansakınılması gerektiğini belirtmektedir"
Kullanıcılar,
(Nielsen, 2000. s.125-126).
büyük hartle yazılmış metinleri küçük harflcre oranla daha yavaş
okwnaktadırlar. "Yalnız
büyük harflerle yazılan y'lzıda okuyucu karakter biçimlerini bir
51
ı
Barbara Chaparro'nun anıştınnasınaparalelolarak Pektaş (Pektaş, s.147) Web sayfasmda
süre wnra tanıyamamakta(çünkü, her sözetikteki harfleri tek-tek tanımlamakzorunda
yazı
kalmakta) ve yazıyı okuınaktazorlanmaktadır" (Görüntü:25) (Demirl'an, 1001,s:86).
i.
i
YALNıZ
"Az boşluk ise karışıklık ve karmaşa yaratır, algılamayı güçleştirir. Yazı
BÜYÜK HARFLERLE YAZıLAN YAZıDA OKUYUCU KARAKTER
..
al<}.nına çok yaklaşmış görüntü ögeleri hem yazımn hem de kendinin
..
i BiçiMLERiNi BiR SÜRE SONRA TANIYAMAMAKTA (ÇUNKU, HER
;~ÖZÇÜKTEKiHARFL. ERİ TEK-TEK TANIMLAMAKZ.ORUNDA Kı'\LMAKTA)
VE YAZıYı OKUMAKTA ZORLANMAKTADıR.·
algılanmasını zorlaştınr. Okuyucunun dikkatini dağıtır. Yazı ile görüntü
i
arasında en az
~
büyük harflerle
yazııan
uzun
metınler zor
okunur.
\
anlaşıhrIığma katkısını araştınnişlardu.Yapmış oldukları ça1Lşma ile, beyaz boşluklann
'"
IL
boşluklar olarak tanımlanmıştır. Bu çalışma doğrulnısundaweb sayfasındaki melni
Çevreleyen 10 mm olan boşluklar kenarlı, metni çevreleyen 2 mm boşluklar kenarsız
Olarak tanımlanmıştır. Satır arası boşluk ıse; ana cümlenin bir önceki cümle ile ya da bir
boşluk en
.," -'v _.~" '~_F. '~o' ;;-o~~" '-ı
_.
o .....""'"
"'~ ~
.""-,, ,J--.,,, .,'
-,""__ o,'
-,<
00.'"
,~,; '-o',k'
:~~~,..~ k•••_,,~.-_.
o''''',' "
'-'-:_B
,,~.
,,->-._, .,
..•• ",,,•.,, '.' .. '.
,"" ,
.'-., .,
-'";__
·r... '.'
-"_r" .
.-•., .• "'" -_., ';_. , __ ,
,;;\::: ::C~· .....'..:::.; . .~; ~.::......_.,,_.
,"o
---
, _, _, ""__•,
,
~
.,., '_-o
j~, ,~" .. ~,' ,.-~""' ,.. ~ ,v~"'l ""~'_,.'-."
~""~"..., ~~_, ..... _-"' "'o-ec- • ,-='.-~~ ;1 ~ ••• " .,,~
·ıç·",; '"
"'1"'. ~O.,.
~.
,,".:: "'..-'" .__
~"".~ ~
;.""
~" ~ "'~",' ,~'",.., ~""",'
',,_,.~
~C,.o
~'-"~ ..,,
""." _,,-\ '""'''''
~,W'.
_~ i i.-ı
'.-.... -.
Iaırşılaştırılmıştır. Kenar; metin sayfasının sol, sağ ve üst kısırum çevreleyen beyaz
uzunluk olarak belirlenmiştir. Bu
Open Or Wrapped
iı
okuma başansı üzerindcki etkisini incelemek için kenar boşlukları ve satır arası boşluklan
arasındaki dikey
~----
!i
Barbara Chaparro ve arkadaşhm bcyaz boşluğun (white space) metnin okunurluğunave
Sonraki cümle ile
4 mm. boşluk olması gerekir. Yazı ve resim alanlan ile kenar
buşlukları önceden saptanınalıdır."(Pektaş. 2003, s.147)
-----(Göıiintü:25)YalnlZ
ve görüntüyü gösterenin "beyaz boşlukıt olduğunu vurgulama.lctadır.Ona göre, fazla
boşluğun dinlendirici ve rahat algılatma özelliği bulunmaktadır(Görüntü:26).
o·,
.'0;:
".-=c~_."
.'y.
_
(Göriintü:26) Beyaz boşluk bıtlıımlmış web sayfası örneği; WW\-V.short-stones.co.uk/
(Psychology. wichita (ty)).
uygun 5
mm ya da yan uygun 4mm olarak kullanılmıştır. Araştırmaya katılan 20 koı~j (10 kız, 10
erkek) öğrencisine (l-Kenarlı, en uygun satır boşluğu, 2-Kenar\1, yan uygun satır
boşluğu, 3-kenarsız, en uygun satır boşluğu, 4- Kenarsız, yan uygun satır boşluğu) dört
farklı beyaz boşluk ve satır aralıklı metin sunulmuştur (Chaparro ve diğerleri, 2005).
Sonuç olarak, web sayfası ve grafik görüntüler tasarlanırken, web sitesinin kolay
okunurluğu için daima renk koııtrastlığı, okıınaklı yazı karakterleri, yazı büyüklüğü, yazı
biçimi ve metni çevreleyen beyaz boşluklar dikkate alınmalıdır.
Okuyucu üzerine yapılan sınamalann sonucunda kenar boşluklanllin okuyucular üzerinde
pozitif etki
yarattı.ğı gözlemlenmiştir.
Kenarlarda beyaz boşluk kullanımı; hem okuma
hızını hem de anla~ılabilirliği etkilediğini göstemıiştir. Ayrıca okuyuculann, kenar
bQşluklu parçaları daha yavaş okumasıruı rağmen bu parçaları kenarsız parçalardan daha iyi
anladıklan ortaya çıkmıştır. Genelolarak
sonuçlar kenar boşluk kl.lllanıcılannı memnun
etmiştir. Araştımladasatır arası boşluğu kullanımının okuma başansını etkilemediği
görülmüştür. Ama
Ve
kenar boşluksuz parçalarla karşılaştınldığında dah<ı az mernnuniyetsizlik
göz yorgunluğu meydan_u getirdiği görülmUştür. Böylece satır boşluklan okum<ı
başarısını etkilemezken kullanıcının tercihini etkilemektedir (Chaparro ve diğerleri, 2005).
Internet ortamında gün geçtıkçe hikaye, roman ve makale ob..\Jyanlann sayısı anmaktadır.
Okuma ve anlama kolaylığı sağlayan beyaz boşluğun kullanımı da önemli bir öge
olmuktadır.
2.4
WEB SAYFALARı İçİN TARANABİLİRMETİN YAZIMI
Internet kullanıcıLarı, uzun okuma yapmak yerine tarama yapmayı tercih etmektedirler.
Yapılan araştırmalarda kullanıcıların % 79\ınun okuma yerine tarama yaptıkları %
ı
i 6 sımn da satır satır okuduğu görülmüştür. Kullarucı eğilimlerin c dayanarak Nielsen
(Onursoy, 2001, s.43) web sayfalannda taranabibr metin yazımının csaslannı şöyle ön
gönnektedir:
• Makalelerde iki ya da üç seviyeli başlık kullanılmalı (genel, yan ve alt başlık)
büyüklük olarak da bu başlıklar fark ed!!!.! b!çimde verihn-=-lid!r,
• Esprili başlıklar yerine anlamlı başlıklar kullanılmalı (okurun sayfa ya da
bölümde ne bulacağını anlatan ba:;;lık kullanılmalı),
• Okurun görsel
ışıklı
algısını
yakalamak için önemli sözeükler vurgulanmalıdır(renkli.
sözcükler ya da metinler, ikonlar,
link) daha
altı
çizgili
üstnıetİn bağlantılan
tumımalı ve
kullanımına dikkat
edilmelidir. Metin
sayfası
i
ters piramit kuralına uygun
bilgi vererek başlamalı, devamı bağlantı ile
ikinci sayfada verilerek tarama yapan okuyucuya
sağlanmalı, geniş
bir uygulamada
aynı
sitenin
kolaylık sağlanmalıdır.
beş farklı süıiimünü (aynı
temel bilgi
farklı
sözcüklendirme, ayn site tasanını) yapmıştır. Daha sonra kuilanıcılann aynı taslağı farklı
sitelerde kullanmalan
ölçümlerneye
sağlanmıştır. Kullamcılara uygulayarak
çalışmıştır.
en iyi
ıaranabilir
Yandaki tabloda en iyi kullanılabilirlik ölçümleri
çok- new) .:vııa~iı
N~bnıshı, hı1ylik msırı kıf!4lıiı'l1li ulus/rır arası ~rı~
w~b
:>,t•.mıd~ kuUalıılaı:r
kılr ]ll
promO.5}OllQ! (tarqf1ı)
."'O/ıı:ıı~ıll Sirı/Q
yazımliıiı
(112.166), A ro'Jr LodgQ
metni
verilmiştir
(Görüntil:27).
1;'' J"'' (1'~1'")"
1996'do Mıbııı~a'da
NClio ..ı~
.b.:illfılmı~)
~~''';,
kullanıcıya bilişse1
"değildir" olacaktır.
Bu durum okuyucuyu
onların
yavaşlatacak ve
oranında kullanışlı, hız1ı, tarafsız aynı
BıdJ,;1o
ca!ibYd7 Fon R.Qbin;;ı;rı
Lod8JI si$l HI;/oricai
3trıtJ!l Ftz~,
ı---
SC'J!tJEliZlf
P~ &- MU!ıllpı:r,
o/.,J8
%;7
·
·
·
Fort robın.$OlI SLat" park (350 000
3cottJŞllJfNatıQrl'ıl Monıımıml
Arbor Lodg4
·
·
·
,;tQ/~
Hislon<:o!
~.J'';1urcI)J
(}32.16,{,),
fu,~
&-
Mu~um,
(! 00 (00),
Corlwıg6 C-Ş6,j98;,
SbJ.fır 1'I1ı.;;gı.m ,/J?rı!m Pıomm(60.002}
S&ıtQ Hısıon'cal Frı;ı:JI' rı8A46)
!!ilil)'a[oBili Rand
"hayır",
-
N~91jll ıa~ı (rrı.r~lJ1z
siteyi kullanmaktan
uzaklaştıracaktır. Aynca, araştırmayakatılan kullanıcılar, birleştirilmiş yazılan metni
124
119
~ }ll drıı'llı*tadJr. 1996yJmdrı ~rı ;~vı[m yg Ig,cifı i/ddi/n ';,m,dr[i/n·
bir yük empoze
ilk tepkisi;
(100 WO),
Nl>bI'Q~krı, IıIl}lik ın,.;:!n .'rrıtl9/.m·rıi ııhJ.~lrır al't2:S1 im~ SoliıJp ""<1zib~qj ıl6 ~6tJ!lrd.i:
'''' li'"
etmekte olduğu yönündedir. İnsanlar 'Nebreska uluslararası tanınan hareketliliklerle
doludur' diye başlayan bir paragrafokuduklan zaman,
Mu~qlJ.m
Hi~lor:~d Pqı-*'dır
metnin nesnel uyarlaması, reklam uyarlamasından daha çok kullanışlıdır. Reklam dili
için çok fazla kaynak harcayan
&
St#m- M1J~qı.lIl V mil'i" Piı:!1I.d67)1QBı.ffaIiJŞiU !i'.iındı SMiI
CorMng~.
(% 27) seçmişlerdir. K~llanılırlık başan ölçeğine göre (zaman, hata, hafıza ve site yapısı)
ulaşmak
%/}
FiJn
?ark (2J 446)
rı/tl 611
(Jön
Duzs/mg
$eoli5Blııf Jktıonai Mtmı.m~rıt
::1~g HMton,~aE H.)"J;
MQrıZlmBn!, Arlıo-r
11~ ç~kw~.i:
Jainp c..zibiNI
;,j111i~lı V~ ,qr~ıi'l 9ı;iilnı ./ıa~ıy 61'/6'11'
park OjO.OOO ..ıya."llw)
Bıll Rarıçh StrıtJ!l J::ıi~kmcrıl
Tabloda görüldüğü gibi Nielsen'in ölçümlerinde kullanıcılar, taraflı dil yerine nesnel dili
gerçeklere
dolmakmdrr i996 ıılmJo. ~rı
to)",ı,QrıgQ (86.~SI.8), Stuhr M/Jş6ı.m ofPrr:ımQ I'ıiJmU1r (601702)
metin ise
Nielsen (2001, s.l 04-1 05), taranabilir özellikte bir yazının nasılolması gerektiği ile ilgili
yapmış olduğu
Bır
bilgiler sınıflandınlarak üstmetin (hipertext) bağlantılan
haline getirilmelidir. Erişim süresini uzatacak, okumay! ve yazdırmayı zorlaştıracak
kullanıcıya özet
.Kulirımrrı~1l
vurgulayıcıdır).
Aynca metinler kısa
bölümlerin
JU.rıtrol Şr:ırtl{!!mJ.
(hipertext
Uaırıısk-rı crıııb .~9riJırd~1ı
rh-l)
roimı;oıı Slo.t>ı
(Yo
Çom.ıllge
2001, s.l 04-1 05).
i
@6.598).
Bill Raıı,c1:ı
ıı}alll/
9dlle",] ~rld}'i' fo'/1
._..-
~/ı27
park (350000 1J.lI1JV1cı) ScoitsBlı;,f NrlJıorıa1 Mfl/lWlllilıı!
(llJ.166), Amo7 Lodge
zamanda akılda kalıcı bulmuşlardır (Nielsen
birldu 1996 'd.. eli çok
Stai~
dat~
His/orir.ai Park &
Sfıı1:r Mı..>ılIZlm
oL ?Mrid
MlJ~eı.m
Pionq~r
(IOO
(60. !){rı)
oco,ı,
Y~
Bujfaio
HUorica/ P0t. 12/1446)
-'-"-'-
8jr~itırii'm4tilr
19B6'dqN:ebl'l1,ı;~ 971 ;Qyıi41l
·
·
··
·
·
Fon ;o:o/ıııqorı
Ydli>,.,c[h 6diislı
%124
park (350. 000 t.~"~'6lcı),
;ıfcj~
Sc·ott;Bi·ı!fNo21io;u],i MOll~milnl
Amor Lodg!! ::1r{{e
Iııı.P]~}'lgn.
Og 166),
#IJtorıı:oJ1 Jb}'~.&
MU:Jlum,
~~"lg!J,
StuJ,r MtlJ"ıım qf PmtriP,
Bıiffa1rJ Bıll ,Ilaııdı
Pio~u
!Itaf9 Hıs/orica/ Fark'
----(Görüntü: 27) Nielsen'in taranabilir metin üzerine yaptığı bir çatışma.
ı
54
55[
Standfor-Poynter (Onursoy 2001, s. 48) göz takip
amştırmasında, metinlerin
Web siteniz görsel
çalışmalarının metinler üzerindeki
nasıl
okunmak yenne büyük oranda tarandıgmı göst~rmektedir.
Çevrimiçi haber okurları üstünkörü okumakta, bulunduklan
okumınnaktadırlar. Poynter
sahip
şaşırtıcı
Enstitüsünün yaptığı ölçümlerde okurlar üzerinde bazı
başanit
• Haber ve matale1ere bölüm adlan
aracılığıyla bakılmaktadır
bütüne
sitenin geri
yazarak. diğcr kişilerle
etkileşim
ka1anını kolaylıkla bırakaçak.,
halindedirler (Poynter, 2005).
İnternette yazımn daha
resmin ve grafık1erin açılması da okurun
dizgesini
alışkanlıklanııı değiştirmektedir. Sonuç
tasanın yapılırken,
bulundumImalı ve kullanıeılann webde
olardk
bir şekilde taradıklan
sayfasını değerlendirmek bir
ardı
edilmesi demektir ki, bu da bilgiye
değerlendirmek için
alamıyorsanız, sayfanızda hatalı bir şeyler vardır.
Burası
almak gerekmektedir. Web sitelerinde
vardır.
Görüntü 28, web
duyarlar. Bilgi
ögeler sitede
otobanı
dizgesi
'burası
işlevini
ve
ya da
içinde büyük bir bilgi aralığında hareket etmek
kullanıcılara
sorulara karşılık 3
de
yaygın
sayfasına yerleştiriL"1liş
adı
olarak web
üç genel bölgeyi
verilen 'ben neresiyiın?'
'dolaşım çubuğu' adı
verilen
t,
kestirme yollarla
sağlanır.
Mark:ı C'.J.b.'Aı\l (blo'lnd ~~'113(ıfı nM'9$ivil'll;ı
:::.. O~:.ltırıı ~\I~I,j.~ll
"80l0,ıog, IıldltbiBrln.?
3. M~lrıırı \ııılund\l,j\l ::'8f (ı";~(ı~in tlIJ1\lndlıyu
k'Olm) 811'.I!lt rı.,..
••:>
Bu
yerine getirir.
Bir dolaşım dizgesi olan webde temel kullanıcı etkileşimi için, yüz milyonlarca sayfa
tıklanmahdır. Büyük
değişse
.
aradıkIan ~t;:yi
sokak numara ve işaretleri gibi)
diğer
dolaşımla ilgili
neresi?' sorusuna yöneliktir. (Veen 2001, s. 48)
olarak. adlandınlan web üzerinde de dolaşım logo,
düğmesi, bağlantı araçları
dolaşım
Bu basit ama etkili bir
'nereye gidebilirim?' sorusuna yönelik iken, 3'nolu yer ise 'içerik alanı" olarak bilinen
hava alanlanndaki fiziksel alanlara
levhaları,
labirenti içinde
neresi? ve Nereye gidebilir:im? sorulanna
sorusunun cevabına yönelik yerdir. Soldaki 2'nCilu yer ise
İnternet ortamında bulunan web sitelerindeki bilgi, belge ve görüntüler sanalolsa da
yeri bulabilmek için işaret dizgesine (trafik
Kullanıcının bilgi
bölge bulunmaktadır. Bazı sitelerde dolaşım çubuğunun yeri
SAYFALARıNDADOLAŞıM
benzemektedir. Büyük ve kaınıaşık olan yerleşim yerlerinde insanlar,
önemli bir
ölçüm yöntemidir (Veen 2001, s. 48)."
oluınlu cevap
tarama yapmasına uygun metinler
şehir ve
diğer
temel bir yol önenniştir. llSitenizden herhangi bir sayfa
göstermektedir. 1'nolu yt:r marka çubuğu (brand bar)
fiziksel bir yer kaplamaktadır. Bu,
süreçtir ve basitten
erişmek isteyen kullanıcı açısından
en önemli özellik dolaşım dizgesidir.
sitelerinde bu üç bölüm
etiket, yönlendirme
pes edecek ve
için dob.şım tas8nmı birinci planda tatulma1ıdır. Keith In:stonc, doiaşıi11
Etkili bir dolaşım ıçin, Ben neredeyim?,
okur okuma alışkanlıklan göz önünde
bazırlanmahdH.
gereksininı
bu
seçip. eğer aşağıdaki 3 soruyu sorarak yaptığınız değerlendirmede sQrulann herhangi
birine cevap
önce ekrandt"! görünmesi, soma
sayfalarındaki metinleri kullanıcılann okumadıkIarl, hızlı
siteyi ya da web
gitmektedir. SaIt estetik açıdan değerlendirmek, sitenin
göz
boğulmaması
Yapılan araştınnalar İnternet okurlannın öncelikle göz attıklan daha sonra tekrar metne
döndüklerini göstennektedir.
doğru
durulması gereken
• Çevrimiçi okuma yapanlar aynı zamanda, haber ya da makale üzerinde
WEB
ortamında bütün
gereksiz yere zaman kaybıdır. Büyük ve karmaşık: bir yapıda tasarlanan sitelerin üzerinde
okumaktadırlar.
2.5
sunucu
sitenin yönlendinne dizgesini
web sitesi için zonmlu bileşendir.
özelliğinin
• Okurlar, makalenin tamanuru okumadan önce özetleri daha sonra makaleyi
Bu yüzden,
kanşık buluyorlarsa
Çeşitli açılardan bir
(spor, güncel,
kültür vb.).
görülmüştür.
yaramayacaktır. "Ayrıca ziyaretçiler
asla geri dönmeyeceklerdir" (Timberlake, 2004). Bu yüzden, iyi bir yönlendirme tasanmı,
• Özetler, makalelerden üç kat daha fazla çağrılınaktadır.
web
ve
olabilir. ama ziyaretçiler bu gi.}zelliklere
olacaklarını ve nasıl kullaııacaldarınıbilmiyorlarsa,
güzellikler hiçbir işe
sayfayı tamamen
çıkanmlar sağ1anmıştlr,
yorumlannı
açıdan olağanüstü güzellikte
içi~
(Görüntü:28) Web sitesinin bölümleri; marka çubuğu. dolaşım çubuğu, içerik kısmı.
üstrnetin bağlantılannııı üzt:rİlle
bir btlgi boşluğunda, basit go-to (git komutu) üstmetin bağlantılan
gerekli olan dolaşım desteğini sağlar (Nielsen 2000, 188)_
Ben neresiyim: En önemli yönlendirme
tasarlaYlCısı
sorusıı, olasılıkla
bu soruya cevap verecek şekilde sitesini
ben neresiyimdir. Site
tasarlamaktadır.
Yönlendirme
dizgesini tasarlayanlann ana görevlennden bir tanesi de kullanıcılnnı nerede
olduklarını
"Eğer bilmediğiniz
bir şehirde bir metro istasyonuyla karşılaşırsanız, ne tür duygulara
kapılabileceğinizi düşünün.
Aynı
S.
Hemcn çevrenizdeki yerlere bakar, yol
duygulara bilmediğiniz bir sitede
olduğunuz zaman
49). Sitelerdeki dolasım dizgesi de metro
yönlendırrne dizgesi
Web sitelerine
sizi
giıişlerde
gelmektedirler.
işaretlenni ararsınız.
da kapılabilirsiniz" (Veen 2001,
istasyonlarındaki işaretlere
ulaşmak istediğiniz
yere
benzer, iyi bir
götfıriir.
Kullamcılar,
değil diğer web
bağlantılardan
sitelerindeki
arama motorlan, yer imi'" (bookmark) ve web
sayfasındaki
bir reldarn ya da içerikle ilgili bir bağlantıdan sitenizin herhangi bir yerine girebilir ve
nereden girdiğini de
hatırlayamayabilir
sayia.snıda sİlenin kimliğini yansıtacak
(Veen 2001, 5.49). Btl yüzden sitenin her
etiketin, logonun
2003,5.377) (Götüntü:29). Site logosu metro
olması
istasyonlarındaki
Diğer taraftan başlıklarda ad bulunmadığı zaman site açıldığında sunucunun üzerinde
1'>Vntitle Document" yazısı çıkmaktadır. Bu tür belirsizlikleri de ortadan kaldınnak
gerekir.
Nereye gidebilirim: Belirli bir amaç için tiiteye gelen kulhı.nıcılann en önernh sorunu
gidecekleri yer hakkında fazla bilgilerinin olmamasıdır. "Kullarncı sitedeki yerini
kimi zaman ::ına sayfalar kullanılmaktadır. Kullanıcılar genellikle
web sayfalann<J. ana sayfalanndan
sitesinin ismi göriinür ve kullanıcı nerde olduğunu bilir (Nielsen 2000, 191). Aynca site
jsimlerinin başlıkta verilmesi arama motorlarında sitenin bulunmasını kolaylaştırmaktadır.
bildinnektir (Niederst, 2003,s 377).
gerekir (Niederst,
durak adlanna
bemt'lilebilir.
belirledikten sonra, süede kendileri için daha başka uygun nekrin olduğunu hdidemeye
çalışır. Bunu, sayfalarda tasanmcılar tarafından sunulan dolaşım birimlerini tarayarak
yapmaktadır"
(Veen, 2001, s.51).
Kullanıcıların
gidecekleri yeri gösteren
dolaşım
hirimleri ise tiayfanın üzerindeki mtmü çubuklan w:. çeşitli biçimde ku!lam!an
bağlantılardrr (Powell,
sayesinde
2002, s.199). Sitenin içeriğine uıa~lIn, bu bağlantı menüleri
sağlanmaktadır.
Yönlendiroıe dizgesinin diğer bir sorumluluğu da kullanıcının gideceği yeri açıkça
sıınmasıdır.
"Yönlendirme
duğmesı yapılacağı zaman
iki sorunun sorulması
gerekmektedir. Birincisi kullanıcı temelli; kişinin gitmek ıstediği ycr neresi olabilir?
İkincisi de weh yayıncısının rolüdür; bizim gitmesini düşündüğümüz yer ziyaretçiniu
., ..
gideceği yer midir?" (Niederst, 2003, s.377). YayıncınIn, yörJcnd:imıe dizgesiııi
tasarlarken kullanıcı gcreksinimlerini gözettnesi. aynı zamanda kendini kull::ımcı yerine
koyması gerekmektedir.
Bazı ölçünlü biçimler olsa da her bir web sitesinin dolaşım seçenekleri farklıdır. üenelde
web siteleri kullamcılan diğer sayfalara yönlendirebilmek için sol taraftaki dikey sütun
(Görilntü:29) Logoların genelde sol üst
köşede olduğunu
gösteren görüntü; "wwvı.buy.coIn" web
siLt:si (buy, (ty».
içinde yönlendirme düğmelerini kullanmaktadırlar. Ölçünlü biçimin dışında verilen
duruma uygun yönlendirme biçimleri de kullanılabilmektedir.Önemli olan kullanıcılann
sezgiselolarak çözebileceği etkili bir dolaşım sağlayan dizgedir CV een, 2001, s.51).
Web 5itelerinde yer belirleme görsd kimlikle
olduğunu göstemıek için
yapısı içinde etkileşim
sÜe
kimliğine
ilişkilidir.
Web sayfalannın bir bümne ait
gereksinim duyulur. "Web sayfalanmn kendi
ve düzen <t.i1lsmuan benzediği de görsel kimlikle
sağlanabilir"
(Nielsen 2000, s.188-189). Görsel kimlik, kuuameınm aynı web sitesi içinde olduğu
duygusunu verir ve
kaybohnasını
Kullanıcıların bulundukları
önler.
158
başlık
HTML içinde yazılırsa sunucunun üzerinde de web
• Book.mark: Daha önce ziyaret edilen web
sunucusunun üzerinde oluşturulan yer imi
sayfasına
A. Anasayfa (homepage) bağlantısı; sitedeki her bir sayfanın üst kısmında ana
sayfaya geri dönmekiçin bulunur.
B. Geniş işlevsellik; seçili bölüme aldırnıadan sÜçnin bütününe erişilebilccek
yeri gösteren diğer bir araç da HTML'in
tanımlamasıdır. Eğer sayfa adı
Örneğin Nordstrom sitesindeki yönlendinne dizgesi. içeriğe rahat ulaşacak şekilde
tasarlanmıştır (Göriintü:30). Bu sitede yönlendirmelcr dört bölüm halinde sunulmuştur:
daha sonra tekrar gitmeye yarayan, web
bağlantı gurubudur; yardım bölümüne, arama yeteneklerine, diğcr genel bilgitcre
ulaşılabilir.
C.
Sınıflandınlan
bölüm menülerinin anü
~ayfada
ve her bir sayfada bulunması
gerekır.
D. İkinci dereceden dolaşım dizgesi sitenin sol tarafında bulunmaktadır ve seçilen
bölümlerin alt seçeneklerini
sunmaktadır (Niederst,
2003. s.377).
nın kınmzı, National Car Rental'ın yeşil kullanması gibi). CNet ise temel
renk olarak sanyı seçmiştir ve bunu kullanmak i~in hiç tereddüt etmemİijtir.
Bu renk, sitenin hazır bilginin sunum yapısıyla vc kullanıcılann zihnini
etkileyen dolaşım dizgeleri ile sitenin yapısım oluştunnaktadır. Uyg.ulanan
.strateji oldukça basittir; site haritasını belirleyip, sayfa üzerinde bu yapıyı
----~IJ
akJaımak için renk bantlannın kullanılmasıdır"(Veen 2001, s.51).
Kullamcının içeriği bulmasını kolaylaştıncı yöntemlerin kolay gelişmediği bir gerçektir.
Cnet kullanıcılan, san çubuğun dolaşım çubuğu olarak algılanması ve bununla birlikte,
mavi alt çizginin üstmetin bağlantı anlamına geldiğinin öğrenilmesi belirii bir sürecin
~allCll
~:::"::-'~---~,-
geçmesini gerekli kılmıştır. Öğrenilen yöntemler yeni sitelerin yönlendirme dizgelerini de
etkilemiştir.
,.",,""
..
~,.
Neredeyim: Web sayfaSlOda içeriğin bulunduğu alan sizin neredeyim ya da burası neresi
sorusuna verilen yanıtı oluşturur. Nerede bulundl\ğunuza yardımcı olacak bazı ipuçları
vardır; örneğin ziyaret edilen web sayfalarının bağlantıları farklı renkte görünür (ziyaret
edilmemiçler mavi, ziyaret edilenler mor renkte). Ayrıca web sunucusu yazılımları
tarihleme menüsünde ziyaret edilen sayfaları listelemektedir. Eğer sunucu üzerindeki. geri
tuşuna basılır~a, sunucu bir önceki sayfaya dönebilmektedir. Bu durum bulunduğuz yer
~~-~~-~~-~;-----@
hakkında bilgi
verebilmektedir (Nielseu 2000, 191).
Sunucunun sağlamış olduğu olanaklardan yararlanmak için (ziyaret edilmiş yerleri
gösteren link) sunucunun atamış olduğu bağlantı renkleri değiştirilmemelidir.
,--~----~~~--
Eğer bt1 bağlantı renkleri değiştirilirse, kullanıcılar alışkın oldukları durumdan
(Görunru:30) Nordstrom sitesinin yönlendjnne dizgesi (Niederst 2003, s.378).
farklı olduğu için bağlantıları anlayamazlar. Sunucunun atamış olduğu bağlantı
renkleri sayesinde kullaıucı daha önce ziyaret ettiği sayfayı bir daha ziyaret etmp.k
Veen,
yapmış olduğu
bir araştınnasmda, web sitesi
yapısıyla da bağlı olduğunu belirtmiştir. Marka
tanıtımını hem
de yönlendirme dizgesinin
''Yıllar önce.
için
dolaşım
dizgesinin sitenin marka
seçilmiş
olan rengin hem ürünün
yapısını etkilediğini vurgulamıştır.
birkaç web sitesi, özellikle ticari bilgisayar kaynaklan
enet.com diğer Web sitelerine
zorunda kalmayacaktır (Nielsen 2000, 191).
karşı dolaşırnda ciddi tutarlık çalışmalarma
başı~!TIışt!r. Özellikle, CD.et, sitenin 'marka' yapısıyla yaklaşık aynı
özelliklere sahip dolaşım stratejileri ile ilgilenmiştir. Örneğin, belirli bir
renk kullanımı, o sitenin ya da ürünün tanıro1anmasıylailgilidir. (Coco-cola'
2.5.1. Yönlendirme Biçimleri
'.Veb siteleri üç çcşit yöntendiıme biçimi k•.illaımıaktadır; ;';ıra düzensel dolaşım. genel
dolaşım ve yerel dolaşım (Timberlake, 2004).
ı. Sıradüzensel dolaşım (Hierarchical)j sitedeki sıra düzensel uygulamalar tıpkı
bir kütüphane gihi büyük bir ağaç olarak en iyi ve zengin biçimde organize edilmiş
bilgiler içeren siteleI'in uygulamalarıdır.
ol ı
2. Genel
dolaşım (Global
navtgatlon); genel uygulamalar, lüm noktalar
arasında
kul1::ımlml1ktadır.Bazı
sitelerde ise siternn yapısına uygun bir biçimde üst kısımda
kolay vc mantıklı sıçrayabilinen sitelerdir. Bunun en iyi yolu, daha geniş
listelenmektedir" (Timberlakc, 2004) LGÖrünm:31). Bir Dolaşmı çubuğununııasıl ve
kategorilerin daha uZ sayıda bilgiyle sunulmasıdır.
nereye "konulacağınadair çok sıh bir kural yoktur. Birçok sitede üstte ve yanda
kullanılmasınarağmen sağ
3. Yerel
dolaşım (local navigation); iki şeyarasında bağlantı kUID1l1k için
kullanılır, geniş alan içinde daha derin bilgiye ulaşmak için uyguıanır. Dolaşımın
gözü
sağ
tarafta da
zorlamasınınyanı sıra
tarafta
web
kullanıldıgı göriilmektedir. Sağ
tarafta
kullarulrnası
kullanıcılarınınalışkanlıklarını da zorlamaktadır. Ama
kuııanIlmasının,kullanıcıyı şaşırtmasının dışmda yanlış olduğu söylenemcz.
en temel şekli gömülü bağlantılardır. Eğer wcb üzerinde başka bir yerde daha fazla
bilgiyle bir kavram desteklenmek istenilitse gömülü bağlantı bu yöntem için en
uygunudur (Timberlake, 2004).
2.5.2
Yönl€ndirme A"2~12rı
Günümüzde baz! web siteleıi olağan üstü güzenikte tasarlanmalarma rağmen dolaşım
dizgelerinde aksaklıklarbulunmaktadır. Bu aksüklıklar dolaşırnda hıııanılan araçlann
işlevlerinin bilinmemesi ve etkili kullanılmamasmdankaynaklanmaktadır.
Ana sayfalIlll web süenizin
başhmgıç noktası olduğu unutulmamalı bütün
yönlendinne
araçlarının çeşitleri ve miktan bu hat üzerinde ayarlanmalıdır. Ana sayfa üzerindc
kullanılacak yönlendirme araçlan işlevleri ile birlikte aşağıda verilmiştir.
(Görüntü:3 l)Yönlendinne
• Dolaşım çubukları (navigation barı nav-bar).
çubukları
genelde sol tarafta bulur (Kids.discovcry, (t}')).
• Aşağı doğru açıb.n menüler (Drop down menüleri javascript, CGl vb.).
• Gl'alik görfuıtülü yönlendirme düğmeleri.
• Grafik göriintülü-görÜTIni haritalan (Graphie-image rnap).
;) MetiL. baghmlıları- gömülü bağlantılar (Text link-Embeedee linles)
Dolaşım çubuklarında
en büyük kaygı, yerinin iyi belirlenmesidie Yönlendırme
çubuklarının sol
sağ
ya da
kenann seçilrnesincteki amaç sayfa
boşluğu azaltınamaktır. Ekranlar,
yatay kenan dikeyden uzun
içeriğinin kullanılacağı
oluuğu ilfİn,
yönlemlirme
• Ekmek kınntm izı bağlantılan (Bread-crumb trail).
çııbuğunu şul ya da sağ tarafa koynıak mantıklıdır (Timberluke, 2004). Dolaşım çubuklan,
• Sekme dolaşım (Tab navigation)
içeriğin bulunduğu alanı etkilemediği ve taı:ıarunın tutarlılığını bozmadığı
• Site haritaları (Site map).
yerlerde
kullanılmalıdır.
2.5.2.2
Aşağı Doğru Açılan
süreCe uygun
o Rehber tum (Guide tour).
• Pencerelerin kullanımı (iıı frame).
• Arılma kutuları (Devingen olarak üretilen URL'ler).
Menüler (puıı-down menus i Drop-down menus)
Web Sa)'fasına daha fazla menu eklemenin diğer bir yolu ise açılan menülerm
kullanımıdır (Görüntü
2.5.2. ı Dolaşım Çubuklan (navigation barı mY-bar)
32). Bu bağlantı nıenüleri ekranda çok fazla yer
içeriğin ahInı genişlemektedir(Niederst
2003, s.382).
Aşağı
ya da yana
kaplanıadığı için
doğru açılan
çoğu web sitelerinin doiaşım seçeneklerini ıgrafik. düğmeleri ya cia metin bağlantıian)
menülerin
yatay dolaşım çubuklan ve dikey paneller oluştunnaktadır."Dolaşım çubuklan klişeleşıniş
HTML) menülerini kullanmaktır. Devingen HTML menüleri Javascript ya da diğer arayüz
biçimde kııll~11l:r. Sayıs1z sitede dolaşıD çubu.!dan genellilde sayfanın sol kısmınd3
yapımındakullanılan en yaygın yöntem
DHTML (Dynamie HTML! devingen
yazılımları
sayesinde
olu.ştunılmaktadıL Bazt
web
zamaııda kaydınna çubıığuyla birlikte aşağı doğru
:'iiıelerinde menüier
yana açılmokta aynı
internetin yaygın olmaya başladığı 199~'lı yıllarda yöniendirme düğmelerinde, düğme
oldugunu hissettirecek kabartı etkisi verilmekteydi (Görüntü: 33). Günümüzde kullanıcı
hareket etmektedir.
alışkanlıkları değiştiği ve estetik beğeni düzeyi arttığı için bu tür abartılı düğme etkileri
çoğu sitelerde kullanılmamaktadır.
(Görüntü:33) Kabartı etkisİ uygulanmış gwlik yönlendirme iliiğmelen (Granmsticdesigns. 200Sc).
(Görüntü: 32) WebMonkey sıtesinin menÜ5ü hem yana açtlmakta hem de
(Webmonkey. (ty)).
aşağı doğru kaymakiadır
2.5.2.4 Görüntü Haritaları (Image maps)
Fare tıklandığında, birden fazla seçenek sunan açılan menülerin temel
sunulduğu
ekran boşluğunu arttırmasıdlf. Diğer bir özelliği de
başlıkları oluştururken sağladığı hiyerarşik yaV1d1r.
başlıklannı tahmin
tüctinün temel
edebilir. Bu durum
dezavantajı birçok
eski
l:1u sayede
avantajı, içeriğin
sınıflandırmada
kullanıcı, bağlantımn ::ılt
dolaşımı kolaylaştırır. "Yönlendirme
sunucuların
alt
dizgesinin bu
yaşamaması için
(browser) jawascript dilini
kullanırlar" (Gnıntasticdesigns, ıOüSc). Kullanıeılaıın
Yönlendirme
katar.
çoğu
araçları
web
sorun
site yönlendirmenin alternatif fonnlarmı kullmımak gerekir.
2.5.2.3 Graftk Görüntiilü
e
görüntülerdir (GrantclsticdeSigms, 2005e). Aşağıda örnekte de göriildüğü gibi grafiğin
üzerinde diger sayfalanı gönderme yapan resimler bulunmakta bu resimlerin üzerine
gelindiğinde ı-;adeee gidilecek olan resmin kapladığı alan bağlanti dnrumunu almaktadır
desteklememesic!ir. ZiY3r~tçüerin. v'? ticari anlamda müşterilerin birçoğu jav,rascripti
desteklemeyen :-ilinuculan
GÖlÜntU haritası, bağlantı olarak kullanılan görüntünün üzerindeki alanın herhanl:!İ bir
yerine tıklanmasıylakunanıeıyı gitmek istediği sayfaya aktaran tek parça grafik
(Göctintü:34). Görüntü Haritası olarak adlandınlmasınmnedeni ise bir grup halinde bilgiyi
dizgeli bir şekilde görüntü ile aktannasındandrr. Genelde görüntü haritaları GİF ya da JPG
biçiminde kullanılmaktadır.
Yönlcndimıc Düğmeleri
o\arak grafık görüntüler, web
sayfasında bir
sayfasına eşsizlik,
renk ve
kişisellik
yÖniendinne dizgesi olarak grafiklerin kullanıldığı görülür.
Grafik görüntüler, görsel bir çekiciliğe sahiptir.
Kullanıcıların gözlerine
dogal olarak bir
renk lekesi ve boyutsal bir değişim daha cazip gelebilir.
Grafik görüııtnıü yönlendirme
Diğer
düğmelerinin en
büyük avantiijı çabuk
avantaj l ise görüntü., HTML kod içindeki a1ternatif metin ile
işlı;;:r1iğini
kaybetm(;mt:siuir (Grantastictlt:sigııs, 2005c).
Grafik bağlantılann yüklenme
(downIoeıd) süresi
belirlemede önetnlidir. Genelde. yönlendirme
onun kullal111ıp kullanılmayacağını
düğmelerinin boyutll,
boyutunda ve 2~-fin piksel yüksekliği ile 60-165 piksel
olmalldır.
sitedeki
algılmabılmcsidic
desteklendiğinden
Sitenin yönlendinne
düğmeleri esas
ileti
1-5
kb\1ık
bir dosya
genişliğindeki b<..ıyutlar arasında
olmalıdı:" ve kullanıcı tıkladığında
yönıendinne düğmelerinin tamamının yüklenmesi
için beklememelidir.
(Görüntü: 34) Görüntü haritaılı ve altında metin bağlantılan, (Grantasticdesigns, 200Se).
B;ızcn ttk bi. görJ.ntü lJH.l"itasi çoklu yönlendinııe düğmelerinden daha hız1ı
algılanabilmektediL Ameı görüntü haritalan estetik açıdan hoş göıünmesine karşın,
İndirilme hızının düşük olması süe ziyaretçisinin siteyi terk etmesine neden olabilmektedir
(Grantasticdesigns, 2005).
içindeki
Aynı
zamanda, birçok
bağlantılan izleyememektedir.
aranıa motoru
Bu yüzden web
bir görüntii haritası
sayfalarında arama
motorlan için
Bu nedenle, görsel çekiciliği sağlayabilmek için metin bağlantıları rastgele kullanılmamalı
gerektiği kadar kullanılmalıdır(Grantasticdesigns, 200Sc).
yönlendirmenin alternatif olması çok önemlidir.
2.5.2.6 Ekmck Kınntıs! İzi Dolaşımı (Bread-Cıumb Trail naYigation)
2.5.2.5 Metin! Sözcük Bağlantıları
Dolaşım
İçerikleri derin ve geniş olan hiyerarşik siteler, yaygın olarak "ekmek mıntısı izi" (bread-
dizgesi içinde en çok kullanılanbağlantı şekli metin
bağlantılar menülerin
içinde (sol, üst ve alt çubuklarda)
bağlantılarıdır.
kullamlabileceği gibi
Bu
crumb traiı) denilen yaklaşımı kullanırlar (Görüntü 35). Adım adım sayfa anlamındadır
ana metnin
içinde de gömülü olarak b..'Ullanılabi1mektedir.
(Timberlake, 2004). Sitenin hiyemrşisi boyunca tıkladığınız sürece, arka arkaya gelen
bölümleri sözcük bağlantısına bağlı olarak gösterir (Niederst 2003,5.384).
Birçok İnternet kullamcısı, metnin içinde b..ııllanılan altı çizili ve mavi renkli sözcüğün bir
üstınetin bağlantı olduğunu bilir. Diğer
grafik göriıntüler ile birlikte sitelerde çok
kullanılan "sözcük bağlantılar" getirdiği olanaklar açısından iyi
Metin içinde bir ya da birkaç sözcük
genellikle ziyaret
şeklinde kullanılan altı
edilmemiş bir bağlantıyı, mor
ziyaret edilmiş bir
bağlantıyı gösterir.
kullaıulmadığı zaman,
sık
bir uygulama şeklidir.
çizgili mavi renkli sözcük
Metin bağlantılarında ön
değer (default)
renkleri
metin bağlantılan kalın (bold), daha büyük ölçülü (puntolu), küçük
dikey çizgiler ya da kare parantezler arasında kalan ya da bunların bir birleşimi olan diğer
bazı
yöntemlerle vurgulanabilir. Bu bağlantılar site içinde tek bir renkte kullanılmalıdır,
web sayfalanndaki
diğer
her hangi metinlerle
(Görtinlü:35) Arama motorlarında sık sık kuııanılan ekmek kınntısı izj yöntemi, (Yahaa, 2006)
ya da kestane \ ili:FÔ)OIl) renkli metin ise
aynı görünnıemelidir. Eğer
n:nk ve biçim
açısından tutarlılık sağlanarnazsa, kullanıcılar başlıklan bir bağlantı olarak düşünebilir
Daha özel konulara doğru derinleşme, ekmek kırıntısı yöntemi ile verilir. Bununla birlikte
kullanıcının nerede olduğu ve nerelerde olabileceğini gösteren bölüm ve altböıüm
başlıklan ile dolaşım sağlanmaktadır. Ayrıca bu dolaşım biçimi b..ııllaıncıhra tek bir
tıklama ile daha üst bölümlere geçebilme olanağı sağlamabadu (Niederst, 2003. 8.384).
Ekmek kırıntısı izi metodu, HTML metinlerde birkaı; bytc ile dolaşım kolaylığı ve iletişim
sağlar.
(Grantasticdesigns, lOOSc).
Aşağı doğru
uzayan metinlerde
dolaşımı kolaylaştırmak için "geri~yukan", "sayfanın
üstüne dön" (use t.aek-to top 1ink) gibi metin bağlantıla.rılcul1am!ma..lCtadır.Bu b~ğbntı!ar
sayfa içinde dolaşımı hızlandırmakta ve kolaylaştırnıaktadır.Diğer bir bağlantı da
sayfanın
en altında bulunan üst bağlantıları taklit eden llsayfa
(Powe1l2002, s.20]).
çoğu
olarak kullaıu1ır. Grafik
kez
sayfanın alt kısmına
altı
metin bağlantıları"dır
eklenir, genellikle
aşağıda yatay
dolaşun düğmelerini beklemekten sıkılan birçok kullanıcı, yaygın
Metin bağlantılan web sitelerde
sağlamaktadır (Usask..,
araştırmacılara derinlemesine araştınna olanağı
2005a). BumID yanı
sıra
il
metin bağlantılarının sağladığı bir diğer
olanak ise arama motorlan için anahtar sözcükler olabilmeleridir" (Grantasticdesigns,
200Sc).
Metüı t.ağlantila:i'J.nm ohıillsuz
yönlen de
tamamına yayılmış mavi bağlantılann büyük
görünmesin~ neden
olur.
2.5.2.7 Sekmeler
i 990 'larda web dünyasına giren 8ekmeler ilerleyen yıllarda ölçünlü bir yapıya sahip
olmu.ştur. Sekmeler, aynı işleve sahip sınıflandınnala....., göstennek ve sitenin bölümlerine
ulaşmak için kullanılmaktadır (Niederst, 2003, s.382). Örneğin "office.ınicrosoft.com"
sekmelere iyi bir örnektir. Burdda her bir seknıe içinde bir alt servise i hizmete
ulaşılabilmektedir(Görüntü:36).
Sekmeler oldukça işlevsel ve sık olarak sİtenin bölümlerine ulaşımda kullanılmasma
olarak bu biçimi kullanır.
bulu!'.r::::e...lCtad~.
\X/e!:- sayfalannm
oranda kuııallJlması, sayfanın sıkıeı
Kul1amcılar yalınlığı
ve yönlendirme
kolaylığını severler.
'
rağmen, bazen oldukça uygunsuz ve gereksiz, çoğu zaman da süs amaçlı
kullanılmaktadırlar.Yığılma ve karmaşaya neden olacak kadar seLme kııllamJmamahdrr.
En iyi çözüm sekmelerin sayılarını azaltıp gereği kadar kullanmaktır. Aynca GİF ya da
]PG
görüntüden oluşan sekmelerin site hızını yavaşlatacağı unutulmamalıdır.
Sitelerde pencere yöntemi her zaman avantaj sağlamamaktadır. Arama motorbnm
kullanarak siteye gelen ziyaretçiler, pencereler yüzünden ana sayfasına
ulaşamayacaklardrr. İçeriğin bulunduğu ana pencere sunucuda açılacak ama yön1endjrme
düğmelerinin bulunduğu üst ve yan pencereler açılmayacaktır. Herhangi bir sayfadan
siteye giren kullanıcılar için içeriğin bulunduğu ana pencerenin alt kısmında metin
yönlendirme düğmeleri bulunmalıdır (Timberlake, 2004).
·,]r
'f
2.5.2.10 Rehber Tum (Tour guide)
~, "<{::}J -
!
(GÖfÜntü:36) office.microsoft web sitesinde
kullaıulan sekıne örneği,
(office.microsoft, 2008)
Ziyaretçilerin bir yerden diğerine nasıl gideceklerini ..miatmaya yarayan site ekran
görüntüleridir, Bu rehber turlar, sitenizin yönlendirme dizgesi olarak ziyaretçilere, kesin
bir rota ya da yol süresince rehberlik yapabilirler (Timbe,lakc, 2004). Rehber turlar aynı
zamanda yönlendirme düğmelerinin nasıl kullanılacağını bununla birlikte sitede nerelere
gidilebileeeğini gösteririler.
2.5.2.8 Site Haritalan
Trafiğe çıkıldığında işaretler bazen
yönlendirmeye yetmemektedir. Yolun kaybedilmemesi
ve vanlacak yere en kısa yoldan gitmek için harita kullanılır.
çok olduğu bilgi
otobanında da
durum
farklı değildir.
Geniş
ve bilinmeyenlerin
Bu nedenle her sitede bir site
Bilgi bulmak için en yaygın kullanılan kısa yol ise arama motorlarıdır (Niederst 2003.
haritası bulunmalıdır.
s.385). Dolaşım dizgesi olarak kullamlan arama motorlan veri tabanına sahip siteler için
Site haritalan genellikle, bir site üzerindeki
sayfaların tamamına
ya da
çoğuna ulaşmak
için bağlantılar içeren sayfadır. Eğer web sitesi geniş ve karışık ise, dolaşım dizgesinin
kısa
yollarla desteklemeşi gerekebilir. Site haritası, site bölüm ve altbölümlerinin
ba.5lıkları yapılandırılarak oluştunılabilir (kitapıann "içindekiler" kısmına benzer).
içeriği başlıkl;ırla belirtilerek, kul!anıcılara daha
Site
haritasındaki
her başlık ilgili
sağladıkları
5.384). Site haritalan
için
kullanılan
2.5.2. ı i Arama Motorlan (Seareh Engine)
sayfayı
sağlanmış olunur.
açmaya yarayan bir bağlantıdır (Niederst, 2003,
olanaklar yüzünden tasanmcdar tarafından yönlendirme
bir yoldur. Ama site
tamamlayıcı yöntemi olmalıdır
mhat dolaşma imkanı
Sitenin
haritası
yönlendirmenin ilk yöntemi
değil,
(Timberlake, 2004).
oldukça kullanışlıdır. Özel yazılım gerektiren arama motorları basit gibi görünse de
oldukça kapsamlı bir y"ıpıdadır. Arama motorları bilgi ve belgenin aranmasının yanı sıra,
zengin çeşidi olan çevirimiçi (online) e-mağazalarda kullanıcılannın aradığı ürünleri
bulmalarını kolaylaştırmaktadır (Grantastiedesigns, 2005c).
Arama motorları sayesinde site ziyaretçileri bir arama terimi yazarak 3 tıklamayla
aradıkları şeyi bulabilir. Aynı zamand{\ arama motorları ekranda fazla boşluk
kaplamarnaktadır. Sağladığı kolaylıkların yanı sıra bazı olumsuz yönleri de
bulunmaktadır. Birçok arama motom ilgisiz ya da çok gereksiz bağlantılara ulaşınakta ve
kullanıcılara seçebileceği yeterince tanımlanmış bağlantıları sağlayarnamaktadır. ;\rama
motorlarının iyi ve etkili çalışabitmesi için dildeatli hazırlanmış bİr site dizinİ
2.5.2.9 Bir Peneere İçinde (in a [rame)
gerekmektedir (Niederst 2003, s.385). Bunun yanı sıra durağan HTML sayfalannın
Bazı tasarımcılar yön:Iendirme kolaylığı açısından pencereleri kullanırlar. Üstte sol yanda
veritabanlanm kommak hem pahalı hem de zaman kaybı olabilmektedir
(Grantasticdesigns,200Sc).
ve ana pencere olmak üzere üç pencere
yaygın
olarak kullanılmaktadır. Bu yöntem
,
'~_ re -La
llJ\.JtlUlgln~la
11..[ ü<l.jüıU
'~'-'.'
sayesinde, kullanıcı aolaşım çuouguna
,
•
~.
el~l~"",~
UVHJ..
;>'''~ .,..~,,'hl:.~--".r:"
....... 6~ ı~
yeniden yüklemek zorunda olmayacak ve yukandaki pencere sabit kalırken yalnızca
içeriğin buhınduğu
ana pencere
değişecektir (Timberlake,
2004).
Y ukarıda değinilen yönlendinne araçları sitenin içeriğine, genişliğine ve tünine göre
seçilebilir. Zengin içerikli anakapılarda (portal) grafık görüntülü site haritası kullanmak
siteyi yavaşlatırsa; moda ile ilgili bir sitede de metin bağlantısı kullanmak sitenin
69
1
görüntüsünü bozabilir. Önemli olan siteye uygun dolaşım araçlarını işlevsel ve estetik
açıdan seçebilmektlr.
2.5.3
İyi Bir Dolaşımın Özellikleri
Dolaşım dizgeleri site için seçici bir özelliktir. Bir site için mükemmel olan özellikler
diğer site için ctkili olmayabilir. Başarılı bir dolaşım dizgesinde açıklık, tutarlılık, etkililik
ve verimlilik gibi özellikler aranır.
Açıkltk: Dolaşım dizgesinin iyi çalışması, onun kolaylıkla öğrenilebilirbir yapıda
olmasıyla ilgilidir. Wcb sitesi dolaşlffi dizgesinin başarısı kolay, hızlı ve etkili bir şekilde
öğrenilmesi ile ölçülür. Dolaşım araçları kolay öğrenilebilirliğe göre tasarlafuıw.lı
karmaşık ve
zor olmamalıdır.
Dolaşım dizgesinin açık. ve anlaşılabilidiğinisağlamak için Niederst (2003, s.379·380) bir
takım öneriler getirmiştir;
• Dolaşım araçları içeriğin dışında olmalıdır. Görsel elemanlar, gruplanarale
Tutarlılık:
Bir wcb sitesinde
dolaşım elemanları
Aynca, grafik ya da metin olarak kullanılan yönlendinne
kullanJrlık açısından
Web
sayfasında bulunan dolaşım araçlannın işlevleri her
sayfalardan da
aynı
Sayfalar
arasında gidebilmek
haritasınm hazırlanması
Web
ve gelinen yere geri dönebilmek için
sayfalarındadolaşım tutarlılığı sağlamanın bir
yol
düğmelerindeki
renklerin lcullanımıdır. Örneğin ana sayfaya dön düğrnesi bir sayfada kmnızı renkte ise
öbür sayfalarda da
içinde
aynı
tutarlılığı sağlamak için aynı
renkte olmak
kural geçerlidir. Çubuk üzerindeki renklerde
zorundadır. Dolaşım çubuğu
tutarlılık sağlanması gerekir.
Verimlilik: Web siteleri, her tıklanışta kullanıcılarınilgisini kaybetme ve onlann siteyi
terk etme riskini
taşımaktadır. Site yapısı
ve
dolaşımı tasarlanırken,içeriğin ne
Bir site için
bilgiye
dolaşım dizgeleri aşın tıklamayı
doğru
dolaşım
kısa
basit bir
kadar
kullanıı.:ılann bilgiye
etkili
2003,
azaltma yönünde almalıdır. Dolaşım yapısı
yönlendirme yapan kısa yollar gibi
yönlendirnıe yapan bağlantılar gibi
verimlilik,
Amaç,
onları siteye bağımlı kılmaktır (Niederst,
olmalıdır.
Bu yapı diğer sayfa ve sitelere
tıklamayla olmalıdır.
yollarla betimlenmiş site haritası ya da
Bununla birlikte,
araştırma çubuğu gibi
genel site
dizgesiyle desteklenebilir (Niederst, 2003, s.380).
5.379).
resminin ana sayfayı tanrmlaması gibi) imgeleıi anlamak ve kullanmak oldukça zordur.
anlaşılir bir
yolu da yönlendirme
5.380).
Simgelerin kullanımı: Herkes tarafından bilinen birkaç imgenin dışında (küçük ev
ulmak
gerekir.
• Her şeyaçık şekilde etiketlcnmelidir: Web görsel bir araç olnıasına ve tasarım
adları ve diğer bağıantılar herkes tarafından anlaşıhr olmalıdır (Niederst, 2003,
aynı
özellik beklenir. "Aynca sayfalann tümünün baştan sona gezilip
gerek yoktur. Ama dolaşımın bir parçası olduğu hissi verilmelidir.
istedikleri yere yönlendinnedc daha etkili olduğu görJImüştür. Bu :ri.\zden bölüm
bir sayfa üzerinde
yönlendinne elemanlarının görevinden emin olunması gerekir" (Timberlake, 26"04)
tıkIanacağı ve verimliliği dikkate alınmak zorundadır.
• Kullanıcı sımunalannda uzun ve tanımlayıcı metinlerin, ziyaretçileri gitmek
ve
zorundadır. Örneğin ikinci sayfadan doğrudan ana sayfaya dönme bağlantısı varsa, diğer
bir şekilde ula,,;;malarını sağlamak v~
bulmaktadırlar.
araçlarının, görünüm
site boyunca tutarlı olması oldukça önemlidir (Niederst, 2003, s.380).
içerikten ayn tutulmalıdır. Düğmeterin 3 boyutlu tlklanabilir olarak görünmesine
için görsel ipuçları belirtmesine rağmen, kullanıcılar hilla yonal.nt 'sözcüklerle'
olmalıdır.
tahmin edilebilir ve güvenilir
Sonuç olarak web sitelerinde yönlendirme
araçlann seçimi,
araçları
site
dolaşıımm etkilemektedir.
Bu
kullanılan renkler, yerleştirme yerlerindeki tutarlılık, kolay algılamlırlığı,
okunurluğu ve öğrenilebilirliğiile
iyi bir dolaşım için önemlidir. Bütün bunlar
Yönlendirme için görüntülere güvcnilmemesi gerekir. Eğer bir resim yüzlerce kelimenin
ziyaretçilerin üç
tıklamada aradıkları şeyi
ycrini tutarsa, içeriksiz bir imajın da binlerce anlamı olacaktır (Timberlake, 2004).
aradıklarını hızlı
bir
şekilde
bulmalan içindir.
Eğer kWlamcılar sitede
bulamazlarsa siteyi hemen terk ederler,
Simgeler tek başına zayıfbir iletişim sağlarlar, Eğer imge kullanmak gerekiyorsa, açık ve
anlaşıhr olmasına dikkat edilmelidir. İmgelerin yanı sıra sayfada, yönlendirmeyi
,. "mu" bulunmalıdır (Nieders! 2003 s.379-380). Kiiaaüicilar ai'"wıi<l
sag-i ayaea k mei·ın suru
'
,
··
,.
til··
,.
tarayacaklarsa
o
•
yapark en gorun yu deg-ı'l metinleri taramaktadırlar.Eğer oöruntüvü
görüntü adı ona göre verilmelidir (Timberla.\.e, 2004).
2.(,
WEB SAYFALARINDAARADlCINI KOLAY BULA1ÜLME
İnternet ortamında milyonlarca web sayfası bulumnaktadır. Kullamcılar gereksinim
duydukları bilgi,
belgeye ulaşmak için önceliklc arama motodannda (Yahoo, Google gibi)
anahtarkelimeleri yazarak araştınna yapmaktadır. Arama motorlan, .mahtar kelimelerin
sitelerindc bol miktarda animasyon ve görüntü kullanılmaktadır. çözü.m,
bUlunduğu web sitelerini listelemektedir. Kullanıcı bu listeden ilgili web sitesi bağlantısını
kitlesine
tıklayarak aradığı
bilgiye ulaşabilmeletedir.
için en uygun yüklenme
Yüklenme zamanım kısaltm3ya yarayacak
Kullanıcılar aradığı bilgiyi kolay bulabilmek için araştırma yapıyorsa, web sitesi sahipleri
•
de kolay bulunabilme ile ilgili çalışmalar yapmak zorundadır. liEğer bir web sitesi
ipuçları
(Kemalumal, 2005):
yüklenen büyük resim dosyalanndan kaçınılmalı, eğer sitede büyük
kutlamlması
gerekiyorsa, o zaman, büyük resimlerin
• Çok fazla animasyoulu
gelmeyeceklerdir. Web siteleri, e-magazinler, banner (şerit) reklamlan, ödüllü sitelec alt
grafıleler kullamlmümalı,
• Grafiklerin görüntü kalitesi ve boyutu
dizinler, arama motorlan ve başka siteden bağlantılar aracılığıyla çevirim içi
ayarlanmalı,
• Gereksiz program kodlamasından kaçınılmalı,
tutundurulurlar (Grantastiedesigns, 2005e). Aynca geleneksel reklam yöntemleriyle
~ Sayfaların
reklamlar, radyo, tclevizyon, broşür gibi)
KB
değeri
mümkün
olduğu
kadar küçük
tutulmalı,
• Çok fazla Javascript kullanılmamalımr.
Günümüzde birçok kuruluş, televizyon, radyo ve diğer iletişim araçları ile web sitelerine
Eğer
sayfasının
bir web
yüklenmesi uzlul sürerse,
kullanıcı
(okuyucu, ya da ümit edilen
müşteri)
beklemez. Bu dumm ise sitenin kullanışsız olduğu,
boş
yere
zedeler.
yatırım yapıldığı anlamımı
akademisyenler de kendi kütüphanelerinin web sayfalan üzerinden bu e-yayınlara
2.8
WEB SAYFALARINDAERİşiLEBiLİRLİK
ulaşmakta ve araştınnalarını yapmaktadırlar.
Erişilebilirlik, öncelilde
daha farklıdır. Elektronik yayınların kolay bulunabilirliği o yayının uluslararası c-yayın
küçültülmüş
• Kesinlikle çok fazla grafik ve / veya b:mnerlar kullanmaktan kaçınılınalı,
hem de çevrim dışı ohrrak tıirlilete tutundunna çalışmalan yapılmadıkça insanlar s!teye
Web sitelerinde kolay bulunabilirlik için, site içeriğini yansıtıcı anahtar kelime iyi
seçilmeli ve arama motorlarına da kayıtlı olmalıdır. Elektronik yayınlarda ise durum biraz
geniş kullaTIlcı
zamanını bulmaktır.
(thumbnail) olanlan kullanılmalıdır.
kummların ve şirkellerin çoğunda bu yaygın ama yanlış inanış vardır. Site hem çevrim içi
yönlendinne yapmaktadır (garanti.com.tr gibi).
Yavaş
boyutlu bir resim
yaptıysam, kullanıcılar gelirler" mantığı yanlış bir mantıktır. İnternet'e yeni giren
tutundumıa çahşmaları yapılabilir (basılı
ulaşabilmek
amacını
ortaya koyamadığı,
gelir. Bu da kumru ya da kişilerin marka niteliğini
ve e-kütüphane dizinlerine ginnesiyle sağlanır. Kütüphaneler, e-yayınlara abone olmakta,
web site tasanınmdan daha çok mimarı düşünce yapısı ile ilgili bir
terim olarak karşımıza çıkmaktadır. Mimaride,
2.7
WEB SAYFALARıNDAHıZLı İNDİRİLEBİLIRLİK
Web sitesi kullanıcılannın üzerine yapılan araştumalarda, eğer sayfalann çoğu lS
saniyede indirilemezse ziyaretçilerin web sayfaya olan ilgisinin dağıldığı ve siteyi terk
ettiği görl11mektedir. çoğu artistik web sayfaıan yüklenme "lamanı UZlın sürdüğü için
girişte eğlendinci animasyon kullannıaktadır.
engelE insanlar da düşünülmektedir.
rampalannı, arabaları
için
zorundadır
asansörleri, binalara girebilecekleri özel yer1cri,
ve gereksinimlerini
karşılayabilecek olanakları sağlamak
tasarımlar yapılarak diğer kullanıcıların
çalışılmaktadır. Web
boyutu metin, resim, flash, ve java gibi desteklenen dosya boyutlarının toplamıyla
sitelerine
açıklanır. Sayfadaki görsel elemanlar yayır. yapan sunucudem kullanıcınır. bilgisayanna
Birliği
yüklendikten sonra görürunektedlr. Yüklenme hızııun düşürülmesi için animasyon ve
Berners Lee;
erişebilirliği anlamına
siteleri için
gelmektedir.
("W3C" World Wide Web
gereksinimleri
crişilebilirlik 'büt.i.in' kııllarucıl:ınn
Diğer
web
bir deyişle, Dünya Bilgisayar Ağları
Consoniıım) W3C'nin
"erişilebilirliği, kullanıcıların engelliliğini
yöneticisi ve kurucusu olan Tim
önemsemeksizin bütün
kullamclIar tarafından erişilebilirlik" olarak tanımlamıştır (Webnauts, 2005).
özelliği,
Web sayfasının işlev ve içeriğine göre animasyon ve resim ktıllanılmaktadır. Bilimsel
Weblin en belirgin
içerikli web sayfalarında anİmasyoi>. az kullanılırken moda, alışveriş merkezi gibi web
erişebilıneyi sağlamaktır.
in
sürecinde normal insanlar yanLOda
(Wetmauts, 2005). Günümüzde araç ve gereçler bütiin kuBamcılar düşünülerek
tasarlanmakta ya da özel
gerekIT.
parlelarını,
insaıılarla iletişim sağlayabilecek
giderilmeye
boyutlannın ayarlanması
tasarım
yasalarla binalarda engelliler için minimum
ölçünler belirlenmektedir. Yeni binalar, engelli kulhmıcılar için ıekerlekli sandalye
Yükleme zamanım etkileyen öge, görsel elemanların dosya boyutudur. Web sayfasının
görüntülerin dosya
Ayrıca
fiziksel ve teknolojik
okumayı
Web, görsel bir araç olarak
önemsemeksizin bilgiye
göriHdtiğü için, tasanının amaçları
731
aynı
zamanda
erişilebilirliğinamaçlarını oluşturoıaktadır.Tasarımcılar, estetik
değişik çoklu
sayfalar tasarlayabilmek için büyük imgeleri,
görüntü ve video vb.) ve
bileşik
sayfa taslakImm
birlikte web siteleri bilgi aktan mı ve tasanm
görsel kontrole
rağmen
araçlannı
ortam
dolaşımsal
işlevsel
(ses, hareketli
kullanmışlardır.Erişilebilirlikkaygısıyla
açısından olgunluğa nlaşmı~tır. "HTML"
ulaşıp olgunlaşmasıyla birlikte; tasarımcılar, birtakım küçük
daha yapısal ve
ve
in
Pavka'ya göre erişilebilirliği sağlama.ıl1il eı} önemli yolu site içinde tutarlı biı
kurmaktır.
Bunu sağbrken imgelere
alt çizgili sözcüklerin reuklerinin
kullanılacaksa imgelerin
web siteleri yaraunak için uğraşmaktadırlar (Lynch ve
açısından önemlidir. Fonların ölçüsü web
desteklenmediği için
Erişilebilirlik Öncüsü (Web Accessibility Initiative WAI) ve "U,S. Bölüm 508 rehber"
(U.S. Section 508 Guidelines) engelli kullanıcıların web'de
sürdürrnekte aym zamanda rehberlik e:tmektediL
uyguladıkları, web erişilebilirlik
Ayrıca
erişimi için
gerekli
birçok ülke, hükümet
rehberleri ile engellilere çözüm
çalışmalan
siteleıine
sunmaktadır (Pavka,
2005).
gelişmesine rağmen birçok tasarımc! ruHanıcılann teknik,
durumlarını göz ardı
etmektedir.
Bazı kullanıcıların fizikselortamları ile
kullanılan
dikkat edilmesi gereken sonln rengin
kullanılması gerekiyorsa:
seçildiği zaman,
da
renk kö:rü
yeteneği
az olan kullanıcılar,
körlüğüne çözüm
taşıyan
içeriği
etkileyebilmektedir.
Konuşma gibi b,ızı
bilişsel, duyuşsal ve hareketliliği iyennektedir.
yetersizlikler kişinin web
yetersizlik dereceleri
değişmekte ya
tasarımcılarının, normal kullanıeılar dışında
farldı
önerileri getirmi·5tir.
çeşitli
tasarım
açısından bu
hağlantılar, fontlar,
sıtesinin eriı;;iiebiiirliğini
farklı yapıdaki
ile göstcnnektedir
ise
eklentileri (plug ins)
sağlamaktadır. Web sayfasının içerik
(Okuma yazma zorluğu olan) ve
öğrenme 20rluğu
açık dil kullanılmalıdır.
iki gurup dikkate
Gerek tipografik, gerekse sayfa
almmalıdır. Aynca
sitedeki görsel elemanların
10-12
yaşlnda
bir çocuk
işlevini doğru algılayamıyorsa,
üzerinde yeniden dÜ5ünü!mesi gerekmektedir (Pavka, 2005).
Web sitelerinde:
engelli kullanıcıların ihtiyaçlannı
Web tasanmında erişilebilirtikte anahtar kelimeler; basitlik, görecelik ve
(Pavka, 2005) yapmış olduğu bir
şeması
düşünülmeli onlarında erişimini sağlayacak önlemler alınmalıdır. Sitc
attığında, eğer
iletişimdir.
tablolar. renk gibi
aril.ii.1naktadlL Aiütra Pavka,
araştırnıada erişlebilirlikle ilgili
sık sık
yeni pencere açan sayfalar da
bağiantılarda site kimliğini yansıtacak
bağlantının yeni
sorunlann giderilmesi de web
"BT2s" renk
olabilmektedir (Pavka, 2005).
anlamak ve destelernek sonımIuluğu da vardır (Lynch ve Horton, 2004a).
ve
uyumu oldukça önemlidir. Site için renk
web sitesidir. Bu kaynakta, en yaygın olan kırmızı yeşil renk
olacak
engelliler dc
siteye göz
kullanımını etkilememektedir. Kullanıcıların
da yetersizlikleri
özelliğin dıı;;ında eşdeğer/ilik/er, dolaşım
dikkat edilmesi gerekmektedir. Renk körii
En önemli kaynaklardan birisi kullanılan renklerin
için uygun, basit ve
düzenlemesi
önemli yetersizlik kategorileri;
düşünülürse, renk
planlaması yapıldığında, dysiexia
o Anlama ve öğrenme zorluğu ol:::m kullanıcıların (dyslexia) (Webnauts, 2005)
eriı;;imi
kullanımıdıL Kullanıcıya bir iletiyı aktan'i.ıak için
şeye
(http://innovate.bt.eomlpeople/rigdence/coloıırs/colours2.html).
Diğeri
.. Motor \ fiziksel engeli olan kullanıcılar,
da
birkaç
kullanıcılar tarafından nasıl algılandığını
www.vishcheck.conı
.. Duyma engeli olan kullanıı:ılar,
kişisel sorunlan
yüzdelik ölçü kullanılmalıdır.
edilmelidir. Web'de renk körü kullanıeılarınauygun site tasanmına yardımcı olacak çok
çeşitli kaynaklar vardır.
• Renk körleri ve görme
ayarlarında da
bu renklerin renk köıii kullanıcılartarafından nasıl görüleceği kontrol
kullanılması ve yiiksek / az ışıklı yerlerde İnternet ulaşımı web sayfalarına erişimi etkiler.
biryok engelli kullanıcının;
tablolarm
biçimlendinnesi (mark up) gerekir. Erişilebilirliği sağlamada dolaşımdan SQnra en fazla
ilgili sorunlan; en son çıkan gratik tarayıcılannınkullanılmaması,yavaş modemlerin
Web
sayfalannda iki şekilde be1irlenebilnıektedir biri
Veri tabanIanna ulaşılabilirlik ve kullanılırlık için tabloların dikkatli bir şekilde
kullanıcılann olduğu
Web teknolojisi, gün geçtikçe
Diğer
eklenmdidİr. Web
ölçüsünün ayaTIanması da erişilebilirlik
ölçü olarak yüzdeliklerin kullanılması tavsiye edilmektedir. Çize1ge
bilgileri ve içerik için
renk
yanı sıra
içerik içindeki
imge bağlantılan
"Em's"* diğeri ise yüzdelik ölyü birimidir. lntemet Explorer Em's problemleri olduğu ve
Dünya Bilgisayar Ağları Birliği'nin ("W3C" i World Wide Web Consortium) Web
Bunun
yanma eşdeğerliğini destekleyiü metinler
sİtesinde kullanılan yazı karakterinİn (fontun)
engellere
Horton,2004a).
fiziksel ve ruhsal
dayalı bağlantılardan kaçınılması ve
değiştiıilmemesi gerekmektedir. Eğcr
ı3;]~aşım ağ1
Bu üç
erişimi
etkilemektedir. Bu tür
imgelerin bulunması gerekir.
bir sayfada açılmasına hazırlıklı olmayabilir.
kullanan bir kullanıcı için yeni
Daha da önemlisi
Kullanıcılar
Ayrıca
geri (back)
tuşunu
açılan pencereler kullanılabilirlikbaşarısını düşürecektir.
yanlışlıkla farklı pencerelerin kapatılması da
sorunlara neden olabilir
(Pavka,2005).
sorunlara çözüm
Eın's font ölçü birimidir. Intemet Explorer "Em's"i piksel olarak
1.25 piksel olarak kullanılmaktadır.
"
değerlendirmekte ve ı
.25 Em's,
Belirli süre
arahklarında
kaçınılmalıdır. Hızlı etişimi
güçleşmektedir.
Web
olmi'lyan kullanıcılar için bu tür sitelere
Yine de kendini belli
kullanıcıyı uyarınalı
3. BÖLÜM
özdevimli (automatic) yenilenen sayfalar oluştunnaktan
aralıklarla
yenileyen web
erişim
ELEKTRONİKYAYıNLARDAGRAFİK TASARIM
sayfası yapılacaksa,
ve mümkünse onlara daha çok zaman tanımalıdır.
sayfalannın erişilebilirliği sağlandığı zaman kullanıcı
ve
SORUNLARI
sağlayıcı açısmdan
birçok
yararları vardır;
3.1
Kullanıcılann erişilebilirlikten
elde
ettiği
yararlar: Her kullanıcı
işitsel.
fiziksel,
bilişsel
sorunlan ve teknolojik. engelleri önemsemeksizin şunları yapabilirler: rahat bir şekilde
bilgiye
erişir.
scrvisleri
kullanır.
ürün alır ve ilgili kişilcrle
iletişim
kurabilir (Webnauts,
2005).
kitaplarının
çok bütün
ayrıntılanyla
1993. s.91). Emre Becer ise layout'u
Kullanıcı kavrayışını arttırma,
•
Yeterliliğini
iletişimi sağlayacak şekilde
Q
Saygınlığını arttırına
süreklihğini geliştmne,
• Yasal gereksinimleri
birçok yararlar
ve memnuniyeti
arturoıa
(Webnauts. 2005) gibi
sağlamaktadır.
ihmal edilen bir unsurdur.
güçlüklere dikkat etmemekte, bu durum da
çoğu taSMırncı
kullanıcıların
siteyi terk
(alıcı)
iletiyi daha kolay
amacı
Smİth
(Smith, 1986, s.25) iyi bir layout'un
tüm çalışmalar, çabalar. para ve zaman boşa gitmiş otur. Web siıesinin erişüebilir1iği
sınanınalı, tasarım
layout'un taslak
yayınlanma aşamasında
kullanıcıların erişebileceği bir
site
hatalar en az düzeye
tasarlanmalıdır.
İndirilmeli
ve tüm
algllamasıll1
layout. görsel elemanlann
Eğer
layout içeriği başarılı
algılar.
bileşenlerini, tasanmı bozmadan. iddialı bir
kullanmadan ya da metnin
ve
sürecinde
kaynaklarda sayfa düzeni
bilgiyi iletmeyi kolayıaştınp, ilgiyle izleniten materyal
göre sistematik bir biçimde sunulması ile
olmazsa iletişim de olmaz ve yapılan
işidir"
haline getirmektir.
sırasına
erişim
Kısaca
vurguya göre organize edilmesidir.
göıiintü
etmelerine neden olmaktadır. Sonuç olarak,
Bazı
anlamda,
Bilgiyi estetik ve işlevsel açıdan sunmak için yapılan eylemlerin hepsi layout'a (sayfa
düzenine) girer. Layout'un
sayfalanııa erişim tasanmeılar tarafından
erişimde yaşanan
2005, s.75).
yönelik bir işlemdir (Şeker, 2004, s.3).
bir şekilde desteklerse, izleyici
geliştiroıe.
geliştirme
"geniş
olarak da geçen layout, okunm yazıyı ve görsel malzemeleri en az çabayla
•
ve
göre
tasarımın görselleştirilmesi
adlandımnştır (Becer,
sağlamaya
ve
Pektaş'a
şekillerin
bir tasanmı anlatmak için taslak biçiminde göstermek
sunulan taslaklar olarak
yararl.u ise:
sözlüklerinde, sayfa üzerinde metin, görüntii ve
düzenlenmesi olarak geçen Layout (Cotton, 1990, s. i 86),
(pektaş,
Sağlayıcıların erişilebilirlikten elde ettiği
Web
LAYOUT SORUNU
Grafik tasanm
okunurluğunu
dikkate almadan,
açıklar.
vurguların
önem
Smith bu görüşüyle daha çok
aşamasını V\ırgulamaya çalışmıştır.
Desen ve resimde kompozisyon olarak adlandınlan şey tasarımda layout'ttır. Görsel
organizasyonun, layout, kompozisyon olarak adlandınlması genellemel tasarım
uygulamalarına göre
belirlenir. Güzel sanatlarla
birbirlerine benzer, ama
yapıldığına bakılması
farklılaşmaktadır
salonlarında
rolc sahip
gerekir.
Sanatçı
tasann;, yapar. Bu yönü ik
noktalan bulunmaktadır.
Sanat ve tasanmın kimler için
Tasarım, iletişim aracı olduğu
(Smith, 1986, s.26).
farklı düşünüIse
uğraşanlarla, tasanmcılar kısmen
değildirler.
oranda sanattan
bireyselolarak kendi iletisini sergi
izleyicisi ile paylaşır. Tasaruncı ise
doğrultusunda
eserinden
aynı
tasarlayacağı
tasarıınCi ve
ürün ya da iletinin
tasur:m.1 üi'Ün"ii,
S<iu.atçı
amacı
ve sanat
de her iki::;i de bir iletiyi estetik kaygılarla aktaracağı için ortak
göıüntü
Tasanm ürünlerinde, metin, logo,
layoufun taslak aşamasında karar verilir.
vb. grafik
Tasanıncı
elemanların nasıl yerleştirileceğine
önem
sırasına
düzenler. Taslak aşaması sayfa bitmeden sorunların önceden
Kompozisyonun genel
yapısına
basılı
ürünlerin yanı
sıra
dolayıdır (A,
sayfalarında da
web
"kimlik kazandınnakta, okuyucuya aradığını kolay bulabilmesini
de kmeI
yerleş.im değişmeyerek izleyiciye
dinamik düzenlemeleri kullanma eğilimindedir. Bu sitelerin layout'larındaki biçimsel
dengenin başarısı, alfabetik karakterlere ve harflere benzeyen ekran taslaklan olmasından
saptanmasına yarar.
bu aşamada karar verilir.
Layout dergi, gazete, kitap gibi
değişse
göre bu elemanlan
Sanat ve rekbmla ilgili bazı web siteleri, kullanıcının d.ikkatini çekecek resmi olmayan
X, C, B, D, Y, E, O, Z, gibi) (Edtech.vt, 2005).
,
tasanma
sağlamakta, içerik
görsel bütünlük sunmaktadır" (Şeker,
:"
~ IItttll.L~ ;~.:::
~.~
~
__
~._.
:=::-
::-~ ·f~tfr\tM
-O"'
.... _---.-
•
_._-
-..l" •
""""""'"
2004, sA).
Smith, tasarlanan materyalde kullaI11lan grafik elemanlann renk, biçim ve beyaz
farklı
alternatifte düzenlenebileceğini belirtmekte, sonsuz önerilerin
vurguıamaktadır
Basılı yayın
boşluğun
getirilebileceğini de
(Smith, 1986, s.35)
organlannda,
iletişim aracının yapısına ve
hedefkitlenin durumuna göre
layout değişmektedir. Aynı durum web için de geçerlidir. Web
layout'lar hazırlanmaktadır.Reklam,
tanıtım, kişisel,
web siteleri ile içerik agırbklı e-dergiler ve
(Görüntü: 37). Görüntü
ağılıklı sitelerde
anakapılannın
..
sayfalarında içeriğe göre
magazinsel gibi görüntü
ağırlıklı
(portaI) düzenlemeleri
ekran yapısma göre
C_."_
ıı:,T,"jjii?'i- AA~@iii}>i$fB.%g-b,;c;_#
sınırsız
farklıdu
düzenleme alternatifi
varken e-dergiler ve içerik. anakapılanmn düzenlemesi sınırlıdır. İçerik sitelerinde dolaşım
ve metnin yerleri hemen hemen birbirlerine benzemektedir (Göriintü: 38-39).
(Görüntü: 38-39) Birbirine benzeyen içerik siteleri örnekleri; Sabah ve Hürriyet gazetesi web sayfalan
(hurriyet, 2006 ve Sabah. 2006)
Bazı
sitelerde görsel elemanlar hadlerin biç.imine benzer biçimde yerleştirilir. "O" harfi
şeklinde yerleştirilebileceği gibi, "B" şeklinde de yerle)lirehilir. Free ride
(wvıw.freeride.com)örneğinde ekran dengesi "O" harfine benzer yapıda yerleştirilmiştir.
Aynı şekilde The Science Learning Network (W\\,.-w,sln.org) sitesinde görsel elemanlar
~~'!l=tbfi)&'.,km}rC~~@N}lltiŞ!&;;bjJliJA
C'~,"
~,.,
,_
".h. . . . . .
~",,,,,
•.".'
"O" harline benzeyen dairesel biçimde yerleştirilmiştir(Göriintü:4ü-41), Reef web
sitesinde İse ana sa)fadaki görsel elemanlarınyerleşim biçimi
(GörüntüA2) (Edteçh.vt, 2005).
..
n."",.,.
S"
",""
~
:.~-.'.').
~
,,'
,~.;
.
F=.. ~._; :'rij91
~
,~.,
~
;;:;o;m;ıı\
,~.".
~~
ıP;c,,",:l>ı,
•.
I.'
_.
"
.~
b
«
1'5'-':'
:#
The Ultimale Internet Wa;1(eUng Vehicle
(Görüntü:37) Coolhomepages sitesi değişlk layout örneklerinin bulunduğu bir sitedir. İçeriğe göre
değişen farklı layout örnekleri görülmektedir (Coolhomepages, 2006).
[78
"z" bartine benzemektedir
~OWj.f,..,.~,
, ........ $ . , . ._
.... ~_
, LU
".;~""'. . .,""
. ....
'--,.d"';
...-
.ııwt
"""'~
,,-c
(Görüntü:40-41) Free Ride ve The Science Learning Network web sitesi "O" tipi yerleştirme düzeni,
(Edteeh.vt, "005).
dağıtaçağından
tercih edilmemektedir (Kaptan, 2000, 8.33).
İçerik ağırlıklı çoğu web siteleri birhirine henzemektedir. Stockholm Üniversitesinden
Palme, içerik sitelerinin benzerliğini şu şekilde açıklar; "İnsanlar çoğu web sayfasını bir
ölçüde bir birine benzediği için kopya zanuetmektedirler.
sadelik, kolay
kullanım, dolaşım gibi
yapının temelinde
henzerlikler,
basitlik ve layout'un insanlar tarafın kolayanlaşılmasıyatar.
Gazete ve içerik ağırhklı sitelerdeki yapıya örnek olarak
yayınlaTh.1.il New
Yapısal açıdan bazı
özelliklerden dolayıdır" (Palrne, 2003). Bu yaygın
a.~ğıda
17
aralık
2002 tarihinde
Yark Times gazeresinin sayfa yapısı verilmiştir. Palnıe bu sitenin niçin üç
sütllna bölündüğünü göıürrtü üzerindeki parçalanmalada göstererek açı.klaımştır'(Göri'mtü: 45).
(Görüntü: 42)Reefweb sitesinin ana sayfasında görsel elemanlar "z" harfıne benzeyen bir biçimde
yerleştirıhniştir, (Edtecll.'lt, 2005)
Tasanm yüzeyi, yani ekranın boyutu layoufu etkilese de görüntü ağırlıklı tasanmlarda
sayısız seçenek fuetilmektediL Moda, eğlence ve oyun sektörüne yönelik Flash
programında tasarlanan ve .swf uzantıh sitelerin düzenlemekünde sınırlama yoktur
(Görüntü: 43~44). Tasanm ölçüsünde esnek olunmakla birlikte çoklu ortam olanaklan
atabildiğincekullanılmaktadır.
,
..
)J
.'4..
1},.
~1;:'
:}
~-
Gene/ı;kle
yOnlt:Tldiıme
(Görüntü:43.44) Cabedge kişisel web sayfası (soldaki) ve modaya yönelik co3eh web sayfası
{sağdaki! her ikl5inde de farklı layout düzeni ile yapılmıştır (Calledge, 2006 ve Coach. 2006).
aror1annı
1-
içenr.
Ana me/m
ortasütımdu"~'eBirs(İ1J' ,')ağsütund;I,Anıamefnı
60-80 haifgemşlığındedir.
i ~~~ekleyen ek yazılarve
---.J.:ıcrbul""""W'
---"------
(Görüntü: 45)
~ew York
Times gazetesinin sayfa düzeni (Pa/me, 2(03).
Metin ağırlıklı site düzenlemelerinde bilginin aktanmı daha önemlidir. Metin, tasanının
odak noktasına, diğer görsel elemanlar tanıfindan okunurIuğu azaltmayacak şekilde
yerleştiriliL Vurgulama ve algılanırlık metne göre ayarlanır, fotoğrafve diğer gö~~l~r.in
boyutları küçük tutularak öncelik metne verilir. Hareketli görüntüler okuyucunun ılgısını
180
New York Times web
sayfasının metin yapısı, çoğu
yapıdadır. Benzer ~itelerde
web
de genellikle 3 ya da 4 sütun
sİtesİnde bulunan yaygın
kullanılmaktadır.Bu
sitede
aııa
SI
i
metin orta şütunda, yönlendirme bilgileri sol sütunda, ana metinle ilgili okumalar da, sağ
3.1.1
sOtunda buımaktadır (Palme, 2003).
Layout'un oluşumunu etkileyen en önemli
Layout hazırlarken bütün ve parçalar arasındaki ilişkiye dikkat edilmelidir. Kompozisyon
hazırlanırken görsel malzemeler yazı, resim ve grafık parçalanmalar hepsi bir birini
etkilemektedir. Önemli olan iletilmek istenen' içeriğin dunnnuna göre ya da algılatmak
istediğimizin biçimlerin sıralamasına göre layout'ta değişiklikleryapmaktır (Smith, 1986,
s.45).
"Layout'ta ilgiyi sağlayan öğelerin ağırlığı, güeü önemlidir. Biçİmlerin büyüklüğii,
geometrik yapıları, renkleri, merkezden uzaklığı. layout'ta ağırlık sağlayan etmenlerdir.
Bunların azhğı ya da çokluğu dilckat çekmede önemli roloynar" (Pektaş, 1993, s.9l).
Görsel ağırlığın odak noktada toplanması kul1anıcıyı/okuyucuyumetne bağlar. Görsel
merkez denilen; tasarımın odak noktası, ekranın gerçek merkezinin biraz üstüdür (Ekran
üç'e bölündüğündc yukarıdan üçte birlik kısım, odak noktaya daha yakın değeri içerir). E-
Layout'un Görsel
yapısına
Görsel
göre
Hiyerarşisi
öğelerden
olan "Görsel
Hiyerarşin içeriğin
şekillemuektedir.
hiyerarşi, algılanmak
istenilenleri önceliklerine göre
sıralarnaktır. Web
sayfa
tasarımında içeriğin mantıklı şekilde aktanmı için sağlam ve tutarlı bir görsel hi;erarşi
oluştı.ınılma~a
gerekir. Web
sayfaları diğer grafık üriinleri
gibi ilk bakışta görünmemekte
ve sayfa ilk obrd sol üst köşeden açılmaktadır. Bu yüzden öncelikle oÖlÜlmesi istenilen
şeylerin sol başa alınması gerekir.
'='
Kullanıcılar öncelikle
bir zemin üzerinde görünen büyük
algılarlar.
Bundan sonra
başlarıar.
Son
eğer
şekilkri ve
renk alanlarını
varsa grafiklerden başlayarak belirli bilgileri
aşamada ise yazı elemanlarını algılayıp,
tanımlamaya
tek tek sözcük ve paragranan
seçerler (Lynch ve Horton, 2004d) (G.örüntü: 46). Yüksek
hızda bağlantı sağlayan
modemler sayesinde bu durum aşılmaya çalışılmaktadır.
yayınıarda içerik ve başlık odak noktaya yerleştirilirse daha etkin olur.
S::ıVh y:ıpl!3ınin gön.1 nr;ınm ııının ~fımıl,uı
Layout'larda hareket dikkat çekici bir roloynar. İkon, resim ve geometrik biçimlerin
büyüklüğü; yönü hareketi sağlayan öğelerdir. "İnsanlar, genellikle büyük biçimlere, yazı
ve boşluklara bakarlar. Hareketin başlangıç noktası buralar olmalıdır" (Pektaş, i 99.3, s.9 1).
Hareket izleyicinin ilgisini çekeceği gibi algıyı da diri tutar. Açık kapı gibidir. okuyı.1Cuyu
metin ve görüntii üzerine davet eder.
Tas::mmda gözü çekmek için görsel elemanın yönünü, yerleşim biçiminin ve yerinin
değiştirilmesi gerekir. İzleyicinin ilgisi tasanma doğru bu şekilde çekilebilir. Gerçek
yaşamda da hareket eden şeyler dikkat çeker. Bu yiyecek ya da tehdit eden bir şeyolabilir.
(Görüntü: 40)
1
Kullanıcının sayfayı
görsel taraması aşama aşama gerçekleşir (Lynch ve Horton, 2004d).
insan beyni, gözün dış kenanndan görüş merkezine doğru hareket eden şeylere eevap
vermek üzere ayarlanmıştır. Hareket ve hareketi çağrıştıran devingen çizgiler dikkat çeker.
Batı'da
insanlar soldan sağa, yukardan
Örneğin düz çizgilere göre çapraz ve eğik çizgiler daha dikkat çekicidir.
okurun
ekranın ~ol
Düz tekdüze bir sayfa düzenlemesi yerine. bir odak noktası tarunılanacak şekilde dengeli
degışse
de hep sabittir (Lynch ve Horton, 2004d). Bütün
ve orantılı görsel zıtlıklar taşıyan düzenlemeler kullanıcının gözünü daha iyi yönlendirir
(Üstündağ, 1999, s.54). Ama, monotonluktan kurtarırken "byout'u meydana getiren öğeler
dengesizce yerleştirilmemdidir yoksa ilgi oagıijl", göz saga 5013. kaç,u. Öğckr zıt olsalar
bile kendi içinde uyuşmalı, düzen içinde olmalıdır" (Pektaş, 1993, s.9l). Düzen ve
bütünliik. web sayfasının rahat izlenilmesine yardım eder.
üst
aşağıya doğıl.ı
köşesinde sayfayı
okuma yaparlar.
Sayfanın başlan gı cı
çözmeye başladığı noktadır. Sayfa ilk olarak sol
üs~~öşeden görünmeye başlar. HTML bu yolla yapılandırıldığı için saYf~ının ölçüsü
içerİk
sayfalann görsel
hiye~şiler~ baş~~gı~a gö~e düzenlendiği söylenebilir. izleyen akış sol üst köşeden sağ
alt koşeyedır. Dıger bır deyışle soldan sağa döngü, yukardan aşağıya doğru bir döngü
DluşuL
5.
,",-şağıda soldaki göriintüde Eonic web sitesinin (http://wwvr.eonic.co.ukI) ilk hali
~örülmektedir (Görüntü: 47-48 soldaki). Sitenin logosu sağa yerleştirilmiştir. Erişim hızı
İçerik
6. Ait
ve bulunduğu bölüme ait olan her şeyi kapsayan bölge.
olduğu bölüm
yavaş olan İnternet bağlantılannda sayfa ilk. açılmaya başladığ\nda sitenin kime ait olduğu
görünmeyeceği için logonun sağda kullanılmamamsında yarar vardır. Aynca Batı
kültüründe okumalann soldan başladığı düşünülürse yine logonun sonradan fark edi\ecegi
gözardı edilmemelidir. Sonradan site tekrar tasarlaıUlllş ve Iogo sola yerleştirilmiştir
3.
.,....~
Ç~/c;.-T,",
dolaşırnı sağlayan bağlantıları İçerir.
2.[Site~!eveJ. navigçıt;cn
1. Site [Sıte LDL
(Görüntü: 47-48, sağdaki).
içindeki
7 ve 8. Sayfa içeriği ve başlığın bulunduğu bölgedir.
Site section
i
~;!:,\'};t.'·t;::;;;l
ıD]
&function]
st-leveı
4.[Section navigation (1
na'l)]
5. This section
i
6. [Section nav]
(2nd-level)
i
7. Page title
ı
6. Page contents
L
(Görüntü: 47~48) Eonic web si.tesinin ana sayfa görüntü~ıı (sol daki görüntü sitenin ilk hali
(Webdesignfromscratch, 20051), (sağdaki ıse sitenin güncenenmiş hali (Eonic, 2006)
İçerik sitelerinin klasik sayfa hiyerarşisi aşağıda maddeler halinde verilmiş, benzer
maddeler çizenek üzerinde ele gösterilmiştir (Görüntü:49). Aşağıdaki maddeler izlenirse,
görsel elemanlar arasında ilişki ve derecelendirmeler için kolay bir layout oluşturulabilir.
Verilen bilgiler kuralolarak algılanınamalı, içerik sitelerinde kullanılabilecek bir öneridir
i
i
[Site~level
i
navigation footer]
(Webdesignfromscrateh,200Sı).
Aşağıda verilen çizgeye göre klasik sayfa yapısının hiyerarşisi;
(Görüntü: 4.9) KI asik sayfa yapısı bilgi
hiyerarşisini
verecek şekilde gösteren çizge
(Webdesignfromscratch.20051),
ı. Site kimliği logosu sayfa açılırken ilk görünecek yer olan sol başa yerleştirilir.
2. İkinci bölge; Site içi arama, oturum açma gibi siteye ait işlev ve bazı dolaşım
araçlan sitenin logosumm bulunduğu kutucuğwı içinde olabilir.
3. Işlevaraçları ve bazı dolaşım araçlarından aşağıda bir ikincİ kimlik bölgesi;
seçili bölümÜTI nereye ait olduğunu anlatan oaşlığı vadır.
4. Dolaşım araçlarının bulunduğu bölüm; seçili bölüme benzer yerlere gidecek
dolüşım araçlarının bulu!1dnğı.ı düğnıelerin ycrleştiği yer.
851
A~ğLda g6tiilen Dubit sitesinin klasik layout uygulammanın açjklalTIas~ (Görüntü:50);
ı. na~langıç noktası olan sol üst köşede logo bulurıınakta,
2. Site içi oturuma açma fonksiyonun bulunduğu 2 numaralı bölge, site logosu ile aynı
boşlukta yer almaktadır.
3. Slte bölümünü gösteren sekme, ("Cormnunity" sekmesi gibi').
4, Site kimliğinin sağındaki birinci seviyede dolaşım araçlandır (community, chat
Kontrastlık,
kullanılır.
zıtlık
bir şeyi etraftaki
olarak açıklamaktadır. Ona göre;
önem verilmesi
5. Bölüm başlığının alt başlığı.
6. İkinci seviye dolaşım araçları (home pııge, blog, gallery). Bu dolaşım araçlan
daha çekici ve fark edilir hale getirmek için
Tasanınlar
"bazı öğelere
zıt1ık yaratır. Zıtltk, farklılıktır.
tonlarda, yönde olabilir"
vs.).
diğer şeylerden
Bir şey yüksek kontrastlıkla daha görülebilir olur.
(Pektaş,
Pektaş, kontrastlığı
veya fikirlere
ligiyi diri tutar.
diğerlerinden fazla
zıtlık,
ölçüde, renk ve
1993, s.91).
analiz edildiğinde yaygın olarak kontrastlık sorunları ile
yeteri kadar
görsel
kontrastlık kuIlanılmamakt::ı.
karşılaşılır.
Genellikle
ya da yüksek kontrast yapılan elemanlar doğru
seçilmemektedir.
bUlundukları bölümün biT parçasıdırlar.
Layout geliştinnek için
7, içeriğin başlığı,
8. içeriğin yayınlandığı alan (Webdesignfromscratch, 20051).
değerlendirirler (Küçüği.in zırtı
tasarımcılar öncelikle kontrastlığı ya
Tasanmcılar, kullanıcılara
ve
yardımcı olması
iyi
yapılmış
köşeli biçimli
açığın karşıtı
da karşıtlığın gü:çlerin'i
koyu gibi) (Smith, 19X6. 5.37).
sunucu üzerinde çaba sa....-f etmeden hızlı göz gezdirebihi"iekri
için kontrastlığı kullanırlar. Kontrasthk kullanılarak. bakılması kolay
web sayfalan. izleyicide
Aşağıda örneği
suliyeti
büyük,
canlı
ve yeniden yapılmış hissi
görülen www.getinspired.atweb
sayfası,
ana metnin
uyandırabilir.
etratınd::ı. sanmll
güzel bir layout'tur. Aynca dola.5ım düğmelerinin arkasında da bir figürün
gizlenmiştir.
Yinede bu web
sayfasında da bazı tasanın
sorunlan
bulunmakt::ı.dır
(Görüntü:5l-52). İlk olarak içeriği okutacak düzeyde kontrastltk bulunmamaktadır. Gri
metin gri arka plan üzerine
algılanırlığını
yerleştirilmiş,
yitirmesine neden
logo ve metnin aynı büyüklükte
olmuştm.
logosu sayfanın logosıından daha büyük ve
...
"
~.;;4
'ı'
"~~ ..
canlı
renklidir.
Doğnısu
'
taşımaktadır
"
"
' Iayout omegı
..
-'l ("'ehde<,'gnfromserateh.
20051)
(Göcüntii:50) Dubit web sitesı
(klasik
n
",
,
"" ,
..''' ,,'.
"-<'~",''''
,,'",
.
"""",,
içeriğ.e göre ayarlan~aktadır. Amaç i~eriği o~utmaksa
',"",',".'
." ..
,,~
.~,
Web sayfalarında görsel hiyerarşi
logonun
sitenin logosunun
büyük olmasıdır. Bu yüzden site için kummsal kimlik yaşamsal önem
(Webdesignfromscratch,2üü5ct),
,
olması
Bununla birlikte altta bulunan 'Get Firefox'
• '''d"",
,','~
~,,,,,,"~,~
,'o '"",'.. ,",' ,""."',,,,_
'.-go ..
~."'''' ~."
VUrgulanınak istenilen öğeler ona göre ayarlanmalıdır. Iyi hazırlanmışhıyerarşı,
,'
ct . b lmasını kolaylaştınr
okuyucunun gözünü tasarım üzerinde yönlendırır, ara ıgı şeyı u
.
3.1.2 Kontrastbk
Sayfa düzenlemelerinde vurgu ögesi olarak kullanılan kontrastlık; elemanlan ayıran,
ct'
tki
baSkın eleımını öne getiren, d..'ilia az ba:<ikın elemanı geri plana iten ve evıngen e
Yaratan yaygın temel tasarım ilkesidir.
186
(Göcüntü:51-52) Yetersiz bir kontrast örneği httpJ/www.getinspired.at/(soldaki). aynı sitenin
Kontrast değerleri ile oynanarak, düzeltilmiş hali (sağdaki) (Webdesignfromscratch, 2005d).
Layout'larda Kontrastlık Ölçümü
Aynı wcb sayfasının kontrast değerleri ile o)1lanarak bir kaç önemli deği~iklik
3.1.3
sağlanabilir, içcriği ayırmak için arka plan açılır, yönlendinne bağlantılankoyulaştmlır,
Çoklu ortam araçlarında kontrastltk ölçümü şaşıhk testi ve yazılımlar yardımı ile
site logosu büyütülerek site daha iyi hale getirilebilir. Basit tonal kontrastların arttırılması
yapıımaktadu.
ile site daha rahat taranabilir ve okunabilir hale getirilebilir.
Kontrastlıgın etkili
bir ölçümü şaşılık testi:
Şaşılık testi,
sayfadaki bütün kontrast
Kontrastlık, renklerİn kapladığı alanlar büyültiUüp-ki.içü1tülere"k, ton ve renkteki
dereceleIinı ölçmenin
farklıl1k1a.r arttmlarak ya da azaltılarak sağlanabileceği gibi kompozisyon içindeki görsel
bir oranında kapatılması gerekir. Böylece normal metin bulanık ve okunmaz bir hal alır.
elanıanlarının yönleri değiştiriıerek, biçimler büyütülüp küçültülerek oluşturolabilir.
Güçlü renklerin yanı sıra ışıklı ve koyu alanlar da
İyi bir ekran layout'u olan Amok sitesi 2/3 oranında bölunmeye rağmen, kontrast ayadan
yanlıştır (Görüntü:53). Yüksek kontrast alanlan daha önemli özeııikler için
yoludur. Bunu yapmak için göz kap~lannındörtte bir ya da üçte
bakıldığındayüksek kontrustlı alanlar
açığa çıkacaktır.
Bu şekilde
daha belirgin biçimde görülmektedir
(Webdesignfromscratch,2005d).
vurgulanınamıştır. Sol kenardaki reklam panelleri daha çok dikkat çekmekte ve içerikle
Yan sayfada görüntüsü bulunan Amok sitesine şaşılık testi uygulayıp, gözün odillandığı
ilgisi bulunmamaktadır. Sağ kenarda yüksek kontrast ve yana çapraz iki göriıııtü
yerler kontrol
edildiğinde. Gözün doğrudan iki
reklam;
z.lgıladığı sonucu çıkmakt;lt!!r
bulunmaktadır (Bunlar satış için tasarım şabİonlandır, sitenin içeriği ile ilişkili ama ana
(Görünru:53). Aşağıda ise kontrastlık açıdan iyi çözümlenmiş bir reklam şeridi
sayfanın odak. noktası değildir). Marka çubuğu alanındaki logo ve çiçek görüntüsü en zor
(banner)"lıxıd" gÖriHmektedir
(Görüntü:54)
(Webdesignfronıscralch,2005d).
algılananparçalardır. (Welxiesignfromscratch, 2005d). Tasanmı daha etkili yapmak için
sayfanın odak noktası planlanarak dikkat çekici kontrastlıklann eklenmesi gerekir. Ana
yönlendirmeler, sayfa bölüm başlıklan, site logosu açık ve anlaşılır olmalıdır. Sayfanın
geneli çok ışık olduğu için bu aydınlığı kırmak için ek bir koyuluğa gereksinim vardır.
Aynca sayfanın üzerindekı bölümlerin aydınlık ve koyıtluk değerleri oynanarak
algılanırlık yükseltilebilir. Dolaşım araçları ve de ikincil alanlann (kenar bağlantıları ve
reklamlar) içerikten ayırt edilmesi sağlanmalıdır. Sitellin işlevselliği kontrastlIk. değerleri
iyi
ayarlanması
ile
(Göıüntü:54) Kontrası değerleri iyi ayarlanmış lpod reklam şeriuı (banneri),
(Webdesignfromscratch,200Sd).
arttırabilir.
Kontrastlığın
gri tonlama yapılarak ölçülmesi:
KontrasdığJ denetlemenin
planla ön planın ışıkhklparlaklıkdcğcrlerinin ka.rşıla:;tmlmasıile olur.
yolu,
ı:ırka
Işık. değerleriildeki
farklılık kontrastın büyüklüğünü belirler.
Web Design from Scratch web
sayfasındanalınan görimtü
tonlamaya getirilip, renk. seçici ile
..
-
(Göıüntü:53) Kontrast değerleri çok düşük olan Amok sitesi, (Webdesignfromscratch, 2005d).
Photoshop programmda gri
parlaklık değerleri ölçülmüştür
(GÔrÜTItü:55). Ahmm
ekran görüntüsünde de görüldüğü gibi maksimum okuma için ana metin siyahibeyaz
kullanılmış. Belirli
metin blok]an gri tonlarda reııklerle gösterilmiştir. %90
kontrastlığı kullanılarak okunurluk sağlanmıştır (Webdesignfromscratch,
civarında renk
200Sd).
(Görüntü:5;) Kontrast değerleri ölçümü için Web Design from Scratch sitesinden
görüntüsü iWebdesignfromscratch, 2005ı:l)_
alınan
ekran
"'N"WW .sealedmedia.com"
sansı
ana dolaşım menülerinde orta grilikte arka zemin üzerine hardal
ve beyaz kuııanılmıştır(Görüntü:56).
Beyazın griye karşı kontrastlığı %.32
diL Gözü
da bilmek,
tasarımcmınbütün
pmça arasmda
görselorganizasyona yardıııı tder Vt
ilişki kunnasım kolaylaştınr.
tasanında
düzenin
Bu yas<l1ar,
oluşumnnu sağlar_
bozuk olanlci! için bu kontrastlık düşük gelebilir. San ve gri tema1 kontrasu ise sadece
%7'dir. Bu tasarım için güvenilir bir renk ve ton kontrastlığı değildir. Bağlanhya
basıldığında
için zemin ya
zemİn
görülen
sarı rengi yanlıştır.
karartılacaktı ya
da
Bu bağlanııya ba::>ıllIlca san rengin a1gılunnıası
aydınlatılacaktl. Beklenilenin
açıldığında,
aksine, san
rengi ile kontr.ıst1ık arttırılmamıştır (Webdesignfromscratch, 2UU5d).
3.1.4. ı Gruplama
Görsel
bütünlüğü sağlamanın en
iyi yolu
gruplarnadır,
"Layout'larda bütünlüğün :-iağlanabilnıcsiiçin illüstrasyon,
görsel
~"I;::'1!'f.,I.
elemanların gruplanması gerekmektedir.
bütünlükten bahsedilebilir. Her görsel eleman
'"i} '>'.
";",,j~~f~ """"...t
(Göriintü:5fi) hrtp:/lwww.sealedmedia.çom/ sitesine ait anu menüıerin
(Webdesignfromscrateh, 2005d)
kontrastlık
ölçüleri
kapIaliıkları yüzey
düzenlemesİni bu
bakLrmudan birer lekedir. Yüzey
yazı fotoğraf gibi
Ancak () zaman tasanmda
lekeleri uygun
yerıeştirerek yapanz. Tasarıma başlarken kullanacağımızelemattıan lekeler
düşünüp,
halinde
iyi bir gnıplama yap,p
Iwllamrs::ık. Etleili hiyerarşik. bır
düzenleme yapabiliriz." (istek. 2004, s.70)
"www.ITansforrnatİonalbreath.co,uk"webs itesinden alman görüntüde siyah metİn gri ve
beyaz bir arka plan üzerin
yerleştirilmiş minimum kontrastlık ise
(ClöTÜnm: 57) ve evrenselokuma
değerleri için
%91
oranındadır
yeterli düzeydedir
Yakıntık, hizalarna,
Sayfayı !aramaya başlayan göz
nesneleri
g)l."r.;",
Gözün bu
~}ı~" ..,
sayfada
hiyerarşisini yönlendirmekte,
yapmış olduğu vurgularnalarla
ise
başllgı çözer
Web
tasarımında temel
ilke düzendir. Layout
kavranmasınayardımcı olur_
yanında, yerleştinnelerinde
Layout'larda görsel
aigı)'ı
dagınıksa rahatsız eder,
de bir birlik, bütünlük
güçlendirlm birlik ve
düzenliyse ilgi
olması gerekir (Pektaş,
bütünlüğü destekleyici
çözmesine yardım eder.
başlık ile
etraftaki
(Webdesignfromscrateh, 2005e).
birbirine benzeyen nesneler bir ırada,
ayrı gruplanır.
İki boyutlu tasanmda bir dizi h'TUplama tt'knikleri kullanılır; ı:enar boşluğu ve paragraftan,
dolaşım çubukları ve kümelenmiş biçim elemanlarınakadar.
3.1.4.2
Yakınlık
boşluk içinde
Düzenlernede renk biçim ve
Birçok
da tasanmm
sayfalara dinamik bir etki katmaktadır.
Layout'larda Görsel AIgıyı Güçlendiren İlkeler
çeker, konunun
hızh
ve derhal
ihtiyacı duyar
Gruplamada en çok kullanılan yöntem nesneleri
3.1.4
araçlardır.
kontrastlık
Örnek web sitelerinİn kont.rastlık değerlerinin analizinde de görütdüğÜogibi kontrastlık
okunurluğı.ı artlırrnasının yanı sıra,
ilk önee
gruplama yapma
algııayış biçimini kolaylaştırrnak: için,
farklı nesneler
(Göriintü:57) Transformationalbreath.co.uk sitesine ait metin zemin ilişkisini gösteren
ölçümü (Webdesigclromscratch, 2üD5d).
görsel
ilişkilendirir ve
eden
hirhirlerini gruplarnaktu.
Benzer elemanların gruplanması beynin sayfa düzenini daha
(Webdesignfromscratch,200Sd).
,,)",O''''''''"''''"c<>t-.:''"
grupleımaya yardım
tÜJnleme, ritim ve biçim,
elemanı ilişkiıCndimıenin en basit yoltı
yazı uyunılan
1993, s.9l).
Gestalt
ilkelerinden yararlanılır. Gruplarna, Tümleme, Yakınlık, Benzerlik, Süreklilik gibi ilkeler
nesneler arası ilişkilendirIneyigüçlendirir. Tasarım itkeleri~n yanı sını. Gestalt yasalarını
güçlerin
beyaz boşluk iyi
yakmlaştırmaktıLYakınlaştmna, beyaz
karşılaştırılmasımıgüvenir. Eğer
kullanımıaIDış
ise
yakınlık
bütün elemanlar kapalı ciı- alanda,
etkisiz olmaya başlar (Görüntü: 58 i.
Gruplama için beyaz boşluğa gereksinim vardır. Beyaz boşluk var etmenin
boşluk oİmazsa gruplama
örneği görülen
güçlü olamaz
yönlendirme
birbirine 1.lZakhl;:tan iyi
ıWebdesignfromscratch,2005e).
düğmesi, düğme
ve
karşı
gücüdür
Arka sayfada
açıklayıcı yazının yakınlığı
ve
düğrnelerin
ay?r1amn«.dığ( İ,;üı kul1iU'~cı!ar!n kafasını karıştımbilir
(Görüntü:58). Diger taraftan benzer işleve sahip görsel elemanlar arasındaki uzaklıklar iyi
ayarlanıp
gruplamrsa tasanmda bütünlük
oluşur (Görüntü:59).
91
i
3.1.4.3 Benzerlik
(Görilnni:58 ). Yeteri boşluğun sağl,mamadığı
kötü gruplama öm~ği (Webdesignfroınscratch,2005(:).
i!J
<a il el [AJ
'" i
Beyin, benzer şekil, renk ve ölçüdeki öğeleri gruplamaya meyillidir ve
ilişkıyi
anlamsal
(Içıdan
biçimlendirir. Benzerlik,
bzelliklerİn
beraber görülebilecek
oluşturulur
(Görüntü 62) (Skaahd, ı 999).
hjzatanarak gruplanır. Böylelikle
şekilde
şekil.
öğeler arasındaki
ölçü, renk, doku,
değer
gibi görsel
uyumlu bir düzende bir araya getirilmesi ile
BeDL~r öğeler yakmlaştırılarak ya
tasanında bir
bütünlük
da
yaratılır.
2.;:;iZJ~(j::;;
• • • • 11 000o ,
• • • • 11 • • • •
••••
(Görüntü: 59) Yakınlık gruplamasınagüzel bir örnek; (http://jimrnac.musichalLczl ) Ikon1ur algılanrr
bir şd..ilde yak.mlaşlınlanık 2 takım halinde gruplanmış. (Webdesignfromscratch, lOOSc).
• • • • • 11 • • • • 1
i
similarity
Sıze- ı ı
(Görüntü: 62) Biçim benzerliği (soldaki), renk
işlevsel bir
gibi, iki radyo
düğmesi şeklindeki buıonl;mn
alg!lanmaktadır
herbiri
~ııorrnal & simphfıea) açıkça
(Görüntü:6ü-6I; sol taraftaki fonn). Her bir butonla yanındaki etiket
yazısının yakınlıklan da uygundur.
Ama aynı formun yan taraftaki deneme~ınde açıkça
hata görünmektedir (Görüntü:6ü-61; sağ ıarnftaki form). Örnekte olduğu gibi boşluk iyi
kullanılıp gnıplama
iyi yapılmazsa düğmelerin işlevlerini anlamamız da güçleşir
(Webdesignfromseratch,200Se).
(Skaalid, (999).
3.1.4.4 Süreklilik
Süreklilik, izleyii.:inin dikkatini
-
~ ,.,,~'ı
üzerinde yönlendinneye yarayan araç olarak
ritimdir. Yaygın biçimsel
özelliklerin düzçnli ya da dü;ıeusiL t~loJan ile oluşan rilim, görsel Cıe.manlann birbirleri iie
ilişkilendirilmesini
de
sağlamaktadır.
Ritim ilişkilendirme araçlanmn en zoru Ve en incesidir. "Ritim, biçimsel özelliklerin
tekran ile elemanlann birbiri ile
(Webdesignfromserateh,
T'~;'" ~: f"'·~'l)
tasarımın
açıklanır. Tasarımlarda sürekliliği sağlayan tasanm öğesi
hizaıanamadığı zaman İşleyen
c·," "
1
similafY
b~nzerliği (sağdaki)
fonn grafiğinde elemanlar iyi gruplanınazsa kullanıcı buradaki düğmeterin
işlevlerini anlayamayacak ve etkileşim gerçekleşeıneyecektir. Örnek formda görüldüğü
~"'
1
,10000,1
ilişkisine yardım eder.
gmplanamadığı ya
da
işler"
l005lı).
Biçimin tekranudan oluşan rıtim, web layout'1annda görüntülerin tekrannm
yanı sıra,
listeleme ve başlıkların madde imi olarak kullanılmaktadır.
Amerikan Cumhuriyetçiler Partisi'nin web
tekrarlanmış, kullanılan başlıklar
(Görüntü: 60-61) Form elemanlannıngruplanroası;, sol taraftaki form yakınlık gruplaması iyi yapılmış
bir tasanın iken sağ tm"aftaki formda bazı yerelişlevlerini yerine getirecek şekilde gruplanınamış.
(Webdesignfromscratch.com,2005e).
Elemanlar
ritim, bazen de bu teknikler ile birlikte
aynImıştır (Görüntü:63).
Böylelikle
için beyninde aniden bir örnek
kullanarak diğer ~eyıeri
gÖliintüde,
başlık
biçimi
sLİreklilik yanıtlımış. İnsan bazı şeyleri tanımlamak
kalıp,
tanımlar,
sayfasından alınan
sola hizalanınış. yatay bir bölünme ile birbirinden
kural ya da düzen oluşturur. Sonra bu
yorumlar.
Alınan görürıtüue
:::.!tınualci biçimlerin b.ci:a~n fa:rkıii.3. vanıma51
kuralı
"Special features"
başlığı
için açıkça iIişkilenJirilmiştir. Yatay tic
himlamayla oluşturulan riÜm aym zamanda başlık. metin ve görüntülerio biçimsel
tekrarı
ve düzenli boşluk ölçüleri ile de fark edilmektedir (Webdesignfromscratch, 200511).
Katı kuşatma;
Til" Relıef'~ 5Ir~"gtl'.e"iııç: Cur
gösterildiği
ECOOJ;'>my
üst başlığın içinde alt başlığın, ya da bütünün
yerdir (webdesignfromscrateh, 200Se).
kutu içinde genel başlığın
'
'~"':"~:-:,:'
,'"O"' 'on
~.b.Y"", 0_ 'OQ~'
F""'~,"V'.
·ec ...,.or ,"'"p"
"
o," '.'.'.'" "w"-,,h',",""
'"o.· ),"'
J "
,,·c.-,"
..
Aşağıdaki
ömekte
görüldüğü gibi
bir
alt başlıklar yerleştirilmiştir tGÖrüntü;(5).
-.~'-'.".".'-"."...
"',:
'.
"
________
.cı,'
~\,~.:o....>;ö'.<iiı:
"'.00''''''
',,' 1:;'"
-l'",
.. "bnı~..., .~.!~~" ',,, I~_~~~~:.:.~~:':.
'''''A'::~'i'"",
etrafında
parçasına aİt elemanların
.:~
7·'~.J~m_
~CP
!ZZ'-''''5 ~cı
~
;=OClIS
""'"'_''''o·'·'_~'''';O
-çı
'_JO' '"0",<'
o,' ~""1'"
'.,,, ,·._c
,.~ '-"."~
"",ce.. '-,,,'
00'"""",,,,,
'" ·_",r,,"
'"'''''0'''''
,''''''-''''"''';0<
"".-"-"'0"".0 ""',,_",-."
'" -",,",.,lI_' """ •.
~
,.~
(Görüntü: 63) Basii bir ritim örneği.
Amerikan c~LLriyetcilerpartisinin
web sayfası, (Webdesignfroı:nscratch,
(Görüntü: 64) Yalnızca bağlantı elemanlan birbirleri ile
ilişkilendirilerek ritim oluşturulmuştur
rN ebdesignfromscratch, l005h),
l005h).
(Görüntü: 65) Bu örnektc üç panel ana sayfanın özellikleri tilliıyan bir grubun alt başlıkları olduklan
görülmektedir. Başhk çubuğu, aşağıdaki. ü,; özelliği kapsayarak bir kutu içine almaktadır. Burada başlık
alt ba.şlıklan betimlemektedir (webd.esignfromscratdı,lOOSc).
Yumuşak kuşatma (türnleme); fazla kalıpsal bilgi kuşatmasına yumuşak seçenektir. Üst
öğenin alt öğeyi
kapsayacak diye bir zonınluluğu yoktur, önemli olan görsel
üstünlüğü
olan öğenin tümleyiciliğidir. Baskın elemanın toparlayıcı bir rolü vardır. Üstün baskın
elemanlar alt elemanların solunda üstiinde ya da her iki
Yukarıdaki (Sağ) örnek web sayfasında süreklilik, dolaşım simgeleri (icon) ile
oluşturulmuştur. Yazı biçimi, görsc1lt:rin büyüklüğü gibi biçimsel bt:ıızerlikler kabaca
dairesel bir biçim üzerinde yerleştirilmiş ve devamlılık sağlanmıştır. Layout düzenlemesi
(webdesignfromscratch, 200Sc).
fiziksel içerik kutusu
vurgulamaktadır.
başlığı
Aşağıda
olmamasına ragmen başlık açılcça
Sayfa başlangıcı ve liste
listeden daha sola
yanında
da olabilir
görülen "Bargain thghts"
başlıldı
görüntü
liste içindeki her bir maddeyi
ara.-;ında yerleştirilen
kaydınlarak algılatılmaya çalışılmıştır
"This week's bargains"
(Görüntü:66).
de "O" harfine benzemektedir (Görlintü: (4),
.' ,--".~
3.\ A.5 Tümleme i Bülünleme i Birleştinne (Contaiıunent)
ı{"ı,,-\,~
Alicilntc
Gruplamanm farlı bir biçimi olan tiimlerne (containment), bir ya da birden fazla elemanm
bir gmbun ya da sınıfın parçası olarak görsel yöntem ile gösterdiği etkidir
i.7'.l:'JlJ
'i. 1', ,;)0
1''!.:!Jlı~
.i;7:J. JO
Tcn"2'i:!"
f9~-.
_"~"""'_'-~
i:3~.':W
!,,,~.=,,
ı.1ilhoT.
f'ııHrj
... ,·"nl1l2'''-
M,~J_t.a
birkştirilen nesneler daha kolay algılanmakta aynı zamanda belli başlıklar bir başlık.
(Görüntü: 66)
.;;2,
.:. 7 '}. 00
~-i"·Q
La,;
(Webdı:signfromsl;fatch. 2005c). rümlerne sayesinde bir alan ya da kutu içinde
altında toplanabilmektedir.
-,lJlçUI~:f', ,.=---.::~.:~!_
, Tllis IM'!9k'S ba-lı"diilS
Hi
c.ii'). Dll
.:.-" ~. 90
1.J':I._OO
'~l-li.,"lJ
Yumuşak kuşatınaya örnek
"Bargain flight<;" (pazarlıklı
(we\xlesignfmmscrateh. lOOSe).
uçuşlar)
görüntüsü
Tümlemelbütünleme'nin (birleştirme) iki çeşidi vardır; birincisi katı kuşatma. diğeri ise
yumuşak birlcştirme/toparlamadır. Katı kuşatmada; elemanlann hepsi bir kutu içinde
toplanır. Yumuşak toparlama birleştirmede ise kutunun, hiyerarşik sıralama ve beyaz
boşlukla kullanılması önerilir (webdesignfromscrateh, 200Sc).
Gereğinden
fazla
katı kuşatma yapıldığında,
her şey biribirinden ayn görünür ve hiçbir
şey
bir biri ile ilişkikndirilemez. izleyici sayfaya baktığında görsel karmaşa gördügü zaman
içeriği
anlamakta zorlanacağından sayfadan
çıkabilir
(webdesignfromserateh, 2005e).
\.şağıda bir web sayfasından"lınan görüntüde görüldüğü gibi, bakışııniı dolaşım araçlan
;:üçük puntoda ve algılanınamakm., içeriği boydan boya bükn mavi çubuk yüksek
contrastlıkdeğeri ile gereksizce dilckat çekmekte, aynca bu sayfada başlangıç ve son
rıoktamn nerede 1..1\duğ;u bilinmemektedi.r (Görüntü: 67)_ Bu tasanını düzeltmenın ve görsel
ilişkilendirmelerin ana yolu hizalama kullanmaktır.ilişkilendiriıenöğelerde farklı
miktarlarlli1 girintİ knllarrarak tasarım iyileştirilebilir. Eğer tasanında nesneler arasında
iliskilendinneler yapı1acaksa sıradan bir şekilde büt{ınlcme yapılmamalı, nesneler kutul~
.ıçme
~ ai ınaca ks a gereldı· beyaz boşluk ve hizalamalar dikkatle k--ullanılma1ıdır (GörüntU: 6~).
Yoksa tasanın kanna.şaya dönüşür.
3.1.4.6
Bızaiama
(Alignment)
Hizalama yalnızcatipografıde metinlerİn sağa, sola ya da ortadan bloklanntası olarak
algılal1mamalıdır. Aynı
yaratmanın diğer
zamanda hİzalama layout'ta "görsel demanlar
çabuk anlamasına yardım eder" (Webdesignfromscratch, 2005a). Hizatama, farklı
elem{\nlar arasındaki
ilişkinin
anUlda fark edilmesini
Görsel elemanlar bir eksen üzerinde bir araya
s"ğlayan
bir ilkediL
getirildiğinde hizalama oluşur. Hizalanmış
elemanlar görüldüğünde, birbirlerinin eş düzeyde bir
parçası olduğuna inanıtır
ya da ortak
bütünün parçası olarak algılanır.
Sol üst kenardan aşağıya doğm yapılan hizalamalar doğal akış
11,"'"
" .. ,:.'
arasında birlik
bir yoluduL Sayfa üzerindeki neşneler arasındaki ilişki, kullanıcıların
sağ
alt kenar hizalamalardan d"ha güçlüdür.
eksenleri,
sağ
ve
aşağıya doğru
Ekranın
basamakları olduğu için
sol-üstünden başlayan hizalama
olandan daha üstündür. Görsel
hiyerarşi
en iyi bu yolla
gösterilir (Webdesignfromscratch, 2005a). Birçok görsel eleman kademeli olarak
düzenleneceği zaman
bilhassa "lt
başlıkları olan
gereksinim vardır. Aşağıdaki örnek menüde de
alt başlıkları kendi eksenleri üzerinde
·
b' ... ;1' k El
(DÖNııtü'. (,7) Hiz;ı.lama ve gruplama kullanılmamış brr W~ sıtesıome,,1, ao
yönlendirme
düğmelerinde hizalamaya
görüldüğü gibi
hizalanınıştır (Görüntü:
birinci!
başlıklar ve
onlann
69).
hakim
(w~bd~signfroınseratch, 200Sc).
(GÖrünti.i:
'-~~------ ı
. ....,.
~;!~'
..'
Izgaralar; sayfa
.",,,~r,
69) Meniiler alt bagl<'lntılura ve ana bağltlntıbrn göre hizalanmışıordrr
(Webdesignfromscratch. lOOSa).
.." ''''M.....···.,.. ;l,,"
(Görüntü: 68'1 Kötü bir gruplmmı kuşatma örneği (webdesignfroms.. n
. tch, lOOSc).
tasanmında biçimlerit! yerleştirilmelerini kolaytaştrran araçlardır.
bir hizalaTIla ekseni yaratan ızga:.:!.l~~ diğer sayfalam.
ve dil
birlikteliğinin sağ!;mma&ına yardımcı
Layout'larda
ızgara kullanılmadığı
Güçlü
tasanmında da kullanı:arak tüıar1ığın
olur (Webdesignfromscratcb.,2005a).
zaman görsel elemanlar arasında karmaşıklık meydana
(lelmektedir. Gözün bütünü ve parçayı algılaması zorlaşınaktadır.Aşağıda görülen
~www. gpın·'o
t:ık" web sayfasının
üst kısmındahoş göıi'ıncn resmin dışında sayfa bitmiş iş
.l:.
.
olarak karmaşık bir düzenleme içem1ektedir (Görüntü:70).
3.1.5 Layout'a Sayfa Boyutunun Etkisi
Tasaom ilkeleri
dışında
web sayfası tasanmını etkileyen bir öğe de sayfa büyutudur.
İnternet kullanıcılarının farklı ekranlara sahip olması web tasanmında standart bir ölçü
konulmasını engeIJemektedir.
Aynca kullanıcılann farklı ekran çözilnür]ük ayarlan
kullanması da tasanını etkileyen
düşünürsek en
faktördür.
:;."'I'='i
kullanıcılar olduğunu
piksellik baskı alunı da dikkate
zorundadır. Eğer metin satır uzunluğu sayfa
,~
ölçülerde
boyutunu
Bazı web
aşar1ia metinlerin
sitelerinde metin ve resimler tablo içine
yerleştirilmekte
özdevinimli ölçü değişmektedir. Bu yüzden layout'un biçimi
Klepp).
yazılar
Ayrıca tasanm
760 piksel ölçüsünü geçerse, web
msc I"atch.ıOosa).
Fulwood Motor Company web sitesi layout'u basit ama ctkili bir hizalama örneğidir. Bu
web sayfasında dört hizalama ckseni
bulunmaktadır; birinci eksen logo ve birinci derecede
yönlendirme bağlantısı (home, cars for sale, about etc.), ikinci mZı!lanan öge "about~
. .~.. b i ct ~ altı bağlantı üçüncü elcsen ise sola hizalı ana metnin bulundugu
ıçengının u un ugu
~,
. .... ., ..
bölge, dördüncü hizalama bölgesi ise en alt bağlantılar ile yukandalu goruntunun
hizalanına eksenidir (Webdesignfromscratch, 200Sa) (Görüntü:7l).
i " " " " , •.
.... " ..
.,
I
sunucuya göre
değişmektedir (Jenkins-
saytasındabazı
görüntu ve
işlevsellik açısından
sayfa boyutu layout için
önemlidir.
Genelolarak sayfa layout'unun başarısı onun basit, anlaşılır, kullanışlı ve estetik olması ile
ölçülür. Bu ölçütler ancak tasarun ilkelerinin uygulamnası ile
sağlanabilir. Layout'tuı asıl
amacı
iletiyi hedefleitlesine iletmektir. Layout'ta biçimlerin yerleştirilmesine karar verildik1.en
sorını
estetik ve
işlevselliğini etkileyen
ı;llAPıııe
S;\H
/IoR(~
iki
fOR "D'Il
sonın karşımıza çıkar;
:ı:
tipografi ve renk.
fiOIJ SiCREEN:')
[~.~~~.~
ıl-.'-~:~~
ı,::·,,'.' '
\
bir kısmı
kesilmekte ve görünmemektedir. Bu dummda kullanıcılar yatay çubuğu kaydırmak
zorunda kalmaktadır. Hem estetik hem de
(Göriintü: 70) http://www.gpin.co.ukIwebsaYfası(Webdesignfro
iı
kullarucIlann
alınmak
çıkmayacaktır.
~
)
Bazı
güvenilir ekran ölçüsü gOOx600 pikseldir (Görüntü: 72).
içeriği basılı okuduğu düşünülürse 560
~
Farklı
. ,..
'"': c"1,:,:;:::;:~i.:.·:,":,~:::.:" .,'"
-e-,,,.-t- ",.
.".'.
,.,
~;_CJ_'=""=..c.~"'=- '~ ~'~ " =.:." ,-".._, ~,.,~., ~~\ l_~---. ~~_-~_J
(Görüntü: 71) Fu{wood Motor Company web sitesi ve hizalama eksenleri (Webdesıgnfromscıatch, 200Sa).
L~==J
(Görüntü: 72) 800x600 Pikse[ güvenli tas<ı[lnı ve b<ıskı alanını gösteren çizenek.
(Lynch ve HortQll, 20041)
LAYOUT'LARDA TİPOGRAFİ
3.2
Web
:sayfalarında foutlann
seçiminden önce font ve font
ailesİnin
iyi bilinmesi gerekir.
Görsel iıetişim araçlarının en temel öğes,i yazı ve tipografidir. Tipografı, bütün iıetişim
Web sayfa tasarımında fontlar ve font ailesi:
aradannda olduğu gibi web sayfalarında da önemli bir yer tutmaktadır. İletişim
ve noktalama imlerinin aynı yazı karakteri, biç.emi ve ağırlığındaki dizisidir"
"Bır
font, karakterlerin, sayılann
ara~larınm durumuna göre tipografık sorunlar farklılaşmaktadır. Görünmlük
(Sarıkavak, 2005
tasarımlarındayazınltı seçimi, büyüklüğü, hizahmması,satır, harfve sözcük arahğı,
özelliği içindeki
vurgı.ılama ve arka plan gibi akunuriuğu etkileyecek birçok sorunlar olabilir.
"Buna, harf seti. sayı seti ve tüm özel karakterler ve ayraç işaretleri ki baskıda
sahip
3.2.1
Yazı
a, s.80).
Diğer
bir deyişle font,
harfın
punto ve tarzına
bağlı
bir
karakterlcr setinin tamamıdır. Font yazı karakteri takımıdır.
olduğumuz
shift. option ya da control tuşları dahildir... Bir font
(yazıyüzü)
ailesi ise, bir fonttm serilerini içeru-" (Grantast.kdesigns, lOOSa). Yazıyüzü ailesi
Karakterinin Seçimi
Yazı karakterlerinin seçimi tipografIk tasanının başlangıç noktasıdır, sayfanın genel
tasarım yapısını da etkiler. Web site tasarımında farklı yazı karakterleri uygulam::ı.k, baskı
belirgin olarak dört fonttan oluşur. Örneğin Times fontunun ailesi: Timcs, Times
Bold, Times Italik ve Times Bold Italik'dir.
tasarımında olduğu kadar basit değildir. Web tipognıfisi.nin en büyük sıkıntısı font
"Geçmişin tüm aynntılı sınıtlandmııalar:ına karşın,
seçeneklerinin eksikliğidir. Bu eksiklik kullanıcınınbilgisayarında tasanmcmın
genel biçimiyle temelolarak üç
kullandığı fonttm olmamasından kaynaklanır. Şayet tasarımeının kullandığı font
(Tırnaklı), 'Sans-Serif (Tırnaksız)
ziyaretçinin bilgisayarında olsaydı, doğalolarak font sorunu olmayacaktı
Bazı
Grantasticdesigns (2005a). Web sayfalarınıyayınlayan sunucunun yalnızca dizge fontları
olarak sınıflandırılmaktadır(Webdesignfromscratch, 200Sg).
ile çalışması teknik bir sınırlamadır. Bıı yüzden tasarım yapılırken teknik sınırlamalar
oözetilmelidiL Web tasarımcısı, fontlarını seçerken kullamcılarm ulaşabileceği dizge
o
fontlarını seçmeıidir (Göıüntü 73).
geniş tasarım sınıflandırması içinde
1.
Tımaklı
font,
'tırnaksız' ve
küçı:U< ayaklı, tımaklı yazı,
Kağıt
rahaı ve okunması
üzerine
basılı
ve beyaz
(webdesignfromscratch, 200Sg).
Roman, Garal11011d
V~
'dekoratif
yazı
karakterleri
daha çok geleneksel görünümlü bir
grafik ürünkrinde göz hareketleri
kolayolan bir fonttUI.
okunurluğununnedeni ışık
gruplanabilir: 'Serif
ve 'TypeWriter' (Daktilo)" (Sarıkavak, 2005 a, s.80).
kaynaklarda da yazı karakterleri: 'trmakh',
biçime sahiptir.
bilgisayar ortamında font aileleri en
Tımakü yazılann
boşluğun harfin
ekranda zor
yapmm
Yaygın olan tımaklı yazı
açısından
bozmasındandır
karakterleri; Times
PaIatino'dur (GÖriintü:74).
('''<OU"
Arial Black
co",,«
.\r~:'br;'i<
"·"e~
Arial R<ıunded MT 80ld
Bc":"
Anlıqu~
80~'kl·M.n
Cld ;"[yle
'~:,"ntur'! \:?-o,ı-ı<:
'~"nt.ı_ryS~h~.J\:.,,~k
H".'~'1"
11"",,·'"
N~',~Y",rl,
;',,"'no
-r-,
Bu 14 pt Palantino'dur
~,,,,,,ıer
::0urı"'" t'H'"
Bu 14 pt Times' dır
~m.m,'r,o
MSD'''lo'l
~C;OI~jogl.,gl"
1'1~
LJ.ıı"Dt"'"'·-
(Görüntü:74) Palatina ve Times tımaklı yazı karakterlerİ.
MS.;""r
~3 Scrıs 3"Jrır
Mi
Sy"t~mX
TLoı""HewRc-lnCII
'.-..,,-J,'rı<l
(Görüntü: 73) Wicl(.1ows ve Macinto~h ortamlannda kullanılan dizge fon~liln, web sitesinde .d,izge
fı:.ntları dl~111da bir font kedianıldığında.sunucu öz.Cıevinimli olarak dızge fontlanna çevınr
(Onıırsay, 2001,
ı
100
s.751.
2.
Tırnaksız
font, daha çok
PIl.::s~l taoarılı ekran
çağdaş ve açık görünümlü, tırnaksız olan fontlardır.
üzeri:r..d.e !!rr..a.\.blard3r. da,.~a
olGm::ıklıdır, düşük
çözü..'lürlillde
dahi ekrana uyunı sağlayan fontlardır (Webdesignfromscratch, 2005g). Yaygın
101
'ı
olan
tırnaksız yazı
karakterleri Hdvetika, Arial ve Avant Gtlrdc'dir (GÖrüntü:7:;).
3.2.2
Yaygın Weh Fontl.rı
çoğu tasanmcılar web sayfasında iyi görünüm için tasarlanmış yaygın web [antlanm
kullanırlar; Verdana, Trebuchet, Helvetica. Bu tonUar, doğal piksel ızgaralarıyla uyumlu
Bu 14 pt Arial Black'dir
Bu 14 pt Bold Avan Garde'dir
olarak tasarlamnışlardır. Ayrıca harfbiçimleri değil, beden yükseklikleri ve harfboşlukları
da ekıan okunurluğu için uygun hale getirilmiştir (Gil1espie, 20(5). Hemen hemen bütün
web sayfalannda kullanılan bu üç fontun kullanım nedenini sırayla aktaracak olursak;
(GÖTÜntü:75) Arial ve Avant Garde tımaksız
yazı karakterleri.
3. DekQratif fontlar, dekoratif yazılar okunurluğu az olan daha çok süslemeci bir
anlayışa sahip
olan
yo.zı
Tırnaksız yazı ailesi grubıında olan ve ekran için tasarlanan Verdana fontu, bugün web'de
kullanılan en yaygın fontlur. Verdana ana metinler için belirli bir biçimde tasarlanmış
fonnur (GÖrüntü:78). Çok küçük ölçüde bile kullanılması onu okıınırrluk açısından diğer
[ontlardan üstün tutar (Götz, 2002, s.24).
karakterleridir (Göriintü~76).
(Görüntü:7~ı Verdana tontun hart"ve harf içi boşluğu (Hunıe, 2005).
(Görüntü:76). Dekowhf
yazı
karakteri Shotgnn.
Veniana yazı karakterinin harfarası boşluğu ve har:fın kendi iç boşluğu okunurluk için
Genellikle web sayfalarında iki
çeşit yazı
ailesi kullanılır;
tımaklı
oldukça uygundur. Bu dumm tırnaksız web fondan için de seçilmesinin nedenidir.
Verdana bazı tırnaksiz yazılara göre daha okuTIur bir fonttur (Görüntü:79).
ve tırnaksız
(Görüntü:??).
i Georgia
Verdana
Arial tırnaksız okunur bir fonttur. (14 pt)
ı
(Görunrii:77) Georgia (tırnaklı) ve Verdana (tırnaksız) yazı
Verdana tırnaksız oldukça okunur bir fonttur. (14 pt)
karrıkterleri.
(Görüntü:79) Arial ve vereiana'nm okunurhığunun karşılaştınlması (Hume, 2005).
Ekran için 1996 Vincent Connan~ tarafından İ<ısarlanan Trebuchet fontu; enerjik Ve kişisel
Tırnaklı yazı karakterleıi basılı ürünlerde
okumirIuk
aı;ısından kullanışlı iken
üzerinde okunurluk sorunu yaşatmaktadır. Tırnaksız yazı karakterlerinin ise
daha iyidir. Bu yüzden yaygın olarak tercih edilir.
Tırnilkh yazıh'!r
elaan
okunurIuğu
ana metinde küıyük
puntüua kullamlırsa çatlak ve dÜZei)siz göıünÜf bunun nedeni örtüşme önler / çentik
gidenr (anti-aliasing) etkinleştirildiğinde yazının eğri ve uç k.ısımlanmnbulanık
görünmesindendir.
Diğer taraftan,
düz,
düşük karşıtlıkIl
(eni
diğerlerine
grotesk [anttan beklenilenlerden daha fazla özelliklere sahip olmasıdır (Hume, 20(5).
Kişisel farldıhğarağmen, Trebuchet'in vuruşu, tıknaz ve açıktır. Küçük ölçülü fontlarda
okunurluğu arttıracak harf Genişliği ve yüksekliğine sahiptir (Gönıntü:8ü ).
göre daha fazla)
tırnaksız yazı daha. yumru güce sahiptir. Örneğin Verdana yazı karakterinin ekrandaki
etkisi güçlüdür.
bir tavrı ile diğer web fontlanndan aynhr. Ru yazı için en belirgin özellik, klasik bir
TrebuchefMS
(Görüntü: 80) Trebuchet fontunun harf içi boşluğu ve yüksekliği (Hurne, 2005).
103
1
Max Miedinger, "1956'da Eduard
yazı tasarımının adı
yy'ın
Hoffmann'ın yönetiminde
Hass Grotesk'i tasarlar. Bu
1960'ta 'Helvetica' olarak değiştirilir"(Sank.avak, 2005 b, s.2). 20.
ikinci yarısı boyunca en popüler bir font olan Helvetica, ekran fontu
kullanılmayabaşladığından itibaren
okunurluk
almıştır. Tı.knaz genişliğe rağmen, harfin x
olarıık
Yazı karakterlerinin seçimi kadar, çeşitliliği de tasarımı ve bilgi aktanmını etkileruç:ktcdiı-.
"Eğer sayfa büyük, metin uzun ve farklı vurgular gerektiriyorşa yazıda çeşitliliğin olmaşı
zenginlik ve renklilik getirir. Çok fazla yazı karakteri- her karakter farklı mesaj
açısından web tipografıstlerindentam
not
ileteceğınden- okuyucunun kafasını karıştırabilir" (Pektaş, 2003, s.144). Web tasa:ıınıında
görsel kirliliğe neden o~manıak için farklı ve uyumsuz yazı kullanımındankaçmılrrtalıdır.
yükseklik büyüklüğünden dolayı ekran
üzerinde rahat okunur bir tanttur. Harfler orantılı beyaz boşluğuyla gözü yormamaktadır
Sonuç olarak uyguu yazı karakteri seçerken, seçilen fonHann estetik yapısına.
uygunhığuna, okunurluğuna ve oleuturluguna da dikkat edilmelidir (Sarılmvak, 2004,
(Hume, 2(05) (GÖrülltü:81).
s.65).
Helvetica::
(Görüntü: 81)Heivetica fontunun harf
Fontlar
seçılirken, bilinmesi
rahat o.kuyacaklardır. Ama
3.2.3
yüksekliği (BUille,
2005)
ekran foııtlarını da denemelete yarar vardır.
Ağırlığı
ve
etkileyen olgulardır. Kenar boşluğu ve hizalamalar sayfanın görünüşünde büyük bir etkiye
sahiptir. Kenar boşlukğu site içindeki diğcr elemanlardan ve sunucunun çerçevesİ1lden
metni <ıyrıştırrnaya yarar. Hizaramalar ve boşluk ana metni çevresinden ayırarak s<ıyfadaki
okııma alanını belirler (GÖrüntü:83). Ayrıca sayfada önemli bir görsel rahatlık şağlar,
İyi ekran fondarının kankteristik özellikleri;
•
Sorunları
Web tipografisinde hizalama ve metin kenarboşluğu, okmıurluk ve estetik açıdan Üı.sanını
gereken kurallan uygularursa kuUanıcılar da metinleri daha
diğer okunur
Hizalama
kalınlığındakitutarlılık ile düşük kontrast
ve basit
Web ortamında metin, farklıhizalama yöntemleri ile biçimlendirilerek, hısanmda .karmaşa
vuruı;;tur
• Y ükşekliğindeki artımlıIık,
ortadan kaldırabilir. Sitenin tutarlı, okunabilir ve şık bir yapıda olması hizalamadald
• En ve harfboşluğundaki artımhlık,
(bloklaına) başarı ile sağlanabilir. Meiİn bloklan farklı hizalamalar ilc yaratılabilir (sola
• Harf içi
blok, merkezi blok, sağa blok ve tam blok seçenelderj).
boşıuğundaki artımlılıktır (Görüntü:82).
Good font-·,>
(Göıüntiı:82)İyi
Yazı
birfontunun harfyüksekliği,genı~lİği ve aralığllHume, 2005).
karakteri seçerken fontun karakteristik özelikleri dikkate
alınmalıdır (Hurne,
2005).
Metnin içeriği, kişiliği ya da tonu yazı seçimini etkiler. "Seçilen yazı karakteri bir kimliğe
şahiptir. Bu
karakter içeriğe uygun olmah ve ürünle bütünleşebilmelidir. Aynca izleyicişi
tarafından kabul
kullanıcı yazı
edilebilir olmalıdır" ( Sankavak, i 997s. 32).
Yazı tasanmın
bir parı;:asıdır,
seçemez ama etkileşime girecek olan onlardır. Bu yüzden onları dildcate
almak zonındasınız. Banka ve sigorta
şirketi
için bir web tasarlanacak olsa ana metin için
Comik Sans doğru bir seçinı olmaz. Comik S..", ""],s .::ğleü.celi ~ar.lcatü.r tarzınc::,. cbı:ısır..C!'::~"G
dolayı bankanın
kUnlm kimliğıne de zarar verebilir. Ayrıca Comik Sans yazı karakterini
web'de sunabilmek için yazının grafik görüntü olarak kullanılması gerekmektedir.
1
104
(Görüntü: 83) Argus-acia.coın web sitesinde hizalaına ve beyaz boşluğun kullanımılLynch ve
Horton,2004b).
dayalı
olarak lüzalaılHuş metinler;
rnetinleıin ;:ıkışı
Sola
popülerdir, sayfaya tekdüze biçİm verir. Basılı ürünlerdeki tam bloğun başarısı tasarım
web'de metnin sola doğru olması bir gerekliliktif. Sola dayalı metinler web
yapılan programın
tirelemeyi desteklemesi ile sağlanabilir. Tam blok web sayfalannda
en okunaklı seçenektir, çünkü, sol hizalama gözün
salilim
sağa doğru olcluğu
Tam blok; metnin sağa ve sola yaslal1Inasıdır. Tam blok kitap ve gazetelerde oldukça
başlama noktası
için
sayfaları
için
için sabit olan bir
yaygın olarak kullanılmamaktadır. Bunun nedeni sunuculann ya da işletim dizgelerinin
yerdir ve düzenlidiL Metni sola hızalamak, kelime boşlukları için herhangi bir ayarlama
tirelerneyi dcsteklememesinden kaynaklanmaktadır, Sağdan ve soldan blok alındığında
yapılmasmı
sözcük aralannda büyük açıklıklar oluşmaktadıL Tasanın dilinde nehir olarak adlandırılan
gerckrnemektedır. Sağ boşluğun dağıtılmış olması
bu açıklıklar, estetik ve okunurluk açısından tasanmı etkilemektedir (Hurne, 2005)
(GÖrüntü:84). Wcb- sayfalannda tam blok metni kontrol etmek zordur. Son zamanlarda
akunaklılığına
CSS'i destekleyici sunucularda tam blokla başanIı bir göıiıntü sağlaı:ıabilmektedir (Lynch
ve Hortan, 2004b).
gerektirmez.
Ayrıca satır sonlarında oluşan boşluklann
dayalı
sayfaya yç.şitlilik katar ve
etki etmeden ilgiyi. çeker (Lynch ve Horton. 2004b).
Başlıklarm hizalammısı; başlıklar ve
bir biçimde
üzerinde iki
da düzeltilmesi
satır
sayfa adlan sola dayalı metinlerin üzerinde yine sola
kullanılmalıdır. Ortalarmnş ba5!ıklar,
olduklan zaman güzel
önerilmemeletedir. Sola
dmıır.
dayalıhizalanmış
iki yana
Ancak iki yana
dayalı
dayalı
metinlerin
metinler web için
metinler üzerinde kullamlan
ortalanmış
başlıklar, ıızunlu kısalı
oluşmasım sağlar
biten sağ kenarla, asimetri oluşturur ve dengesiz bir sayfa
(Görüntü: 86) (Lynch ve Horton, 2004b)
i--~~
i
! ~C~;c~f,:;;~3
i
(Göriintü:84)Tam blok metin ve nehir oluşumu (Lynch ve Horton, 2üü4b).
i ,-:i2~"",,~~'((c
Ortalanmış ve sağa dayalı metin blokları; ortalanmış ve sağa dayalı metin bloklarını
okumak zordur. Okuma soldan sağa doğnı yapıldığı için, satır atlandığında odaklanılan
yer, sol hizalamanın düşey çizgisidıL Soldan sağa doğru hizalanan ve yırtık görünen
(Görüntü: 86) Başlık hizalmna biçimleri (LYllCh ve Horton, 2004b).
metin. bir alt çizgiye geçişte göz harekeıini yavaşlatacağından okuına hızmı G...'l. aza1tır
(Hurne, 2005 l. Sağa dayalı ya da ortalanmış bir metnin pürüzlü sol kenan, melin
incelenmesini daha da zorlaştmr çünkü sol göz her yeni satınn başlangıcını görmeye
gereksinim duyar (GÖrünti.i:85) (Lynch ve Horton, 2004h). Sağa doğm hizalamalar, uzun
metinler dışında yalnızca belirli amaçlar için kullanılabilir.
3.2.4
Vurgu
Başarılı
bir t?s,mmda bilgiYi <.incelemek, tipografinin temel yeteneklerinder birisidir.
içeriğin sunurnunda bazı önemli şeylerin vurgulanması gerekebilir. Metni içinde, Bir
sözcüğü vurgulamak
için sözcükler kendi çevresindekilerden
farklı yapılmalıdır.
Bu,
yazı
biçerni, ölçüsü ya da ağulığı değiştirilerekya da farklı bir yazı karakteri kullanılarak (ya
J;j tasamucmın yaratıc/lığına oağiı bir uygu1arnayla) yapılabilir (Sarıkavak. 2004,138).
öncelemenin en temel biçimi, sözı:ükh:ki haıDeti daha geniş ve daha koyu yapmaktır.
Vurgu, bir söıcüğün çevresindeki sözcüklerden daha önemli
olduğunu
gösterir (Gillespie,
2005)~
lGöruntü:85) Hizalama biçimlen (Lynch ve Horton, 2Ü04b).
106
1
107 [
)ktımanın akışında,
önemli elemanlür görsel vurgularla verilir.
1kışıua zıtlık sağlayacak şekilde
Bir sayfa tarandığında vurgulu elemanlar,
okumada öncelikli
Yarahcı
olanlardır
Ustalık, okumanın doğal
vurgu ekleyerek, 'vl.ııgulanacük şeyi ortaya çıkannaktır.
diğerlerinden ayrılırlar. Aynı
zamanda onlar
(hipeıtext Jink) bağlantının varlığını i'5aret ettiği İçin vurgu yapmak için allçizgi
kullanılmamalıdır (Gillespic, 2005). Vurgu yine de kullanılacaksa, üstmetin bağlantısı ile
benzerlik İçereçeği düşünülerek, mavi renkte kullanılmamalıdır (Webdesignfromscratch,
200Sg).
(Gil1espie, 2005).
tipograflst1er, bir sayfayı görsel olarak daha ilginç yapmak için bilgiyi öncelerne
tekniklerinin
yazı, eğik,
Kalıulık;
tamamını kullanırlar.
Metinde vurguyu
web
sayfalarında
sağlünır. "Başlık
vurguyu
sağlamanın en
yöntem vardır;
kalın
etkili ve
yaygın
yöntemi
aynı yazının
kalın yapılarak vurgu
ve alt başlıklarda vurgu için kahu yazı kullanmak iyi bir seçimdir.
yazınıu
metnin birçok yerinde kullanıınıası etkiyi
çoğu kalın olursa
dikkat çekmez,
kalın yazının hıtumlu
azaltır"
Kalın
fazladan gürültü yapar.
ekranlarda
değildir (Hurne, 2005). Renk vurgu öğesi olarak kullanılırsa. bağlantılarla karıştırılabilir.
Örneğin mavi bir bağlantı rengidir ve bağlantı işlevinin dışında kullanılmamalıdır.
Tipografık dolaşım menülerinde yerinde kullanılırsa dolaşıma büyük katkı sağlar.
sılemtı
Boşluk ve girintHerle vurgu yapmak; başlık gibi bir sözcük, metinden biraz
uzaklaştınlarak beyaz boşlukla 'llırgulanabilir. Aynea madde imteri, alıntı metinler ve
ve yerinde kullanımıdır (Hmne, 2005).
Eğiklik; eğik (İtalik) hartler eğri biçiminden, daha fazla yana yattığından, normal kare
Eğik
Metin içinde rengin kullanımı riskli bir iştir ve renkle vurgu yapmak ideal hir yöntem
(Lynch ve Horton, 2004g).
okunurluğu azaltıcı
pikselızgarası çelişir ve düşük çözünürlükteki
Renk; sayfa içinde bulunan diğer görsel elemanlann etkisinden dolayı metinde vurgu
olarak kullanıın\ zor bir iştir. Başlıklardatutarlı bir şekilde kullanılırsa Vtlfgııyıı arttırabiIiI.
vurgulanacak sözcük ya da tümce
Metnin
Anahtar,
sağlayıcı birçok
altçizgili yazı, renk ve büyük harfler (Hurne, 2005).
kalınım kullanmaktır. Metinde
2005).
özdeşleştirdiği için, kafası kanşabilir (Bume, 2005). Web belgelerinde üstmeün bağlantısı
örnek tümceleri nomıal metine göre içerden başlatıldığı için 'llırgu ögesi gibi
kullanılmaktadır (Lynch ve Horton, 2004g).
verebilir (Gillespie,
ve tırnaklı yazıların düşük çözünürlükte okunabilirlikleri
azalmaktadır,
Vurgulama yaratmak tasanmın ve dizgiyi yerleştinnenin önemli Ve ayrılmaz
bu
yüzden metin bloklannda kul1anllmaınalıd!r.Tımaksız Yüzıların eğik olarak kullanımı
bir parçasıdır. İyi ayarlanmış etkisİ ve karanyla vurgulama okunı
tırnakıılaru göre oku~urhüuğu
yönlendirecek ve bilgilendirecektir. Vurgulama eksik olduğunda, ya da
Kısa
daha az etkilemektedir. (Webdesignfromscratch, 200Sg).
gereğinden fazla '\1.1rgulama yapıldığı zaman, dizgi, basılı bir sayfada
tümcecikleri ve sözcükleri vurgulamak için eğik yazılar oldukça kullamşhdır.
Yabancı tümee
kamıakarışık olmaya başlar ve okumayı zorlaştırır (Sarıkavak, 2004, 138).
ve deyimlerin yazımında, kitap listelerinde ve periyodik başlıklaıda
kullarulabilir (Hutne, 2005). Vurgulamada eğik yazıların tercih edilmesinin nedeni,
CıüzerH yapıdab sapmaları algılamada
2(05). çünkü göz hemen
insan beyninin çok güçlü
aykın satıra atlaına yapar
olmasındadır
(GilIespie,
Web sayfa tasanmında vurgulama yapılırken seçilen yazının ekran üzerinde kullanımına
dikkat edilmelidir.
(GÖrüntü:87).
3.2.5
Büyük - Küçük Harf Kullanımı
Büyük-harfya da küçük hamn kullanımı metnin akunurluğu üzerine güçlü bir etkiye
sahiptir. Büyük harfleri taramak zor olduğu için, metin içinde kısaltına ve kısa adlarla
birlikte yer ve kişi adlarında kullanmak uygundur. Sözcükleri dizerken kısa başlıklar hariç
(Görüntü:87) Zıthk algılamayı güçlendirir. Örnekte görüldüğii gibi eğ\k olan hemen algılanır.
Altcizgi; (Underline)
hasılı
ürünlerde harfe yaptığı olumsuz etkiye rağmen bazı
tasanmcılar tarafından vurgulamak
için kullanılır. Web tasanmında altçizgili metinler
bağlantı olarak kullanılmaktadır. Eğer a1tı;İzgili metne bağlantı
kullanıcının yanı sıra
108
1
konma.zsa, nonnal
renlc körü kullanıcılann da, bağlanhyı a1tçizgili metin bağlantısı ile
büyük harflerin kullanımından kaçınmak gerekir. çünkü sözcükler harf harf aynştınlarak
bütün olarak okunur ve tanınır (Göıüntü: 88).
değil,
"Aynı büyüklükte kutu ölçüsünde olduklarından ve harfler arasındaki
3.2.6
Yazı
Ölçüsünün Sayfa Yapısın. Etkisi
karşıtlık azaldığından metinler için büyük harf kullanrnayın!. Büyük harfler
Yazı ölçü:;;ü ekran üzerinde değiştirilmesi en kolayetkendir. Ölçü, içeriğin hiyerarşisini
bir sözcüklük bilgiler için kullanmak yararlı olabilir. Fazla kullanılırsa
vermek için önemli bir araçtır. Font ölçülerindeki değişikliklerle içerik, önem
etkisini kaybeder. Hepsi büyük harfii olan metinleri okumak hem yorucu
vurgulanabilmektedir.
Başlık ve
sırasına göre
alt başlığın ölçüsü, ana metin ve dipnotun ölçüsü sayfanın
hem de yavaştır çünkü ayın ölçüde olduklanndan tanınırhkları
geneline büyük etki edebilir (Buille, 2005). Web sayfalannda, başlık aLt
azalmaktadır" (Görüntü: 89)(Webdesignfromscratch, 200Sg).
metinde üç farklı punto kullanmak yerinde olur. İçerik. dışındaki yazılarda ise farklı
ölçülerde font kullanılabilir (banner reklam,
AYNI BtnrüKLüKTEKUTUÖLÇÜsüNDE
OLDUKLARıNDANVE HARFLER ARASINDAKİ KARŞıTLıK'
AZALDıGINDAN METiNLER iÇiN BÜYÜK HARF
KULLANMAYıN',
(Webdesignfromscratch, 200Sg). A)TIca
özelliklerine de
sıkı sıkıya bağlıdır
(Görüntü: 89) Büyük harflerin okunınluğu zordur.
sık
ölçüsü
menüsü ve
bağlantı
yüksekliği, punto*
birimiyle tinlimlanır. Genel geçer biliuirliği olan ve
oluşmaktadır.
Harfboyutları karakterlere
okunmalan oldukça zordur. Küçük harflerin kullanımıyla oluşan sözcükler ise biçimsel
dizgelennde de
farklılıktan dolayı ba.kan kişinin dikkatini kolayca çekebilmektedir (Görüntü: 90).
Macintosh'larda en az 2,3 punto küçük görülebilmektedir (Göri.intü:92)
değişik
göre
değişmektedir aynca
~_.-
komutlar
kullanılmaktadır.Başlık,
çoğunda standart
(Onınsay,
altı
tane komut
2001, s.74).
punto belirleyen
alt başlık, dipnot gibi yazıları hiyerarşik bir
yazmak için <H>, </HI>, <1H2>, </H3>,...
sayesinde Ölçülerde
ayru puntoda karakter farklı bilgisayar
boyutta görülmektedir. PC bilgisayardaki 12 punto yazılar
Web sayfa tasanmında kullanılan programlann
-
Yazının
da etkiler.
Büyük hartlerle oluşturulan sözcükler, tekdüze dikdörtgen olarak algılanacak.lanndan
i
etiketlerinde ..)
sayfanın diğer karakteristik
kullamlan fontlann bir kısmı ekran fontu olarak tasarlanmıştır ve 8,9,10,12,14 punto "gibi
standart ölçümlerden
Monoton
MONOTON
ıQii(DORroENLE~ Dı1Cdörtgeuıet
ve ana
( sütun ve sa11r yüksekliği gibi) (Hume, 2005).
büyüklüğü satırın uzunluğunu ve aralığını
Bir yazı karakterinin
dolaşım
yazı
başlık
uygulanır. Bu
hazır
şekilde
komutlar
hıtarlılık sağlanabilir.
(Görlinili: 90) Büyük harfle yazılan sözcükler tek düze olduklarından akunurluğu zordur, kiiçük
harfler biçimsel farklılıklarından dolayı dikiGıt çekicidir ve hızlı okunur.
Başlık, alt başlık ve metin için sözcük ya da tümcc başı sözcüğün ilk harfinin büyük
yazılması önerilir. öncelikle sözcüklerin üst kısIIlllll taradığından, Küçük harflerin yapısı
okunurluğu destekleyecek biçimdedir (Hurne, 2005). Aşağıdaki örnekte de görüldüğü gibi
küçük harflerin üst yapısı. sözcükleri daha hızlı algılanır yapar (Göriintü:91).
Anal
Arial Black
An"ı lnac:Jıı::
AfI~1 Nan","'
~N~""lOJ
Arial Rounded "'IT Sold
Bcck .A.ntıqua
Bookman old Style
Century Günııe
Century S"hQdbook
EoomaL Old :.'ltc/l'"
ç('n~~ry
Gol",,:,
'::.:ntur:;r
Sclıoalbrok
Couı::ie:ı:- Neı.]
COur.1E::ı:: ll~w
C=-ıond
G"=~nd
MS
IIS l.J.LeD:ı::ıı"
LıneDraw
Tımes
(GÖrüntü:91). Tümccnİn üst yansı alt yansmd<:ın daha iyi okur.
Arial Ro.m.. d Mr aold
BOClk Antıqua
New Roman
Verdana
T=N,w:<.D=
Verdana
(Göriin1ii:92) İki farklı bilgisayardaki fontların karşılaştınlması (Onursay, 2001, ~.74)
1110
.. Punıo: ABD kökenli olup tüm dünyada kabul gören harf karakterlerini
ölçümlendirme birimi.
ul\ıslararası
j
II
i
Harf Aralığı, Satır Aralığı ve
3.2.7
boşluk (aralık),
Beyaz
elemanlann
metinlerin
akunuduğu
etrafındaki beyaz boşluk, yazı
boşluğu olarak
bilinir. Beyaz
boşluk,
Satır Uzunluğu
yaşamsal
için
önem taşımaktadır. Görsel
bloklanna uygulandığındaciIr payı ya da kenar
Metin bloğu üzerinde her bir satırın başlangıcını
kolay bulmamıza yardım ettiği için yararlıdır.
Beyaz boşluk sayfa başlığının belirginliğini arttırmak, metin ile metnin başlığı
ilişkiyi
güçlendirmek için kullanılır. Başlığın yeri hemen
altındaki
kendinden önceki paragrafa yakın olmamalıdır. Paragraf ve
ya da yakınlıklarınsağlanması ile içerik daha iyi
Boşluklar
ile harf aralığt ya da
satır aralığı
olarak
sunulmuş
içerik
başıtkıarda
arasında
metnin yatay uzunluğu ile satır arasındaki yükseklik, iletinin biçimini ve okı.ınurluğunu
farklı bir şekilde etkileyebilir. Aşağıdaki örnek iki tümcede de görüldüğü gibi satır
uzunluğu satır yüksekliğini etkilemektedir. Pratik olarak genel kural, seçilen satır
yüksekliği değeri, satır uzunluğuna göre fazla ise okunurluk için daha fazla satır anılığı
gerektiğidir. çoğu web sunucusu ön değer olarak 1.2* değerini at:u. Tipografıstler 1,4-1,6
arasındaki SıJtır aralığı değerini önermektedirler (Hume, 2005) (GÖrünru:94).
olmalıdır,
gerekli
::ıralıklann
olur_
karşılaşılır. Ayrıca satır uzunluğu
da
Satır yüks~kliği de (inemin satırları arasındaki boşluk ÖI,-=CUllÜ)
o~ııı:ı~rluk üzerinde önemli bir etkiye sahiptir, Eğer sJtıriar
bırbırıne çok yakınsa okudUğumuz sözcüğün bıılıınduo-u satır
üzerinde gözlcrimizi tutmak zor olacakt1r.
'='
genel boşluğun alanını belirler.
Harf aralığı, harf "Ve harf gruplarının tek tek okunabilmesi ve sözcük olarak
algılanabilrnesİ
için harf aralannın belli bir oranda
olması
gerekmektedir. Sözcüklerin
okunmasma yalnızca şekilleri yardımcı olmamaktadır. Aynı zamanda sözcüğün iç
yapısına
da bakılır. Bu nedenle, uygun,
arasındaki boşluk)
görüldüğü
,
lı
dengelenmiş Mrfboşluğu (sözcüğün
okunurluk için önemlidir (Savio, 2005).
gibi, harf aralan ne çok dar ne dc çok
Aşağıdaki
geniş olmalıdır
harfleri
(Görüntii: 93).
aralığı okurluğu etkıler Bu yuzden har'
i~diımesi
:arf aralığı okurluğu etkiler. Bu yüzden hali aralığına dikkat
gerekir (Normal).
Harf
aralığına dıkkat edılmesı gerekır (Geniş).
(Görüntü: 93) Harf aralığı okurımluğu etkiler.
(metnin
bir etkiye sahiplir.
satırları arasındaki boşluğun ölçüsü),
Eğer satırlar
birbirine çok
üzerinde gözlerin tutulması zorlaşır.
satıra
geçmeyi
güçleştirir (Sa"Vİo,
Diğer
yakınsa
taraftan,
okunurluk üzerinde önemli
okunulan
-
örnek denemede
Harf aralığı okurluğu e1Kiler. Bu yüzden harfaralığına dikkatediknesi gerekir
(Dar).
Satır Aralığı
Satır YÜJ.~sekliği de (metnin satirları amsmdald boşluk ölçümü)
okunııduk üzerinde önemli bir etkiye sahiptir. Eğer satırlar
birbirine çok yakınsa okuduğumuzSÖzcüğün bulıınduQ.ıı satır
,
üzerinde gözlerünizi lutmak zor olacaktır.
sözcüğün bulunduğu satır
gereğinden fazla boşluk
ise alttaki
(Görüntü: 94) Sanı- <lralığı okunurIuğu etkiler.
Satır uzunluğu, en uygun satır uzunluğu (çizgi başına düşen karakter sayısı) ile ilgili
birçok görüş vardır. Ama, idea! uzunluk, harfin boyutu gibi ikincı bir faktör taraflIldan
belirlenir. Okuyucu için ana ölçü, sonraki satınn başlangıç noktasına rahatlıkla
geçebilmesidir. Satırlar çok uzun olursa bu oldukça güç olacaktır. çünkü, gözün hareket
edeceği aralık uzar ve sonraki sattra geçmesini geciktirir, gözü yorar. Diğer taraftan, eğer
satır çok kısa olursa okuyucunun gözleri sık sık sat1flO dışına çıkmak zorunda kalır
(Savio, 2005) (Görüntü:95)_ Dikkate alınan ideal satır uzunluğu, bir satırda 60 ya da 70
karakter (noktalarna ve boşlUklar dahil) (Savio, 2005) beliniLse de ekran ya da .sayfa
üzerindeki sözcüklerin düzenlemelerinde, hmiJerin boyutu, boşluk ve şekiller satır­
uzunluğunu etkileyebilir.
Dıi;jer laraftan, eğer
satır ço~. kl~a
sık sık satırın dışına
20(5).
çıkma~.
Web
sayfalarına yazı yerleştirildiğinde
cn önemli ayntl
olursa
okUYucunun gözleri
satır aralığı
sorunudur. Ana
zorunda
kalır
(Görüntü: 95) Satır kısa olursa göz satır dışına çıkar.
• Karakterin alt çizgü;i ile üst çizgi arasındaki uzunluk 1 değerdir.
mj
Zemin Yazı İlişkisi
3.2.8
Yazının okunurluğunu etkileyen önemli nedenlerden biri de zemin görüntüleri üzerinde
yazının durumudur. Koyu değerlerin hakim olduğu bir görüntü üzerine siyah bir yazı
tayf, ışık olarak algıladığımız şeydir. İnsan gözü bu dalga boylarının bir kısmını
görmektedir. Göz, kımıızı ve mor arasındaki 400-700 nm' lik
okunmayacağı gibi, açık değerlerin hakim olduğu görüntü üzerinde de beyaz yazı
okunrnayacaktır. Böyle bir durumda yazının akımınıuğu için zemin ile zıt gölge ya da
Bir tasarım öğesi olan renk.,
kontur kullanılması gerekir (GÖrüntü:96).
modeli (ROBI
Basılı -ürün
(Görüntü: 96) Arka plan görüntüleri okunurluğu olumsuz yönde etkiler (Gillespie, (ty».
3.2.8
Tipogra/i ve Tutarhlık
Web sitelerinde tutarlılık yazının seçimi, punto~unun hiyerarşik yapıya göre uygUlı
kullanımı satır ve harf aralığının iyi ayarlanmasınabağlıdır. Başhğın ölçüsü paragraf
boşluğu gibi ayarlardaki tutarlılık izleyiciye güven verir. Saymış olduğumuz bütün
tipografıköğeler okunuduğu da etkilemektedir. I'vl~s;'!. üstü yaymeıIıkta tutarlılık kuıı~mlaıı
sayfa stiııeri tarafından nasıl sağlanıyorsa web sayfa tasanınlarında da CSS (Ca~cadıııg
Style Sheets! basamaklL sayfa biçem dili) olarak adlandırılan yazının ~atır, lıa~. ve
boyuhmun kademeli olarak hazırlanıp istenildiğindekullanılmasım saglayan bır
tanımlama dili ile sağlanmaktadır. Aynca yazı biçimleme dili sayesinde başlık, alt başhk
ve ana metnin bütün web sayfasmda aynı ölçülerde olması s~ğhmır. Bu dizge sayesinde
sitenin tutarlı olması sağlamr.
iletişim afactnın
ve ekranda farklı dizgede
(Cyan Imavi,
E
LAYOUT'LARDARENK
Renk fiziksel bir oluşum olmanın yam sıra insan psikolojisini etkileyen önemli bir tas~r~ın
öğesidir. Farklı iletişim araçlarındafarklı soıunlarlakarşıımza çıkan rengin bileşenl~nnı
ve özelliklerini renk kuramları başlığı altında, ~ha sonra da tasanın sorun1an başilgı.
altında rengin yanlış kullammmm ne gibi tasanııı sorunları doğuraçağına dcğinilecektır.
3.3.1
Magenta/kl1"lliıZı,
Eklerneli renk modeli
ışık renk
çalışır.
renk modeline göre
birleşimindendiğer renkler
araçlar için eklemeli renk
için çıkarmalı CMYK
Yellow/san Black/siyah) renk modeli kullanılmaktadır.
temeline
Mavi,
yeşil
dayanır,
bilgisayar, televizyon gibi ckranlar bu
ve kırmızı renklerin
farklı miktarlarda
meydana gelir (.k.ımıızı+yeşil: sarı), bu üç rengin
kullanımı beyazı,
üçünün yokluğu da
Çıkannah renkler
ise,
yansıyan ışın
çalışmaktadır. Sayısal
redlkırmızı, GreenJycşil, Bluelmavi), basılı araçlar
1114
eşit
miktarda
siyalıı oluşturur.
kullandığunız boyaları
esas alan renklerdir, boya maddesi üzerine
bir ktsmını emer, bir kısmını da yansıtır. Yansıyan ışık boya maddesini
rengini verir. Pigment olarak adlandınlan bu boya maddelerinin üç temel rengi
vardır;
nıavi. kırınızı, sarı.
yeşil,
tunmcu).
vermesi
Baskı
Bu renklerin
kanşımından diğer
ikincil renkler oluşur (mor,
dizgelerinde mavi, kırmızı ve safiya son renk olarak basılan üıiine derinlik
amacıyla siyah eklenmiştir.
HSV renk moddi, (hue, saturat.ion, value! ton, doygunluk ve
vardır; ÖZ,
doygunluk(
matematik.
tabanına uygunluğundan
HSV dizgeyi
tüıii)
ayrıca
değer),
rengin üç ana
bileşeni
yoğunluk) ve değer (açık-koyu). Bilgisayar işletim dizgelerinin
BSV renk modeli kullanılmaktadır (Görüntü: 97).
RGB ve CMYK dizgelerini üzerinde barındırmaktadır. Hue, (rengin
rengi birbirinden
ayıranniteliğidir (kınnızı,
san...).
Diğer
bir
deyişle, renklerin
birbirinden aynlmaslIla yarayan davranıştır. Saturasyon (Satmation i Doygunluk), rengin
yoğunluğumı işaret
yaklaştığını gösterir
ve
rengin saflığı, berraklığırn veya
eder. Bir rengin saturasyonunun
(pastel renkler). Valör (Value i
azalması ile kazandığı niteliktir.
tanımlanmaktadır(Seylan,
Rengin,
açıklıkw
azalması onun
gri etkisinc
ışıklılık değeri),
koyuluk
rengin
Renk Kuramı
(Görüntü: 97) HSV Modelinde Rengin Dunımlan (McClurg, 2005).
doğru
ışığın artması
değerleri olarak
2005, s. 99-100).
Renk fiziksel bir oluşumdur, ışık ile birlikte var olmaktadır (Uçar, 2004, 5.168). Re~,
görül~bilir tayf içinde, farklı ışınım dalga boylanna gözün verdiği tepkidir. Görülebılır
bir)
durumuna göre farklılıklar içennekterlif.
doygunluğu anlamında kullanılmaktadır. Ayncu
3.3
(nanometredir/trilyond<ı
bir dalga boyuna cevap verebilmektedir (McClurg, 2005).
da
{nca Web'teki RGB renkleri l6'11k hexadecimal kodıa temsil edilmektedir. Örneğln
IOAAFF kodundaki 6 birim sırasıyla kırmızı, yeşil ve maviyi temsil eder. Koddaki ilk
-'ların kırmızıyı.
'ların yeşili, ff~lerin de maviyi simgelediği söylenebilir (Parise.
Aşağıdaki
örnekte (Görüntü: 99)
parlaklığın (parlakhk kontrastlığı) okımlJrlu..'<. üzerine
etkisi görülmektedir. Lacivert zemin üzerinde
sarı
renk ve kınnızı üzerinde
açık
mavi daha
iyi okunmaktadır.
Renk çemberi üzerinde birbirini karşılayan renkler, tamamlayıcı kontrast olarak bilinirler.
105).
Tamamlayıcı renklerin, parlaklık değerleri
er birim O'dan 9'a ya da A'dan F'ye bir değere sahiptiL Bir F değeri tam doymayı
,aturation=doyma) ifade eder. #OOAAFF kodu mavi rengidir. Kulianılan O (sıfır) değeri
doyınayı ifade eder. #OO.A.A.FF örneğinde kırmızı rengi yakuır. Aradaki tüm renkler renk
oyumu ye açıklıkkomı::iundadeğişen değerlerle gösterilir. Eğer kırmızı, yeşil ve maviye
ynı değeri verilirsc, siyah, beyaz ya da bu ikisi arasında bir gölge (ton) elde edilir. Yani
FFFFFFF beyaz, #000000 siyah, #CCCCCC gridir (Parise, 2005).
~eb tasanmında hexadeeimal kodla kullanılarak sayfa içindeki renklerde tutarlılık
ağlanmaktadır.Aşağıda bazı temel renkler ve onların hexadeeimal kodlan (karşılıkları)
ıerilmiştir (GÖrüntü:98).
bir birine yakm ise gözde titreme etkisi yapar
(Göıiintü:lOO).
Renklerin etkileri bulunduklan ortamdaki
diğer
renklerin etkisine göre de
değişmektedir.
~ynı renk farklı renklerle bir araya geldiğinde farklı elkiler gösterir. Örneğin san renk,
sı.y~hla
bir araya geldiğinde uyan ve dikkat çekici bir görevi üstlenir. Sarı ve yeşil bir
bınne komşu oldukları için,
renk olduklanndan enerji
gerilim oluşmamaktadır. Sarı ve kırmızı her ikisi de sıcak
etkisİ yaratırlar (Görüntü: 101).
Her renk diğer bir ya da birden fazla renk ile bir arada kullanıldığında değişik görsel
etkiler gösterirler. Örneğin sıcak-soğuk renk kontrast1ığınınyanı sıra renklerin ton ve
doygunluklarına göre,
ekran için uygun renk
bileşenleri oluşunulabilir. Aşağıda sıcak­
s~ğu.k., sıcak-sıcak, soğuk ve soğuk,
akromatik-kromatik ve ton değerleri ile ilgili
bıleşenler görülmektedir (Görüntü: i 02).
"",,,,,;llhnlı:le<
I:llnIllo:u.·*EF,II..MIO
_=4'~r;ışi.i'!"rb,-1~~&~fsıı;ı'W;yt._gmı-"JIr~
':
(Görüntü: 99)
Parlaklık kontrastIığı
(GÖTÜntü:l00) Görüntü:
Tamamlayıcı kontTastlar.
(Görüntü:93) 3azı. temel renkler -,e onl?rm hex"~ceçi!Ual kodlan.
(Görüntü: 101) Renk:
tarklı
renkler ile bir (mıya geldiğinde değişik etkiler gösterir.
Hexadeeimal kodlar sayesinde web sayfalarındakifarklı formattaki dosyalar arasında
sağlayarak tutarlıltğa katkıda bulunur. Örneğin bir f1ash prognımında yapılmış" .swf'
uzantılı dosyanın, zemin rengi ile aynı olması için hexadeeimal kodların kullanılması
gerckir.
Renkler diğcr bir renkle etkileşim halindedirler. Tasanmcı renklerin doygunluğunu,
lc:ontr::ı.sthğını, par1a.1dığını, tonlarını ve derecelerini (SLcak-soğuk) bilmek zorundadLr.
Renklerin doygunluğu rengin diğer renklere kanşmaması ve saf olmasıdır. Renk
doyguniuğu yOKsa o akromatih bii· renktir(gd, beyaz y:ı da s!y~h).
Her bir renk kendi parlaklığına sahiptir. Ekran üzerinde görünen renklerin bir birleri ile
farklı kontrastlıktarda etkileşimi metinlerin okunurluğunda önemli bir roloynar.
\ 116
•
!\oıı1l tOJl!,ınwL ~'lllıııı>""
(Görüntü: 102) Her renk
farklı
renkler ile bir araya
geldiğinde değişik
etkiler gösterirler.
3.3.2
Rengin
Kullanım Sorunları
Renk, l'arklı ortamlarda, dikkat çeken, belirli duygular yaşatan, cezbeden, iğrendiren,
kızdıran ve kandıran bir yapıda algılanabiliL Web sayfalannda da benzer etkiler yapar.
"Özellikle geniş yüzeyli ekran tasanmlannda gözlerin odak noktası renktir. İlkönce renk,
sonra resim, semboller, amblem, logo sözcük ve türnceler gelir. Rengin algılanırlığı diğer
daha
fazladır {Şener,
t 997, s. 51). Bu yönüyle renk,
otlakhmılmaşıııı s(lğlar.
yöne
doğru
Aktanlacak iletinin ilk önce
ve turum;u renk ekran üzerinde güçlü bir vurgu
da bilginin
olduğu
sağlayabilir (Onursay
2001,
s.S2). Çünkü sıçak renkler yakınlık hissi verir ve göstergenin daha çabnk aigılamnasıııı
sağlar. Soğuk renkLer ise uzaklaşma hissi uyandınr. Örneğin mavi ve mor zemin
renklerinin hakim
Renk, mesajı iletıneye yardım eden, en önemli tasarım aracıdır. Renk. içeriği vurgularna,
ön plana
tasarlarna, ayırma, kişisel VUTguyu aktannada kullanılır. Renkler, "iyi kullanılıp bilinçli ve
bir görsel
zevkli bir yaklaşımda düzenlendiğinde;İşleve hizmet eden tasanm öğesi olabilir" (Uçar
Renk, bilgiyi
2004, s. 46).
oluşturan bileşenleri, durumlarını
sonm ile başa çıkmaya çalışırken bir yandan da renk öğesini tasarımın bir
istenen kısmına
algılanması ya
gözün hareketi için dikkat çekici renklerin kullanımı önemlidir. Bu bağlamda
kımıızı, ij<ın
görsel elemanlardan daha fazladır" (Şener. 1997, s. 51).
"Grafik tasanmcı kavramsal çözüm, tipografi, kompozisyon gibi pek çok
tascı.nmın
olduğu bir
çıkarılabilir veya
sayfada kullanılacak başlık yazısı
ton
değerleri değiştirilerek aşIn
hiyerarşi oluşturması
öne
sıcak
bir renk yardımıyla,
çıkması ve
sayfada yanlış
engellenebilir (Uçar, 2004, s.46).
sımnandırmayayarayıp anlaşılır hale
ve
diğer
getirir. Bu nedenle
tasarımcı rengi
unsurlan bilmek zorundadır. Renk sayesinde
bilgi ekranda etkili bir şekilde organize edilebilir. Renk, ekranda bilginin düzenini ve
bölümleri vurgulamak için kuııanılır. Ayrıca:
elemanı olarak oluşturmak durumundadır... Renk ve ton değerleri sayesinde
• Bilginin üzerinde dikkati sürekli
biçimleri, tipografıyi, ön planı görünür kılar veya arka plana iteriz. Renk
örneğin "Yenİ!"
kılmak
için uyan iletilerinde kullanılabilir,
gibi.
görsel hiyerarşiyi organize etmek aşamasında önemli bir etmendir. Renk
• Bilginin sımflandınlması, gruplandınlmasındave birbirleri ile yakın ilişki kurula
konusu içinde renklerin tek başlanna analizlerinin yanı sıra birbirleriyle
bilinmesi ü;in
:iişki1eri de değerlendirilmelidiL"(Uçar 2004, s. 45)
• Nesneler, birbirine yakın renk
kullanılarak, kullanıcının
hem
kodlaması hem
de
kolaylıkla gruplaması sağlanabilir.
Renk tanımlayıcılığı, ayırt ediciliği, yön göstericiliği ile web sayfalarının en önemli
• Sembololarak renk kullanılabilir. Örneğin sıcaklık. artışı göstcnnek için sandan
öğelerinden biridir. Okuyucuyu etkileyerek ilgiyi diri tutar. Tasarımcılar da, "bilgiyi
kırmızıya doğru rengİn geçişi
iletmek (akılda tutmak), dikkati tasarım yüzeyinde denetleyebitmek ve etkileşimi sürekli
a Bilginin
kılabilmek için sık sık renk öğesine başvururlarlı (Şener, 1997, s. 5 ı).
Web sİlelerinde renk etkili olarak nasıl kullanılacağı ciddi bir sorun olarak. tasarımemın
kullanılabilir.
Görsel
gösteriLebilir.
taranmasını kolaylaştımıak
algılamayı kolaylaştınc1
etkisi, rengi
için
başlıklarda
diğer öğelere
renk kullanılabilir.
oranla öncelikli kılar.
kar:;asma çıkmaktadır. Hiçbir tasarııncı tekdüze bir sayfa tasarımı yapmak istemez. Aynı
Zıtlıklan yaratmada
zamanda kullanıcılar da bu tür tekdüze sayfayı görmek istemezler. Hiyerarşiyi sağlamada,
düzenlemeye boyut katmak önemlidir. İzleyiciyi tasarıma baktınnak onu: duraklatmak için
önemli öğeleri vurgulamada, zıtlıklarla tasanma hareket veren renk, çogu yerde yanlış
zıtlıklardan yararlanılması gerekir. Zıtlık
kullanımıyla ciddi tasanm sorunlarına neden olarak karşım1za çllcmaktadrr; yoğun
sağlanabilir. "İzleyiciyi tasanm içinde gezdirrnek görsel bHgiyi sunmak için onu uyarıcı
kullanımı ile ilgiyi dağıtmakta, zeminde yanlış kullanımıyla okunurluğu, bağlantılarda
zıtlıklardanfaydalaıımamızgerekmektedir. Eğer tasarımda
yapılan hatalarla dolaşımı etkilemekte, yetersizliğiyle de ölü bir doğa görüntüsü
yok ve
sergileyebilmektedir.
Hiyenrşiyi sağlama.ja rengin klillammı: Elcran tasanm!:!!"!I!da ilk önce algılanan renk
hiyerarşiyi sağlamada da etkili olarak kullanılmaktadır. öncelikle ne algılatılmak
renk de ona "göre "k"ııllanılmalıdır. Rencrin
algılanırlığı diğer görsel elemanlardan
L'sten~vorsa
,
o
1
11 8
sıradan
rengin
kullanımı: Güçlü, canlı
ve hareketli bir tasanm için,
boyut ve biçimin yanı
sıra
renk ile de
renk, biçim ve boyut zıtlıklan
ise okuyucu ya da izleyici hemen sıkılacaktır" (Onursay 2001, s.83-84).
Zeminde kullanılan renk ile ön planda kullanılan yazı ve grafikler
arasında oluşturulan
zıtlık, nesnenin algılaıımasInıkolaylaştırabilir.
Arka planlarda renk kullanımı: Rengin kullanımmda yap11an en büyük hata, arka plan i
metin renklerinin yanlış seçimidir.
"Eğer kalitesiz
renk bileşimleri kullanmak isterseniz
ıetninizi okunamaz hale getirirsiniz". Metni okunaklı kılmak için, arka plan renklerine
ikk<ıt etmek gerekir (Johnson, 2005). Pek çok tasanmcı, zemin rengi ile metin rengine
ikkat etmez, hatta parlak mavi ve parlak kmnızının büyük bir renk bileşimi yaptığını
üşünfu (Görüntü: 103). Metin / arka plan renklerinin seçimi akıllıca yapılmazsa, çabalar
..._- " " N ,
~.c~
."'>
"..,,~
. "' c-" ".,....","',-
.. ," ',.. ..,'_ . ,'''',
..'.... ..•"
.•"''' __
imamen boşa gidebilir. Uygun renk ve ton bileşiminde zemin rengi kullamlrrs3 tırnaksız
.~.",
~
~"
~
-~"iW'
~
~.~
~
,.o~".J,
_.A.. , _ . ; , ...~ .." ",,' ,..,.".,."'" •."'-_"
.....
'_~"'~.
,.~,
~
'~
'~', "."..,~_.",.
'~'~"'_r_'''''''-''"''''''"~~;'''''_·'·''_c~.~_·
•_ _... , .....".-·~ ... ".__ ,~·.,_."·~"..'· ','.i ",,,,·,.,·
-azı tırnak1ıya göre daha okunur olmaktadır.
J;"Z'.!::. ."" ~"'-... ,~~
~:,~;:...;,;:-.;:
""',''''
_
...
'~ ,",_~-'"
, ,."',..,.,,_~ .-l'." . • ,
-",,_,~ ~r_··
~
"" <,,.•. "--<~,
...,..-_., m ._••__ , ,-,~,,.. ......
.T"·' ,"', _~.",'."
.' ~ '.'~ ,,_"""'.>
""~""'" ~
''''',
(Görüntü: 103). Mavi ve kmnızı obmurluğu en az renk bileşimidir.
~i~
3eyaz arka plan üzerine yazılan siyah metnin okunurluğudiğer renk bileşenlerine göre
:laha yüksektir. Eğer siyah metin için zC'min rengi kullamlacaksa okunurluğu
:tkilemeyecek şekilde en açık ton kullanılmahdır. Aşağıdaki örnekte (Görüntü: i 04-105)
nka plan gri ve beyaz olarak. yararlanılmış iki görüntüden arka planı beyaz olan daha
~-"~
(Görüntü: 106) www.hea.net HEAnet web sayfası.nda alt ve üstü bantlı site logosunun zemİninde
beyaz, içeriğin bulunduğu almıdu mavi renk blHanılmıştir, Bu durum içeriğe odaklanm<ıyı tamamen
zorlaşhrmaktadır (Webdesignfromscratch, lOOSb).
yabuk algılanmaktadır. Kontrastlığın yüksek olması algılamayı güçlendinnektedir. Diğer
örnekte de, HEAnet web sayfasında alt ve üstü b<Ultlı site logosunun zemininde beyaz,
Bağlantı
içeriğin bulunduğu alanda ise mavi kullanılmıştır (Görüntü:l06). Bu durum içeriğe
bağlantılardır.Bağlantı renkleri bilindiği
renkleri: Web sayfalannda rengin
yanlış kullanıldığı yerlerden bİri
de
gibi e-yayınlarda, parlak mav! \Le belirtilmiş
odaklanmayıtamamen zOTlaştırmaktadır.Dikkat edilmesi gereken diğer bir nokta da metin
üstmetjn
kenannda beyaz boşluğun bırakılmasıdır. Beyaz alanlar okumaya, göz taramalarına daha
metinlerden aynmıııı göstermek için kullanılan bu metot oldukça etkili bir yöntemdir
elverişlİdir daha çabuk göze çarpar. Tasarımlarda sıklLkla kutlanılan beyaz arka plan
(Niederst, 2003, s.386). Mavi renkte üstmetin
bağlantılarmı göstermek
için
tasar!anrr!.1ştır. Bağlantı
metinlerinin
bağlantılan, gösterge
olarak
diğer
uzlaşıımış,
üzerine, içeriği yerleştirmek geleneksel bir yöntemdir. Eğer tasannıda zemin rengi
üzerine tıklanınca başka bir sayfaya
kullanılacaksatutarlılığı sağlamak açısından diğer sayfalarda da aynı zemin rengi
ziyaret edilen sayfalardab bağlantılar bordo rengini alarak o
kullanılması gerekir (Webdesignfromscratch, 2005b).
Eğer tasarrmcı üstmetİn bağlantılaflm değiştirmeye karar verrnışse bağlantıların
gidileeeği anlamına gelen
görsel bir ip ucudur. Aynca
sayfanın tarandığını
gösterir.
her bjr;
aynı renkte olmalıdır.
Bölümleri
"
"i
ayrıştırmada rengin kullanımı: Eğer
bu bölümler
kullanışh bir
içİn farklı renkler
kullanabilir.
sitede belli
başlı
birkaç bölüm var ise
Kullm1ıcıları yönlendirmek
için oldukça
yöntem olmanın yanı sıra bölümler arası geçiş yapmada da oldukça yaradı
bir yöntemdir (Görüntü: 107). Her renk değişimi farklı bir bölüme geçildiğİnİn göstergesi
olabilir (Nieder't, 2003, ,.387).
Benzer işleve sahip elemanlar aynı renklcrle renklendirildiğinde grup olarak algılanırlar.
Kullanıcı arama
(Görüntü: 104-105) www.pixe1gnıplıi1..,dç.sİic~inJcn (,rjiıı;ıl'v~ ai".<:ılıtur~;l';T.ıŞ gö>ü"t'2!er. ScL: aıjin.3l
gÖrÜntü sağ: anahtarlarınıış göriinili, sağ görüntünün kontrast1lğı daha fazladır
(Webdesignfromscratch, l005b).
1120
yaparken renk, yön gösterici roloynar. (Niederst, 2003, s.386). Site
içinoe benzer i~ieve sahip başlık, menü ve alt başlıklarda da renk tutarlığı sağlanmalı site
boyunca ayın işleve sahip olanlar aynı renkte verilmelidir. Menüler dolaşım için önemli
olduklarından
renk ve ton
kullanılmalıdır (Paris~,
zıtlıkları
dengeli
olmalıdır. Bakıldığmda kolay algılanan renkler
2006)
'.
.....ık"'±d.
Ibvy.com
""""..,,,-,._~~
·1.
-
..
.._
._._~
öğeierin renk. uyumsuzluğu, süeyi ölü bir kahve s~tesip.e çevimıektedir(Görüntü: 1 ıo)
(Webdesigntromscratcn,2005b).
..
-
',:7""'O::rl''''·:~""==,,,-
..,-
~--~~
'.
oc::::::ı
~
'7:;-:t':.\:.-~.;:ı
... - __ f7ıil
_ ..
O'
_
,;
(Görüntü: 1071 www.buy.comsitesindeböıüınlerdefarklırenkkr kullanılarak izleyiciye nerede
olduklannı bildirilmek istenmiştir (Niederst 2003,s.G13).
(Görüntü: 108) The Nationul Center for 8upercompııting Arıplications (NeSA) web sitesiniıı renk
paleti doğ.1dan ilham <ıhn<ır<:ık oluşturulmuştUr (http://www.ncsa.uiuc.cdu/AboııtUs/im:iex.bml)
(Wroblewslci,2003).
Renk paleti oluşturulmalı: Web sayfalmnm görsel çekiciliği arttuınak için hangi
renklerin kullanılacağı pıanlanmah ona göre renk paleti oluşturulmalıdır. Renk, sayfaya
kişilik
ve canlılık katar. Ru yüzden,
tutarlı
ve dengeli hazırlanan renk paleti sayfa için
önemli bir öğedir (webdesignfromseratch, 2005b), Renk paleti kullanıcıya benzerlik hissi
verİL
Renk paleti, Ü1Ünün, hizmetin, yaylTIm görsel
hatırlantrken marka
ve renklerle birlikte
aıttınnaktadır (Onursay
kirnIlğini bclleklere yerleştirir.
I.Göruntü: l09 ) D II bl'ın d en b ir manzara ve ondan oluşturulan renk p.::ıjeti ile lasadanmış 10go
(Wroblewski.2003).
hatırlanmaktadır. Renk markanın tanınırilğını
2001, s.79-80). Renklerin uyumu ile
tutarlılığı sağlamada önemli
Site
hazırlanan
renk pakti,
bir kaymıktır. Rcnkler aynı renk tona ailesine ait olmak
zonında değildir. Altematif renk seçimleri olabilir. Önemli olan rengi tutarlı ve uyumlu
kull anınaktır.
çoğu
web sitesi doğadan aldıgı ilhamla renk paleti oluştunnaktadır. Bu yöntem sayesinde
güzet renk. uyumlan oluşturulabilir. Örneğin NeSA web sitesinin i"enk paleti baaır
fotoğrafından oluşturulmuşttır (Görüntü: 108)
(Wroblcwski, 2006).
Diğer
gÖriintüdeki renk
paleti ise Dublin yakınlarından çekilen bir fotoğraftan oluşturulmuştur(Gömntli: ı 09). Bu
tnsanmcılartarafından sık uygulanan
bir yöntemdil".
'il '::.,~':; ..
'"
';~""::"
Renk yetersizliği: Renk yetersizliği siteyi ölü bir görünüme sokar. Yan sayfada örnegi
g6riilen Starbucks web
sayfasında
hareketsiz ve tamamen
faydacıl göıiinmektedir. Markanın yaşam tarzı
istense de, sitenin
im
ıamamında
ciddi renk
karakter
düzenİ eksikliği vardır,
eksikliği
Gri arka plan
logo ile verilmek
gÖtiilmelcte. Zemin ile içeriği oluşturan
(Görüntü: 110) Renk yetersizliğine örnek bİr site; www.starbucks.com
(webdesignfromscratch,2005b).
Çok az renk kullanmak sıkıcı ve hareketsiz görünme riskini arttırır. Renk, elamanları
kırmızı
ayırmanın., gnıplamanın ya da tanımlamanın iyi bir yoludur. Küçük bir renk farklılığıyla
ctrafında dönmektedir
ye koyu renkte kutular yüzünden göz içerikten uzaklaşmakta ve kutulann
(Webdesignfromscratch, 20051').
elemanlar bir birinden ayrıştırılabilir, gözün harcketi sağlanabilir ve farklı bir anlam
katılabilir.
Guardian
Güçlü ve yoğun renk kullanımı: Rengin yoğunlnğu gözü çeker, alan büyüdükçe etkisi
artar. Çok yoğun renlder, gözü daha çok yönlendirir ve pot8nsiyel etkiyi azaltır.
Collegedub'da çok güçlü renk ve kontrastlıklar kullanılnuş, bu yüzden göz aşağı yukan
atlayıp durmaktadır (Görüntü:l1l). Sayfanın ortasındaki geniş bir alanı kaplayan şiddetli
tumncLl rengi, çok dikkat çekici bir renktir, fakat çok önemli bir içeriği yansıtmak için
kullanılmamıştır (Görüntü: 112). Eğer verilmek istenen ileti birineil derecede değilse bu
bir tasarnn hatasıdır (webd~signfromsl..:ratch, 2005b).
", ;;:. . " ı.<!'*,"
.....
.';';I'-"'f.eı..-..
......
~
~,'~
Fotografik görüntü ye rengin yakın
sıralamaktan ve yoğunluğu yüksek
C" :c.::·c:·~·
;ıl:
ııı'l
~.;;.
..
,.....
,-,._.
olan renkleri zeminde kullmmıaktan kaçınması gerekir.
Aşağıda gördüğünüz
Harrah's Casino (Göıiintü:114) web sayfasında fotografik montai
yoğun olan mor rengine bitişik kullamlmıştır. Monın yoğunluğu fotografik göıiintüle~·
•.
..,.,.;~,<'>',-
~=-~~~:-.
kllU:mımı: Tasarımcılarm, fotografik göıiintü.lerİ
o
(Görüntü.; 111-112) Güçlü ve yo~n renk kullanımına örnek; www.collegeCıub.conıwebsitesi
(soldaki) ve onun bir kesiti (sağdaki) (webdesignrromscratcb, 2.00Sb)
içindeki renkIere etki etmektedir. Göıiintüler ren.1derin etkisiyle soluk ve kidi
gözükmektedir. Güçlü bir renk yanında bulunan. r~ngi ve görüntüyü olumsuz yöııc.e
etkililer (Webdesignfromscratch. 2005b\
Çok parlak renk kullanımı: Web sayfalannda çok fazla renk kullaronu gözü yorar.
Örneğin san, basılı üründe rahatlatıcı bir renk iken webde ışık ve parlaklıletan dolayı gözü
rahatsız eder. Bu nedenle parlak renklerin ton değerleri ile oymmması gerekir.
Etkili renk için, kontrollü ve sınırlı kullanım: Çoğu amatör site, ana sayfaıarında çok
fazla renk kullanarak hata yapmış ve görsel kaosa nedcn olmuştur. önemli olan birkaç
rengi seçmek ve onlar arasında uyumu sağlamaktır (Niederst, 2003, s.386). Kullanıcının
dikkatini dağıtacak. vurgulanmak istenilen bilginin etkisinin azalmasına ncden olacak
(Görüntü: 114)
Hamıh's
Casino web
sayfası
(webdesigntromscratch, 2005b]
fazla renk kullanurundan kaçınınak gerekir (Turgut 2004, s.75) Guardian ~itcsinde dikkat
çekiçi renk ve elemanlar fazlasıyla kullanılmıştır (Görüntü: 1 ı 3). Çok sayıda kuııanılan
Tamamlayıcı renk kullanımı: Bilindiği gibi
karşısında
1,124
bulunan renkler kontrast
(zıt)
renk çemberi üZçrinde birbirlerin in
renklerdir.
Tamamlayıcı
(kontrast) renklerin eiler
parlakhk
değerleri
bir birine ya.kJn ise gözde titreme etki:si yapar. Bu tür renk birlcşimleri
okuma)'ı zorlaştırır, daha
ince bir fonHa bu daha güçleşii.
oynayarak okunurluk arttırılabilir, gözde
(Ciörünrn·.115).
Aşağıda verilerı
olmasına rağmen
01l1ekte
Zıt
yaratacağı tiLreşim
görüldüğü
gibi
renklerin ton
etkisi de
değerleriyle
ve mavi bağlantılar ile ııyuşmamaktadır. Ana dolaşım çubuğumin üzerine eklenen sarı
rengi tasarımı bayağılaştınnışnr (webdcsignfromscratch, 200Sb).
a23ltılabılir
kımllZl-yeşil kontrast
iyi bir renk kombinasyonu ile başlarken, sayfanın bundan Somasına kınTIl;>:1 ton hakimdir
bir renk
(Görünlü: 115 sol üst köşedeki kare), kmnızı beyazıa açılarak okunurluk
sağlanmıştır (Görüntü: 115 sağ
alt köşedeki kare;
yeşil üzerİ
pembe
yazı).
i.·<,,_·...... ~,.... ,,~" _
(Görüntü: 115)
Tam,unlayıcı
(Görüntü: 116) RNIB (British organisation for the blind körler için ingiliz organizasyonu) web sitesi
(webdesignfromscratcb,2005b)
kontra st ve y<'Jzı11ln üzerindeki etkileri
Renk körleri için rengin kullanımı: Renk körleri için renIderin slnırlandınlması gerekir.
Web sitesinin zjyaret edenlerin hemen hepsinin normal kullanıcılar olmauığJ bilinmelidir.
Bazı kullanıcılar renk körü olabilir.lnsanlar arasında tam renk körlüğüne
(Monoehroma>:y renk k6rlüğü; bijtün her şeyi siyah-beyaz görür) çok az fast1anır.
Genellikk, birçok renk körü renk yetersizidir,
Kahverengi, mor ya da
blri gibi
ayııı
tıU1.ıncu
kırmızı
gibi kırmızı ve
ölçüde göremezler.
Eğer
yeşili
başlıklara
önemli
almması
oLmadığı düşünülebilir. Anıa pçk
gibi renlcleri iyi görmez1cr.
erişebilmesi
gerekir. Web
isteniyorsa.
sayfalarında
çok insan web sa:iftlI<iiltii
alt
t~ra.ken
alt
dikkat eder. Bu yüzden uygun olmayan renkte bir alt başlık, dikkatllee
renklendiri1miş içeriğin
Birçokları
yeşiL
siteye renk körlerinin de
renk paleti hazırlarken renk körlerinin de dikkate
başlıklarm
ve
içeren renkleri; bütün renkleri gören
renk körleri
tarafından okumnasını
için kınnızı ve yeşil birbiriyle çok iyi uuran
zıt
etkiler (Parise. 2006).
renklerdi!'. Ame
k:ırmızı ve
yeşili ayıt edememe renk körleri arasmda yaygındır. Örneğin içerisinde kırmızı içeren
mor, kahverengi ya da tunlilcu kullanılırsa, onları renk körleri
insana nonna! görunen renkler, renk körleri için
bulanık
ayırt
edemezler. Birlfok
ya da aylrt edilemeyebilir.
bozukluğu
kullanılmaktadır. Renk. :sağladığı psikolojik etkil'le duyguları harekete geçinnektedir. Bu
yönüyle renk, web sitelerinin içeriği ile nyurn içınde olmak zonındadır. Rengin seçimi
hedefkitlenin duygusal yapısma uygun olmalıdır. Örneğin gençler yönelik ~itele-ıde onları
harekete geçirecek sıcak renkler tercih edilmeli, bir sigorta şirketinde ise mavİ ve gri gibi
durgun renJder seçilmelidir. Hedef kitleye göre farklı ctkiler gösteren renklerin gencl
olarak taşıdıkım anlamlar aşağıdaki tabloda verilmiştır,
Renkler taşıdıklan anlamlarla bir ileti taşırlar. Aynı zamanda bilinç altına k,1dlarnalar
yaparak fırnıunın malda kalmasına yardımcı olurlar. çoğu kunım vc ktımluşlar bu renk
kodlarnalanndan yararlanırlar. Coco Cola'nın kJrmızısı, Parleınent'in maviS'i. Vakıf
Bank'ın sarısı ve Garanti Bankası'nın yeşili, renkle özdeşleşen kummlara örnektir. Aynı
zamanda bu fırmalar kurumun fel:sefe:sini rengin yapmış olduğu psikolojik etki ile
yansıtımıktadırlar. Renk kodlamalannın bilinçli bir şekilde kullanılabilmesi iein hedef
kitlenin isteklerinin iyi analiz edilmesi gerekir. Arka sayfadaki tabloda
özel anlamları verilmiştir (Görüntü: i 17).
(Pari'e.2006).
Görme
Rengin psikolojik etkisi: Renk, duyguyu, düşünc.::yi ve iletiyi aktaran bİr araç olarak
orta seviyede olan kişiler için
hazırlanan R..~IB
(British organisation for
the blind)'in sitesinde. ehan elemanlan fark edilecek oranda koııtrasthklarla verilmeye
çalısılmıştır (Görüntü.: llfi). Buna rağmen renk düzeni karışıklık içindedir. Üst soldaki logo
reng:i~ genel ve
Rer'l~
Bilinçaltında
AIg.llanan
p*'
,dı
'4441
';;i
efi'
'.
*'-,"1
SAp
,4
?;
Sıyalı
k3r3nlık
.....
!ililı"wı:mıaariliiA4'
*'
W%
14i;
{Jj'ı'IM?i'l,;o
yas, ölüm,:artt'
~ır
d:.ır,'ıı
lG"Q.142i4 141; bı;;
ım§ıımıs.;
=
II
.i§Il,löl®mi
-ıuıtiMM
karamsanık,
"MıM.
·;::c;:],~
(Görünnl:1 ı 9) IJe Beers web sitesi (http://ww.v.adüımondisfurever.co;nI).
ÇlIM;ı;w
~c>
•
~;,..,~;;,
Göriintü:117) Renklerin taşıdıkları
Kurum ve
anlamları
gösteren tablo
kuruluşlar kunımsal kimlikierini
(Şener,
yans1hc1 renklere daha kunıhış
etkileyecek şekilde belirlemektedirler. Rengin
Beers rengi beyaz
yeryüzünü betimlemek İçİn
'ıe siyahtır (Beyaz;
(Görüntü: 120) Royal Family İngiliz Kraliyet Ailesı web sitesi (hrtp:/lwww.royal.gov.uk/indexohtmi
'Kıırumsal an~amda etkililig~ne şu
örnekler verilebilir; Greenpeace'ta kullanılan renkler rastlantısal
ilişkilendirilirken; kahverengi,
0",.,.,,
1997.s. 53; Kaptan, 1000, s.44).
a§amasmdayken karar verirler. Görsel kimıiklerini ve kurumsal renklerini insanlann bilinç
altlarını
_~
....... -~
değildir (Y cşil, doğa
kullanılır)
ile
(Görüntü: LL ~), De
sat1lk ve temizliği sembolize eder. Siyah; korku ve
Görsel algınm temelinde biçim ve renk yatmaktadır. Tasanın öğesi olarak renk, ne kadar
dikkatli kullanılırsa ileti de i) derece doğru aı...1arıhr. Estetik ve işlevsel bir tasarım için
renk, tasarım ilkelerine hizmet edecek şekilde kullanılmalıdır.
ölümün yanı sıra güç ve zarafeti de gösterir) (Görüntü: 119). Royal Family .!aaliyet
ailesinin web sitesinde de mor renk
kullanılanık;
ruhaniIik ve hükümdarlık5imgelenmiştir
3.4
(GörüntU: \ 20).
LAYOUT'LARDA GÖRÜNTÜ KULLANIMI
Web sayfa tasanmında görüntüler grafik, resim, illüstrasyon y<ı da fotoğraf olarak
kullanılmaktadır. Sayfa içinde görüntünün na.~ıl ve nerede kullanılacağına layout
aşama;;ında karaı- verilse de teknik sorunlar görüntünün kullanımını etkilemektedir. Web
sayta tasanmında kullanılaıı göıiintüler içeriği destekleyecek nitelikte, büyüklük ve
konumu dikkate
alınarak kutlanılmalıdır. Aynca diğer görsel elemanlar arasında olumlu
bir hütün1ük oluşturmalıdır. tşlev~el ve estetik açıdan iyi bir web sİtesinde görüntUnıin
kullanımındabilinmesi gerekenler;
a Görüntünün {omıa.tı; Basit grafikler GIF, fotoğrafık görüntüler JPG formatında
edilirler.
kayıt
(Görlintii: 118) Greenpeace web sitesi (http://www.greenpe~ce.orBi)
• Görüntünün ölçüsü: (i-ötiinHi 600 pikselden fazla olmamak kaydıYle! 72 Dr!
çözünürtükte kayıt edilmelidir.
• Görüntünün rengi: Görüntünün renginde Ye detayında eksikliklerin olmaması
im
için gereken renk ayarları yapılmahdır.
• GIF dosyalar fotoğranar için grafiklerdeki gıbi sonuç vennez. Fotoğrafik
• Görüntüue oluşun çentikler: Metin ve kavisli şekiller anti-aliasing yapılarak
f,ırtıklar düzeltilmelidjr.
• Arka plan sorunları: görsel elemanlann dış çizgileri ile arka plan rt'nkleri
arasında oluşan hale
3.4.1
etkisinin gideriımesİ gerekir (Bakulor, 2000).
JPG (loint Photographic Experts Group) fotografik görüntüyü sıkıştırma üzerine
çalışan
grubun kısaltılması olan JPG, fotoğrafik görüntülerin dosylama biçimidir. İllüstrasyonlar
ve fotoğraflar gibi ç.ok renkli görüntüler ıçin en iyi dosyalıma biçimi JPG dır. JPG
göcüntünün 16 milyon renge kad<:ır göninme:ı;ıne ahmak sağlar. Görüntüleri dosyalarken
JPG'in sağladığı özelliklerin bilinmesi gerekir;
Görüntü Dosyalama Biçimleri
Web sunucuları özel dosya şeklinde kayıt edilen grafikleri gösterebilir. Görünailer, CHF ve
JPG gibi iki temel dosyalama biçiminin yanı sıra yeni kullanılmaya başlayan PNG
biçiminde de
göriintiiltrdı;;;dı;;;ğtr kaybına neden olur (Bakalor. 2000).
kııllanılırlar.
• JPG sıkıştınnadeğişkendir.Aşağı yukarı her bir görüntü için ayn ayrı sıkıştınna
yapılabilir.
• JPG kayıp dizgesidir (Lossy; kayıp görüntü tekniği). Daha fazla k.alite için
Web sayfalarım ziyaret edenlerin mürnkün olduğu kadar kısa sürede görüntüleri
uygulamaııızı daha fazla sı.kışhmıanızgerekir (Gillc::;pic, 2005). Bu dizge ile dosya
görebilmeleri için fotoğraf ya da resimlerin uygun biçimde sunulması gerekir. Bu yüzden
boyutu oldukça küçüıebilir. Tasanmcılarçoğukez, resim
her bir görüntü için en iyi dosyalama biçimini seçmek ve bu dosyalama biçimlerinin
farklılıklannm bilinmesi
önemlidir. Dosyalama biçimleri
görÜlııünün hızını
ve kalitesini
etkiler.
"Dosyanın indirilroe hızı resmin boyutu ile orantılıdır. 28 k modem ile 12 k bir resim 6
saniyede görülebilir" (Bakalor. 2000).GÜniirnÜzde daha hızlı bağlantılarla bu süre
kısaltılmaktadır. Ama
56 k modernle bağlananlarunutulmamalıdır.Tasanın yaparken
bütün izleyici kitlenin düşünülmesi gerekir.
kalite~i ya da dosya
boyutu arasında seçim yapmak zorunda .kalır. Görüntü işleme programlan en iyi
göruntü ve dosya ölçüsünü ön izlernede göstennektedir. Bazı web siteleri verilen
görüntüyü en uygun boyutta ve kalitede tasarınıcı adına sıkışt.ınp öneriler
getinnektedir.
a
Düşük kaliteden yüksek kaliteye doğru göıiintiinün yavaş yavaş belirmesini
sağlayan sunueular sayesinde JPG görünLüler daha kaliteli ve daha az yer
kaplamaktadır.
• JPG dosyalar grafikler ve çizenekler için· iyi bir seçim değildir. Eğer JPG ile
Web sayfalanndaki görüntüler üç çeşit dosyalama biçiminde kullamlmaktadır: GIF; JPG
dosyalama yaparsanız hem boyut olarak daha fazla yer kaplayacaktır hem de
vePNG.
göriintüde beneklenme olacaktır fBakalor, 2000).
GIF, Grafık Bilgi Biçimi'nin
kısaltılmasıdır (Graphic
Infonnation Format). Daha az renkle
görüntüyü daha iyi göstemıeye yarayan dosyalama şeklidir. Fotoğrafik göriintülerin
dışında tablo, çizenek ve sunum gratilierinde
• GIF
dosyaları
GIF dosyalama biçimi
kullanılır.
256 renk içerir.
PNG (Progr.esslve Network Graphics)
aşamalı ağ grafikleri. PNG, yeni bir dosyalama
biçimi olduğundan yeni sunucular tarafından desteklenmektedir. Bu yüzden eski sunucuya
sahip olan iZleyiciler grafikleri göremeyehiliL
P1\G sıkıştmlrnış dosya olarak çok yönlü bir şekilde GIF ve JPG görüntülerin özelliklerini
• Glf göriintüler saydam olabilir. Bazı grafiklerin ve görüntülerin dış kenar
birleştirebilir. Örneğin saydam arka plan özelliği yanı sını milyon rcngi destekleyen
özelliği de bulunmaktadu. Buna rağmen eski sunucular desteklemediği için PNG formatı
renklerinin olmaması, bunun yerine web sayfasının rengi olması istenirse GIF
yaygın olaTak kullanılmamaktadır.
ış
GIF göıünmler yüklenirken önce bulanık görünür dosya indikçe belirginliği artar.
dosyası kayıt edilirken katmanın saydam olması gerekir.
• GIF dosyaları sık.ıştınnalardagörüntü kalitesi en az kayıp veren dosyalardır,
• Ayrıca GIF dosyalan canlandırma olabilir. Basif,lıarekt::t1i görüntüler elde edilebilir
Görüntüyü dosyalama biçimlerinde yaygın olarak yapılan hata
kullanımıdır. Bu durum basit bir şekilde çözülebilir:
yanlış dosya biçiminin
• Eğer bir kaç renkli grafık kullanılacaksa seçim GIF olmalıdır.
i IJO
aı Eğer g;örüntii fotoğraf ya da illüstrasyon ise dosyalama biçiminin lPG olması iyi
bir seçimdir.
3.4.2 Görüntü
çözünürlüğü
Web ortamındaki görüntülerde rastlanılan en önemli sorunlardan biri de çözünürıüktür.
Ekran çözünürıüg-i.'L ekranda gösterilen piksel sayısıdır. Yüksek çözünürlük, görülen
noktacık sayısırun çok olduğunun işaretidir.
Çevirim içi tasanmlarda izleyici ekranlannın öLçüsü ve çözünürlüğü farklı olabilir. ilk
:öriinru: 121) GlF ilc biçimkndi,rilmiş gmfik çiı;im (soldaki). Aynı dosyanın !PG biçiminde kayıt
ediımiş görüntüsü (Sağdalci) (Bakalar. 2000).
yıllarda çoğu ekran yaklaşık 600 piksel yaygın olarak kullanılıyordu ve ekran çözünürlüğü
de 640x480 pikseldi. Günümüzde
artık yüksek
çözünfulükte ekranlar vardır (gOOx400 den
l280xl024 kadar). \Veb sayfasında kullaıulan resimlerin en yüksek çözıınürlüğü72
iö-er taraftan fotoğrafik görüntüıer, lPG dosyalama biçiminde
kayıt edilirken görüntünü
dpi'dır.
72 dpi üzerindeki resimlerin yüklenIlle
sürekıi yüksektir.
l~tesini etkileyen faktörün göz ardı edilmemesi gerekir. Dosya boyutu ve görüntü
ılitesini etbleyen en önemli faktör kalite ile dosyanın sılüştırılmasınınoramdır (Bakalor,
3.4.3 Görünüide Renk Derinliği
J06).
Ekran üzerindeki görüntünün piksellerinin her biri, üç renk iminin
gösterilir:
Renkli
bit)
kınııızı, yeşil,
birçok renkle gösterilcbil ir.
piksel için 256 renk
JPG yüksek kalite (%80), dosya boyutu 10K
.ıPG orta kıılite (%30), dosya boyutu SK
JPG Düşük kalite (%1O), dosyrı bo)'11tu 3K
GIF, 12K
Görüntü: 122) JI'G Dosya boyutu ve kalite <ıyaılarım gösteren bir deneme ve GIF ilc
ı
mavi. Bu renk imlerinin yoğunluğu görünümü belirler.
elenınlar kanııaşık bir yapıya sahiptir.
hıdar
6 milyon
,eng~
Herbir piksel 16' dan (4 bit) 16 milyona (24
Yaygın
bilgisayar
göstenııektedirIOörünl:ii:l23).
kadar
kombinasyonları ile
Yeni
gösıcrcbilrr::ektedir(Bul\.alor,
ekranları günümüzde
biıgisayarlar 65.000
her bir
(16 bit) den
2000) .
'Hi ndeıv~
I'1:ınnto3h
2'S6clıl"n
2:.';';;ç.l\!n
karşılastmlması.
o sıkıştınna ve dosya boyutu; JPO formatlı göriintülerin sıkıştınlmasmda en uygun dosya
Eğer dosyanın hızlı inmesini
'stiyorsanız kaliteden ödün vermeniz gerekebilir. Görüntü işleme programl~da .
Photoshop, Fireworks vb.) kalite değeri üç boyutta verilmektedir. Bunlar yüksek (kalıte
"80)
orta (O;<o30) ve dii.;:ük
(":-'0 i O) değerlerdir. Yukandaki örnekte görüldüğü gibi orta
,o,
-o'
değerdeki görüntü kalite ve boyut açısından wı.::b sayfasında kullanılmasındasakınca yolctur
(nöümtü: 123) W~ndows ve l\'lacintosh 256
oyutunun kalitesinin denenerek belirlenmesi gerekir.
ranı
(G~rüntü:
122). Bununla birlikte fotoğrafvc çok renkli
grafıkl~ri Y~ da illüs~asyonlanJPG
den GIF'e çe\rirİn5eniz hem dosya boyutu artmakta hem de kalite duşmektedır.
rerıkten olu~an pa\~lleri..
İnternet ortamında ç.oğu kullamcılann bilgisayarları 256 renk gösterebilen ekranlara
sahiptir bu yüzden
Görüntii.
reıık ayarlarının bu
dosY'il1annın
dizgeye göre
yapılması gerekmektedir.
iyi görünümü renk ayarlanrun bilinmesine bağlıdır. Görüntüde
kayıpl::ınııın olmaması için
rı;:nk
sunucu güvenli.\: renkleri (Browser-Safe eolors)
1331
U2
kullanılmalıdır (GÖrüntü:124). çoğu bilgisayarlar 8 bitlik sunucu güvenlik paleti dışLUdaki
renkleri göstermez ve görünlüdeki renkleri güvenlik paletindeki. renklere çeYinn ez onları
3.4.4 Görüntülerde Anti-aliasing ve Hale Etkisi
Göriintüler piksellerden
GöIiintüyü
noktalandırıı (dithering).
oluştuğu
oluştuı"an pi.lcsel1er ızgara
yerleşınemesine ve
üzerine
için, piksel kareleri
üzerine tam yerleşmcyebilir. Piksellerin
gidemıe "A.nti-alies"* işlemini
ızgara üzerine yerleştirilen piksellerin
Eğri şekillerin
ızgara
pikseller arasındaki bölürune farklılıklarına "alias" denilir.
Birçok grafık yazılımı çentik
yurnuşatrrıaktadıı (Bakalor,
ızgaralar üzerine yerleştirilmiştir.
otomatik olarak uygulayarak,
çentikli:;rini doldurmakta ve görüntüyü
2000):
ve metinlerin anlaşıhr ve hO'5 görünmeleri için çentik giderme (Anti-alies)
yapılmak zomndadır. Aşağıda görüldüğü gibi
sol taraftaki metinde
pikseller çentik göıiinümündedir(Göıiintü: 126).
A;rnı
ızgaraya otunnayan
metin çenetik giderme
işlemiyle
( Anti-alies) çentiklere pilseller eklenerek yumuşatılmı.,tıL
~ Gürüntü:124)
Sunucu güvenlik renk paleti.
Noktacıklandınna, sahip olunan renklerin dışındaki renkleri gerçekmi:;; (doğalmış) gibi
göstennek amacıyla bllgisayann yaptığı bir yöntemdir. Eğer grafik, sunucu güvenlik .
rengine göre yapılmamışsa, sunucnnun gösterebildiği renklere dönüştir ve gerçek rengı
değişir (Görüntü: 125). Düz bir renkte noktalandmna yöntemi uygulandığında, görüntü
çekiciliğini kaybeder (Weinman, 2000). Aşağıdaki örnekte görüldüğü gibi soldaki göıiıntü
sunucu-güvenlik renklerini içermcz ve S-bit sunucu dizgesi onu noktalandıratak rengipt
değiştirir. Bu şirket logosu olsaydı görsel kimliğine zarar verebilir. Sağdakl görüntü ise
sunucu-güvenlik renkleri kullanılarak yaratılmış ve 8-bit mod'da bile, sunucu onu .
noktalandınna yapmadan, rengini bozmadan gösterir (Weinman, 2000).
An~i-alias
(Görüntü: 126) Çentik gidenne
HaıC
etkisi: Görüntülerin
(soldaki), çentik gidenne olmuş
lBakalor, 2000).
diğer SOrunu
da hale etkisidir.
daha önceden belirleyip arka plana uygulamanız gerekmektedir. Dikkat edilecek diğer
noktada web
aynı
sayfasındaki renk
kodlan ile sizin resminizi
hl'lzırladığımz programdaki
renk
olma zorunluluğudur.
(Görüntü: 127) Hale etkili
renkleri dikkate alınarak tasarım yapmalıdır.
resim ve yazılar saydam GIF
haleler oluşabilir (GÖliinm:l2?). Bu tür görüntü kirliliğini önlemek için zemin rengini
Jagged"Halo" Effect
Web sayfasındaki görüntülerin etkili ve güzel görünmesi isteniliyorsa, sunucu güvenlik.
Eğer
yazı (sağdaki)
olarak kayıt edilip web sayfasma yerleştirilirse, saydam görüntünün etrafında yentikJer ve
kodlan
(Görüntü: 125) Soldaki görüntü sunucunun noktalandıraTak değiştirdiği görüntü, sağdaki görüntü ise
sunucU giivenlik renk kullanılmış ve doğal Tenkleri değişmemiş görüntü ~W~inınan. 2000).
Anti-Alias on
off
olmamış yazı
Sonuç olarak web sayfa.
Yi.lzı(~oldaki),
ta.sanmında
No "Halo" Effect
lmdYf>U1lJ
.ı1:ım-.aJ.j.ı;;ed ~in~t
Hale etkisiz yazı
(~ağd<ıki)
(BakaloT, 2000).
görüntünün kalitesi, netliğinin yanı
sıra
görüntünün
hızla yüklenirliği önemlidir. tietiyi aktarmak için kullanılan resim ve grafikler eğer teknik
açıdan
eksikler giderilmezse tasarımda açıldık ilkesi ihlal
ziyaret ettikleri
sayfanın hızlı açılmayan,
edilmiş
resimleri ve grafikleri
olur. Web
kullanıcıları
anlaşılmayan sayfalan
hemen terk ederler. Bu yüzden yukanda verilen göliintünün kullanımı ile ilgili
dikkate
alınması
uyanların
gerekir.
*Anti-aliasing; komşulaştınnak, çentik gidennek ya da örtüşme önlemektir.
135
1
LAYOUT'LARDA ÇOKLU ORTAM EKLENTiLERİ
5
eb sayfa tassrL""111nda grafikler, yazı ve resim gibi görsel elemanıuruıyanı sıra video, ses
üç; boyutlu göriintüler de içeriği destekleyici bir şekilde kuHumlmaktadır.Bu tip çoklu
tam araç.ların web sayfalarında görünürlüğü ve -işitirliği bant geniş!iğı açısından sorunlu
maktadıL Fakat her geçen gün teknolojik gelismelerle bu tür sorunların aşılacağı bhmin
Ses
dosyalarının
ses
dosyalannın
nedenle
vardrr_
tercih edilmesindeki önemli
kullanıcıya düşük ve
Ayrıca
bilgilendirmek
verilmesi
bır ıwantaj kotay sıkıştırılabilmesidir.Ancak
oldukça büyük olması kayıt ve dinlenme sürelerini
ses
etkil~mektedir. Bu
yüksek kalite ses dosyalan seçeneklerini sunmakta yarar
dosyal::ırıruıı verildiği hiper bağlaıılı ikanlanna kullanıcıyı
amacıyla l10syanm bnyiiklüğü
yararlı ohıcaktır (Şener,
ve Khz cinsinden yiiklenme
hızının
1997, s.71).
ti1mektedir (Lynch and Horton, 2004e). Yine de kullanıcılarınçoğunluğu
işÜTIüldiiğünde bant genişliği, en düşük bilgisayar ve aktMlIn kapasitesine göre site
Film ve Video Görüntülerin Kl!llammı
san mı y"'pılmalıdıL Aynca çoklu ortam araçlarının görünürlüğünükılan ek yazılunların
3.5.3
ıratacağı sonmlar da göz ardı edilmemelidir.
Tcknolojik gelişmeler sayesinde
sayısal video
dosyalan tamull\l;;:l1 yüldenmeyi beklemeden
gösterime başlamaktadrr. "Quicktinıe son sürümünde bulunan uyumlu ek yazılım"fast
start"
.5.1
Plug-in 'ler
sayesimJ~ kuJlarnc!ı'u-ın.a
yazılım gereken
büyük kol<>.yl!k.
zamar_
bütün dosya bilgilerini dosya verileri
{eb sayfalarında çoktu ortam araçlarını izleyebilmek için plug-m (uyumlu ek) denilen ara
(Erdinç, 2002, s.l 00), Bu sayede
azl1ımhıra gereksinim vardır. Video, animasyon ve ses dosyalanınn dinlenip
tt1baren gösterime hazrrdrr.
ölÜntülenebilmesi için doğru çoklu ortam sunum araçları seçmek gerekir.
\/13
t::ı.s3rruul sağla!l2<ı.ktHdıl".
Bu ek
yapısmda en başta yilklenmektedir"
filiın dosyası kulhınıcl1lın bilgisayarına ulaştığı
andan
Eğlence içerikli sitelerde tilm ve videolar en sık mstlamm gör~el ve işllsel elemanlardır.
'lug-inler amaçlanna göre farklılıklar içennektedir. Ses dosyalarının aktarunı için
Bu görsel elemanlar içerdikleri gö-riinti.i ve ses özelliklerinden dolayı uzun sürede
RealAudio", video izleyebilmek için apple'iıı tiretmiş olduğu "Quicktime" video
yi.iklenmektedirler. Ses
eldentilcriııde olduğu gibi
azıiImmı kullanmak gerekir. Ayrıca Freehand, naslı, AuthorWare, Director
(bu ikonlar filmden hir kare Glabilir)
azılımiarındahazırlanan -.sv.i'uzarıtılıdosyaları izleyebilmek içinde "ShoekWave" plug-
yazılmalıdır
(Görüntü: 127)
(Şener,
altına
bu
dosyalarında hiper bağlantı ikarıları
yükleme süre ve
hızları
bcl.irlcn
bır yazı
1997, Si.72).
'e gereksinim vardır. Bazı hareketli ve etkileşimli ort.amlann hazırlanmasında Sun
ırmasına ait olan "Java" programlama dili kullanılmaktadır (Şener, 1997, 5.69).
asanıncılar plug-in'leri seçerken iki durumu göz önünde bulundunnajan gerekir.
/'G"
\II"."~·,,II
irincisi plug-in'lerin indirilmesi ve yüklenmesi; kullanıcı bu plug-in'leri ücretli mi yoksa
FO/,",'
,""',i,,,,,
cntsiz mi indirecek, fazla karmaşıkyapıda nu?, in.dirilme ve yükleme süreleri uzun mu?
II
Inlorm.\,""
tür sıkıntılarlakarşılaşabilir. Kullanıcılaryükleme süresini beklerneyebilir. İkincisi ise
fı,'m"
""""","'""0'1
il...,nloAI>""
oğru zamanda doğm teknolojiyi kullanmaktır. Çoklu ortam araçlarımn formatı plug-
1.1",10'",,1
"""",-0,."
lere göre ayarhımalıdıL Örneğin geçmiş teknoloji ile- video dosyası kayll. edilirse,
dIanıcı video görüntüyü izleyemeyebilir.
.5.2
(Görüntü: 128) Kullanıcıyı bilgilendinnek -ıçin, video dosy::ıhmmn biçimlenme türü ve ölçüsünün
gösli~rilmesi gerekir. (hubble.stsci.edu) Lynch and Horton (2004e).
Ses Eklentileri
hazrrlmırkenkullaıııcının ağ erişiıni, i:;>letiID
lelişerlInternet teknolojileri sayesiade müzik diD!eEebil!!!~kte,kr:ınfı::mns<! katılım
Video dosyalan
ağlanabilmektcve çeşitli ses efektleri ilc siteler daha canlı hale getirilebilmekteuir. Sesi
belleği dikkaıe alınmak zorundadır. Aynca
·nemli kılan. bilgLTlin uhışıınmda ve kalıcılığında etkili olmasıdır.
video
dizgeleri,
dosy<ılan küçük
makınenin hızı
dosya
ve
şeklinde
hazrrlanarak kullanıcıların daha rahat izleyebilmeleri sağlanabilir (Erdinç, 2002, s. 100).
,
136
137
!
Fbsh animasyonlann başanst~daki önemli etken anti-alias göruntU-örtüşmeyi
Animasyon Kutlanımı
3.5.4
Durağan şeylerin yanımb hareket
eden görüntü ya da grafik elemanın bireyi
etkilediği bir
gerçektir. İçerik ağırlıklı site/erde hareketli göıiinti.iler ok'llyucunun metne odaklanmasmı
zorlaştınnaktadır. Amacına göre
uygun ölçülerde
abartılmadan kullanılırsa animasyonlar
etkili olabilmekıediL Aşın yoğun kullanım görsel kirliliğe neden olabilir. Bu yüzden
kullanıcılar çoğu
animasyonlardan rahatsı2 olmaktadır. Nilsen hareketli görüntülerin
bilginin aktarıroım etkilediğini vurgulamaktarlu (Nilsen. 2000, 5.143).
animasyoTIun
şu
Ayrıca
amaçlar doğrultusunda kııllanılu5a daha etkili olacağını aktannaktadu;
desteklemesidiL Anti-alias sayesinde yazı, ve grafiklerdeki çentik ve
kırık
görüntüler
yumuşamaktadır.
VRIWL (Yirtual Reality Modelling Language i Sanal genieklik. model1eme dili); lntç:met
protokolü sayesinde sanal gerçeklik ve üç boyutlu
grafıkler masaüstü
bilgisayarda
kullamma geçilmiştiL İnternet'tekibu gelişmeden web siteleri de yararlanmakta, ilginç üç
boyutlu grafiklerin sunumlan
yapılabilmektedir. Ancak
üç boyutlu görüntüler ekrar:
indirilmesi teknolojik açıdan hızlı olmadığmd..1n tasarımeılartarafindan fazla
•
Dönüşümdeki sürekliliği
göstermek,
lctlllamlmamaktadlT
• Dönüşümdeki bo)ııtlııluğu göstermek,
• Zaman aşunlanm açıklamak (annandaki
ağaçlann büyüdüğünü gösteımek için),
• Çok bölmeli görüntülerde, (pop-up menülerin imleç ile hareket ettirilmesi)
• Graflksel
sunumların zenginleştirilmesiilde,
(Yılmaz,
2001, s. 99).
grafiğin amacına ulaşmasmı engellemektedir (
Sonuç olarak çoklu ortam
araçlarınm görsel
açısından kullanılmasında büyük
yarar
çöziinürlüklü ekran üç boyutlu
Onursoy, 2001, s.85).
zenginlik, bilginin kalıeı bir
vardır.
Görsel
ağırlıklı
ürün
şekilde
sitelerde harekctli görüntüler ve ses efektleri siteyi zenginleştirebihr. Ama içerik
• Dikkat çekmek için kullanılırlar.
yayınlarda
biçiminde
etkiIemek için
kullanılan
animasyoniar GIF, vektörel ya da sanai gerçekçi
okuyucunun ilgisini
k'Ullanılmalıdır. Çoklu
aktarım hızı
l."1l11anılmaktadır.
ve
birleştirilmesinden
animasyonıan,
ard arda görüntülerin GIF
fomıallıu.1a
ol1I.5an hareketli gôriintülerdir. Web tarayıeılannmhepsi GlF
mlimasyoman gösterimini desteklediği için uyumlu-ek
duyulmamaktadır.Sayfayı ziyaret
yazılımına ger~k~ıLnirn
edenler rahatlıkla GIF animasyonları görebilmekıedir.
Ancak GIF animasyunlana kullanımında iki önemli sorun bulunmakt~t1ıJ. Birüıcisi GfF
dosyaları sıkıştırılmamış olduğu için her resim kendi dosya boyutunu korur. İkineisi i5e
dosya direkt olarak sayfaya konulduğu için kontrol mekanizması yoktur ve dikkal
dağıtıcırllL
Vektörel animasyonlar; yöneysel çizgi ve grafiklerden oluşan vektörel animasyonlar,
Bürnapped tabanlı n:simlerdcn
tarafından daha
oluşan
GIF animasyonlara göre web
tasanmcı!an
çok tercih edilmektedir. Bunun uedcni dosya boyutunun küçüklüğü ve
vektörel çizimlerin büyüLüp küçültmc ile
bozulmamasıdır (Erdinç,
2002, s. i (3). Vektöret
animasyonlar küçük boyutlarda hazırlansalar bile tam ekran gösterimde tasanm
büzu!ma.."11aktadıı.M3cıvmedia5.rm~sının ~!'etip geliştirdiği Fı~_sı:> ~'a:ı:ıh!D.1 s~;,~:sinde
vektöre\ animasyonlar web sitesinde görsel bir zenginlik sunmaktadır. Bilgisayarıann
çoğunda Flash
Player oldnğu ilTin web sayfi'lannda Fhı..Qh kullanmakta
sakınca yoktur.
tarafından terk
oldukça az ve
ağırlıklı
gerektiği kadar
ortam araçlannm k."ı.ıllanılımı.<;ındakiası! zorluklardan birisi de
baııı genişliğidir.
yav~ olması kullanıcıian web
GIF animasyon; GIF
dağıtacağından
verilmesi
tanıtımı yapılan
• Üç boyutlu yapıların görselleştirilmesimle,
Kullanıcıyı
[138
Ayrıca düşiik
Hareketli görüntü ve ses
sitesinden
uzaklaştınnaktadır. Eğer sitenizin
edilmesi istenilmiyorsa aktanm
sorunlar düşünülmelidir.
dosyalarının aktanın hızının
hızı
ve bant
ziyaretyiler
genişliğinin doğuracağı
4. BÖLÜM
AKADEMİKE-DERGİLERİNİRDELENMESİ
Araştırmanınbu
bölümünde, e-dergilerin tasanmlan irdelt:ncrek t:ısanm somulan açığa
çıkanlacakttr. Bu
gelişigüzel
derginin
dergiler Google arama motoru yç Elsevier akademik
seçilen e-dergilerdeııoluşmaktadır. Ulusal ve "Uluslar
dolaşım, erişim,
imlel<sinden
arası kaynaklı ikişer
tipografı-okuııurluk ve
düzen lemc, renk,
u~rgi
görüntii kuııanımlan
yönünden incelenerek analizi yapılacııktır.
İnceleme yapılacak e-dergiler;
i· Digital Web Magazine (www.digital-weh.com)
2~
e-sosder (Akademik e-sosyal bilimler dergisi; www.e-sosder.com)
3· Müzik ve Bilim
(Uluslararası hakemh
bilimsel müzik dergisi;
www.müzikbihm.com)
4- First f\,londcy (www.firstmondey.com)
4.1
DİJİTAL WEB MAGAZİNE www.digital-web.com
Derginin
içeriği:
geliştiricileri
ve
Digital Web Magazine (Görüntü:129), profesyonel
ta~aI!mcı1an
için tasarlanan çevirim içi, haftal!k
Dergide web teknolojileri, tasanm, tipografı, web pro gramlan ve
bilgimimarları, web
yayın
yapan bir dergidir.
kullanırhk üzerine
makaleler yayınlanmaktadır.
Site
dolaşımı ve erişilebilirliği: Dergi,
bilgi organizasyonu içeriğe rahat ulaşılacak
şekilde tasarlanmışttr. Dolaşım menüleri,
kaynaklarının organizasyonu
konu
başlLğına göre
iyi
sınıftandınlmıştır.
Bilgi
ve site mimarisi dizgeli bir ağ yapısında oluşturulmuş. Bu
yüzden dataşım rahattır. Aynca,
kullanıcı aradığını kolay
hulabilmektedir.
Dolaşım
menüleri iki guruba ayrıImıştır. Üstteki ana menüde yayınevi ilkeleri. iletişim, abonelik
ana sayfa
bağlanttlan bulunmakta
belli olmakta,
kullaıhCl
ve bu bağlantılara
tıklandığında düğmelerdeki
sekmeler
nerede olduğu biime~tedir. Sol menüler, üst menülerin içeriğint:
göre listelenmektedir. Ana sayfadamakaıelerinkonu, tarih ve yazara göre
sımflandırılmasıyapılmaktadır (Görüntü: 129).
14ü
\4[
i
M i WL
_M'" i tn nMışm!
ve
kalın
(boId)
kulhmılarak vurgulama artiınlmıştır. Metin
içindeki vurgular aynı yazı
karakterinin kalını kullanılarak yapılmıştır. Renkle vurgulama yapılmamıştır. Bağlantı
.<
kullanılarak hiper
renklerinde de alt çizgi ve mavi
~ OIGITRl 'JJ~9
(alt mavi çizgi, tıkla ve git komutunu içerir).
uygun ölçüdedir.
Satır uzunluğu
metin olanı.k bilinen
Satır aralığı
yapısı kanınmuştur
ve fontun büyüklüğü okunurluğa
70-80 karakter arasmdadır. Bu ölçüden uzun olan
satırlar
okuma hızını etkilemektedir. Bu tasanmın başansmdaki diğer bir önemli etken de beyaz
1_",,,,,"
boşluğun kullanımında yatmaktadır.
.".',b"'.'~
';''1-<,'
görsellere uzaklığı iyi
dijltal dergi, tipografinin tüm
Görüntü
Bu yüzden görsel kannaşa yaşanmamak1adn-. Bu
kurallarımı uyulduğu ba9anlı
kullanımı: Görüntüler içeriği
çözünürItik değerleri iyi
'----,'---'.-'
Gerek paragrafboşJuk.ları gerekse ana metnin diğer
dengelenmiştir.
bir uygulamadır.
destekleyecek niteliktedir. Görüntü kalitesi ve
ayarlanmıştır. Hızlı açılınayı
kullarulrnı.ştır. Hareketli görı1ntülerden oluşan
engellemeyecek şekilde küçük
reklam bannerJan genel
yapı)']
bozmayacak
büyüklüktedir.
~"
•
..ı.,
.<,.
'-'-"""""'''.'","
(Görüntü: 129) Digita\ Web Magazin~ ana sayfası (www.digital-web.eom)ve
dolaşım menüleri görülmektedir.
Renk
kullanıml:Renkolarak
kum rengi tercib
edilmiştir.
logonun rengiyle uyumlu olan açık mavinin tonları ve
Ok
imlecİ ile
çerçevede bulunan alt başlıklarm üzerine
tOIlliyla uyumlu (Ilan açlk. yeşile
üst ve sol menülerin ve sayfa layouttlnda orta
gelindiğinde, ilgili
dön'i~erek
görsel
etkileşimilı
gücü
etkileyecek sorun bulunmamaktadu. İstenilen bağlantıya tıklaııdığında sayfalar açılmakta
turuncu renk kullanılmıştır. Aynea arama kutucuğunun altındaki go!
kullamcmm hoparlör, kulaklık gibi araçlan kullanmasına gerek kalmamaktadıL
açık mavinin
artınlrnıştıL Günlük
Erişilebilirlik: Menülerin kunamını; renk, biçim ve düzen yönünden erişilebilirliği
yapılarak gözde
si.'ıtün başlığm.da dikkat
kutucuklar
haberlerin bulunduğu sağ
ve herhangi bir sorun yaşanmamaktadır. Sitede çoklu araç kullanılmadığındanayrıca
açık
çekmek için mavin kO!ltrast rengj olarak
hareketlilik sağlanmıştır. Kullanılan renk
şeması
sözcüğü
görsel
de tunmcu
hiyerarşiyi
destekleyecek düzendedir. Üst bant ve soldaki dolaşım menülerinde pastel ve açık tonlar
kullamlarak rengin metni etkilemesi
önlenmiştir. Dolaşım
Sayfa düzeniemesi: Görsel öğeler ve içeriği oh:.şturaa metin kısm~ bütünlüğü sağlayacak
yazm.1I' tDn kontrasthlda.Tl
biçimde düzenlemiştir. Tasanm yüzeyi, tüm ekran olarak kullanılmıştır. Bütün sayfalar
görüntüsünden alınan parça Photoslıüpeprogramında gri
tutarlı bir biçimde tasarlanmıştır. İçerik ağulıklı bir site olduğu için, içeriğin yeri ve
rengi ve yazının
dolaşım menülerinin bulunduğu yer dengeli bir şekilde tasarlanmıştır. Beyaz boşluklar
oranlardandır (Görtintü:130).
görsel öğelerin algılamrhğını arttıracak oranda kullamlmıştır. Sitede en başarılı olunan
kullanılmıştır.
yazının okuTIurluğunu
kontrastlık değerleri ~·o
70
menülerinde zemin rengi ve
destekleyecek düzeydedir. Ekran
değerlere çevrildiğinde
çıvarındadır bu
Renk site bütünündi;; görsel
oran
okıınurluk için
tutarhğı
zemin
ideal
destekleyecek biçimde
tasarım ilkeleri vurgu, denge ve görsel hiyerarşidir. Sitenin her bir ııuktası düşünülerek ve
bütün görselolumsuzluklar en az düzeyde tutularak tasarlanmıştır. Bilginin mimarisi ve
tasarını ilkekri bir biriill destekleyecek niteliktedir.
Tipegrafi ve okunuduk: Metin ve dolaşım araçlan menüsünde ekran okunurıuğu yüksek
olan Ariel. Helvetika, Sans-Serif font grubu kullamlmıştır, Sitede bu font gurubu
kullanılarak aynca tipografik açıdan da tutarlıIlk. sağlanmıştır. Metinler sola hizalanarak,
gözün bir alt satıra geçerken başka satıra atlaması engellenmiştir. Başlıklarda font, büyük
(Görüntü: 130) Dıgital-web sayfasmdan
alınan
ekran görüntüsü gri değerlere çevrildiğinde uygun
görülO1ektedir(digital-web, 2006).
kontrastlık değerlerinin yakalandığı
ı 142
iğct'
sorunlar: Digital-web magazine sitesi teknolojik
açıdan
da güçlü bir ah yapıya
•hiptir. işletim dizgesi; RedHat Enterprise Linux 3, web stmtlcusu; Apache/2.0.46 (Unix).
~ri tabanı
bağlatılarrna (hipertext link) tıklandığında renklerinin farklı değişmesi ile ilgili sorundur.
Yani, mavi renkteki bağlantılar kest.ane rengi yerine siyaha dönüşmektedir.
sunucusu; MySQL 3.23.58, ara yazılım; PHP 4.3.10 & Smarty. aynca;
HTML 1.0 Transitional & CSS 2.1
kullanılmıştır.
Tarih, yazar, konuya ve
ıakaleler arşivlenerek geçmiş sayıya erişim sağlanmıştır.
başlığa
göre
bu dumm kaliteli ve güvenilir
........."_.•'<•• ,'~,
ir e-yayın
.2
olduğunun
. ;:.
'"~'"
göstergesidir.
E-SOSDER.COM ELEKTRONIK SOSYAL BİLİMLER
DERGİSİ www.e-sosder.com
'erginin içeriği: E-sosder, sosyal bilimler
~lsefe,
coğrafya,
edebiyat, tarih.
edefkitl~si
olan ve
yılda
(eğitim,
sosyoloji. ekonomi, hukuk, psikoloji,
güzel sanatlar ve siyasal bilimler)
alanında
çok
geniş
bir
iki kez yayın yapan akademik bir dergidir (Görüntü: 13 ı). Dergi,
........... _-",,-.,
,,~, ;~". ;~I~'.W"',." ,,,~.,,,,,,
'uBİTAK tarafından kabul gören bir dergi olmasının yam sıra, dergideki makaleler
,."._
,."~
rÖK'ün belirlediği doçentlik kriterlerine uygundur.
....
"'._~".M'_,
erişilebilirliği:
;'" .....,",••"
_,,""_
',,<,~'u,,~
ve
,,,.,,,~
.... ~
,..,;.'''F>'"'"· '''L,.~' ...""' -""N.'~'
""'"'··"'"''·'''''''''''no''',.'''
.:ı."
Yrd,... <....
ıite dolaşımı
JOC'"'' L"
~-,.""
''''.O.''PIN·'W."''~,'<
Derginin bilgi organizasyonu
içeriğe
rahat ulaşılacak
,:., 'l'.w.;""
'c'~'.~'" "<'I
..........
''''''''''_'''',''M~'''''D"/~''',.o",,,,,
'>~_i.' <.... 0, . . . . . ._ .
...
~:;~,o::~;;ı:t~;,;·~~~:,~:'.,Ie-','""",,,
I
ekilde tasarlandığı söyleneme2. İçeriğe ulaşılacak menüler ile genel dolaşım menüleıi
.... _-"','_."'...
ılarak adlandırılan ana
~:;:"t;~~l~t!'::o~!~;~"~,,~,~~~·~,,ı
ıir içeriği olduğu
sayfa ve
iletişim
menülerinin tümü sol sütunda
:;';i'5,~,',;~rt;;;",';';"~1',
toplanmıştır. Geniş
için sınıflandırma hataları yapılmıştır. Örneğin, hakem kurulu ve iletişim
;ibi butonlann "aktiviteler"
başlığı altıda
gösterilmesi, içerik açısından uygun
değildir.
Bu
;f-ic<'':i·:J!Iı;t.:.,.1tik'iNi4!
;"'. ""e<...,•.,
'~' %':-S~~:3.~";:~k:;;r;.:d'i·~j
!
H~;t~_.-~'IJ;:::c'J
(Görüntü: 131) E-so~de[ dergısi ana sayfası (....'WW.e~sosder.com) ve dolaşım menüleri (e-sosder, 2006).
ür slllıflandırma hataları bilgiye ulaşımı zorlaştırmaktadır. Ayrıca, E-SOSDER iÇERİK
nenüsü yana ya da
arihlerine göre
aşağıya açılan
sınıflandınlıp
menü dizgesi
sol sütun,daha iyi
kullanılarak
eski
sayılar;
değerlendirilebilirdi.
konu, yazar ve
Sol tarafta gmp!ar
~_k>ı'
~
C~.
"""'~il
~~;OL~_
ıalinde hazırlanan dolaşım menülerinin başlannda bulwıan ikonların, başlıkları
ıçıdan
anlamsal
ifade ettiği söylenemez. Örneğin; uosya ikanu, üzerinde uzlaşılmış bir gösterge
)lrnadığı
için tasanmcı bir kullanıeı içİn portfolya
anlamını
ifade ederken, bir başka
~ullanıCl için farklı anlamlar içerebilir (GÖrüntü:132). ikonun göstergesel yetersizliği,
'anma
başlık yazısı yazılarak giderilmeye çalışılmıştır.
;OSOER başlığı altında ise,
~sk.i sayılar bağlantısı,
<uHamcılar öncelikle
)olaşım
kullanıcılar
Eski
Bunlara rağmen, sol menüdeki E-
yararlı bağlantılar
ve tezler bulunmaktadır.
sayı
sayılardan
ve eski
sayı düğmelerini
bir birine yakın görmek isterler.
v~ gidilliiğimlc i:1çıiaıı sayfaların
_i
AKTlVtteu:Jt
~~xı..m
........,
,,~~~~
i';l.1>l;~ı
_
{;1/ltŞlı.Kk1K
(Görüntü: D2) Aktiviteler başlığının sol tarafında bulunan dosya ikonu aktiviteler başhğını içeriği
yansıtfığı söylemez.
2.
sayı,
2002-2 olarak yazılmakta ama derginin 2003
İçerik alam içinde bulunan makalelere tıklandığında, makaleler aynı alan içinde POP
dosyası olarak açılmaya çalışılmakla, sayfa sayısı çok D!duğu zaman dosyanm açılma hızı
test edilmedij5i
yayma başlaması bir ikileın yaratmaktadır. Önemli hatalardan diğeri ise, üstmetin
144
~r&1Hm'r~,
menü sütunun alt kısmında olduğu için görülmemektedir.
yeni
menüsündeki ikonlar
~örülmiiştür.
için
~
.A1""~(
yılında
yavaşlamaktadır. Ama, makaleler yeni bir sayfaya bağlanarak açılsa kullanıcılara diğer
makale ve sayfaları da inceleme fırsatı yaratılabilirdi.
1451
içeriğin açıldığı kısım tutarlı bir şekilde kullanılamayarakciddi bir dolaşım hatas;
kurumun dışa yansıyan yüzüdür. LClgo, kurumun felsefesini, hedeflerini, alanına verdiği
yapılmıştır. Örneğin, "aktiviteler" başlıklı sol menüdeki "şiir köşesi" bağlantısıtla
önemi, saygın1ığl ve bakış açısını yansıtır. Bu yüzden en çok önem verilmesi gererken
tıklandığında, yazar ve şiirinin başlığı çıkıyor ama şiire tıklandığında yeni bir pencerede
şiirin Word belgesi olarak indirilmesi için pencere açılıyor (Göri.intü:133). Benzer diğer
öğedir. Ülkemizde yapılan en yaygın hata; şirketlerin kendilerini "idare" edecek bir
amblem ya da logo yapmalan i yaptırmaları ve daha sonra geliştiklerinde onu değiştirmek
bir örnek sol taraftaki" e-sosder içerik" kısmmdaki "güzel sanatlar" düğmesine
istemelerinde yatmaktadır. ilk önce yapılan hata ilerde büyük sorunlar doğurmaktadır.
tasarlatımalıdır. Aksi takdirde kunım bÜyüdükçe logo
tıklandığındabazı sayfalar PDF uzantılı olarak açılırken, bazılarına yeni bir sayfada yazılı
Öncelikle, kurum için iyi bir logo
metin olarak rastlanırken bazılarının da Word belgesi olarak indirilmesi için küçük
kumm için yetersizleşebilir. E-sosder logosll' da sıradan bir logo olup, nite1iJ.<.li bir grafik
pencere açılmaktadır. Birliktelik yoktur.
tasanmcı tarafındantas::ırlanrnadığıortadadır tGörüntü: 234). LogCl, basılı bir ürün ya da
,~~
'.ı
.
-"
"'"
,~aG
'" ,"".',
web sayfasında kulbnıldığmdatasarımı etkileyen önemli bir görsel ög~ed1f'. onun
biç.imi bütün tasarımı etkiler.
"~~';\l"~"A~-?'
~iJ
;c
g"
:::i'~,~iII
-~ ~,~:;".........
,_.~
... '....i~'
"';"""
: ~~-;;:
"-c_..
··~"M
.
.., ..
rBı~"'~""""'''1
l~'3N
,II'."'.""""".""
-
...
J..)I}.•• (',;~
(Göıi.inru:134) E-sosd~r dergisini
logosu
'::;;".''''''''''~''
_'
......"""l'
,
....
i
.
rengı,
.~-
. ,",,":::oc
~
(Görüntü: 133) E-sosd~r dergisi dola.':amında tutarsızlık öm~ği, şiir başlığına lıkl:ındıgında Word
belgesi çıkrrmk.tadır.
Bıı tiitenin sayfa düzenlemesi, ekranın ortasına A4 sayfa boyutuna yakın bir ölçüde
yapılmıştır. Belirlenen boyut içerisinde dolaşım menülerinin bulunduğu sol sürtin dengeyi
bozan bir yapıda olup bütün ağırlık noktası orada toplanmıştır (Görüntü: 135). Aynca
sütunun yüksek kontrasUıktnolması, logonun algılanırlığını etkilemişlir . Yine SCll menü
Her bir bağlantıya tıklandığında "içindekiler" adlı bir başlık çıkmasınakarşın neyin
"içindekiler" başlığı olduğu belirtilmemiştir. Örneğin, "hukuk içindekiler" yazılsa daha iyi
olabilirdi. Kullanıcı, hangİ başiığın, hangi kODunUli "içindekiler" kısmımı baktığ!!lJ
içindeki gereksiz parçalaruna tasanull olumsuz yönde etkilemiştir (GÖriintü:136). Bu
şekilde pdrçalanmış zeminler özeıinele tasarlanacağınakontraı;tlığı dengelenmiş lek bir
zemin üzerinde de tasarlanabilirdi.
kanştınnaktadıLBu e-dergide ciddi bilgi sınıflandırması ve yönlendirmesi sorunl~rı
vardır. Sitenin bilgi mimarisi yeniden yapılandınlmalıdır.
c
Erişilebilirlik: Menülerin kullanımında; renk, biçim, yazının doğru kullanımı ve sayfa
l090
düzeni açısından erişilebilirliği etkileyecek somnlar bulunmaktadır.Dolaşım dizgesi
işlevsel değildir ve sınıflandınna hatalan yapılmıştır. Bazı içerikler PDP belgesi olarak
bazılan ise word belgesi olarak açılmaktadır. Kullanıcıya, özet bilgi sunulmadığı için tam
içerik
metnin açılması için bekletilmcktedir. İçerik başlıkları iyi düzenlenmediği içiIl
kullanıcının kafası kanşmaktadır.
Sayfa düzenlemesi: Sayfa tasanınlDı etkileyen görsel elemanlardan biride görsei
kimliktiL Logonun estetik yapısı sayfanın genelini etkileyen bir öneme sahiptir. Dört dilde
yayın yapan ulusal ve uluslararası bir derginin logosu daha iyi olabilirdi. Görsel kimlik,
'------ dolaşım menOsO
(Görüntü: 135) e-sosder dergisinin yüksek
kontrastlıkta dengesiz sol dolaşım menüsünün
sÜtıJnu.
(GÖIÜntü:136) Sol menünün dengesiz ve
parçalanmış
etkisini gösteren grafik şema.
:nü başlıklarının
yanına
konulan ikonlar ile b~lıklar
ırlanmamıştır (Göruntü; 137).
arasında boşluk
~nin
algılamak istemektedir.
Gözlerimiz bu iki ögeyi birlikte
yin otomatik olarak nesneleri gruplama ve yakınıaştıroıa
yazı çizgili arka zemin yüzünden okunamamak.tad.ır. Aynı "hakem kurulu" yazısının
iyi
eğilimindedir. Aynı sonııı,
4 yabancı dilde yayın yaptığını belirten bayrak simgelen
durmaktadır (Görüntü: 131).
tünlüğü sağlayıcı
açıdan tasarım hatalan içeımektcdir. Hakem kurulu sayfasında gereksiz bant, bordür ve
çizgiler kullanılmış ayrıca her başlıkta farklı renk kullanılarak dikkat dağınıldığı
yerleşiminde de
~anınaktadır. tngilizce'yi temsil eden tngiliz bayrağı simgesi ile diğer 3 ülkenin bayrak
1ge1eri ayn
üzerine basıldığında ayrı bir HTML sayfası açılmakta bu sayfa renk, biçim ve tipografik
Gruplarna, sayfa düzenlemesi açısından görsel
yaratılmıştır. "Hakem listesi" ise ortadatı mzalanarak okunurluk daha da zOrlaştınlmıştır
(Göruntü:139).
bir etkendir, buna dikkat edilmelidir.
tı~iiıii!!!,!!'!'I E'~ITi~n;'"-Eı,ı ';ELIŞ;';:'_Er
~
....k.ol",.
"
{lij• • ı
~
~
~
Al."
AK'lIVlTEl.lOR
..,"'~ .....UlU
· ~E~:;ı~~
" Coii·.'••
"
..'
_:ı
;;lr~pO'~J' .
• :~:~:Ji:,~"J<
~~M~"
... utam",ı...
1~;b<PI
....,,~..
~ """",.,;;ı. ""'""ı'.'
~tm.""".,
Yn:I.Doç.D.-.FaCih ıılLcİl
LO.L'- ".'oLE"C'E .~. ;0' "L'-'~L
" "-".-n<: '0''''
~"~C~"~','-_
....
_ <i;ldsIM<;n.lt<
zeminde gereksiz yere tekrar edilen logo görsel bir kir1i1iğe neden
kunurluğu etkileyecek
olmaktadır.
gereksiz arka zeminlerden kaçınılması gerekir. Logo bu
lcrar edilerek sol baştaki
kullanılan
logonun da etkisini
.....
u"
"ı""" '"Co~'J~L'P'
,':'Pur,,-,'
Y'd. ooç. [)ro "u",,,,,, Ci
~~~,:';'~',"."~'['" ,;II.I,r '; _
(Görüntü: 138) Aktiviteler menüsünde bazı bağlantılar büyük harf, bazılannda da küçük harf
kullanılarak tipografide tutarsızlık yaratılmıştır.
(Görüntü: 137) Başlık ile ikonun boşluğu ayarlanarnamıştır (rast gele bırakılmıştır).
~ka
t'-fll~lM
• ?~~~.~':::;~"<l'
P....U
.'.'~'J;LE"'''I" ,~PTAIJf.I,\
Proı.ı''-.AI<if ABaAııDV
,rAriJ~,
"~F,,~ı:···~'
••
IQJ~UUl
aUMlYOO&U ....oou,ı
~Ö'.ll~stvt ........' _
~
yı
1,~·:,.~~J~;:~~'r~:~:;:~~~1.7
• [4'.","'m,~.,,'0~0
• ow,,"'....~oc .. o~
• :.-:~":.i'A",".""
AlCTlvITELI!:Il
Do" ".C~ RIMERDEM,
Doç. Il,. eil>"n TURAL
şekilde
azaltmaktadır (Görii.ntii: 131).
E-sosder dergisine genelolarak bakıldığındatipografık açıdan tutarsızlık sergilenmektedir.
Büyük küçük harflerin kullanımında hatalıır yapılmıştır. Aynca menü çubuğunun
bağlantılannda oldukça küçük yazılar kullanılarak okunurluk ve dolaşım olumsuz yönde
etkilerımiştir.
tenin en büyük tasarım sorunlaTlndan diğeri ise, sitenin tutarsız1ığıdır. Makalelerin ve
ızı içeriklerin ya aynı sayfada ya da farklı sayfada açılması gibi nedenler tutarsızlığı
Görüntü kullanımı: E-sosder dergisinde logo ve ikonlann dışında görunru
$leycn etkenlerdir. Klasik sayfa mantığında kurgulanmak istenen site, görsel
kullanılmamıştır. Logo, zeminde gereksiz yere tekrar edilerek kullanılmıştır. İkorılar ise
amanlann
doğru
amamıştır.
bir
şekilde tasarım
Denge, ritim oran -
orantı,
,ksunluk estetik olmayan bir site
ipografı ve
enüsünde
ilkeleri
ışığında düzenlenınemesi
başanlı
uyum, görsel hiyerarşi gibi tasanm ilkelerinden
oluşumuna
neden
okunuriukj e-sosder dergisi tipografik
kullanılan yazı
nedeniyle
gri zeminde kullamlarak algılanırlığı aza1tılmıştır. Ayrıca ikonlann bazı başlıkları görsel
açıdan desteklemediği görülmüştür (Görünru:139).
olmuştur.
açıdan
incelecek olursa,
dolaşım
karakteri 10 puntonun altmda olduğu için ekran üzerinde
mnurluk açısından zorlanılmaktadır. Bu kadar küçük puntolar genellikle dipnotlarda
l11anılır.
.ğ
"e-sosder", "e-sosder içerik" gibi menüler tamamen büyük harfkuııanılmış ve
tarafa yaslanarak kullanılmıştır. Bu gibi başlıklar sol tarafa yaslanabilirdi.
ipografık açıdan tutarsızlıklar görülmektedir. Örneğin
enüsünde
iğer
bazı başlıklar
bir tutarsızlık
örneği
iergi hakem kurulu"
48
büyük bazı
"sktiviteler başlığındaki dolaşım
başlıkbr küçük h2.!"fl~ y:;ı~zılm!ş~ır (GÖri.i.!1tü: l3g).
de "hakem kurulu"
yazısı
n
bağlantısına basıldığında sağ boşlukta
sol menü penceresine tamamen bitişik olarak çıkmaktadır. Bu
?~EJlIÇ'.F.~
HAKEN
~,o,.
i : g~?~
D,
Çui<C'OVd
'·'oW,.
KU~.U~;
A."eç"" y '"o.,
'
en....,·"-."
I'
DQq~" ŞÇ'y.\5' " ,
ru..., e";",,<.,,,
~~:>-.~'U"."",."''''
'." ·c.
C_,,""'" . c.
"
(Görüntü: 139) Arka zeminde mavi çizgiıer kullanıldığı için yazılann okunUTIUğu düşmekte, dergi
hakem kurulu listesi farklı sayfada açılmasmm yanı sıra tipografık açıdan tutarsızlık devam etmektedir.
Renk
kullanımı: Renk
olarak mavi, gri mavi, lacivert ve gri renkleri kuııanılmıştır. Soğuk
renkler seçilerek resmi bir hava yansıtılmayaçalışılmıştır. Ancak, bu sitede renk etkili bir
şekilde kullanılmamıştır. Biçimsel
olarak yapılan hatalar yüzünden renk. siteye estetik ve
işlevsel açıdan katkı sağlamamıştır. Daha
önce de belirtildiği gibi sol menü sütunun
lacivert olması gözün o yöne hareket etmesini
renklerdeki parçalanmaLU' nedeniyle
işlevini yerine
Diğer
sağlamaktadır.
dolaı?ım menüsünü.n
Ama sütun içindeki
etkisi
azaltılmaktadır.
getirememekte aynea görsel kirlenmeye de neden
faklı
olmaktadır.
sorunlar: Teknolojik olarak PHP ara yazılım} ile desteklenen E-sosdcr dergisi
arşivieme,
düzenleme, renk, bilgi mimarisi ve dolaşım olarak ddd.i sorunlan olan
elektronik bir dergidir. Belirtilen
sonınlar çözüm1enmedikçe
ulusal ve uluslar arası düzeyde olmasma karşın tasanın ve
. '.
Renk
site içerik
............'
açısında zengin
işlevsellik açısından
önemli bir
değer kaybedecektir.
MuzİKBİLİM.COM ELEKTRONİK MüzİK VE BİLİM
4.3
DERGİSİ www.muzikbilim.com
(Görüntü: 140) MÜ7.ikve Bilim dergisi ana sayfrlsı (www.muzikbilim.eom)vedolaşımmenüleri
görülmektedir.
Derginin içeriği: Elektronik "Müzik ve Bilim" dergisi (Göriintü:140), müzikle bağlannlı
diğer bilimler
dahil; tarih,
eleşıiri,
analiz, icni,
bütün alanlardaki bilimsel
yazıları
kabul eden uluslar
Amacı;
akademik bir üslupta ve uluslar
zenginliklerini, tarihi ve güncel
arası
arşiv araştınnalanııı
arası
standartlarda,
kapsayan müziğe aİt
bilimsel elektronik bir dergidir.
müziğin kültürel
gerçekıerini bilimsel çalışmalar ışığında ortaya koymaktır.
()c/(;.'
Müzik ve Bilim, Türkçe ve İngilizce olarak yılda iki kere (Maıt ve Eylül aylannda)
()~Yi
yayınlanmaktadır.
(,;,
'.0"",,,,,,,,,,,,0,,1,,,,,,
"''''''''.''''''"'''''''','''''.,
nıJl;ı;it,.1-.W~W
<;LO,
Site
dolaşımı ve erişilebilirliği:
ortamı buluumamaktadır. Geniş
kolaylaştınnaktadır.
Makale ve kitap inceleme
bir
dışında herhangi
içeriğin bulunmaması bilgi
Buna karşın bazı dolaşım sorunlan
bir etkileşimli
vardır. Tasarım üç
pencereye
bölünmüştür (Üst, sol ve içeriğin yaymladıgı alan). Bu tarzda hazırlanan sitelere arama
motorlarından girildiğinde anahtar
açılmaktadır. Bu
kelime hangı bölmede ise o kısım sunucuda
ciddi bir tasanm hatasıdır. Aynı zamanda, içeriğin göriilmesi için
kaydunıa çubuğunu aşağı doğru kaydınldığında sol
görüıemernektedir(Göıüntü:14l).Ayrıca, bu
bağlantıl~n d:ı h:.ılunrnamaktE!\.hT.
menü de yukm kaydığııçin
dergide
~,
organizasyoDllllu
dolaşun! kolaylaştıncı alt
menü
(Görüntü: l41) Menü çubuğu içerik ile bember hareket etmektedir. Bu tür pencereli çalışmalar
arama motorlanndan siteye girişlerde sorun yaratmaktadular.
Dolaşım dizgesinde metin bağlantıları denilen önemli bir bağlantı türü vardır, Burada
makale adları resim formatında yazılmışnr. Bu ylizden bazı sunucular resimleri
göstermediği için makalelere ulaşılamamaktadır lGöriintü'14")
. ...., Y apı i ması
ııereken
başlıkları resim fonnatında değil üstmetin i bağlantı lı metin (hipertext) oıara~ yazm:ktır.
J
."
(Görüntü: 142) JPG ya da GIF resim biçimindeki başlıklar bazen sUnucul"""~
go".romneye
..
b'i'
<ulU!
ı ır..
'gide sol ana menüde
rıüsünün açı~dığı
diğer hala
olması gereken
"kitap inceleme"
olanaksızdır. Az biçim ve içeriğe karşın gerekli gruplama ve hizalamalar yapılmadığı için
bağlantısına, yeni sayılar
alamn en altından ulaşılmaktadır. Bu bilgi organizasyonu hatasıdır.
da, künye sayfa bağlantısının olmayışıdır. Ana sayfa açıldığında künye
;ileri çıkmaktadır. Ziyaretçi, daha sonra künye
utulan bir diğer menü ise
iletişim bağlantısıdır.
sayfasını ara8a
da bularnamaktadır.
Böyle bir bağlantının yokluğu
hata ise menü
bağlantılarındaokunurluğu azaltan
:gilerİ ve yazıya gölge efekti verilmesidir (Görüntü:
ummız haltı gdirilmi~ hem
de menülerin
rtıeri,
logodan alınan zeytin
dalının
üç bölgeye ayrılan parçalann (üst, sol menü ve içerik kısmı) her birinin ayn bir tasarım
notu
143). Ta..'larımda, hem bağlantııar
araları gereğinden fazla açılarak algılama
rlaştınlmıştır. Aynca, aşağıdaki örnekte görüldüğü gibi
içinde
bir grid ızgara üzerinde hizaıandığındave biçimler arasında yet.erince beyaz boşluklar
bırakıldığında tasarım sorunları çözümlenmiş olacaktır.
Müzik ve Bilim dergisinin web sayfasındabütünlük sağlamamasınınnedenlerinden biri de
lamcmm yetkili kişilerle iletişim kunna..-anı engelleyebilmektedir.
,laşım. menülerinde yapılan asıl
dağınıklık ve karmaşa tasarıma hakimdir. Benzer biçimler guruplandığmda, görsel ögeler
yönlendirme menüLerinin baş
kullanılarak görsel kirliliğe neden
ınmııştur (Görüntü: 143 i.
böLgeSİ gibi düşünülmesinden kaynaklanmaktadır. Her bir bölge, kendi içinde simetrik
düze:nde y::rleştirilmiştir. Bu yüzden tasarımda bütünlük sağlanamamıştıl.
Renk seçimi ve görsel ögelerin yerleşim d~eni içeriğin aıgılanması ve okunurluk
düşünülerekyapılmamıştır. Karma~a ve düzensizlik. içeriğin algllamrhğını olumsuz yönde
etkilemiştir.
Sol menüde gruplama hatası yapılmıştır (Görüntü: 144). Mımü öğeleri biraz daha
yaklaştınlabilirdi.Aynca madde imi gibi kullanılan logo, gerek5izbirim tekran ile hem
algıtanırlığı etkilemekte hem de görsel kirliliği beraberinde getinnektedir (Görüntü: 144).
{},
(:).
Logo sık sık süsleme amaçlı tekrar edilmemeli, görsel anlamı yitirilmemdıdii.
';~"' ~~·oon
(,)$' (:),
(Görüntü:143)
Dolaşım
,~"'.
,
menüsüne bağlantılann altına
gereksız
çizgi ve gölgeler kullanılmıştı!.
(rJ'" .
rişilebilirlik:
"Müzik ve Bilim" dergisinde
erişilebilirlik sorunu
menülerin biçim ve renk
arak algılamrlığı ile ilintilidir. Dolaşım sorunlan başlığında da belirtildiği gibi
o·"
enülerin tasarım sorunlan erişimi etkilemektedir.
{}".
O,·
ayfa
düzenlemesi~ Bu sitede "müzik ve bilimI! dergisinin içeriğini yansıtıcı bir tasarım
aygısı
(logo ve benzeri görsel ögelerin
(),
tasarımında) gözlenmemcktedir. Yalnızca
olaşım menülerinde nota çizgileri düşünülmüştür. Yapılan bu uygulamada menülerin
bınurluğu
olumsuz yünde
etkilenmiştir
lasik sayfa yapısında olmasına karşın tasarım, görsel hiyerarşiyi destekleyecek
üzenlemeden
yoksıındur.
izalama bütünlük yaratmanın yoludur. Bu sitede uyum ve bütünlükten bahsetmek
152
(Gö.tiintü: 144) Makale başlıkları sola hizalanınayarak hem okunur1uk hem de tasanm estetik yapısı
bozulmuştur.
153
1
Tipografi ve okunurtuk: Derginin genelolarak tipografı kullanınııyla ilgili hizalama.
harf Ye .satıT .1l".3.lıkhın, italik metin ynzımı, büyük - hiçiik harf ve vurgunun yanlış
kullanımı
gibi hatalar yapılmıştır.
Makale başhkları içerik alamnda ortadan
yönünden sayfa
bütünıüğünG.
olumsuz
hizalımlli'uk
hem tipografi hem de tasarım
,oıwx ,.'~~k "R"""~,,,r
'''"~'~
UU""~ ~~,,,'"
,,,,,,,,••",,,
etkilemiştir ~Görüntü:144).
müzik ve hilim
Harf,
satır
ve sözcük ~ualan gereğinden fazla
açıktır.
Adeta iki sözcük arasına bir
a,,-_
başka
sözcük girecek kadar boşluk bırakılmıştır (Görtintü: 145).
(G0r~iIJtii: 147) Makale başııı...L:~;ıd<J bir büyük hadbir küçük harfY8.2ılarak,tutar:>ız bir tipografl
anb)ışı sergilenmiştir.
Tipografik açıdan yer yer vurgularna hatası yapl1mıştır. Yazıda vurgulama ita1ik. kalın
((jönintii: 145)
SÖZGük ye
H;ır[,
satır arasılan sonınlu
Müzik ye Bilim Sitesinin
başlığı.
(bold), alt çizgi ve renk kullanılarak yapılabilir. Burad.u sözcük gluubu hem italik henı de
kalın yapılarak iki vurgulama yöntemi yinelenmiştir (Göıünlli: 148).
Makale özetlcri, ita1ik ve tımilkh yazı karakteri ile yazılarak okunmaz hale getirilmiştir.
Bilindiği gibi
ekran pikselızgaralan ile italik yazı uyuşmamaktadır. Bu yüzden
kırık
Mn".
göriinmektedir (Görüntü: 146).
"Il"'m.
,~",k""",
"," ''''1'''''''''''''-'''''' ,"
""m,., .i"'~""
.'0"0"''''1.""... ,
"'"""""" ",,,d,,,,·,,o1., ",,,d,,,,.,
'''·"''''''·''''"''·''''I'1·,·'"'·~'·'Y
11l0... . . f1"'m, ••••"
"1.,,",, ,.,,,,
""~"
i"'
\" ..."',,'
,,,;,,,,,,, ~'''''''' '."",1•."," ''''"'~
"Ol.
..ii'.....
[Wl,... i~'.(.
'" ,
,',,,,,,,,",, "';<"'",,' r~E~
.",,,,,,,,,,,..,, ..,,,,,
(GÖlÜntü: 148) Vurgularna hatasına örnek bir kesit. Vurgulanan sözcük hem italik hem de kalın
yupılmıştır. Yalnızca kalın ya da ita1ik yapılma<il yett=tlidiı.
'''~'''''''''''!''
·--1
~._--
!
'ı
'''l'k hllJ.;.- h.s:-,.tı.W O'l'
,jr""""", da»ırı;= .... V"<U~ 'd~ ,,;WNC.I'j'.'Cnd,·H br" J~
19. »' 'da ~"m" k<.o::4J.''',., ;'Çsyr:ı! b''',,1&>' ~iJJ,-~!I ~~r,~,,.
"",;'lLi~'~/I;r, "'....,~'i ~".ı ",Jılı. ÖI','L"", !1n~j<'ly:l!k j''''''N,ın
"~ oo>ı-'tlJ:: ."...1kı,-d,ı ;.ırhJtJl',1 k"...~ O''''i'' !"Or~ok"~·:',..-.Ni~,, J" ",,,,~/;!""r>,,,,,; '#ı;.•. ~ ~'"
""'I:IJ&.'y~bırdrr. Sii;'a.;c~
h,iliJ,,~i ~!;",Xiilr- dı1
Ii
<:'i""
ok"..," an: """~". l.-Idlf'II"y<;iRn;ı 10~"1 ,JICpU ""y<i~ 1!~riiJ<ı JJ!I W.r "'ı..."1k!~,. lranf?1
;p/!du :<:/,a "",;'"d," Uıı:" ._~r<'ibıw <ib~.,,,,ç,,,;"11 h",I"li' jI~ '_Irıi')1"ya/~r".
mviııap' ;orU.m> .~~ ",kii./M .~O~~ ,,:do.." iir4~'.~ cw'",,,,,>, Jr<J.;::r~l. 7'ar-io' !."',.!l;Ir
!'''.va!I',J.ıh Qi",m/ı b" J.'~rd<.7' clr"lay",,~j(I)l'.
"""'YI!'
i
\".'1!'.Ll
L_~b;ıe. Me!d-'r,~it\C'''''<ı..ı,
(Görıintli:
146) Makale
özeti.lıc:uı italik
Ur.l"
i
1
~-,,:,i",~h<
M'ht~:~:::'~' -Mmı~~ :.~~.
hem \.le
tınıaklı yazılarak
hem de büyük harflerle
ve
cömertiiği düşüncesi
aHınca
yazılarak
bu!una.rJ. llk!)r!1!k Y:'l.Zar"
okunurluk azalmıştır.
sayfa tasarımına zarar
fotoğraflar çok az kullaml~ıştır. "Kitap incelemesi" başlıldı yazıd~ kitap kapağı görüntüsü
metne çok yakın kullanılmıştır. Görüntü ilc metin arasında en az 5 mm beyaz boşluk
(espas) bırakılmalıdır (Göriintü:l49).
oknnUrluk azaltılmıştır.
Büyük-küçük harllerin kull:ınımında yanlıştıklar yapılmıştır. Yan sayfa (üst) görülen
örr;,ektc rnakhlc başlıkl:::ın;ıın
Görüntü kullanımı: Dergi incelendiğinde görünni ağırlıklı bir site olmadığı için resim ve
h~!!'! s!y~b
ri;?DJ:le yqzılnıış
Sayfayı çeşitlendinne zenginliği
venniştir (GÖIÜntü:14T).
~"
... ,.."", ,,,. 0,. "" T~'~, ••.",,'''1.''',.. '4""._.C~,ı.;
,,.,.,,, ,,,,-,
"'~""
••••
~~"".'ı. ".~,,",,
.-,""h-
. " ..
". "."'~ .... ,~
"".', ,,,
".a.,'. , •. ,'"' ~,~,'" - ",'
oc"") "''''''''''.......1;''11: '".. """,,,,,.=J'.lfm.'.""..'.,,",,,,",,,,,-,~,,,­
-"."" ."","". 0',,,,,, """ '0,<>,,, '''''''',1. '"..c" ;''". ,__ ,,,"~ \,,"- ",
i""~...
.
,w'" ''''''''i" r~••
",,·4 '", "",,~,>,.,
'~"~'"'" "'"'"
,.,;......... ~
,,,...-,.,,.. ",,.... "',,.,,
"
.......: ....
"._~.'.""·f.
"". '~,",,, ''''"
'".
~'
""."~ ',~
...,......."', ' .....
'~
(GöJÜntü: J 49) Metin ve görüntii arasında bey'az başluk bırukı{;ırak hem görfintü hem
dc yazının rahat bir ncfes alması sağlanabilir.
Renk kullanımı: Site içenğine uygun bir renk paleti seçildiği düşünülemez. Lacivert,
4.4
Mavi, yeşil, kınnız!, san ve gri renkleri ton ve renk kontrastltkları dikkate alınmadan
gelişi
gü.zel ve sıradan bir şekilde kullanılmıştır. Yeteri kadar ton kontrast1ığıyapılmadığı
için yeşillogonun mavi üzerinde algılanması oldukça güçtür (Görüntii:150). Hemen
yanında
bulunan yıldız içinde
"3.yıl"
logosu daha kontrast olması nedeniyle daha önce
algılanmaktadır. "3.yll" logosunda eiddi tasarım hatası yapılmıştır. Yıldız biçimli logo
uzaktan kolayalgılanmasına karşın içindeki yazı okunamamaktadır. Yıldız biraz
büyütülüp "3. yıl" yazı hafifküçültüldüğünde ve dış kısımdaki mavi yazı ile yazıldığında_
daha rahat
algılanacaktır.
FİRSTMONDAY.ORG ELEKTRONİK İNTERNET DERGİSİ
www.firstmonday.org
Derginin içeriği: İlk yayıınna mayıs 1996 yılında başlayan First Monday, yalmzca
çevirim içi yayın yapan erişime açık tnternet dergisidir (Göriintü:152). First Mondey'de
İnternet, iletişim, bilgisayar
ve iletişim güvenliği, sayısal kütüphaneler, bilgi tabanh
web'in simgeler arası ara yüzü
(ıSı
's Web of Knowledge), kütüphaneler, bilimsel bilgi ve
teknoloji gibi konular dizinlenmiştir. Ayrıca 10 yılı
yayınlamıştır. Aylık
geçmişine sahip geniş
Site dolaşım) ve
Giriş sayfasına
çıkan
olarak
bir okur kitlesi
erişilebilirliği:
ana
dolaşım
Bu sitenin
menüleri
(Göıüntü: 150) Yanlış kontrastlık kul1anunından dolayı
logonun algılanırlığı
zayıflatılınıştır.
Yazar adlannda kınruzı, makale başlıklarında mavi kullanılarak titreşimi yüksek iki renk.
yana yana getirilmiştir. Uzmanlann önerisi, başlıklann kırmızı, yazar adlannın da % 70
oranında siyalıla yazılarak uyumlu bir renk birleşiminin kullanılmasıdır. Aynca, metin
kısmında vurgular
logoya
153).
giriş sayfası İle
yerleştirilmiştir.
Diğer
tıklayıp giriş sayfasına ya
dönüş düğmesİ olduğunu
tasarlanmış
farklı kültür
ve
ana
eğitim
sayfası birleştiriımiştİr.
Ama sitenin
diğer
sayfalan ana
dolaşım çubukları diğer
sayfalara
sayfalarda ise ya kullanıcılarınsol üste
da sunucunu ara yüzündeki "geri"
dönmeleri beklenmektedir. Ana sayfada bulunan
trafiğini güçleştirmektedir
sürede 122 yayın ve 708 makale
vardır.*
sayfa (home page) dizgesi üzerine kurulmadığı için
konulmamıştır (Görüntii:
aşkın
derginin 200'e yakın ülkeden
(Görüntü: 153;
dolaşım
tuşuna basıp
çubuklannm
sağdaki). Kullanıeılardan,
bilmeleri beklencmez (Görlintü: 153;
yerleştirilen
logonun ana sayfaya
sağdaki).
Estetik açıdan iyi
dolaşım hatası yapılmamalıydı.
bu sitede
ayru rengin tonlan de yapılabilir (Görüntü: 151).
§Mil;;G;@Iıg.I@_
·k4t&,Jl@i!
. - @ 4 1 \hR}HJL.l
..... ",.'
,
.. ..
~"",-",~,~,:' ,~
. -"""
(Göruntü:151 )Kırmız1- mavi titrcşimleri yüksck renk olup yazının okunurluğıınıı etkilemektedirler.
Burada kırmızı ve mavi yazıdan önce algılanmaktadrr. Renk yazıdan önce algıiaııdığt için oh."unuıluk
etkilenmektedir. Öncelikli olarak makalc adlan kırmızı hale getirilip yazar adları siyah yapılabilir.
~
~
~
=
~
Renk, bilgiyi organize edecek, görsel hiyerarşiyi sağlayaeak şekilde kullanılmamıştır.
Titreşimlenne. miktarlanna ve kontrastlıklanna dikkat edilmediği için bilgiye erişim
gi.içleştiıilmektedir. Tasarumn amacı bilgiyi iletmektir. Her bir tasanm öğesi bilginin
iletilmesine hizmet etmek zorundadır. Bu sitede renk, estetik zevkten yoksun bir biçimde
işlevini yerine
getirmeyecek şekilde kullanılmıştır.
(Göıüntii:
i 156
152) Fİrst Mondey dergisinin
giriş sayfası
{Firstmondey, 2006 L.
• Ayrıntılı bilgı için http://www.fırstmonday.orglidea.html ve
http://www.tirstmonday.org/guidelines.htmi#audience adresine bakınız.
geri
olmaması site
Makale içine gömülen üstmetin
bağlantıları (hipertext
lirr..\.) ise alt çizgili ve açık kımnzı
kullanılarak metnin akışkan yapısı bozulmamıştır (GÖrüntü:156).
Bu özellik, makalelerde
tutarlı bir şekilde uygulanIDışbr. Makale dışındaki metin bağlantılannda alt
üstmetin
>
bağlantılsrı (hipertext
link)
çizgili m.1vi
kullanılmıştır (Göıiintü: 155).
<--
(GÖfÜntii:153) First Mondey dO\3.'ŞIIDl c'!izgtsi. l\na sayfa mantığı üzerine kurulmıdığı için diğer
suyfalarda dolaşım çıı"buklan sayfa aHlarmda ve sınırlı sayıda bultuııruılct<ıdu', Site kullmcının gitmek
istediği yere onu yönltndinnekıedil"
,
:'~',
"'-"""'-"".
(Görüntü; 156) Metin içine
gömüıü bağlantılan.
Önemli bir dolaı;;ıtn hat<ısının olmasınakarşm ~ltenin dolaşımını kolaylaştıracakküçük
önlemler de alımnı;;tır. Diğer sayfalarda aIt kısma yerleştirilen dolaşım çubuklarında renk
Erişilebilirlik: Dolaşım açısından erişilebilirlik sorunu bulunmaktadır. Sayfa
ve biçim açısmdan tutarlılık sağlamıştır.
ve all menü çUbuklan ile
dolaşım çözümlenmeye çalışı[mıştir. Ama
söylenemez. Makale taraınası, eski
Dolaşımı kolaylaştıran sayfa altı metin bağlantıları, dolaşım çubuğu şeklinde y&tay olarak
sayılara erişim
gibi sorunlar
yeterli
Sayfa düzenlemesi: Tasanm yüzeyi olarak bütün ekran kullanılmıştlr. Giri;;
makalenin altındaki index (arşiv) ve makalenin içeriğine yönlendirme yapılmıştır
asimetrik denge ile görsel ögeler
yerleştirilıniştir(Görüntü: 152).
fotoğraflar nedeniyle sağ
çubuklan ve
çubuğunda "Past Mondeys (eski sayılar - arşivler) ve Reeommend'e (önerilen makaleler)
Tasarınıda bütünlük:
yönlendirme yapıInaştır (Görüntü: 154; ~ağdaki).
nokta
üst
arasında hareket
sayfasında
Göz logo, menü
köşedeki lurmızıya doğru hareket
için sıklıkla kullanılan üç nokta ilkesi iyi
doIaşun
bulunmamaktadır.
kunamlmıştır. Ama bütün dolaşım dizgesi dcğil, gerckli olanlara yer verilmi;;tir. Ömeğın,
(Görüntü: 154; soldaki). Dl,ger taraftan, güneel makaleler sayfasında da alt menü
içi
olduğu
etmektedir.
kurgulanmıştır.
Göz, bu üç
ettirilerek monotonluk kaldırılınıştır. Ayrıca göıiintü ve menü
çubuğuııun bulunduğu alan boşluğu da
iyi
dengelenmİştir. Giriş sayfasındaki
düzenleme
görsel hiyerarşiye hizmet etmektedir. İlgi orta alandaki dolaşım çubuğu ve görüntülerin
üzerine toplanmaktadır.
Giriş sayfası dışındaki diğer
(Görüntii:' 54) Dolaşım çubuklan sayfa alllarında ve belirli yerlcre gönderme yapmaktadır.
Makale sayfası içinde dolaşımı kolaylaştırmak için, çoğu e - dergilerde kullanılan sayfa
içindeki konulara yönlendiroıe yapan "makalenin lconu başlıkları" üstrnetin bağlantısı
(hipertext lin..\.) yapılmış, ilgili bağlantıya tıklandığında ise o başlığa uıaşılmıştır
(Görnatil.: 15S). B&Zl dergilerde bu bağlantılar "kayan menü gibi tasarlanır. Yani, bar
cubuğu aşağı - yukan doğru hsreket ettirildiğinde içerik menüsü de harekel eder.
Bazılarında ise konu başlıklarınınyanında diger başlıklar sol ya dn sağ tarafa
yerleştirilerek dolaşım sağlanır. Tasarımcılar çoğu zaman, aşağı doğru uzanan metinlerin
konu başlık aralimnda (başlığın üst kısımnda) "geri", "yukarı" gibi üstmeün bağlantıları
(hipertext link) kullanarak dolaşımı kolaylaştırmayaçalışmaktadır.
sayfalarda logo, sol üst
köşedeki
konumu
aynı ve
mctinlerin
sola dayalı kullanılması ile tutarlılık kısmen sağlansa da bazı sayfalarda simetrik
düzenleme hatası yapdmıştır (Göıiintü:157).
r -":
i ~~_."o<:':o:o:'·:"c
i '
.. o~ı i='~'.~'-~,==
-:
i~
Iıı
"0
i
1;1
L
,
_~ı
_'-_0_"
(Görüntii: i 57) Tutartığı
_
zayıflatacak
düzenleme
~i
hataları yapılmıştu.
S.BÖLÜM
ayfalar tek tek incelendiğinde, içeriğin organizasyonu kendi içinde tutarh bir yapıdadır.
.u tutnrlılık tipografideki boşluklann yerinde kullanımı ve vurgulamadaki başarı ile doğm
"e-grafik.net" UYGULAMA ÇALIşMASı
rantılıdır.
'ipografi ve okunurluk: Site tipografık açıdan incelendiğinde, satır uzunluğunun yanlış
ullanımı dışında ciddi bir tipografık hataya rast1anmamıştır. "Times" yazı karakteri,
kunurluğu etkilemeyecek büyüklükte kullanılmıştır. Tipografık açıdan olumlu yönleri;
UYGULAMAALANI SEçiMİ
5.1
Kısa
bir geçmişine rağmen WWW, radyo ve televizyon gibi yaygın olarak
iletişim araçlarından biri olmuştur.
o Başlıklann büyüklüğü ve vurgusu iyi ayarlanmıştır.
o Harf ve satır araları okunurIuğu destekleyecek ölçüdedir.
kitlelere ulaştınlabilmektedir. Web,
o Metin sola hizatanmıştır.
basılı
o Paragraf boşlukları iyi dengelenmiştir.
o Birden çok yazı karaıderi kullanılmamış; aynı yazı ailesinin kalın, İtalik ve roman
İnternet'te
(normaıyi kullanılarak
tipografide
tutarlılık sağıanmıştır.
:;Örünm kullanımı: İçeriğe yönelik hazırlanan bu web sitesinde giriş ve makalelerde
~l1anılan götiintüıer açılma hızını etkilemeyecek büyüklük ve kalitededir.
~enk kullanımı: Logoda kullanılan ikı renk sitenin genel yapısına ve görsel kimliğe
iletişim aracı olmanın yanı sıra
arşivleme aracıdır. Akademik kuruluşlar ve yayın
evleri, web'in bu
bilgiyi
kitle
geniş
yayımlama ve
özelliğini kullanarak
dergileri elektronik ortama aktarmışlar ya da tamamen e-dergi
yayınlayarak
içerik oluştunnuşlardır.
Ülkemizde grafik tasanın alamnda yayınlanan basılı dergiler yüksek maliyet
gerektirdiğinden varlığını uzun süre sürdürememektedir. Bununla birlikte İnternet
ortamında
Ayrıca
"Grafik Sanatlar"
alanını
sosyal ve fen bilimleri
kapsayan yeteri kadar Türkçe içerik bulunmamaktadrr.
alanında çıkan
akademik e-dergilerde de ciddi
tasarım
ve
kuUanılrrLık problemleri bulunmaktadır. Bu konunun seçilmesindeki en ö~ern1i
alanında,
)lumlu katkı sağlamıştır. Bu iki renk tutarlı bir şekilde gerek tipofgrafı gerek dolaşım
nedenlerden birisi grafik tasanm
iizgesinde görsel hiyerarşiyi destekleyecek şekilde kullanılmıştır.
tasarım problemleridir. "e-grafık.net"
vlenü çubuklan incelendiğinde ton kontrastlıklarmın iyi ayarlandığı gözlemlenmektedir.
kullanılan
WWW sayesinde bilgi, belge, görüntü ve sesler,
ve
araştırmacılarına
kaynak hem de
içerik eksikliği, diğeri ise e-dergilerdeki
uygulama
diğer
çalışmasıyla, hem grafık tasarım öğrenci
e-dergilere estetik ve işlevsel
açıdan
bir model
oluştunnak amaçlarunıştır.
~itede siyah, kınnızı renk ile beyaz arka plan çok uyumlu kullanılmıştır.
5.2
SİTENİN İÇERİCİ VE ORGANİZASYONYAPıSı
Web sitesi tasaronrnda konu i alan seçiminden sonraki
aşama içeriğin oluşumu
ve bilginin
organizasyonudur.
Sitenİn içeriği:
<Le_grafik. net", grafik tasanm
alanında akademik
hedefleyen hakemli elektronik bir dergidir. «e-grafik.net" ile
iletişim, gör.ıel iletişim, animasyon/canlandırma,
tv-video
platformun oluşmasını
Grafık Tasarımla ilinıili
grafiği, reklamcılık, fotoğraf:
masaüstü yayınCılık, sinema, tipograrı, iUtistrasyon, İnternet, web yayıncılığı, gösterge
bilimjsemiotik
anıştırmactlara
üzere y!lda iki
aylık tasarım
konularında nİtelikli yazılara
yer verilerek, grafik tasanm eğitimine ve
kaynak oluşrunnak hedeflenmiştir. Ocak ve Haziran aylarında olmak
sayı
yaYL.'1.!anacD.!( ola.. .
sergileri de açılacaktır.
"c-gLa~ik.ilet"'te okurun
Yazılan
makaleleri
ilgisini
tartışmak
canlı hıtıııak
bilgi
.için
alişverişinde
bulunmak .için "Tartışma Forum"'ları oluştumlup yanır ve okurlar arasında etkileşim
i
160
sağlanacaktır. Ayrıca
"e-grafik.neC dergisinin hedefkitlesi yanşma, sergi ve diger
etkinliklerden haberdar edilecektir.
Sitenin organizasyon
yapısı:
--
"e-grafik.net" sitesinin mimarisi,
kullanıcılarm
1
,-----ı~rden
L=:~
ana sayfadan
diğer sayfalara rahatlıkla ulaşabileceklerihiyerarşik bir ağ yapısına göre oluşturulmuştur
i
h"
L
~ı
,-----I~
ss~ay~I,-J---~m~a~k~a~le~le~r~'f~i
(Görüntü:158).
Hedef kitle
tarafından
etkili bir şekilde erişimin sağlanması için site
edilmesi gerekir. Bu sitede
içeriğin
içeriğinin
Jöietl
~
r--
organize
i
,------L arşiv
organizasyonu; önem, aynlan süre ve kategoriLere göre
~
yıl sayı
-----eakalele
~
yazarlar
makalel.::r
--1= metir
sıra ve sınıflandınlarak yapılandınlmıştır. İçerik başlıklan sıralandınlıp, kullanıcının
özet
öncelikleri düşünülerek dizılmiştir. Örneğin "bu sayı", "arşiv", "yazar" ve "konu dizini"
başlıklarına hemen ulaşabileceği şekilde tasarlanmıştır.
üzerinde bir e-dergide
olması gerekenler;
"editörden"
dergiler", "hakkında", "forum", "iletişim" ve "site harıtası" gibi başlıklar halinde
SLratanmışbr.
olması
nedeniyle, zaman içinde yeni konu başlıklarmm
eklenebilecegi bir bilgi mimarisine sahiptir. Sitenin, ba<;it,
kullanılabilmesi için
diyagram haline
anlaşılır
ve kolay
derinlemesine uzanan kannaşık yapıdan uzak durulmuştur.
Sitenin bilgi mimarisini göstermek için organizasyon
getirilmiştir. Diyagramda,
pd'
makaleler
1----{~~~~f-------1~~~'Sj~
~
L konuıarımetir
başlayarak, "bu sayı", "arşiv",
"yazar" ve "konu dizini", "duyurular", "kitaplar", "e-sergi", "künye", "yönerge", "e-
Site, içerik. ağırlıklı bir site
L
BlU1Unla birlikte ana sayfa
şeması taslağı
(Görtintü:158)
bölümler arasındaki bağlantılar ve sayfalar
arası geçişler gösterilmiştir (GÖıiiııtü: l59).
konular
,------,~
lı
f~
i rlii
L
,------1,
i
:=-i--
r----
- pd'
-
duyuru i
dUyuruıarr1----l~~~J
-lj
U--L~
i
~:
Iljlf~
e-sergi
Jj----I[~S.~sa~lo~n~u=1
I'
künye
I~Yönerg;::]
~--4~L~e~-d~e~,g~i~'ec~~
l---[=d~e~,g~i::Jı
L
hakkında
l
forum
i
arama
i
i
i
ı
mak.le/.
kelime~~
L..E"'..-J
L
i
(Görüntü: 158) Hiyerarşik
ağ yapısına
göre bilgi organizasyon çizelge tasıağı-
i
haritası i
iletişIm
site
(Görüntü: 159) "e-grafik.net" sitesinin bilgi organizasyon yapısı çizeneği,
163
i
.3
UYGULAMANIN İRDELENMESİ
·3.1
Sitenin Görsel Kimliğinin Oluşumu
i
.onu / alan seçiml, içerik ve bilgi mimarisİ oluşnırulduktansonra derginin kurumsal
~ıdan tanınmasınısağlayacak marka ve Jogo çalışmasına başlanmıştır.
e-çrafll<
Q-grafik
e-gra-fik
e-graFik
2-g r 3f i l<
e-grafik
_vlı:FiI::
e-grafik
e-grafik
~-grafi~
e-~r'fik
~~f:.tr-ıfık
e-grafik
e-gL".'l'-:k
""'i
n--:;r"'Fk
e-<;rilfik
~_""r"-'F';"'"
e-grafik
;;: -;;ı i"' ,ı'f~ ~~
e-gr~F,k
e-grafik
e-grafik
e-grafik
nk kez
E-ÇlRaFlK
ı
luşturulacakderginin adı, elektronik ortamda yayın yaptığını belirtmek amacıyla
lektroniğin Il e '''si ile "grafık"iıı birleşimincten oluşan "e-grafık" olarak belirlenmiştir.
itenin logosu için bilgisayar ve elektronik ortamı yansıtan yazı karaktederinden yola
ıkarak örnek çalışmalaryapılmıştır (Görüntü: 160-161)). Bu çalışmalardan "Distila-bold"
ontu ile oıuşturulan logo seçilmiştir (Görüntü: 162). Yine bu logo üzerinde renk
~enemeleri yapılarak. "e-grafik.net" sitesinin dinamik yapısın! y~I':';ntaçak siyah ve turııncu
.~'~··::-f1;~
e-grafik
~-grdfih
e-grafik
enkler üzerinde karar kılınmıştır (Görüntü: i 63).
(Görüntü: 161) Elektronik ortamı
,grafik
-~k
e'';,ch<
egraf1
.....-
-';;;':=;: _.
r
egrofiK---
3- egrafK
egraftk
;groiik ~
egraf1
g!,,!!~
egrafj
~r:.şf~·
~
~erafik
e-grafk
egrafi<
egrafr<
e-grall<
egrafk
srafik
grafik
r=
~-
gJ"ilfik
'.
grafik
-,
~.~
..;~
•
r'
:~1
Q
grafik
,grafik
_grafik
egrafi<
logo denemeleri
--grafiK
g
egraftk...-.o--
fik
eı[email protected]~
G'
~
1~~··~-·
egro1ik~'
yansItıcı yazı karakterıerinden
(Görüntü: 162) Distila fontundan yola
çıkarak tasarlıınan
logo.
O
C
~
~k~
egrafi
egraf\
egran.
e-grall
egrafi .
egrafk egra/k
ııgrafi< egrafk
(Görüntü: 160) "egrafik.net" için logo denemeleri.
e-grafiı<
grafiK 2-grafil<
,,-grafiK
grafiK e-grafiK
grafiK
e-grafiK
" grafiK " grafiK
grafiK
grafiK
" -grafiı<
2-grafiK Ol-grafiK
e-grafiı<
:-grafiı<
2-grafiK
s;.grafiı<
grafiı<
ögrafiK
e-grafiK
~-grafıJ<
2-grafiK
e-grafiK e-grafiK
grafiı<
grafi:<
e-grafii< ,,-grafiı<
,,-grafiK
(Görüntü: 163) Logo için renk denemeleri·, en alttaki turun cu ve sıy<ı
. h re nk
uygun görülmüştür.
J
Görsel kimliğin temel öğesi olan logonun ekran için RGB renk değtTIeri sayısalolarak
verilmiş, aynca doğru kullanımına da öneriler getirilerek, olası yanlış kullanım hatalannın
~!!"~~j~.Zfi~~Zi?I:;&~t~!E:~i~~~~N"Sill~0101~.",\,~ç'''J;,,;r,.
",
~,
"",_~ 'T-
•
'@.
önü kesilmiştir (Görüntü: 164 165).
M
/grafiK
R-255,G 128.6IJ
[5J.
",,,,,••u,·.,,·, ,,,..,.,.,,'"
".'OC""""!
"'""'."""""'·"''''''''''''''''~I'''''''''.-'''''''''''''··'
'!""'-."'.~ y"~u,","'",,~ <.".,""
,,,,,, . ,,"",,,
R CI. '3 Il, 8 Q
(Oörüntü:164) Logonun ekran için ROB değerleri.
l>" n.'~"".'~F"'""",',,.I, ı.~,." r"_,,,,.,",,~,,,,,
,,,".~,
,
"""':'."''',,'
,;"""'''''I'''''IIı\''''''"'"'-;'"'"'"'''''''''~''~''''''''''
.. "'~'""
T",~
""'J.~H_n'''.~
'''''''r:
-grafiK
e-grafil<
e-grafiK
r'
t~'~1J
;~~;,":::"::"'"'~",·""...,·..."..-''''.'.r'.''•• '·H.'' · ",·,',M."."
--_._._--.. ------,
,'''''''.~,'''<
~
~ " :': ",:
(Görüntii:165) Logonun doğru kullanımı için önerileri.
'" "' o'
Sitenin Dolaşım. ve Erişilebilirliği
"e-grafık.net" dergisinin bilgi organizasyon yapısı ana sayfadan bütün içeriğe
ulaşılabilecek biçimde tasarlanmıştır (Görüntü: 166). Sol tarafta konumlandmlan ana
dolaşını menüleri ile derginin bütün içeriğine erişilebilmektedir. Sayfanın sol üstüne
"""~''''''''''"'''''J''''''''~""".",~",:",,",",,'""'~,,~~"".,
(Görüntü: 166) "e-grafik.net" dergisinin bütün
e-grafh<
5.3.2
'i
-,
ana sayfadan
ulaşılabilir.
,·,ec·
"",.~,
"l<''''''''~'
"',"""'",,..,,:,,' '. ".-."".,,,',,"ı.,.',','·"
I
(GÖrünti.i:167)
'"
içeriğine
,JO' "
~'''"
Ba~lık ve menü ilişkisi; "yönerge" düg-mesine tıkl,m~ı-g-ın-da"
yönergesi"
e~gra
Ek .ne t yayın
sayfası açılmaktadır.
yerleştirilen ana sayfa, site haritası ve iletişim bağlantısı ile kullanıcmm geniş fonksiyonlu
S.ite,. ~eriulemesine en fazla üç kez açılan sayfalar biçinıinde tasarlanmıştır. Kullanıcınm
dolaşımı sağlanıniştır. Aynca sİtenİn en altmda bulunan dolaşım menüsü ile kullanıcılar
sıt~ ıçınde kaybolmasını
diğer sayfalara atlayabilmektedirler.
baglantısı eklenmiştir.
Site içi dolaşım kolaylığı, başlıkların ve menü adlarının birbirlerini desteklemesi ile doğru
engellemek için
tuşuna basmasına
..
''''',....... ..-
(Görüntü: 167).
"_
(Göıüntü: 168)
166
sayfalann sol üst kısmına "geri"
gerek kalmamıştır (Göruntü168).
orantılıdır. "e-grafık.net" sitesİnde içerik başlıklarıyla dolaşım menülerinin adları birbirine
koşut hazırlanmıştır. Böylelikle kul1amcının düğmeye tıkladığında ne ile karşılaşacağmı
önceden tahmin etmesi sağlanmıştır. Örneğin "yönerge" düğmesine tıkladığında içeriğin
yayınlandığı bölgede "e-grafık.ne! yayın yönergesi" başlığı ilc karşılaşüma.lc!ad.ır
1
açılan
Böylelikle kullanıcının sunucu (Browser) "geri"
r'_~"C·".,·"O;".,
Makale metninden diğer makaleiere lliaş.mak için "geri" me,'ın bag-ı an t ısı i(u ıı anıi mıştır.
teye: dergi içi dolaşım! kolaylaştınnak için arama motoru
otonı
ile makalelere hızlı
yerleşlirilmiştir.Bu
arama
5.3.3
erişim sağlanmıştır(Göıüntü:169).
Barmer ItdclMı1arda Gra Tas=
1aurıtl Ads
Layout
" e -grafjk.net" web sayfası. bir elektronik grafik tasarım dergisi içeriğini yansıtacak
$or~
biçimde tasarlanmıştır. Sitenin içerik mimarisi ana sayfaya odakJı olduğu için
i
düzenlemeler bu yönde geliştirilmiş ve öneri olarak geliştirilen tasanmlardan
=12~'1
(Görüntü: 171 -172) bir tanesi seçilerek uygulamaya konulmuştur.
(Görüntü: 169)
Hızlı
aramalar için
aranıa
kutusu
,ayfa içinde metin bağlantılan aItçizgi ile belirtilmiş ve bir üstmetin /
hipeJ1ext)
olduğu vurgulanmıştır
"apısını bozmaması
.•.....
~~~::.~.,
metin
__.-..
...•...
(Göriir.tü:166). Metin bağlantılarındatasanmın genel
açık değeTde
için ana metinlerden bir ton
)iğer bir sayfaya bağlantı olduğunu desteklemek
aşındığmda kırmızı renge dönüştürecek etki
LU
bağlatılı
siyah renk
kullanılmıştır.
için altçizgili sözcüğe, üzerine imleç
(effect)
eklenmiştir. Arayüz tasanmıarında
tür etkiler dolaşım düğmesinin bir etkileşim aracı olduğu hissini uyandırır. Yaygın
llarak bütün web siteLerinde bağlantılarda renk
değişim etkisi kullanılmaktadır.
(ullanıcının daha
çıkarak görüntülere bağlantı eklenmiştir.
R.esimlere
önceki deneyimlerinden yola
tıklanıldığında farklı
bir sayfada daha
geniş bilgilere ulaşl1ması sağlanmıştır
:Görüntü: 170).
.." "i'
!
,i
J
(Görüntü:170) Göriinru
Dolaşım
bağlantısL
menülerinde ren..~, biçim ve düzen yönünden
erişilebilirliği etkileyecek sorun
bulunmamaktadır. istenilen bağlantıya tıklandığında sayfalar açılmakta ve herhangi bir
sorun
ı
yaşannıamaktadır. Sitede
hoparlör,
kulaklık gibi
çoklu araç
kullanılmadığından, imiianıcının ayflcli
araçlara gereksinimi olmayacaktır.
(Görüntü: 171) "e-grafik.net" için kayout önerileri i
168
Site
-
taşanmında kullanılan
görsel
öğelerin her
biri,
içeriği
destekleyen nitelikte anlam
taşımaktadır. Örneğin; görsel kımliği oluşturan logo yazı karakterı, dijital teknolojiyle
,
ilişkilendirilmiştir. Hazırlanan uygulamanın elektronik yayın olduğunu
de ana sayfanın üst kısmında pikseneşmeyi gösteren grafik form
~=-=----
desteklemek için
kunamInuştır
(Görüntü: 173).
-=
"~ .~ .~~~_ _~o~
••
..
'"
"
'.
~A''''~''•
'"
".
.'''.
"",
,_,.,_,..."
1~,."",,,",,,~,e"'''j~.,tH'"
'.""~,,q,,~,
'1,•••
m'",.".","",""""
i
Cf:ı"J
'~'I
".",,,'.',,,
,"'~"OO-'"''
(Görüntü: 173) "e~grafık.net" logosli ve pikselleşmeyi gösteren zemini .
.. i = : = - " - - - -
Kullanıcılann
görsel
algılarım durağanlıktan kurtannak
için ana sayfada bulunan
asİmetrik denge oluşturacak biçimde düzenlenmiştir. Ayrıca,
kimliğinin
göstergesi olan pikselli görüntü
dengelenmiştir
kullarucılann görsel
öncelikleri dikkate
Görsel hiyerarşi ilkelerinden biri olan vurgulama,
verecek
ana sayfanın üstündeki site
sayfanın en sağındaki iki
piksel kare ile
(Göruntü: 173).
Ana sayfamn düzenlemesi,
yanıt
öğeler,
şekilde düzenlenmiş
logo üzerinde
kullanıcının"
alınarak yapılmıştır.
nerede"
başlayıp, dolaşlII1
olduğu sorusuna
menüsü ve
içeriğin
bulunduğu alana doğru kaymaktadır. İçerik ve dolaşım menüleri, ekranın odak noktasına
gelecek biçimde
Site,
yalın
yerleştirilmiştir (yııkardan uşağıya
(Göıüntü:l72)"e_grııtik.rıet" için kayout önerileri 2
elcranı:il
odak :iloktasıdır).
ve basit bir anlatım diliyle tasarlanmışlır. Yalınlığın etkisini güçlendirmek için
ikonlardan kaçınılmış, site içi
[170
1/3'lül{ alan
dolaşım üstmetın bağlantısı
(hipertext link) ile
sağlanmıştır.
:kf kitlenin görsel
mılrnıştır.
algısı
ve zihnini kanştıran görsel kirUlik ve karmaşadan
Logo, metin ve
diğer
görsellerin yerleştirildiği alandaki beyaz boşluklar,
ılanırlığı arttıracak niteliktedir.
llanıcılara
rahat bir okuma J ~zleme ve site içi dolaşım
kolaylığı sağlamak
için renk,
öğelerin yerleşiminde tutarlılık sağlanmaya çalışılmıştır.
im ve görsel
-dergi" ve "duyurular" başlıklı sayfalarda
kullanılan
görüntüler, metnin
sağında aynı
- ,',-
:un içinde aşağıya doğru belirli aralıklarla sualanarak görsel sürekliliğin sağlanması
ıaçlanmıştır.
Benzer
şekilde dolaşım menillen
de belirli
<ı"."n'\'."_,ı,,
aralıklarla sıralanmıştır
örüntü:174).
i , •.
m.
--
L----=J
Ni
i
1""""""1 ,..,...
l17i. '"
~::::. ~
~
~
i..~.~,
fl
i. -~
.- '"
i
'~ii~
....
(Görüntü: 174) Resimler görsel sürekliliği sağlayacak biçimde yerleştirilmiştir.
Cullanıcı ekranlannın farklı boyutlarda
asarımı
(15,17,19,21 inç gibi)
olacağı düşünülerek
800 x 600 piksellik ekran çözünürlüğüne göre yapılmıştJr.
aratim çevreleyen gri alanlar,
değişken
bir yapıya sahip olsa da
Sayfanın sağ
sayfa
ve sol
içeriğin bulunduğu
800 x
500 piksellik tasarım boyutu değişmemektedir (Görüntü: 175).
, e-grafik.net >i
uygulamasının
..~
sayfa düzenıemesi, tasarım ilkeleri ve bilginin mimarisi ile
bir birini destekleyen bir nitelikte ve uyum içindedir.
~
k:P::>'J::' -
(Göruntü:175) Sayfa
im
ta.san~ın ~OOx600(üst), I024x768 (orta) ve 1~~Ox968
(alt)
pıksenı ekranlarda görüntüsü.
173 [
5.3.4
Amı
Tipografi ve Okunurluk
metinde ve başlıklarda, ekran
okunmluğu ylİksek olan
font grubu kullanılmıştır. Dolaşım menüsünde
düğme
"Ariel, Helvetika, Sans-Serif"
etkisini
arttırmak ve düğrneyi ana
metin fontundan ayırmak için kalın Verdana yazı karakteri tercih edilmiştir. Tüm metinde
tırnaksız yazı karakteri kullanılarak tutarlılık sağlanması amaçlanmıştır (Göriintü:176).
Metin sola hizalanarak, hem nehirlerin
kullanıcılann göz
hareketlerinin bir alt
oluşumu engellenmiş hem
satıra
geçmesi
_,'" ••"
UW
.[,.n~~, ~'.~mo
~
de tümce bitiminde
kolaylaştırılmıştır (Görüntü: 176).
i
-
"",",,)'-)"·""*1' "[,.r, Bn
T'nf'_'"13.-""~.
r
.f.i....
e,..,., ,,',"'.,'"' ."0,.1"'.'",.'"
:,,::,;:::;,';;::'~:::"
0.0·
I'
'_".~,ır
. ""'".
.. ,,' ,,,,,,.,",",,,,,"",
,_
H,
i
,c,,,
i
_
i
J.~
(G runtu.!77) Vurgulama ve ustmebn i bağlantılı metin kullanımına ornek kesıt, aynı fontun kalını ıle
yapılmıştır. Altçizgi bağlantılı ınetin olduğunu göstermek için kullanılmıştır.
ü
·c .. i
E
~.
,
i
... i.
... :
Renk, vurgulama öğesi olarak dikkatli
kullanılmış, sadece
_,>ıM
- ."<0'.
içerik başlıklan ile
biber kunıızısı renginde uygulanmıştır. Makale başlıklannda font, büyük ve
aynı yazı
karakterinin kalını
dolaşım
olarak değil,
yalnızea
kalın (boıd)
Metin içinde renk ile vurgulamaya gidilmemiş,
kul1anılmıştu
(Görüntü: 177). Altçizgiler ''UrguLama ögesi
üstmetin bağlantısı (hipertext Enk) olan sözcüklerde kullanılmıştır
(Görüntü cı 77).
Ana metinde kullamlan 12 piksel büyüklüğündeki Ariel fontu için değişik satır
denenmiş
en uygun
satır aralığı
değer (Default)
aralıkları
18 pik.<;el olarak saptanmıştır. Fontun ölçüsüne göre
aralıklannda değişkenlikler yapılmıştır.
Harf ve sözcük aralannda
satır
bilgisayarın atadığı
ön
uygun göriilmüştür.
Okuma hızını düşünnemek için
aşIn UZLUL
ya da
kısa satırlardan kaçınıImıştır.
Ana
metinlerde satu uzunluğu 70-80 harf karakter sayısı uygun görülmüştür.
Masaüstü yayıncılıkta kullanılan Quark ve Adobe İn De:sign yazılımlanndaki gibi metin
ve başlıklarda stiller olU9turularak tipografide
1 174
"'110
1<0·
<,"'aı-·, ce" ··,Ge":L
'._', "":m 20C'· ~~"~'" "'o
menüsünde aynı renk kullanılmıştır. İçeriktc ise e-sergi sayfasında sergi salonu bağlantısı
kullanılarak vurgulama güçlendirilmiştir.
..;,~
tutarlılık sağlanmıştır (Görüntü: 178).
,;1"
-,
'~-'--;"w;-~--
o,'. ;,';",'r •
ıl
Renk Kullanımı
I.S
goda kullanılan tumTICU ve siyah renkler sitenin genel yap ıs ma hakimdir ve bu yönde
:sel bir kimlik oluşturulmuştur. Logo renklerinİn yanına onların etkisi destekleyecek
ıer kırmızısı ve grinin tonlannda renkler eklenerek renk şernası düzenlenmiştir
örüntit 179). Bu renk şenıası görsel hiyerarşiyi ve tutarlılığı destekleyecek biçimde
Uanılmıştır. "e-grafik.net"'in sayfalanna bakıldığında ilk olarak kuıum kimliğini
cısıtan loganun algılanması için
yeri ve konumu belirlenmiştir. Aynca turuncu ve beyaz
ıklerden oluşan logoyu arka plandan rtyırmak için hem logoya hem de arka plana
utrast bir renk olan siyah kullanılmıştır. Logodan sonra gözün aşağıya doğru hareketini
i. ~:,,,,,"ı~ı ,ı,,~,"~,,!ı.I"IC'
r,,",ı,. ıg~r", "''''''~'' ''''·-,.H.lI' ";'1'11 (""I ;"", ",mli""."
'''r:'MP cc' rOnırO""'I'-'"''
"c•. ı",~., 1,1"'1 \ "";--" , 'oc.,,; .",,0 '-1'."'··, ;"0;11""1_ 1'>1'"",,"'" '" Ilfo,ln,1 -,"oJ< -,.,'tr,""
ğlamak için sol alt köşeye banner yerleştirilmiştir.Gözün hareket noktalan arasına'
rleştirilen dolaşım menüsünün algılanırlığı ise bıber kınnızısı
ve beyaz boşlukla
«e-sergi", "e-dergiler" ve "kitap inceleme" gibi bazı içerik sayfalarında görüntü 1/3'lük
tınlınıştır (Görüntü: 180).
alana yerleştirilerek tutarlılık sağlanmaya çalışılmıştır (Görüntü: i 82).
hite .,055" ":;:"!<l ,,'5.5b
aek tl, (ip
,~
ttersINeel ",y,;r,~ &;1
5,.'1; I.,"'[lg &;1
~48g4&ı
•
&4*48b..,o
~<%L8EiÖ
,,~ 125j71':"51>
,~
-
IL.'Y 178b
"
•
m-.?tJc/..q.?Mb
~'N- .ı.:~1Y ..:1?bL"lf;.
Ana sayfada hareketli görüntülerden oluşan reklam bannen genel yapıyı bozmayacak
ıtü: 179) "e-gnıt1k.net"
.3.6
Görüntü
renk şeması.
(Göriintü: l80) Rengin kullanımına ornek.
büyüklüktedir (Görüntü: 183).
'ii
,
Kullanımı
;eriğe yönelik hazırlanan bu web sitesinde ana sayfa ve makalelerde kullamlan görüntüler
:eriği destekleyecek niteliktedir. Görüntü kalitesi ve çözünürlük değerleri ekranda en iyi
örürrecek şekilde ayarlanmıştır. Hızlı açılmayı engellemeyecek şekilde küçük
"E
':::::.
l
'I
ullanılmıştır. Görüntülerin altına yazılan açıklama yazılan görüntüye yaklaşık 5mm
ralık bırakılarakyazılmıştır. Böyıelikle görüntü ve yazının daha iyi algılanması
ağlanmıştır. Ayrıca paragraf aralanna yerleştirilen resimlerin metne uzaklıklanna da
ikkat edilmiş, metin ile resmin iç içe geçmesi engellenmiştir (Görüntü;181).
(Görüntü: ı 83) Reklam bannerinin kullanımı.
176
1771
5.3.7
Diğer
Sorunlar
E-grafık.net içerik
sitesi
olduğu
için sayfalar HTML ve ASP temelli
Bu yüzden bazı tasanm problemleri ile karşılaşılmıştır. Masaüstü
yapılandırılmıştır.
.
,~"
.
yayıneılık
satır aralıkları, başlıklar milimetrik
programlannda tasarlanan grafik ürünlerinde harf ve
ayarlanabilmektedir. Dreamweaver ve Frontpage gibi web tasanm programlannda
tasanınlar HTML'e
teknolojik
göre yapıldığı için çok hassas ayarlama yapılamamaktadır. Bunca
gelişmelere .rağmen
tablo içine
yerleştirilen
görüntü ve yazılarda kaymalara
rastlanmaktadır.
5.4
"e-grafık.net"
başlıklann
sayfası)
.., ..
UYGULAMASAYFALARINDAN ÖRNEKLER
web sitesi ana sayfasıyta (editörden) birlikte,
(bu sayı, yazar dizini, konu dizini, kitap
diğer
inı:eleme,
ekran görüntülerine yer verilmiştir (Görüntü; 184-191).
görüntüleri,
orantılı
bir
sayfalardan bazı
e-sergi, e-dergiler ve
Alınan
iletişim
örnek ekran
şekilde küçültülmüştür.
,~
i
L
~
,,,",,.,,
"
'....,",
,~c·.,.,"
,,'~-,,"
,.,, ',,,.,,'''',,.
,,,•..-
".,.,,','....,',' .,.."
.,.1.,,"' __""""",_'"'.'
·).""···n.'''''....
,.;'•..,....
,~
'.0' .••
~~.;;,...&'1itmtl,~~!ffiM~~~K~5fz!r~:!;ıı,:r1rt~B)j?~l~::.f!j~~~l!t.gl~~4i'.~t~BJP5:.'',f,'th;'!f;'.~;!.rrx[?'~-5~.,i:J~
,.,= ,__ ""._
"""~
Iri,
(Göruntü:185) "e-grafiknet" 'bu sayı' sayfası.
~.
--'
]
:.:
.
"",J""'"
"
'ıl
.",;,~",.
..
,
i i i
i,
'iii: I,,, i III II i
"":";',.:;,:,','",,
""",,,,.,.,,,.,,,,,",,,,y.,
"""1'" _>;,,,,,\;,~,, ,,',• .-,"
"'""'J" •.,"''''O·_".''''""'''·'''''·''''''·'''''·'·''-' ',","",,-'
"~'."",M·."",-,;;".,,,,,,,
.-,,,,,,"''''''"
.""': ",ı" .. ';",'~"
'''''ı
,,,,-.
',:-'J"O.",-
'''''''''''':'
,','.... ' ,.,j'"
••.",;
""
,. .. """
F"'9
"
~~.i._.1.i
~""o""\'c'J<;"
"."""." ''"~.",'',,~' ",", •• j.,'"
•.'.
M'''''''''''',''
"""",~),,,,,,,,, •.:"
,""'k'·""""''''''.-'''' . '''"''"''''''''"~ ""\"\."""~"'" ,'".,
'-""."'""--h
"""".,",."".,,,1,'.;.. '
,."",,,,,""",,,,.,,,,
""'i""'-·""~"·"·"'·"" '-1'.eO',,',""''''''"' ,,,.,,.,,,,, F,"m""_'.''','
","0'''''' ~"'1, "'."."
"~"', ,.:ı",,,",,,,,~,,·h",,,·',,-,,~,,,,,,,,,,·,
j.
.
i',
.,,'.' ll"......
. (Görüntü: 184) "e-gra:fıknet" 'editörden'
sayfası.
(Görlintii: 186) "e-grafık.net" 'yazar dizini' sayfası.
• "Ml,
if.
4iS&-
-
'. ,. ,
..., ' , . ) ...
..
,
.j~)~~''':'f1'1%;~1;'r:ı:;:':''')':2i";'~
:>::--;,r;., '" ~ . -'..."-
i
i
ı
1
_
oc} .-'q{,F~5"''''~:'-:, ..•
'
,;;k':;!<=",.,,_-~
_'j~;'?\;;;{f@~,~~~'~j'l~i,\'f'k~~_~d-~m~:~?f:~
. ~_ _
(Görüntü: 187) "e-grafık.net" 'konu dizini'
"...
~
,;r'i;!"M':"-
sayfası.
sayfası.
(Görüntü: 189) "e-grafik.net" .sergi salonu'
q ..p # ;
"'"'.........
, v,iJ-····C4~m~·''!.:·2f-~\X,~s.::''1S'::zJ3E:B2:=::_~.'?!,
:,~:::::'--;"~"T-:::":,
-........... '_.....
" ..,'
,~-
/_.
l ..
-:'J'
,~
"';~
."",",-,...",,,,,
~
•
J
;.'
-~ ,.,.""' ••
-
_ı •• -i""~'~"'."',
,
<.,
~"
,
~
•.\._,"",..1'·
----,._«._.,--
- - - ,,
,
~~-'
-~-
, 'lıiIıiiiiiiiiiii
'~I
1~
!_............e;
<11".,,-..
~~e { ';rft~':f5,$~~i~~IDı1mr,X~:0:"7,§~E'J
(GÖlÜntü: 188) "e.grafiknet" kitap inceleme sayfası
1180
i~'-<~~
-~----
---
(Görüntü: 190}"e-gmfik.net" 'e-dergiler' sayfası.
SONUÇ
•
,,_ . . . iv_'~".
-,--~
Web siteleri.
e-y.ayıncıhğın yanı sıra
yüıiitü1düğü
bir
çoğunun
oıtanı
web siteleri
ürün tanıtım ve pazarlama faaliyetlerinin
olarak kullamlınaktadır. Büyük ticari kaygılar güden
incelendiğinde, satışlan
sitelerini yetkin grafik
firmaların
arttnmak ve marka imajı güçlendirmek için
tasanmcılara yaptırdıkları gözlem1cnmektedir. Diğer
adamalannın yayın yaptıklan
incelendığinde
akademik dergi siteleri
taraftan, bilim
tasarım
ise ciddi
sorunları ii~:icarştlaşılmaktadır. AsLında, bilim ve kültür insanlarının gö;s:~i iletişim
ortamlarını
kullanmada yetkin
grafık tasanmcıların onayını alması
ya da onlarla
çalışması
gerekirken bu konuda ticaıi kaygıları önde tutan fırmalara göre geride kalmalan
düşündürücüdür. Oysaki,
~
1""'·-1
W
etkili bir web sitesi tasarlam~ için hiper yazılıın teknolojilerine
hakim olmak yetmemektedir, verilerin önem
sahip bir biçimde
tasanmınm
sunulması
bir ekip
gerekmektedir.
işi olduğu, yazılım
alanda önemli bir yeri
sırasına
Yapılan kuramsal araştırmalar ile;
için
web site
mühendisleri kadar grafik tasanmcıların da bu
olduğu saptanmıştır. çünkü,
sağlayıcılarma, etkileşim
göre düzenlenmesi, estetik niteliklere
yazılımeılara,
iyi bir web sitesi için; içerik
estetik nitelik ve
işlevsellik
işlevsel
kullanılabilir
için de grafik
tasarımcılara gereksinim vardır.
tGörüntü; 191) "e-grafık,net" 'iletişim' sayfast.
Görsel
açıdan varsı1,
layoutu oluşturan
şu şekilde
tasarım
ve kolay
bir site için;
ilkeleri göz önünde bulundurulmalıdır. Bu ilkelerin
gerekliliği
ömeklendirilebiIir: Sayfa içinde bilginin organizasyonu için "görsel
hiyerarşiye",
öne
izlenebilir, okunabilir,
metin Ve görsellerin
çıkarmak İçin
bütünlüğünü
anlaşılırlığı
için
"açıklık"
ve
"yalınlığa",
önemli iletileri
"vurgu"ya. dinamik ve etkili bir sayfa için "denge" ve "ritrne", site
gösterebilmek için de
"tutarlılık"
ilkesine
uyulması mesajı
etkili iletmek içi
çok gereklidir_
Yapılan araştırmalar
sıra
renk,
yazı
varılmıştır.
sonucunda
e-yayın içeriği
sunulurken düzenleme
ve görüntü gibi görsel elemanlann da
Her bir görsel
öğe gerektiği
yanlış kullanıldığı
sOlunlarınm yanı
sonucuna
gibi kullanılmadığı zaman, tasanmı olumsuz
yönde etkileyebilmektedir. örneğin. elaan yapısına uygun bir yazı karakıeri
seçilmediğinde okunurluğun azalması,
okuuurluk hem de görsel
ve ölçüsü
uygun renk bileşenleri kullanılmadığında hem
hiyerarşinin sağlanarnaması
ayarlanamadığında, algılanırlık
gibi. Diğer taraftan, görüntü kalitesi
ve sitenin açılma hızında SOlunlarla
karşılaşılması kaçınılmaz olmaktadır.
Bu
araştırma
çerçevesinde
organizasyon yapısına,
oluşturulan
e-dergi uygulamasmda; sitenin içeriği ve
içeriğini yansıtan
görsel kimlik oluşumuna, dolaşım ve
ışi\ebiUrbğe,
sayfa düzenlemesine, tipografinin
okunurluğu desteklemesine,
görüntü,
EK
nk ile ses, video, animasyon gibi çoklu ortam araçlarının etkin kullanımına özen
jsterilmiştir.
DERGİ DEGERLENDİRME KRİTERLERİ
iber uzayda hedef kitle ile etkileşimi sağlamak için bilgisayar ve elektronik mühendisleri
:ıva,
yazılımlan kullanmaktadıdar.Ara
ASP, PHP gibi
yüzün
işlerliğini sağlamak için
rafik tasanmcılar, yazılım mühendislerinden destek akmak zorundadır.
Unutulmamalıdır
Dergilerin, "ULAKBİM Sosyal Bilimler Veri Tabanı"na kabul edilebilmesi için ilgili
kurul tarafından belirlenen kriterler aşağıda belirtildiği gibidir (Ulakbim, 2006):
i, teknik problemlerden dolayı erişim sağlanamadığındasitenin estetik niteliği hiçbir
A. Dergi, Sosyal Bilimler Veri Tabanı (SBVT) konuları kapsamında ve bilimsel
nlam ifade etmeyecektir.
içerikte olmalıdır.
~-dergi sitelerinin tasarım sorunlan
ılahilmektedir. Genellikle
yamnda içerik sayfalan sunumlannda da sorunlar
sayfalar, ya
aşağı doğnı açılmakta
ıerilmektedir. Araştımanın uygulama çaltşması olan
alıntılar
)zet.,
ya da parçalar halinde
e-dergide, makaleler hızlı tarama için
için HTML ve daha sonra okumak için de PDF biç-iminde verilmiştir.
HTML olarak verilen makale tam metinlerini incelemek ve olmmak için kaydırma
çubuğunun aşağıya doğru
hareket ettirilmesi gerekmektedir.
sorun
değil de,
tarama
C. Dergi, SBVT'ye başvurduğutarihte en az 2 tam yıldır yayımlanıyorolmalıdır.
D. Dergi, SBVT'yc dergi hakkında tanıtıcı bilgi içeren bir ön yazı ile başvuruda
bulunmalıdır
E. Dergi sayılan, yayınlanması gereken taribten itibaren en geç 6 ay içerisinde 2
basılı ve ULAKBİMtarafındanbelirlenen standart formata uygun 1 elektronik
kopya halinde ULAKBİM'e gönderilmelidir.
Kullanıcılann,
F. Dergi, Kültür ve Turizm Bakanlığı'ndanISSN numarası almı.ş olmalı, ISSN
yaptıklan vanayıldığındankaydırma çubuğu
numarası derginin dış kapağında sağ üst köşede ve iç kapağında yer almalıdır.
çubuğunun okunurIuğu etkilediği belirtilmiştir (Onursoy,
ekran üzerinden okuma
Bazı araştırmalardakaydınna
B. Dergi, ilan ettiği periyotta düzenli olarak yayımlanınahdır.
2001, s.156).
G. Dergide aynntılı ve bilimsel hakem raporuna dayalı bir değerlendirme sistemi
olmayacaktır.
olmalı ve yayın/danı~makurulu bulunmalıdır.
Teknolojik
gelişmelerlebirhkte e~okurlann da
edilmt:mdidiL Bu bağlamda, e-okur ve
ve gereksinimlerini
gibi
karşılamak için
da.... ramşlannın
renk, tipografi,
dolaşım
konuların derinlemesine araştınlmasındayarar vardır.
uğraşan yayınevleri ve
yönlendirici bir kaynak
değişebileeeğ.i
tasarııncılanne-yayınlar ile
ve
farklı
ardı
düzenleme biçimleri
Bu araştınnanın, e-yayıneılıkka
e-dergi tasanmeılan, grafik tasanıneıla. ve
olması beklenmektedir.
göz
ilgili tasarını sorunları
ara:;;tınnacılar
için
H. Her makale en az 2 hakem tarafından değerlendirilmişolmalıdır.
~. Derginin hakemli bir dt:rgi olduğu" .... hakemli bir dergidir" şeklinde bir ibareyle
ıç kapakm belirtilmelidir
J. Hakem ve/veya Yayın Kurulu DeğerlendinneRaporları, Sosyal Bilimler Veri
Tabanı Ohıştı.ınna Kurulu tarafından ilgili yıl içerisinde denetlenmesine olanak
verebilecek şekilde saklı tumlmalıdır.
K. Dergide yer alan makaleler Türkçe ve yabancı dilde (lngilizee vd.) "başlık
(title)" ve "öz (abstraet)" içennehdif.
L. Makalelerde konuyu tanımlayan Türkçe ve yabancı dilde uygun "anahtar
kelimeler" bulunmalıdır.
M. Makalelerde kullanılan kaynaklar, makale sonunda "kaynakça" listesi olarak
standart bir formatta verilmiş olmalıdır.
. N. Dergide makale yazım kurallan belirtilmiş olmalı ve makaleler yazını
kurallarına uygun yazılmış olmalıdır.
O. Derginin adı açık bir şekilde yazıımalı, yayın aralığı (periyod) ve yayın
tarihlerine İlişkin bılgiler derginin iç kapağında beljrtilme1idir.
1 184
KAYNAKÇA
P. Makalelerde, yazar adlan ve çalıştığı kuruluş bilgileri açık ve doğru bir şekilde
belirtilmelidir.
Q. Derginin yazışma ve iletişim (tel ve e-posta) adresleri, editor. yayın kurulu
bilgileri güneel olmalı ve dergide açık bir şekilde belirtilmelidir.
R. Dergilerde birleşik sayı basımı yapılmamalıdır. Yılda tek sayı basılan dergilerin
birbirini izleyen yıllara ait sayı birleştirmesi değerlendinneye alınmamaktadır.
Yılda 2 ve üzeri sayı olarak basılan dergilerin birleşik basımlan ise değerlendirme
Ağır,
A. (1997). Elektronik Akademik Dergi Yayıncılığı ve Bir Model Çalışması. Yüksek
Lisans Tezi, Marmara Üniversitesi, İstanbul.
Akgül, M.( 1999). İnternet Sunucu Araçları ve Yönetimi. Ankara: Bilkent Üniversitesi
Yayınları.
sürecine alınmakta, ancak birkşi..\;: basımın tekrar etmesi durumunda dergi veri
Akın, C (1996). Her Yönüyle İnternet. İstanbul: Alfa Yaymlan.
tabanından Çıkanlmaktadır.
Angel!. D. B. ve Smith. E. G. (1998). Print Versus Electronic: Editors' Insights on the
S. Dergide yayın etiğine uyulmalıdır.
T. Dergi değerlendirilmesinde dikkate alınan yayın türleri şu şekildedir:
• Özgün Araştırma ve İnceleme Makalesi,
• Derleme Makalesi,
. '. Olgu sunumu,
• Proje tanıtımı,
• Kitap tanıtımı (makale formatında olması koşulu ilc)
Cost and Benefıts of Online
24(1).ErişiITı:
20 Eylül
Jounıals.
The Journal of Teclınology Studies,
2004 http://scholar.lib.vt.edu/ejoumals/JOTSlWinter-
Spring-1998/angelL.html
Amiran, E., Unsworth, J. ve Chaski, C (1992). Networked Academic Publishing and the
Rhetorics of1ts Reçeption [Akademik YayıncılıkAğı ve Kabullenilme Retoriği].
36(1). Erişim: 28 mart 2005, Virginia Üniversity:
http://jefferson.village. virginia.cdw'e-:imu2m/centennial.review.36: i .html
Elektronik Dergilerin Değerlendirme Kriterleri
Atalayer, F. (1994). Temel Sanat Öğeleri. Eskişehir: Anadolu Üniversitesi Yayınlan.
A. Elektronik ortamda yayımlanan dergiler için de basılı dergiler için h."1ıllamlan
A"{up. J. (2002). Usability
değerlendirme kriterleri geçerlidir. Buna ek olarak.;
[Kullanırlık]. Erişim:
23 ekim 2005, Userdesign.eom:
http://www.userdesign.com/usability.html
B. Derginin elektronik adresi (Web sayfası) erişilebilir ve kullanılabilir olmalıdır,
C. Elektronik. derginin arayüzü kullanıcı dostu olmalı, hata mesajlan ve erişim
sonmlan yaşanmama1ıdır.
D. Elektronik dergide "arama/search" ve eski sayılar için arşivalanlan
bulunmalıdır.
Bakalor, Mark (2000). Web Graphics Basic:> [Web Grafiklerinin Temelleri].
\5.0cak.2006, Efl.1se:
Erişim:
http://www.efuse.eomlDesignlweb-->>"aphics_basics.htmı
Book, A.C ve Schick C. D. (?). Reklamcılıkta Metin ve Taslağın İlkeleri (Dilek ŞendiL,
çev.). İstanbul: Yayınevi Yayıncılık (1998).
Buy, (ly).
Erişim:
20 Haziran 2006, http://www.buy.com
Chaparro, B., Baker J.R., Shaikh, A.D., Huil, S. ve Brady, L. (2004). Reading Online
Text: }-,~ Comparisan ofFour Wiıite Spacc Layouts [Çevirim İçi Metni Okumak:
Dört Beyaz Boşluk Düzenlemesinin
Karşılaştırılması] 6(2). Erişim: 12
Eylül
2005, Wichita State University;
http://psychology.wichita.edw'sur1'usabiıitynews/62/whitespace
.htm
Britsios, J. S. (2005). Why Usability is Important to You [Kullanılırlık Sizin İçin Niçin
Önemli]. Erişim: 04 Temmuz 2005, Web Desing Libnıry:
http://desktoppub.about. comlgitdynamicloffsi te.
ht1p:llwebdesign.templatemonster.comlweb/web-design-basics/website-
htm?site=http%3A~/o2F%2Fwww.writerswrite.com%2F epublishing%2F
usabili ty/ wlıy-usabili ty -18- i ın portant-to-you. 5 OO3.html
.bedge, (2006).
Erişim:
25
Şubat
Digital-web, (2006). Erişim: 06 Ocak 2006, www.digital-web.com
2006, http://www.cabedge.com
Ebookcrossroads (ty). Introduction to ePublishing [E-yayıcıIığa Giriş]. Erişim: 29 Mart
2005, htıp://www.ebookcrossroads_comlepublishing.html
.ğıltay, K.(I995). Herkes İçin İnternet. Ankara: TÜBiTAK.
~vikel, T. (Aralık 2003). Alternatif Bir Haber Medyası Olarak İnternct: Türkiye'deki
Haber Siteleri [Bildiri], INET-TR'03, IX. Türkiye'de Internet Konferansı,
Harbiye Askeri Müze, İstanbul. Erişim: 12 Nisan 2005, Türkiye'de İnternet
Konferansıan:
Erişim:
18 Ekim 2005, ProQuest Infonnation and Leaming Company:
http://proquest. umi.comlpqdweb?did~891822831&sid~3&Fmt=3&clientId~
44 718&RQT~309&VNamC"'PQD Makale No: 89182283 i
'lyde S., Alojipan M. (2005). ls Electronie Publishing the New Medium? [Elektronik
yayıneılık Yeni
http://www.edteeh.vt. edu!edtechlid/interfacelscreens. html adresinden erişiId i.
Erdinç, Ş. (2002). İnternet'e Dayalı Uzaktan Eğitimde Etkileşimli Görsel İletişim
http://inet-tr.org.tr/ineteonf9/bildiri/91.doc
lyde Laurel A. (2005). Electronic Books [Elektronik Kitaplar]. Teacher Libranan, 32 (5)
s. 45.
Edtech.vt (ty). Screen Design [Ekran Tasaruru]. 5 temmuz 2005 tarihinde
Bir Araç mı?]. Erişim: 22 Ocak 2005, MCTİMES:
Tasarımı: Beykent Üniversitesi İçin Bir Deneme. Sanatta Yeterlik Tezi.
Hacettepe Üniversitesi, Ankara.
Eonk, (2006). Erişim: 25 Şubat 2006, http://www.enoik.cam
E-sosder, (2006). Erişim: 26 tbziran 2006, www.e-sosder.com
Eye4u, (ty). Erişim: 25 Nisan 2006, bttp://www.eye4u.com
Firstrnondey, (2006). Erişim: 23 Haziran 2006, www.firstmonday.org
http://www.mctimes.net/2003/Hyperdrive/20030404Is_ Electronic_PUblishing_
Geocihes (2000). Usenet'te Tıp ve Elektronik Yayıncılık_ Erişim: 17 Haziran 2004,
the_New_Medium.h1m1
http://wwv.·.geocities.com/SoHo/Studios/9594/eyay.htm
:oach, (2006).
Erişim:
25
;oolhomepages, (2006).
Şubat
Erişim:
2006, http://www.coach.com
Gillespie, Joe (ty). Gruphie::> and Color [Grafik ve renk]. Erişim: 09 Aralık 2005
25
Şubat
2006, http://www.coolhomcpages.com
:otton, B. (1990). The"New Guide to Graphic design. London: Quarto Pubhshing
http://www.wpdfd.comlwpdgraph.htm (WPDFD: Web Page Design tor Designer)
pıc
http://www....pdfd.comlwpdtypo5.htm
le Beers, (ty). http://www.adiamondisforever.coml
lede, M.B. (2005). İnternet, Basılı Yayıncılığa AlternatifDeğiL. Erişim: 05 Ekim 2005,
pCTİME:
http://www.pctime.com.tr/deiay.asp?ContentID=1542
)emircan, Z. M. (Mart 2001). Web
)ergibi
(Şubat
2002).
Erişim:
sayfanız
rahat okunabiliyor mu? Net life
cİlt:?,
86-90
(ty). Epublishing Overview
20 Ekim 2004, Desktoppub.about:
l88
[e-yayıncı1ığıııı
Götz, V. (2002). Grids for The İntemet and other Digital Media [İnternet ve Diğer Sayısal
Araçlar İçin Izgaralar]. Switzerland: Ava pubUbing SA.
Grarmy's Mettle (2005). Basic Rules on Page Layout and eoIor [Sayfa Layoutu ve Renk
Üzerine Temel Kurallar). Erişim: 27 Ocak 2006,
http://www. webd esign.orglweb/web-desjgn-basicsldesign-prineip les/basic~nıles~
on-page-Iayout-and-color.4317.htrnl
5 Ekim 2005,
http://www.dergibi.comleditor/yansimaJoportaj .asp
)~sktoppub.about
Gillespie, Joe (ty). Typograpby [Tipografi]. Erişim: 7 Aralık 2005,
gözden geçinnek).
Erişim:
Grantasticdesigns (2005a). Fonts and Typefaces in Web Site Design. Erişim: 28 HaZİran
2005, ht1p://www.grantasticdesİgns.comlfonts.html
Grantasticdesigns {2005b). Making Your 'Web Site ~nd Web Graphic Images Easy to Read
[Web Görüntülerini Okunur Yapmak]. Erişim: 23 Ocak 2005
Hume, Andy {200S). The AJıatomy of Web FOIltS ["Veb fondannın anatomisiJ. Erişim: 19
http://www.grantasticdesigns.comleasytoread.html
Aralık
Grantasticdesigns (2005e). Navigation Sehemes in Web Site Design [Web sayfa
tasarımında yönlendirme
Hobartdesign, {ty). Erişim: i 9 Nisan 2006, http://www.hob~rtdesign.com
Hundie, K. (2002). Akademik and Scholarly Discl..k"ision Lists [ Akademik ve Bilimsel
sistemleri). Erişim: 28 Haziran 2005
Tartışma Listeleri} Campus-Widc Information Systems
htıp://www.grantasticdesİgns.comlnavigation.html
Throughout The Sit~" S Basic Rules OfVveb Page Design And Layout. Erişim:23
Hurriyet, (2006). Erişim: 25 Şubat. 2.006. http://www.huniyet.com
istek, R. (2004). Görsel İletişimde Tipografi ve Sayfa Düzeni. İstanbul: Pusula.
Ocak 2005, http://v.'Vv"\v.grantasticdesigns.comldesign.h tm]
"Your Web Site Sholl!d Be Eas)' to Fi!!d" 5 Basic .k'J..!1es afWd:,
Page Design and Layout [Web Sayfa Tasanmının ve Layoutunun 5 Temel
Erişim:
İnceelli, A., Candemİr, Ö. ve Demi:rG.y, U. (2005). El~ktrOilik Akadei11i...~ Uzal<tan :Gğitim
kuralı).
Dergisi: Tojde İçerik Analizine Dayalı Bir Değerlendume. Erişim: 20 Ekim 2005,
http://www.tojet.net/aıiiCıes/4414.htm
23 Ocak 2005, http://www.grantasticdesigns.com/design.html
Grantasticdesigns (2005t). "Your Web Site Should Be Easy to Read" ['Neb Sitenizi
Jenkins-Klepp (2004). Layout Tips and Tricks [Düzenleme ip uçlan ve hileleri ustalıkları}.
Kolayca Oktlnur Olmalı}. Erişim: 23 Ocak 2005,
Erişim: 25 Ocak 2006, http://www.webdesign.orglweb/weh-design-
http://www.grantastiedesigns.comldesign.htrnl
baslcs/rJesign.principles/layout tips-and-lricks.5606.html
w
Johnson, J. (2000). eoIor and Web Pages [Ren.1.c ve Web Sayfalan]. Erişim: 9 AraLık 2005,
Greenpeaee. (ty). http://www.greenpeacc.org/
http://www.sitepoint.com/aıiic
1el co lo r-web-pages
GÜlSQy, T. (1999). Reklam Terimleri ve Kavramlan Sözıügti.. İstBnbul: Adam Yayınları
Gürcan, H. L, Batu,
ç. (2001
). İnternet Haberciliğinde Sanal Yazı İşleri ve
Kaptan, S. (2000). Web Sayfalarında Görsel Bildirişim Sistemlerinin IşlevscI Açıdan
incelenmesi İnönü Üniversitesi için "Veb Sayfa Tasarım. Yüksek Lisans Tezi,
Gazetecilikte Değişen Roller [Elektronik fosterl. İnternet Konferanslan 7.
Erişim:
Gürcan, H.
Hacettepe Üniversitesi, Ankara.
20 Ocak 2(105, http://inet-tr.org.tr/inctconf7/eposter/gurcan-batıı.hbnl
L Birsen. H. (2000). Haberin İnternette Yeni Bir Görünümü: Portatlarda
Kemalunsal, (2005). "Veb Sayt'-'ılannın Yüklenmesini Hızlandınnak. Erişim: 9 Aralık
2005, http://W\vw.kemalunsal.eomlhtmlarticles11oad_time.html
Haber. VI. "Türkiye'de Intemet" Konferansı 9-11 Kasım 2000. Eri:;;im: 20 Ocak
2005, http://inet-tr. org.tr/inetconf6/tammeti nı gurcan-tam. doc
Hashimoto. A. (2003). Visual Design Fundamentals: A digital Approach. Hingham,
Kids.discovery, (ty). Erişim: 25 Nisan 2006. http://www.kids.discovery.com
Kutup, N., Benli, L. (2005). Samü Dergi Yayıncılığı. Erişim: 06 Ekim 2005,
http://WW.W·.fotografya.g:en.tr/is~ue.15/fotognı.fyabildiri.htm
Massachusetts USA: Charles River Media.
Haley, Allmı. {Ocak i ŞübaL 2002). Online type principles [çevirim iei yazı prensipleri]
Step-by-StepGraphieö 18(1)
Academic Research
,.112-115.Eıişim:3! Mart
2005,
Libnıry:
http://proquest.umi.comlpqdweb?did=629582941 &sid= i &Fm l=4&clientId=
44718&RQT~309&VName~PQDMakale
1190
19 (4), s.156·159.
Erişım: 22 Temmuz 2006 http://www.emeraldingsight.com/l065-0741.htm
Grantasticdesigns (200Sd). "Your Web Page Layout and Design Should Be Consistem
Grant:Jsticdesİgns(200Se).
2005, http://www.sitepoinLeom/article/anatomy-web-fonts/1
No: 629582941
Le~ms.
(rj).
Erişim:
26 Nisan 2006, http://vvvrw.lexus.com
Lynch ve Horton (2004a). Accessibility. Erişim: 30.10.2005,
http://www.webstyleguide.com/interfacelindex_html
'Lynch ve Horton (2004b). Alignment. Erişim: 30 Ekim 2005,
http://wv.w.wehstyleguide.com/type/aligu.html
;nch ve Horton (2004c). Case.
Erişim:
Onursoy, S. (2001). Online' Haber YayıncılığındaGörsel
30 Ekim 2005,
bup:llwww.webstyleguidc.com/type/case.html
mch ve Horton (2004d). Visual hierarchy.
Erişim:
Yayınlan.
30Ekim 2005
Palrne, J. (2003). Web Design Layout Principles Why are Most Web Pages
Desİgned The
Way They Are? [Web Tasarımı Layout İlkeleri Niçin Web Sayfalarının çoğu
{nch ve Horton (2004e). Multimedia. Erişim: 12 Mayıs 2006,
Aym Yolla Tasarlanular].
http://www.webstyleguide.com/multimedia/print/multimedia.html
Erişim:
Boyutu: Haber Sitesi
Özcan, 0.(2003). İnteraktifMedyaTasarımında Temel Adımlar, İstanbul; İş Bankası
http://www.webstyleguide.comJpagelhierarchy.lıtml
{nch ve Horton (2004f). Page dimensions.
Tasarım
Örnekleri Üzerine Bir Uygulama. Doktora Tezi, Anadolu Üniversitesi, Eskişehir.
Erişim:
25 Ocak 2006, http://dsv.su.se/jpalrnellayout/
Parise, M. (2005). Color TheoI)' for the Color-Blind [Renk Körleri İçin Renk Teorisi].
30Ekim 2005
Erişim:
http://www.webstyleguide.comlpage/dimensions.html
16 Ocak 2006, http://www.digital
w
web.com/articles/eolor.._theoI)'_for_the_colorblind/
ınch
ve Horton (2004g).
Erişim:
30 ekim 2005,
Parker, Roger C. (1999). Amatörler İçin Masaüstü Yayıncılık ve Web Tasarımı, İstanbul;
http://www.webstyleguide.comltype/index.html
[cClurg, Joshua D. (2005a). The Elements of Design
Kasım 2005,
[Tasarım Elemanları]. Erişim:
26
Pavka, A. (2005). Accessible By Design
http://www.digital-web.comlarticles/elements_oCdesignl
[cClurg, Joshua D. (20Q5b). The Principles of Design
[Tasarım Prensipleri]. Erişim:
26
Ekim 2005 tarihinde http://www.digital-web.comlarticles/principles_ oCdesignl
[icrosofi, (ty).
Erişim:
[uzikbilim, (2006).
03 Temmuz 2006, www.muzikbilim.com
Tasanın Bilgisi,
HTrvIL, Grafik ve
İlerisi
10
Kasım
2005
. http://www.digital-web.com/types/articles/
Pektaş, H. (2003). Kültürel İletişim Çevresi İnternette Görsel Kirlenme. 7. Ulusal Sanat
mayıs
20m-Ankara: Bildiriler (142-148).
Ankara: Hacettepe Üniversitesi Güzel Sanatlar Fakültesi Yayın1arı:21.
Pektaş, H. (1993). Basın İlanlannda Grafik Tasanın ve Layout. Ankara: H. Ü. Güzel
iederst, 1. (2003). Learning Web Design, A beginner's Guide to HTML Graphics, And
Beyond [Web
[Tasarım Yoluy1a Erişim]. Erişim:
Sempozyumu "Sanat ve çevre" :28-29
06 Ocak 2006, http://www.microsofi.com
Erişim:
Dünya Yayıncılık A.Ş.
için Yeni
Sanatlar Fakültesi Sanat Yazılan 5
Başlayanlara
Pet1ersson, R. (2002). Information Design an İntroduction [Bilgi Tasarımına Giriş].
Rehber]. California, ABD: O'reilly Associatees Ine.
Philadephia, PA, USA: John Benjamins Publishing Company.
ieisen, J. (2005). Jakob Nielsen1s Column on How Users Read on The Web (
Pettenati, C. (2001). Electronic Pubhshing at Thc End.Of200l [200 ı Sonunda E-Yayıncılık],
Kullanıcılann Wcbde NasılOkurlar Üzerine Nielsen'in Sütunu]. Erişim: 28
World Scientific.
Haziran 2005, http://www.useit.comlalertboxl9710a.htm
ielsen, J. (2004). Jakob Nielsen's Alertbox [Jakop Nilsen'in Uyarı Kutusu].
Erişim:
http://villaolmo.mib .infıı. itiM anuscripts/} O~eneral ities/pettenati.pdf
Pleksus (2004).
[Kullanılır Web
Tasanını: Sadeliğin Uygulaması], indiana üSA: New Riders rui:ılishing,
iike, (ty).
Erişim:
25 Nisan 2006. http://www.nike.com
10 Haziran 2005,
27
Hazirnn 2004, http://www.useit.com/.lertboxl20030825.html
iielsen, J. (2000). Designing Web Usability: The Practiee of Simplicity
Erişim:
Erişim:
02
Ağustos
2004, http://www.pleksus.com.tr
Powell, Thomas (2002). Web Design The Complete Reference [Web
Kitabı], OH.,
Poynter. (2005).
Tasarım Başvuru
USA: The McGraw-HiJl Companies, Ine.
Erişim:
20
Kasım
2005, http://www.poynter.org/eyetrack2000
Psychology.wİchita
(ty).
Erişim:
20 Nisan 2005,
66307&TS~ j
http://psychology.wichita.edu!surIlusabilitynews/62/whitespace.h tm
PQD&VInst=PROD Makale No: 66307
Quesenbery, W. (2005). Usability [Kullanılırlık]. Erişim: 23 Ekim 2005,
Skaa1id, B. (1999). Gesta1t PIinciple: Similarity [Gestalt Y asaları:
http://www.wqusability.comlarticIes/getting-started.html
Erişim:
Redish, J. ve Dumas, J. (1999). A Practical Guide to Usability Testing [KullanılırlIk.
'Testinin Pratik Rehbeıi]. Erişim: 23
Ekinı2005,
http://WW'iIl,Toyal.gov.uklİndex.htnı
http://www.usask.caleducationlcoursework/s!caalid/theory/gestalt/similar.htm#1
Suveren, B. (2000). İntemd Orlammua Paza:;-lama Faaliyetleri. Yüksek Lisans Tezi,
Çizgi Kitabevi
yayıncılık.
ve Yazılım Teknolojilerinin Gelişimi. Ankara: Başkent Üniversitesi YaYlfilan.
Sankavak, N.K (2005 b). Sayısal Tipografı 2 Batı'da ve Ülkemizde Sayısal Harfi Font
Tasanmcılan. Ankara: Başkent Üniversitesi Yayınlan.
Şan,
çev.). !:Jlkara: Türk Kütüphaneciler
Derneği. (1996).
The Fisherman (ty). "The Fishennan"
adlı çalışma Saul
Steinberg aittir, The
Leı.byri.nth
yayınlamıştır.
Eylül 2004,
Temelleri. Ankara: Seçkin Yayınlan.
Tİpografınin temelleri.
(Y. Tonta, A. Çelik, A. Kaygusuz, M.
Timberlake, Sean (2004). The I3asics ofNavigation
Sankavak, N.K (2004). Görsel İletişim ve Grafik Tasarımda Çağdaş Tipografınin
[Dobşmun Temeıleri]. Erişim:
16
http://vf'Nvı.enı.se.comlDesignlna'rigation.html
Tonta, Y.(2002). Elektronik Yayıncılık ve Elektronik Bilgi Kaynakları. Erişim: 20 Eylül
Ankara: Domk Yayınları.
2004,
Savio, Nadav.( 1994-2005) Vy'eb Typograpny Tumnal - Day One [Eğit.sel web tipografisi _
Erişim:
Yayınıcm.
Temıant. R., Obcr, J. ve Lipow G. A. (1993). İnternet Handbook [İntcmet EI Kitabı]
Sankavak, N.K (2005 a). Sayısal Tipografı 1 Basımeılık Ve YayıncılıktaAygıt, Donanım
Bir Gün].
Benze,.1i~.ç].
2006,
Şeker, M. (2004). Kuramsal Temcller ve Uygulama İlkeleriyle Sayfa Düzeni. Konya:
San...1<U1", B. (2002). İngilizce-TürkçeAnsiklopedik Bilişim Sözlüğü. İstanbul:
Sankavak, N.K (1997).
Ağusto'"
Yıldız Teknik ÜT'İversilesi, İstanbuL.
Sabah, (2006). Erişim: 25 Şubat 2006, http://Vf'..YW.sabah.com
Pusula
25
Smith, R. C. (1986) Basic Graphic Desing. New Jersey: Prentice-Hall İnc.
http:/hvww.upassoc.orglusability_resources/about_nsabilityImore_ defınitions .html
Royal Family, (ty).
112258827 &clientld~44718&VTyp"",PQD&VName~
22 Eylül 2005,
http://yunus.hacetıepe.edu. trl ~tonta/co LLTsesl hı.l12 00 2n\. uı6 55/02- e-
yayine i1 ik-e-b i19i-kaynaklan
Tonta, Y. (Aralık 1997). "Elektronik Yayıncılık, Bilimsel İletişim ve Kütüphaneler", Türk
Kütüphaneciliği, 11(4), 30S M
314. Erişinı: 20 Eylli12004,
http://webmonkey.wired.com/webmonkey/templates/
print_template.htmIt?meta=/webmonkey/O l/45/index3 a_ meta.html
http://yunus.hacettepe.edu.trl-toIlta/yayinlar/cyaYİi.ı97
.htm
Seylan, Ali (2005). Temel Tasarım, Samsun; M-Kitap
Dağdelen Basın Yayın
Ltd.
şti.
Treloar, A. (2005). Eleetronic Seholarly Pubiishing and the vVorld "iVide 'Web [EShahizan Hassan and Feng Li (Nis::ın i Hazİran 2005). Evaluating lhe Usability and
Content UseCu~ness ofVleb Sites: A Benchmarkir:.g Approach [Vleb Sitclerİn;n
1çeriğinin F aydalılığı vc KullanılırhkDeğerlendirilmesi:Dem;;ktaşı Yaklaşımı].
Journal of EıCctronİc Commerce in Organizations, Hershey 3(2) s. 46M68.
Erişim:
24 Ekim 2005, Acadeınie Researeh Library:
http://proquest.mni.comlpqdweb?RQT=318&pmid=
i
194
akademik
Yayıncılık ve
WWW].
Erişim:
7 Ekim 2005,
http://andrev/.trelüar.rıet/rese2reh/pub1icat
i'Jfl.sl.t-\ '..l.S'N eb9 5/index. sht!Jl.!
Turgut, Özden P. (2004). Banner Reklamların Grafik Tasarım Açısından incelenmesi.
Yüksek Lisans Tezi, Hacettepe Üniversitesi Sosyai Bilimier Ensütiisü, Ankara.
Turgut, S. (1999). İnterneeten Gazeteye. Erişİm: 6 Ekim 2005,
1951