13 Nisan 2008 Pazar

Yazılımınız ve onun sihirli dili: İşlevsel Tasarım

Ürününüz kendisini kullanıcınıza tasarımıyla anlatır. Bu ürün ister bir yazılım olsun ister bir telefon kumandası; baş başa kaldıklarında, aralarındaki tek iletişim aracı tasarımdır.

Tasarım ne kadar anlaşılır ve yönlendiriciyse, kullanıcınız kendini o kadar rahat ve emin hisseder. Tasarım, ürünün dilidir. Bu dili kötü kullanıyorsanız, bu eksikliği kullanım kılavuzlarıyla, ürün danışmanlarınızla, çağrı merkezinizle… gidermek zorunda kalırsınız. Bu, her iki taraf için de masraflı ve zor bir proje olacaktır.

Tasarımın iki kolu vardır; estetik tasarım ve işlevsel tasarım. Estetik tasarım, duygulara ve göze hitap eder. İşlevsel tasarım ise akla ve mantığa hitap eder. Tasarımınız hem göze-duygulara hem de akla-mantığa hitap etmelidir. Hatta sadece akla-mantığa hitap etmesi yeterlidir. Çünkü ürün özellikle yazılım ürünleri, kullanıcıların çokça vakit geçirmek istedikleri şeyler olmadıkları için bir an önce işlerini halletmelerini sağlamak için elinizden geleni yapın. İyi tasarım, istenen işi en kısa sürede yaptıran tasarımdır.

İşlevsel tasarımların görüntüsü sadedir, bilindiktir, sıradandır hatta tekdüzedir. Tasarımlarınızın klasik veya tekdüze olmasından korkmayın. Aksine resimlerle dolu kompleks ve karmaşık bir hale gelmesinden korkun. Tasarımlarınızda resimlerden çok renklerden faydalanın. Ama birbiriyle uyumlu renklerden. Renkler konusunda fazla cüretkâr olmayın. Beyaz ve gri, her yerde tutar. Renkler konusunda resmî olmayan kurallar vardır; hata mesajları her zaman kırmızı renktir; trafik lambasındaki DUR ışığı gibi. OK mesajları hep yeşil veya sarı olur; yine trafik ışıklarını düşünün.

Tasarımınız, ürününüzün işlevlerini ne kadar iyi anlatıyorsa, işlevsel tasarımınız o kadar iyidir. İşlevsel tasarım, yazılarla, düğmelerle, resimlerle, liste kutularıyla, labellarla ve resimlerle bir bütündür. Bu nedenle, estetik tasarımcınızın dediği ile işlevsel tasarımcınızın dediği arasında kaldığınızda, işlevsel tasarımcınızı seçin; zararlı çıkmayacaksınız.

Başarısız bir işlevsel tasarım çoğu zaman, kontrolü kaybedilmiş bir teknik altyapıya ve kafası karışık bir teknik kadroya dalalet eder. Her ne kadar, teknik kadrolar bunu kabul etmese de. Yazılımınızın teknik altyapısını hazırlamadan önce (kod, veritabanı vs) mutlaka işlevsel tasarımını belirleyin. Kodları yazana kadar, siz onun efendisisinizdir. Ama kodları ve veritabanını hazırladıktan sonra tasarımın nasıl olabileceğine onlar karar verir.

İşlevsel tasarımın katkıları

Başarılı bir işlevsel tasarımın ürüne ve işletmeye katkılarından bazıları şunlardır:

Kullanım kılavuzları: İşlevsel tasarım ne kadar başarılıysa, kullanıcılar kullanım kılavuzlarına o kadar az ihtiyaç duyar. Kılavuzlarınız daha sade olur. Sade tutulmuş bir kullanım kılavuzunun güncel tutulması kolay olur. Okunması daha kısa sürer. Sade bir kılavuzun çevirisini yaptırmak daha ucuzdur. İşlevsel tasarımı başarılı bir ürünün kullanımı daha kolay ve basit olduğu için, kullanım kılavuzunda anlatmak daha kolaydır. Kullanım kılavuzu hazırlama ve güncelleme maliyeti daha düşüktür.
Destek maliyetleri: İşlevsel tasarımı başarılıysa, kullanmayı öğrenmek daha kolaydır; ürün destek bölümünüzün telefonları daha az çalar. Daha az e-posta alırsınız. Kullanıcıların ürünü öğrenme süresi daha kısa olur. Destek maliyetleri daha düşük olur.
Müşteri memnuniyeti: İşlevsel tasarım başarılıysa, şikâyet eden kullanıcı sayısı daha az olur. Ürününüzü müşterinizdeki personele kabul ettirmek daha kolay olur.

