Web Tasarımı Hataları: Hangisi Hâlâ Hata, Hangisi Değil

Web tasarımında en sık yapılan hatalar diye dolaşan listelerin çoğu aynı kaynağa çıkıyor: doksanların ortasında yazılmış, on maddelik bir metin. Maddelerin bir kısmı hâlâ doğru, bir kısmı teknolojiyle birlikte anlamsızlaştı, en ilginç kısmı ise aynı hatanın yeni kılığıyla karşımıza çıkıyor. Hangisinin hangisi olduğunu ayırmak, listeyi olduğu gibi tekrarlamaktan daha işe yarar.

Frame tasarımı bitti, frame'in yarattığı sorun bitmedi

Eski listelerin ilk maddesi genellikle çerçeveli yapılardır. İtirazın gerekçesi şuydu: kullanıcı sayfayı yer imlerine ekleyemiyor, adresi birine gönderdiğinde karşı taraf başka bir ekran görüyor, yazdırdığında eksik çıktı alıyor. HTML5 frameset'i tamamen kaldırdığı için maddenin kendisi tarihe karıştı.

Gerekçe ise yerinde duruyor. Adres satırının sayfanın durumunu anlatmaması, tek sayfalık uygulamalarda yeniden üretiliyor: filtre seçimi URL'ye yazılmıyor, modal pencere bir rota açmıyor, sonsuz kaydırmada geri tuşu kullanıcıyı listenin en başına atıyor. Testi basit, adresi kopyalayıp gizli sekmede açın; aynı ekranı görmüyorsanız elinizde 1996'nın sorunu var.

Bağlantı renkleri: gelenek dağıldı, ayırt edilebilirlik kaldı

Ziyaret edilmemiş bağlantı mavi, ziyaret edilmiş mor kuralı bugün neredeyse hiçbir yerde uygulanmıyor ve bunu tek başına hata saymak güç. Asıl ölçüt renk değil: bağlantı, çevresindeki metinden yalnızca renkle değil, altı çizgi ya da kalınlık gibi ikinci bir işaretle de ayrılmalı. Renk körlüğü olan okuyucu için renk tek başına hiçbir şey söylemez.

Ziyaret edilmiş durumu ise arşiv, arama sonucu, forum listesi gibi yoğun sayfalarda hâlâ iş görür; okuyucu nereye baktığını aklında tutmak zorunda kalmaz. Tarayıcılar gizlilik gerekçesiyle :visited üzerinde yalnızca sınırlı sayıda özelliğin değiştirilmesine izin veriyor, ama renk bunlardan biri (bu kadar ucuz bir ipucunun bu kadar az kullanılmasını tuhaf buluyorum).

"Kullanıcı aşağı kaydırmaz" maddesi kendisini çürütüyor

Bu madde listelerde ilginç bir biçimde kendi içinde çelişir: önce kullanıcının ilk ekranda gördüğüyle yetindiği söylenir, iki cümle sonra kaydırmaya toleransın arttığı kabul edilir. Doğru olan ikincisi. Mobil kullanım kaydırmayı refleks haline getirdi.

Geriye kalan doğru şu: ilk ekran bir uzunluk sınırı değil, bir vaat. Okuyucu ilk bakışta buranın hangi sayfa olduğunu ve aradığı şeyin burada olup olmadığını görmeli. Gördüyse altı bin kelime de kaydırır. Görmediyse üç paragrafı bile okumaz.

Hız eşiği 10 saniye değil

Eski metinlerde "yüklenmesi 10-15 saniyeyi geçerse kullanıcı siteyi bırakır" yazar. Bu, çevirmeli bağlantı döneminin ölçüsü. Bugünün referansı Google'ın Core Web Vitals eşikleri: en büyük içerik öğesinin ekrana gelmesi, yani LCP, 2,5 saniyenin altında kalmalı. Dört ila altı kat daha sıkı bir ölçü, yani eski eşiği tutturan bir sayfa bugün rahatça yavaş sayılır.

Pratikte yükü neredeyse her zaman görseller taşır, hemen ardından render'ı bloke eden üçüncü parti betikler gelir. Tahminle optimizasyon yapmak yerine Search Console'daki Core Web Vitals raporuna bakmak hangi sayfa grubunun eşiği aştığını doğrudan gösterir. Düzeltme de tek tek sayfada değil şablonda yapılır, kazanç o yüzden büyük olur.

Hareket, dekor olarak kullanıldığında pahalıdır

Göz hareketi algılamaya ayarlı olduğu için sürekli oynayan bir öğe, yanındaki metni fiilen okunmaz hale getirir. Dönen manşet bantları bunun en yaygın örneği: gerçek içerik taşıdıkları halde ikinci karede ne yazdığını kimse görmez. Hareketi dikkat çekmek için saklamak, her yere serpmekten daha çok iş görür.

Erişilebilirlik tarafı daha sert. Vestibüler rahatsızlığı olan kullanıcılarda kayan geçişler ve paralaks efektleri baş dönmesi yaratabiliyor. Tarayıcılar bunun için prefers-reduced-motion sorgusunu sunuyor ve işletim sistemindeki "hareketi azalt" ayarını doğrudan okuyor; animasyonları bu sorgunun kapsamına almak mevcut CSS'e bir blok eklemekten fazlası değil.

Yıllanmayan maddeler

Listenin geri kalanı eskimiyor, çünkü teknolojiyle değil insanın yönelme ihtiyacıyla ilgili:

• Sahipsiz sayfa bırakmamak. Her sayfa logosuyla ana sayfaya, kırıntı navigasyonuyla kendi bölümüne bağlanmalı.
• URL'yi okunur tutmak. Küçük harf, anlamlı kelime, gereksiz parametre yok; adresi gören kullanıcı sayfanın ne olduğunu tahmin edebilmeli.
• Taşınma ve yeniden yapılandırmada eski adresleri ilgili yeni sayfaya yönlendirmek, hepsini topluca ana sayfaya atmamak.
• İçeriği bakımda tutmak. Tarihi geçmiş bilgi, çalışmayan bir form ya da kırık bağlantı, kötü tipografiden çok daha hızlı güven kaybettirir.
• Site içi aramayı ciddiye almak. Yapıyı sizin kadar bilmeyen ziyaretçinin ilk sığınağı arama kutusudur.

Teknolojiye bağlı maddeler eskiyor ve yerlerine yenileri geliyor; yönelmeye bağlı olanlar yerinde kalıyor. Bir maddeyi uygulamadan önce gerekçesini sormak, otuz yıllık bir listeyi hâlâ kullanılabilir kılan tek şey.