Anasayfa › Web Tasarım
Web Tasarım
Web tasarım, sayfanın ekrandan çıktığı anlara da bakar: kâğıda yazdırılan sayfa, ölçü ve adet sorulan form kutuları, karanlık modda açılan logo ve anasayfayı hiç görmeden iç sayfaya gelen ziyaretçi.
Web Tasarım Yazdırılan Bir Sayfanın Kâğıtta Nasıl Çıktığına Neden Bakar?
Bir ustabaşı, tedarikçinin sitesindeki ürün sayfasını yazdırır; kâğıdı atölyeye indirip tezgâhın başına asacaktır. Yazıcıdan dört sayfa çıkar. İlkinde sitenin menüsü alt alta dizilmiştir. İkincisini çerez onayı isteyen kutu kaplar. Üçüncüde ürün fotoğrafının yarısı durur. Ölçü tablosu son iki kâğıda bölünmüş, başlık satırı bir sayfada, rakamlar ötekinde kalmıştır. Web tasarım yalnızca ekrana bakmaz; sayfanın kâğıda nasıl düştüğü de onun işidir.
Karabük ilinde atölyelerde, bürolarda ve okullarda sayfalar hâlâ yazdırılır. Tezgâhın üstüne asılan bir ölçü tablosu, şoföre verilen yol tarifi, duvara iliştirilen fiyat listesi, imzalanacak bir teklif isteği: hepsi önce ekranda durur, sonra kâğıda geçer. Kâğıt bir elden ötekine gider, üstüne kalemle not düşülür, dosyaya girer. Yazdıran çoğu zaman satın almaya yakın olandır; kötü çıkan sayfa onun elinde sizin adınızı taşır.
Bir sayfaya, kâğıtta nasıl görüneceği ayrıca söylenebilir. Buna yazdırma biçimi denir: sayfanın koduna eklenen ve yalnızca yazdırılırken devreye giren birkaç kural. Bu kurallarla menü, düğmeler, çerez kutusu ve sohbet balonu kâğıda hiç çıkmaz; geriye başlık, yazı, tablo ve gereken fotoğraf kalır. Kural yazılmamışsa tarayıcı, yani siteyi açtığınız program, ekranda ne görüyorsa kâğıda da onu dökmeye çalışır.
Kâğıdın kendi kuralları vardır. Tarayıcıların çoğu, mürekkep harcanmasın diye arka plan renklerini kendiliğinden yazdırmaz; koyu zemin üstündeki beyaz yazı kâğıtta beyazın üstünde beyaz kalır ve kaybolur. Bu yüzden yazdırma biçiminde yazı siyaha, zemin beyaza çevrilir. Tablolar da korunur: bir satırın ortasından bölünmemesi, yeni kâğıda geçtiğinde sütun başlıklarının yeniden yazılması istenir. Geniş tablo için kâğıdın yatay kullanılması da istenebilir.
Kâğıda eklenen şeyler de vardır. En alta sayfanın adresi ile bilginin hangi güne ait olduğu yazılır; üç ay sonra o kâğıdı eline alan kişi nereden geldiğini ve ne kadar eski olduğunu bilir. Yazının içindeki bağlantıların adresi açık yazılır, çünkü kâğıda dokunulmaz. Telefon iri harflerle durur. “PDF olarak kaydet” seçeneği de aynı kuralları izler; e-postayla gönderilen dosya, kâğıdın ekrandaki eşidir.
Denemesi kolaydır: en çok iş gören üç sayfanızı açın, yazdır komutunu verin, önizlemeye bakın. Kaç kâğıt tutuyor, tablo nerede bölünüyor, telefon okunuyor mu? Çelik dökülmeden önce numunesi alınır ve sonucu beklenir; biz siteye dokunmadan önce numunesini alırız. Web tasarım için alınan numune ücretsizdir; dışarıdan, şifresiz alınır. Kâğıda düşen sayfa yazının, tasarımın ve kodun ortak işidir; bizde üçünü aynı ekip yapar.
Formdaki Adet, Ölçü ve Ağırlık Kutuları Virgülü, Noktayı ve Birimi Nasıl Karşılar?
Bir müşteri, sac kesimi yapan bir atölyenin sipariş formunu doldurur. Ölçü kutusuna on iki buçuk yazar: önce on iki, sonra virgül, sonra beş. “Gönder”e dokunduğunda kutu virgülü sessizce atar. Atölyeye düşen siparişte yüz yirmi beş yazmaktadır. Usta rakamı tuhaf bulur, yine de birim yazmadığı için bir anlam verir ve keser. Yanlış kesilen sac, formun küçük bir kutusunun bedelidir.
Türkçe yazıda kesri virgül, binleri nokta ayırır; bir buçuk virgülle, bin beş yüz noktayla yazılır. Yazılımların çoğu ise tersine alışkındır: kesri nokta ayırır, virgül binler içindir. İki alışkanlık bir kutuda buluşunca üç şey olabilir. Kutu virgülü hiç kabul etmez. Ya da kabul eder ve sessizce siler. Ya da noktayla yazılmış bin beş yüzü bir buçuk diye okur.
İkinci tuzak birimdir. Kutunun yanında birim yazmıyorsa herkes kendi alışkanlığıyla doldurur: marangoz santimetreyle, tornacı milimetreyle düşünür. Adet kutusuna yazılan on, on parça mıdır, on paket mi? Ağırlık kutusundaki iki, iki kilo mudur, iki ton mu? Müşteri neyi kastettiğini bilir; siparişi okuyan kişi ise ancak tahmin eder. Tahminle başlayan iş ya bir telefonla gecikir ya da yanlış yapılır.
Çaresi kutunun kendisinde başlar. Her kutunun hemen yanında birimi yazar ve bir örnek durur. Kutu virgülü de noktayı da kabul eder; hangisini nasıl anladığını ise saklamaz. Rakam yazılır yazılmaz altında okunuşu belirir: “on iki buçuk milimetre.” Müşteri kendi yazdığını sözle görünce yanlışı o anda yakalar. Binler ayırıcısı ise kutuda hiç istenmez; büyük sayıyı okunuşu doğrular.
Telefonda kutuya dokunulduğunda harf klavyesi değil, rakam klavyesi açılmalıdır; ama kimi telefonda bu klavyede virgül tuşu bulunmaz, bu da denenir. Kutuya sınır konur: sac kalınlığına yüz yirmi beş yazan kişiye “Yanlış yazmış olabilir misiniz?” diye sorulur. Gönderilmeden önce bir özet gösterilir; her rakam birimiyle ve okunuşuyla durur. Müşteriye giden onay iletisi de aynı yazılışı taşır; iki tarafın elinde aynı satır kalır.
Sınaması gerçek siparişlerle yapılır. Son ayın beş siparişini alın, formu müşterinin yazdığı gibi doldurun: virgülle, noktayla, birimsiz, telefondan. Size ne ulaştığına bakın. Web tasarım numunesinde, virgülü kabul etmeyen ya da birimini söylemeyen her kutu bir çapaktır; kesilmiş sacın kenarındaki çapak gibi, ilk tutanın eline batar. Not edilenler üçtür: kutunun yeri, müşterinin eline battığı an, alınacağı ayın çapak listesi.
Karanlık Modda Açılan Bir Sayfada Logonuz ve Yazılarınız Okunuyor mu?
Gece yarısına doğru, yurt odasında bir öğrenci ertesi sabah teslim edeceği ödevin çıktısı için fotokopicinin sayfasını açar. Telefonu karanlık görünüme ayarlıdır; gözünü yormasın diye ekran koyu zemine geçmiştir. Sayfa açılır: koyu renkli logo koyu zeminin içinde erir, dükkânın adı okunmaz. Fiyatlar siyahın üstünde soluk gri durur. Öğrenci ekranı gözüne yaklaştırır, sayfa başı ücreti seçemez ve başka bir fotokopiciye bakar.
Telefonların ve tarayıcıların çoğunda karanlık görünüm, yani açık zemin yerine koyu zemin kullanan ekran ayarı bulunur. Bu ayar açıkken sayfalar iki yoldan kararır. Kimi sitenin kendi koyu tasarımı vardır; ayarı görür ve ona geçer. Kimi tarayıcı ise koyu tasarımı olmayan sayfayı kendi başına karartır: zemini koyulaştırır, yazıyı açar, renkleri tahminle çevirir. Tahmin her zaman tutmaz; bozulan sayfaların çoğu bu yoldan gelir.
Bozulanlar bellidir. Arkası saydam kaydedilmiş koyu logo, koyu zeminde görünmez olur. Açık renkli bir fotoğrafın üstüne konmuş koyu yazı açık renge çevrilebilir; fotoğraf olduğu gibi kalır, yazı içinde kaybolur. Renkli uyarı kutularında zemin ile yazı birbirine yaklaşır. Grafiklerin çizgileri zeminle aynı renge düşer. Sayfaya gömülü harita ise çoğu zaman olduğu gibi kalır; karanlık sayfanın ortasında parlak bir pencere gibi durur.
Önce karar verilir; iki dürüst yol vardır. Birincisi siteye kendi koyu tasarımını yapmaktır: her renk, her kutu, her simge için koyu zemindeki karşılığı tek tek seçilir. İkincisi sayfanın açık renkli tasarlandığını tarayıcıya bildirmektir; koda eklenen kısa bir not, “bu sayfayı karartma” der. Bu nota uyan tarayıcılar vardır, uymayanlar da. İkisini de yapmamak, kararı tarayıcının tahminine bırakmak demektir.
Ardından logo ele alınır. Logonun koyu zemin için hazırlanmış açık renkli bir eşi bulunmalıdır; yoksa logonun arkasına ince, açık renkli bir zemin konur. Yazı hiçbir zaman resim olarak yerleştirilmez: resmin içindeki siyah harfleri tarayıcı çeviremez, fiyat listesi karanlıkta ya okunmaz olur ya da gözü alan beyaz bir levha olarak kalır. Simgeler de tek renge bağlanmaz; yazının rengini izleyecek biçimde hazırlanır.
Sonra bakılır; çünkü tarayıcılar birbirinden farklı davranır. Ayrı markadan iki telefonda karanlık görünümü açın ve anasayfayı, fiyat sayfasını, iletişim sayfasını gezin. Karanlıkta kaybolan logo, web tasarım tarafındaki çapak listesinde kendi satırını bulur; o satıra da ancak siz onaylayınca başlanır. Liste şöyle dizilir: önce ele batan. Okunmayan fiyat, rengi biraz soluk kalmış bir çizgiden önce gelir.
Ziyaretçi Siteye Anasayfadan Değil de Bir İç Sayfadan Girdiğinde Yolunu Bulabiliyor mu?
Yarım kamyonluk bir yükü olan biri “parsiyel taşıma” diye arar ve Karabük merkezde bir nakliyecinin tek bir hattı anlatan sayfasına düşer. Sayfada hangi günler araç kalktığı, yükün nereden alındığı yazar. Yazmayan şeyler de vardır: bu firmanın adı nedir, merkezi nerededir, fiyat nasıl sorulur? Tepede küçük bir logo durur, yazısı okunmaz. Ziyaretçi bir süre aranır, sonra geri döner ve alttaki sonuca geçer.
Aramadan gelen ziyaretçilerin birçoğu anasayfayı hiç görmez; arama motoru onları sorularına en yakın sayfaya, çoğu zaman sitenin derinlerindeki bir sayfaya bırakır. Site ise genellikle anasayfadan başlanarak tasarlanır: firma orada tanıtılır, iç sayfalar bunun bilindiğini varsayar. Oysa her sayfa bir giriş kapısıdır. Kapıdan giren kişi nereye geldiğini o sayfada öğrenemiyorsa, anasayfaya bakmaya çoğu zaman üşenir.
Her iç sayfa beş şeyi kendi başına söylemelidir. Tepede firmanın adı okunur biçimde durur; yanında ya da altında ne iş yaptığını söyleyen birkaç sözcük bulunur. Nerede olduğu yazar: şehir, gerekiyorsa ilçe. Ulaşmanın tek ve açık bir yolu görünür: telefon ya da “fiyat sorun” düğmesi. Sayfanın sitedeki yeri bellidir ve bir sonraki adım gösterilir: öteki hatlar, araçlar, sık sorulanlar.
İç sayfa, anasayfanın söylediğini söylenmiş saymaz. “Yukarıda anlattığımız gibi” ya da “firmamız” diye başlayan, adı hiç anmayan cümleler, sayfaya ortasından giren okura bir şey anlatmaz. Tek bir kampanya için hazırlanıp menüsü gizlenen sayfalar ayrıca gözden geçirilir; arama motoru oraya da ziyaretçi bırakabilir ve o kişi çıkışsız bir odada kalır. Logo her sayfada anasayfaya götürmelidir; ziyaretçi bunu sormadan dener.
Denemek için tarayıcıda gizli bir pencere açın; bu pencere daha önce gezdiklerinizi hatırlamaz, siteyi ilk kez gelen biri gibi gösterir. Derindeki bir sayfanın adresini doğrudan yazın. Sonra firmanızı tanımayan birine telefonu verin ve üç soru sorun: bu kimin sitesi, bu firma nerede, fiyat almak için ne yaparsın? Cevaplar hemen gelmiyorsa eksik anasayfada değil, o sayfadadır.
Bu denemeyi en çok ziyaret alan beş iç sayfanız için yapın; hangileri olduğunu ziyaret kayıtları gösterir. Web tasarım için ilk adım numunedir. Site adresinizi tek satırla gönderin; numuneyi biz alalım, sizden ne ücret ne şifre isteyelim. Kapısında adı okunmayan her iç sayfa orada çapak olarak yazılır. Sonrasını aylık vardiya defterinden izlersiniz: ne alındı, ne kaldı, sırada ne var.
Müşterilerim fiyat listemi yazdırıp duvara asıyor; eskiyen liste aylarca orada kalıyor, bunu nasıl önleyebilirim?
Asılmasını önleyemezsiniz; ama kâğıt kendi yaşını söyleyebilir. Yazdırma biçimine, yalnızca kâğıtta görünen iki satır eklenir: listenin hangi gün geçerli olduğu ve güncelinin bulunduğu sayfanın adresi. Ekranda bu satırlar görünmez, her çıktının altında çıkar. Fiyat değiştiğinde düzenli müşterilerinize kısa bir ileti göndermek de eski kâğıdın ömrünü kısaltır.
Yenice’de kereste ve doğrama işi yapıyorum; sipariş formuma ölçüyü kimi müşterim santimetreyle, kimi milimetreyle yazıyor, herkesi tek birime nasıl alıştırırım?
Birimi kutunun içine değil, hemen yanına, silinmeyecek biçimde yazın ve altına bir örnek koyun. Çizimlerinizde hangi birimi kullanıyorsanız formda da onu isteyin. Olağan dışı bir değer girildiğinde form, yazılanı birimiyle birlikte sözle göstersin ve onay istesin. Müşteriye birim seçtirmek yeni bir yanlış kapısı açar; tek birim daha az hata doğurur.
Logomun yalnızca koyu renkli hâli elimde, çizen kişiye de ulaşamıyorum; karanlık modda görünmesi için ne yapabilirim?
İki geçici yol vardır. Logonun arkasına, köşeleri hafif yuvarlatılmış açık renkli bir zemin konur; logo her zeminde okunur. Ya da sayfanın açık renkli tasarlandığı tarayıcıya bildirilir; bu, her tarayıcıda işe yaramayabilir. Kalıcı çözüm, logonun açık renkli bir eşini çizdirmektir; elinizdeki dosya bunun için çoğu zaman yeter.
Reklam için hazırlattığım sayfada menüyü bilerek kaldırttım, ziyaretçi dağılmasın diye; onu geri mi koydurmalıyım?
Reklamdan gelen için menüsüz sayfa işini görebilir. Aynı sayfa aramadan da ziyaretçi alıyorsa o kişi nereye geldiğini anlamalıdır. Menüyü geri koymak şart değildir; şunlar yeter: okunur bir ad ve logo, ne iş yaptığınızı söyleyen bir satır, şehir, tek bir iletişim yolu ve en altta “öteki hizmetlerimiz” diye küçük bir bağlantı.