Arama Motoru Optimizasyonu (SEO)

Google Analytics gibi analiz yazılımları sayesinde, şirketler artık sitelerine gelen ziyaretçilerinin yarısından fazlasının arama motorlarından geldiğini öğrenmeye başladır. Bu ortamda artık arama motorlarında ilk sıralarda çıkmak en önemli hedef haline gelebiliyor. Optimizasyon yaparken hem teknik adamlara hem tasarımcılara hem flashçılara hem de içerikçileri iş düşüyor. Kısaca, bu iş bir ekip işidir. Aşağıda tüm ekip için bazı ipuçlarını listeliyoruz.



* Javascript kullanımı normalleşmeli. Alternatif HTML yayınlanmalı.

* Flash kullanımı normalleşmeli. Alternatif HTML hazırlanmalı.


* H1, H2, H3 etiketleri yerinde ve bolca kullanılmalı.


* Siteye farklı farklı sitelerden linkler verilmeli. Değerli siteler değerli link demektir. Sitemizi de değerli yapar.


* Resimlerde açıklayıcı kodlamalar yapılmalı. Örn: <img src="http://www.blogger.com/post-edit.do" alt="" title="">


* Site sık sık güncellemeli.


* Sitemizin ziyaret sayısı, arama motorları için çok önemlidir.


* Sitemize insanlar katkıda bulunabilmeli. Yazılara yorum ekleme ve interaktivite formları (blog yorumları, forumlar vs).


* Google Webmaster Tools:

https://www.google.com/webmasters/tools/docs/en/protocol.html


* Arama motorlarına ve dizinlere (örn: dmoz.org vs) kayıt.


* Anahtar kelimeler belirlemeliyiz, sayfalarımızda yerinde ve bolca kullanmalıyız.


* Domainde anahtar kelimelerin geçmesi. Örn: "Boch Kırıcı" araması için www.boschkirici.com adresi çok iyi bir adrestir.


* Adres satırında anahtar kelimelerin geçmesi.


Örn:


http://www.example.com/?urunid=12545


yerine:


http://www.example.com/urunler/bosch_kirici


daha iyi bir adreslemedir.


* Daha az POST method daha çok GET method. Arama motorları POST ile çalışan navigasyonu es geçerler.


* Resimlerin adreslemesi de önemlidir. Örn:


2263BC92-19BB-D109.jpg


yerine


/urunler/resimler/bosch_kirici.jpg


daha iyi bir adreslemedir.


* Javascript ile sayfa açma yerine linkle sayfa açma tercih edilmelidir. Örn:


href="window.location='/urun1.aspx'"


yerine


href="/urun1.aspx"


daha iyi bir linklemedir.


* İçerikleri ekranda görüntülemek için Javascript veya Flash yerinde doğrudan HTML kullanılmalıdır.


* Menülerde vs kullandığımız Javascript kodlarını arama motorlarının da kullanabileceği şekilde ayarlayabiliriz. Örn:


<noscript>

<ul>

<li><a href="urun_detay.cfm?id=234234">Delici</a></li>

<li><a href="urun_detay.cfm?id=234234">Kırıcı</a></li>

<li><a href="urun_detay.cfm?id=234234">Bölücü</a></li>

<li><a href="urun_detay.cfm?id=234234">vs vs vs</a></li>

</ul>

</noscript>


* Benzer şekilde, arama motorları için Flash'a alternatif olarak sayfada aynı anda text linkler de bulundurmalıyız. Örn:


<object>

<embed />

<ul>

<li><a href="http://www.blogger.com/urun_detay.cfm?id=234234">Delici</a><br>

</li>

<li><a href="http://www.blogger.com/urun_detay.cfm?id=234234">Kırıcı</a><br>

</li>

<li><a href="http://www.blogger.com/urun_detay.cfm?id=234234">Bölücü</a><br>

</li>

<li><a href="http://www.blogger.com/urun_detay.cfm?id=234234">vs vs vs</a><br>

</li>

</ul>

</object>



Arama motorları text linkleri, ziyaretçileriniz ise Javascript ve Flashlarınızı kullanacaktır.


* Sitenin başlığında (title) anahtar kelimelerimizin geçmesi iyi olur. Örn:



"Vukuf A.Ş"



yerine



"Vukuf A.Ş. | Bisküvi, Çikolata, Kek..."



gibi.