Kaydırmaya Dokunmayın

 (dontfuckwithscroll.com)
2 puan yazan GN⁺ 2024-11-30 | 1 yorum | WhatsApp'ta paylaş
  • Scrolljacking, tarayıcının varsayılan kaydırma hızı, yönü ve efektlerini geçersiz kılarak kullanıcıların beklediği öngörülebilir web gezinimini sarsar
  • Nielsen Norman Group’un kullanılabilirlik araştırmasında katılımcıların çoğu yön duygusunu kaybetti; bazıları değiştirilmiş kaydırmayı bir bug olarak algıladı
  • Momentum, smooth ve inertia scrolling eklentileri kas hafızasını ve tarayıcının yerleşik özelliklerini bozarak uzun sayfalarda mevcut konumu anlamayı zorlaştırır
  • Ekran geçiş animasyonları ve JavaScript bağımlılığı; hareket hastalığı/baş dönmesi, yardımcı teknolojiler, düşük donanımlı cihazlar ve mobil ortamlar açısından erişilebilirlik ve performans yükünü artırır
  • Kullanıcılar kaydırma gösterisi için değil içeriği görmek için geldiğinden, sitelerin yerel ve hızlı kaydırmayı olduğu gibi koruması daha iyidir

Scrolljacking web gezinimini nasıl bozar

  • Scrolljacking, tarayıcının varsayılan kaydırma davranışını yeniden tanımlayarak bir web sayfasının kaydırma hızını, yönünü ve efektlerini değiştiren bir yöntemdir
  • Momentum scrolling, smooth scrolling ve inertia scrolling eklentileri yaygın scrolljacking biçimleridir
  • Bir iyileştirme gibi görünebilir, ancak doğal, verimli ve öngörülebilir web gezinimi deneyimini engeller
  • Zararları büyük ölçüde kullanılabilirlik, erişilebilirlik ve performans alanlarında ortaya çıkar

Kullanılabilirlik araştırmasında görülen kafa karışıklığı

  • Nielsen Norman Group’un kullanılabilirlik araştırması, scrolljacking’in kullanıcılarda yön duygusu kaybına yol açabileceğini gösteriyor
    • Katılımcıların çoğu en azından hafif bir yön duygusu kaybı yaşadı
    • Bazı kullanıcılar değiştirilmiş kaydırma davranışını bug olarak yorumladı
    • Görev odaklı kullanıcılar, keşif odaklı kullanıcılara kıyasla scrolljacking’e çok daha düşük tolerans gösterdi
  • Bir katılımcı, “tam bir swipe yaptım ama hiçbir yere gitmedi” anlamında tepki verdi ve potansiyel müşteri konumunda olsaydı bunun onu ciddi şekilde sinirlendireceğini söyledi
  • Mobilde uzun kaydırma süresi ve küçük ekran nedeniyle sorun daha da büyür

Kullanıcı beklentisi ve kontrol hakkının ihlali

  • Kullanıcılar kaydırdıklarında içeriğin hemen hareket etmesini bekler
  • Momentum scrolling eklentileri, anında ve öngörülebilir hareket yerine animasyon karışmış bir davranış sunar
  • Bu tür değişiklikler, kullanıcıların verimli gezinirken güvendiği kas hafızasını ve mevcut alışkanlıkları bozar
  • Varsayılan kaydırmayı geçersiz kılmak, sitenin gösterimini kullanıcının tercih veya ihtiyaçlarının önüne koyar
  • Kullanıcılar aşırı sahnelenmiş bir kaydırma deneyimi için değil, içeriği görmek için siteyi ziyaret eder

Hareket hastalığı ve erişilebilirlik yükü

  • Momentum scrolling eklentileri, süzülüyormuş veya yalpalıyormuş hissi veren animasyonlar ekleyerek hareket hastalığına ya da baş dönmesine hassas kullanıcılar için yük oluşturabilir
  • Birçok site bunu kapatmak için seçenek sunmadığından, kullanıcıların okuma sürecinde rahatsızlıktan kaçınması zorlaşır
  • Ekran okuyucular ve klavye ile gezinme gibi yardımcı teknolojiler, zamanlama gecikmeleri nedeniyle engellenebilir
  • Motor engeli veya görsel kısıtları olan kullanıcılar için bu gecikmeler site kullanımını daha da zorlaştırabilir
  • Erişilebilirlik isteğe bağlı bir özellik değil, web kullanımının temel bir gereksinimi olarak ele alınmalıdır

