İlk web sitemi inşa etmek için oturduğumda, heyecanım gerçekti. Zor kısmın kod yazmayı öğrenmek olacağını varsaymıştım—etiketleri ezberlemek, fonksiyonları anlamak, söz dizimini (syntax) doğru yapmak. Yanılmışım. Kod yazmak işin kolay kısmıymış. Asıl zorluk, o satırları insanların kafa karışıklığı veya hayal kırıklığı yaşamadan kullanabileceği gerçek bir şeye dönüştürmekti. O ilk proje bana geliştirmenin, tek başına yazı yazmaktan ziyade, sizin teknoloji yığınınızla (stack) ilgilenmeyen insanlar için sorun çözmek olduğunu öğretti. Bana zaman, uyku ve ilk kullanıcılarımı kaybettiren hatalar yaptım. Bunlardan beş tanesi diğerlerinden çok daha belirgindi.

Yayına Almadan Önce Mükemmelliğin Peşinden Koşmak

Henüz bir şeyi mükemmel olarak adlandırma hakkını kazanmadan çok önce mükemmeliyetçilik tuzağına düştüm. Tüm öğleden sonralarımı hex kodlarını bir ton farkla değiştirmekle, border-radius değerlerini sekiz pikselden ona çıkarıp tekrar geri çekmekle ve tek bir ziyaretçi bile sayfayı görmeden başlık metnini beş kez yeniden yazmakla geçirdim. Kendime cilalama yaptığımı söylüyordum ama aslında kalite maskesi altında ertelemeci davranıyordum. Sonuç mu? Üç hafta geç yayına aldım. Site nihayet yayına girdiğinde, üzerinde saatlerce kafa yorduğum buton kavisine dair tek bir kullanıcı bile yorum yapmadı. Onlar sadece formun çökmeden gönderilip gönderilmediğiyle ilgileniyordu.

Ders aklıma kazındı: Önce işini yayına al. Almadığınız geri bildirimler üzerinden yineleme (iteration) yapamazsınız. Yapıyı sağlam kurun, temel akışın çalıştığından emin olun ve yayına geçin. İyileştirme versiyon sıfıra değil, versiyon ikiye aittir. Kullanıcılarınız size neyin gerçekten bozuk olduğunu, neyin ise sadece sizin kusurlu olduğunu hayal ettiğinizi söyleyecektir.

Çok Erken, Çok Fazla Şey İnşa Etmek

Projem, kitap önerilerini paylaşmak için basit bir araç olarak başladı. Tek amacı buydu. İkinci haftaya geldiğimde; bir kullanıcı giriş sistemi, dinamik bir puanlama grafiği, iç içe geçmiş bir yorum bölümü, karanlık mod anahtarı ve bir e-posta bülteni tasarlamıştım. Hiçbiri iyi çalışmıyordu. Giriş akışı yarı yarıya bozuluyordu. Grafiğin gösterecek gerçek bir verisi yoktu. Yorum bölümü mükerrer kayıtlara izin veriyordu. Bu sırada, sitenin var olma sebebi olan temel kitap listeleme özelliği; ana sayfaya gelen herkesin kafasını karıştıran, bozuk ve yarım kalmış ekstralar yığınının altında kalmıştı.

Tek bir sorunu temiz bir şekilde çözen basit bir site, on şeyi kötü yapan karmaşık bir siteden her zaman daha iyidir. Bir satır daha kod yazmadan önce, ürününüzün kullanıcı için yaptığı o tek işi tanımlayın. Onu inşa edin. Test edin. Güvenilir olana kadar cilalayın. Eğer kullanıcılar gerçekten bir panel veya sosyal akış isterlerse, o zaman ekleyebilirsiniz. O zamana kadar, herkesin tek ihtiyacı olan keskin bir mutfak bıçağıyken, bir İsviçre çakısı inşa etme dürtüsüne karşı koyun.

Görünüşün Ardındaki Deneyimi İhmal Etmek

Zarif yazı tipleri ve şık bir renk paleti seçmek için saatler harcadım. Hero bölümünün arka plan gradyanına takıntılı hale geldim. Sonra sitenin kullanımının aslında nasıl hissettirdiğini görmezden geldim. Sıkıştırma yapmadan tam çözünürlüklü PNG'ler sunduğum için sayfalar çok yavaş yükleniyordu. Navigasyon etiketlerinde, iyi görünen ancak insanların bağlantının onları nereye götüreceğini tahmin etmelerine neden olan "zekice" ifadeler kullanmıştım. Butonlar ince ve şıktı ama bir telefon ekranında dokunmak için çok küçüktü.

Görsel tasarım ile kullanıcı deneyiminin (UX) birbirinin yerine geçemeyeceğini acı bir şekilde öğrendim. Eğer ziyaretçiler bir banner görseli için birkaç saniye beklemek zorunda kalıyorsa veya size iki tıklamadan kısa sürede nasıl ulaşacaklarını çözemiyorlarsa, güzel bir arayüz başarısız sayılır. Her etkileşimi basit tutun. Navigasyonu sade bir dille etiketleyin. Varlıklarınızı (assets) sıkıştırın. Dokunma hedeflerinin yeterince büyük olduğundan emin olun. Hız ve netlik, sona eklenen bonuslar değildir; bunlar her şeyin üzerine inşa edildiği temeldir.

Sadece Kendi Makinemde Test Etmek

Tüm siteyi tek bir dizüstü bilgisayarda, tek bir tarayıcıda ve tek bir ekran çözünürlüğünde geliştirdim. Benim makinemde her şey kusursuz görünüyordu. Sonra bir arkadaşım siteyi iPhone'unda açtı. Butonlar üst üste bindi. Metinler kapsayıcısının dışına taştı. Başka bir arkadaşım Mac'te Safari kullandı ve tüm CSS grid düzeni okunamaz bir yığına dönüştü. Sessizce, eğer benim için çalışıyorsa herkes için çalışacağını varsaymıştım. Bu varsayım bana bir hafta sonu boyunca telaşlı hata düzeltmeleri (hotfix) ve utanç verici özürler olarak mal oldu.

Benim hatamı tekrarlamayın. Yayınlamadan önce sitenizi Chrome, Firefox, Safari ve Edge'de çalıştırın. Farklı genişliklerdeki telefonları, tabletleri ve dizüstü bilgisayarları simüle etmek için tarayıcınızın geliştirici araçlarını kullanın. Her bağlantıya tıklayın. Her formu gönderin. Pencere boyutunu agresif bir şekilde değiştirin. Test aşamasında yakaladığınız hatalar, kullanıcılarınızın canlı ortamda (production) bulduklarından çok daha az maliyetlidir.

Geri Bildirimi Kişisel Bir Saldırı Gibi Görmek

Projeyi paylaşmak beni endişelendirmişti. Ya insanlar projeyi beğenmezse? Bir meslektaşım, üzerinde çok vakit harcadığım bir özellikten vazgeçmemi önerdiğinde