Performans ve cihazlar arası tutarlılıkta düşüş

  • Momentum scrolling eklentileri JavaScript yükler; eski veya düşük donanımlı cihazlarda gecikme, takılma ve bozulmaya yol açabilir
  • Sayfa “Smooth” hissettirmek yerine zayıf cihazlarda bozukmuş gibi görünebilir
  • Animasyon render etmek için şişkin JavaScript kütüphaneleri, ek bağımlılıklar ve daha fazla CPU döngüsü gerekir
  • Bunun sonucunda sayfa yükleme süreleri yavaşlayabilir
  • Mobil ağlarda veya bağlantının kötü olduğu bölgelerde gösterişli kaydırma efektleri sayfayı daha yavaş ve daha az erişilebilir hale getirir

Tarayıcı varsayılanları ve konum farkındalığı sorunları

  • Modern tarayıcılar, isteyen kullanıcılar için zaten momentum scrolling ayarları içerir
  • Üçüncü taraf eklentiler bu yerleşik özellikleri geçersiz kılabilir veya çakışma yaratarak özel kaydırma jestlerini ya da momentum scrolling’i bozabilir
  • Sistem genelindeki hareketi azaltma ayarları gibi kullanıcı tercihleri beklendiği gibi çalışmayabilir
  • Momentum scrolling animasyonları, kullanıcının girdisi ile sonuç arasına gecikme ekler
  • Uzun sayfalarda mevcut konumu doğru anlamak zorlaşır ve hızlı gezinme de zahmetli hale gelir

Power user’lar ve bakım maliyeti

  • Belgeleri hızlıca taramak veya sayfada hassas şekilde hareket etmek isteyen power user’lar için momentum scrolling iş akışını yavaşlatır
  • Yavaş animasyonları beklemek gerektiğinden, işini hızlı bitirmek isteyen kullanıcıların beklentisiyle çelişir
  • Momentum scrolling eklentileri bir kez kurulup unutulacak özellikler değildir
  • Güncel tarayıcılar, işletim sistemleri ve cihazlarla uyumlu kalmaları için düzenli güncelleme gerekir
  • Her güncellemede yeni bug’lar girme riski vardır; geliştirme ekipleri için de siteyi daha hızlı, güvenli veya optimize hale getirmeye ayrılabilecek zaman ve maliyet yerine ek iş çıkarır

Sonuç: Kaydırmayı varsayılan davranışında bırakın

  • Scrolljacking ve momentum scrolling eklentileri gereksiz karmaşıklık ekler, kullanılabilirliği düşürür ve kullanıcıları hayal kırıklığına uğratır
  • Nielsen Norman Group’un ifadesiyle “kullanılabilirlik, keyfin temelidir”
  • Kaydırmayı yeniden icat etmek yerine yerel, öngörülebilir ve hızlı kaydırma davranışı korunmalıdır
  • Kaydırmayı özel bir etkinliğe dönüştürmeyin; kullanıcıların sadece kaydırmasına izin verin

İlgili okumalar

1 yorum

 
GN⁺ 2024-11-30
Hacker News yorumları

  • URL’ye, tarayıcı gezintisine ve geri düğmesine de dokunulmamalı.
    Bu çoktan kaybedilmiş bir savaş gibi geliyor; SPA web’i bozup çok daha kötü hale getirdi.

    • SPA’ların illa böyle olması gerekmiyor; sadece bu şekilde yapmayı seçtiler.
      History API gayet sağlam; SPA’nın ve kendi gezgininin tarayıcıya ve kullanıcıya uyumlu çalışmasını sağlayabilir.
      Ama birçok geliştirici yer imi yapılabilirlik ve gezinti gibi web’in temel şeylerini umursamadığı için bunu bozdu.
      İyi bir SPA normal bir web sitesi gibi davranmalı; hızlı ve tepkisel olması dışında SPA olduğunu fark etmemelisiniz.
    • Bir sayfadaki bir öğeyle etkileşime girdim diye geri düğmesine defalarca basmak zorunda kalmaktan hoşlanmıyorum.
      Belirli bir durumu yer imlerine ekleyebilmek ya da paylaşabilmek gerektiği doğru, ama bunun için yeni bir gezinti adımı oluşturmak yerine URL’nin yerinde değişmesi çok daha iyi.
    • URL’ye dokunmayan SPA yapmanın kolay yolları zaten çok eskiden beri vardı.
      Web’i bozan, web’in temellerini, URL’yi, geri gitmeyi, kaydırma kullanıcı deneyimini vb. umursamayan insanlar; SPA’nın kendisi sorun değil.
    • Esc tuşuna da dokunma, Squarespace!
    • Yönlendirmeler ziyaret geçmişini çoktan bozdu; 2 aşamalı yönlendirme zinciri ise en kötü deneyim.
      Bunu tarayıcılar düzeltmeli ama ataleti o kadar büyük ki olacak gibi görünmüyor.

  • “Biz kullanıcıdan daha iyi biliriz” tavrının yalnızca Momentum kaydırma için değil, güncel UX tasarımındaki birçok moda için de geçerli olduğunu düşünüyorum.
    Her şeyi feda edecek kadar estetik tapınmasına nasıl kapıldığımızı merak ediyorum.

    • Bu, UI/UX tasarımından daha derin, tüm BT sektörüyle ilgili bir sorun.
      Kullanıcının hiçbir sorumluluğu kendi başına üstlenmesine izin vermeyen son derece tepeden bakan bir tavır var.
      Bugün yine macOS’te “Touch ID’yi etkinleştirmek için parolanız gerekiyor” şeklindeki sinir bozucu davranışı kapatmanın yolunu aradım; yeniden başlatmadan sonra istenmesini anlıyorum ama süreye dayalı görünen isteği kapatmak mümkün görünmüyordu.
      Bulduğum en yakın yöntem, bioutil komutuyla zaman sınırını azaltmaktı; artırmak mümkün değildi.
      Maksimum değer kontrolünün yerini tersine mühendislikle bulup alt seviye API’yi doğrudan çağırarak etrafından dolaşabilir miyim diye bakmayı düşünüyorum.
    • Bu sorunu “UX tasarım modası”na bağlamanın adil olduğunu düşünmüyorum.
      Daha çok UX tasarımının yokluğu gibi.
    • O kısım bana kulağa hoş gelecek şekilde paketlenmiş Call to Action düğmelerini hatırlatıyor.
      “Button presses You” gibi başlığı olan iyi bir blog yazısı vardı ama bulamıyorum.
      Ana fikir şu: Uygulamanın amacı, kullanıcının programa ne yaptıracağını belirlemekten ziyade, uygulamanın kullanıcıya neyi nasıl yapacağını söylemesine doğru kayıyor.

  • Kaydırma çubuğuna da dokunulmamalı.
    Şimdilerde her yerde onu 1px genişliğinde yapma gibi bir moda var sanki.

    • Evet, çok küçük kaydırma çubukları dokunmatik ekranlarda kullanılamaz hale getiriyor.
      Bir uygulamayı gerçekten ergonomik yapmak istiyorsanız, tek ya da iki parmak hareketlerinin, örneğin parmakla sürükleyerek kaydırmanın düzgün çalışmasını sağlamalısınız.
    • Fare üzerine gelince görünmesi sorun değil, ama birçok web sitesi kolay yolu seçip bir eksende ya da iki eksende birden kaydırma çubuğunu tamamen kapatıyor.
      O zaman masaüstünde kaydırmanın tek yolu, çerçevenin kenarının ötesine doğru metni sürükleyerek seçmek oluyor.
    • Genelde kaydırma çubuğunu gizlerim.
      Taşan içerik kullanmamaya çalışıyorum ama mutlaka taşması gerektiğinde kaydırma çubuğu tasarımı bozuyor ve varsayılan kaydırma çubuğu çok çirkin olduğu için gizliyorum.
    • Kaybolan kaydırma çubuklarını seviyorum.
      Fareyi hareket ettirdiğiniz anda beliriyor, durunca kayboluyor.
      İlerleme konumunu görmek isterseniz fareyi hafifçe oynatmanız yeterli.

  • Gopher döneminden beri internet kullanıyorum ve saf HTML estetiğinin minimalizmini seviyorum.
    Yazının altında, bu yazıya ilham veren web sitesine giden bağlantı da çok hoştu.
    Böyle sayfalarda kaynağı görüntüleyince bu sadece basit bir nostalji değil, “bu insanlar bir şeyleri biliyor” dedirten sıcak bir his veriyor.
    Helvetica belgeselinde tasarımcıların, 1950’lerin kötü script yazı tipleri yerine yeni çıkmış Helvetica’yı seçebilmenin nasıl bir his olduğunu anlattığı sahneye benziyor.

  • Kaydırmaya göre arka planda gösterilen içeriğin değiştiği ya da sayfa bölümlerinin bizzat ayrıldığı gösterişli landing page’lerin de buna dahil olduğunu düşünüyorum.
    Örnek: https://webflow.com/made-in-webflow/website/Translate-Webflo...

    • Böyle davranan uygulamalar, kusurlu kod yüzünden yalnızca bazıları; tarayıcının kendisi iyi bir kaydırıcı.
      iPad’deki eğerek kaydırma, yaşlı insanların bile hızlı okumasına ve kaydırmasına yardımcı oluyor; otomatik kaydırma da oldukça iyi.

  • Aslen yalnızca yukarı-aşağı kaydırılan sayfalardaki öğe satırlarına < > düğmeleri konmasını ilk gördüğümde ne kadar sevmediysem şimdi de o kadar sevmiyorum.
    Streaming medya platformları bu konuda en kötü şöhrete sahip, ama tek suçlu onlar değil.

  • Bugünlerde en nefret ettiğim şey Ctrl+F veya Ctrl+K’yi ele geçirmek.

    • Seçim davranışını ve Ctrl-C’yi ele geçirmeyi de eklemek isterim.
    • Tarayıcıların kısayol tuşlarının üzerine yazılmasına izin vermesi başlı başına çok kötü.
      Tarayıcı tarafında bunu mümkün kılmak için mutlaka ek kod gerekmiştir; Google, Apple ya da Mozilla’nın o kodu yazmamasının bir maliyeti olmazdı.
    • Faydalı bir uygulama içi arama sunsa bile Ctrl+F’yi ele geçirmeden gerçekten nefret ediyorum.
      Tarayıcının bu durumlarda kullanılabilecek Shift+Ctrl+F gibi alternatif bir kısayol sunması gerekiyor.
      Firefox’ta Shift+Cmd+F’nin bir şey yaptığını az önce öğrendim.
    • Outlook for web Ctrl+R’yi ele geçiriyor.
      Standart tuş kombinasyonlarına dokunulmamalı.
      Başka bir uygulamanın işlevini elinden alıp kullanıcıyı şaşırtmamak gerekir.
    • Dürüst olmak gerekirse bunun iki tarafı olduğunu düşünüyorum.
      Son zamanlarda Mac’te Google Sheets’te e-tablo içinde arama için Cmd-F çalışmamaya başladı; evet, bu yöntem sistem kısayolunu ele geçiriyordu ama gerçekten yerine geçen bir işlev de yoktu.
      Bu yüzden arama yapmak için Sheets menü çubuğuna gidip menünün içinde bulmak gerekiyordu.

  • Aşağı kaydırınca animasyonun ilerlediği, öğelerin yana hareket ettiği ve sayfanın aşağısına tekrar inebilmek için kaydırma kapılarından geçmek zorunda kaldığınız şeylere de dokunulmamalı.
    Korkunç, rahatsız edici, engelleyici ve kullanıcıya düşman bir tasarım.

  • En komik olanı, “Back to the normal version” bağlantısının ancak en üste yumuşak kaydırmayla geri dönünce tıklanabilir olması.
    Güzel yakaladılar.

  • Firefox’ta bunu about:settings üzerinden kapatmak mümkün mü merak ediyorum.
    Yoksa olay algılama bozulur mu?

    • Bu özelliğin sadece tarayıcı ayarlarıyla engellenip engellenemeyeceğini ben de merak ediyorum.
      Alternatif olarak bir tarayıcı eklentisi yardımcı olabilir.
      Uygulamanın duruma göre değişeceğini düşünüyorum; sayfadaki örnek [1], luxy.js [2] kütüphanesini kullanıyor.
      Bu belirli sayfada [1], geliştirici araçları konsolunda aşağıdaki komutu çalıştırınca yumuşak kaydırma davranışı devre dışı bırakılabiliyordu.
      luxy.init({ wrapperSpeed: 1.0});
      1. https://dontfuckwithscroll.com/smooth.html
      2. https://min30327.github.io/luxy.js/