Web Uygulamasını Yeni Pencerede Açmak: Gerek mi, Bahane mi?

Bir bağlantının yeni sekmede mi yoksa aynı sekmede mi açılacağı çoğu projede bir kez konuşulur, sonra kimse dönüp bakmaz. Oysa bu kararın arkasındaki klasik kural ("fonksiyonel uygulamalar yeni pencerede, içerik aynı sekmede") tarayıcıların artık desteklemediği bir davranışa dayanıyordu. Bugün soru tek bir yere indirgenebilir: kullanıcı geri tuşuna bastığında ne kaybediyor? Cevabı "hiçbir şey" yapabiliyorsan yeni pencereye ihtiyacın yok.

Eski kural neyi çözüyordu

Kuralın mantığı şuydu: karmaşık bir yönetim paneli tarayıcı sekmesinde açılırsa, kullanıcı refleksle geri tuşuna basar, formdaki veri uçar, oturum karışır. Çözüm olarak uygulama window.open ile araç çubuğu olmayan bir pencerede açılır, geri tuşu ortadan kaldırılırdı.

O kaçış yolu kapandı. Modern tarayıcılar window.open özellik dizesindeki toolbar, location gibi ayarları büyük ölçüde yok sayar; adres çubuğunu ve gezinme kontrollerini her koşulda gösterirler. Yani yeni pencere artık geri tuşunu ortadan kaldırmıyor, sadece kullanıcının açık pencere sayısını artırıyor. Gerekçesi ölen kural ayakta kaldı.

Geri tuşunu arayüzün parçası yap

Veri kaybı korkusuyla pencere açmak yerine geri tuşuna anlamlı bir karşılık ver. Bir modal, bir sihirbaz adımı ya da bir yan panel açarken history.pushState ile geçmişe bir kayıt bırak, popstate olayı geldiğinde o katmanı kapat. Üç satırlık iş, üçüncü parti bir yönlendirme kütüphanesine gerek yok, üstelik Android'de donanım geri tuşu da bedavaya doğru çalışmaya başlar.

Gerçekten kaydedilmemiş veri varsa beforeunload devreye girer, ama sınırlarını bilerek: tarayıcı kendi standart uyarısını gösterir, yazdığın metni yıllardır ekrana koymaz ve sayfa içi rota değişimlerinde hiç tetiklenmez. Tek sayfa uygulamalarda kendi kontrolünü yazmak zorundasın; beforeunload yalnızca sekmenin kapanmasına ve dış bağlantılara karşı bir emniyet kemeri.

Yeni sekme hangi durumda doğru

Ayrım fonksiyonel/içerik değil, kullanıcının o an bir işi yarıda bırakıp bırakmadığı. Doldurulan bir formun yanında açılan yardım belgesi, sözleşme metni, dış kaynak bağlantısı ya da yazdırma önizlemesi yeni sekmeyi hak eder; çünkü asıl bağlam korunmalı. Uygulamanın kendi ekranları arasında geçiş bunun dışında.

İkinci kural daha katı: yeni sekme kararını kullanıcı verir, uygulama değil. Bağlantıyı normal bırak, isteyen Ctrl/Cmd ile tıklayıp kendi sekmesini açsın. target="_blank" koyduğun anda bu tercihi elinden almış olursun ve ortadaki tıklamayla açılan sekmeyi bir daha kapatamazsın.

target="_blank" aynı zamanda bir güvenlik ayarı

Yeni sekmede açılan sayfa, window.opener üzerinden kendisini açan sayfayı başka bir adrese yönlendirebilir. Kullanıcı geri döndüğünde aynı görünen sahte bir oturum açma ekranı bulur. Buna ters sekme kaçırma deniyor ve gerçek bir saldırı yüzeyi.

Tarayıcılar bu tarafta yol aldı: Safari 12.1, Firefox 79 ve Chrome 88'den itibaren target="_blank" taşıyan bağlantılar varsayılan olarak noopener gibi davranır. Ama bu ima yalnızca bağlantılar için geçerli. JavaScript'ten window.open() çağırıyorsan opener bağı hâlâ kurulur; özellik dizesine noopener yazmadığın sürece açık kalır. Bağlantılarda da rel="noopener noreferrer" yazmaya devam et, eski cihaz parkını bedava koruma altına alırsın.

Mobilde "pencere" diye bir şey yok

Masaüstünde iki pencereyi yan yana koyabilen kullanıcı, telefonda aynı şeyi yapamaz. Yeni sekme orada görünmez bir yığına eklenir ve kullanıcı çoğu zaman geri dönmek yerine uygulamadan tamamen çıkar. Ana ekrana eklenmiş bir PWA'da durum daha sert: _blank hedefi kullanıcıyı uygulama kabuğunun dışına, ayrı bir tarayıcı yüzeyine atar. Sosyal medya uygulamalarının içindeki gömülü tarayıcılarda ise davranış platformdan platforma değişir.

Pratik sonuç: pencere kararını cihaza göre ayrıştır. Aynı bağlantıyı masaüstünde yeni sekmede, dar ekranda aynı sekmede açmak tutarsızlık değil, ortamın kısıtına saygı.

Erişilebilirlik tarafındaki borç

Yeni pencere açmak WCAG'de bağlam değişikliği sayılır ve 3.2.5 (İstek Üzerine Değişim) ölçütünün konusudur. Ölçütün kendisi AAA seviyesinde, yani çoğu proje için zorunlu değil, ama arkasındaki gerekçe her seviyede geçerli: ekran okuyucu kullanan biri odağın başka bir pencereye taşındığını çoğu zaman fark etmez, geri tuşunun çalışmadığını görünce kaybolur.

Çözüm ikon değil, metin. Bağlantının erişilebilir adında "yeni sekmede açılır" bilgisi geçsin. Görsel olarak küçük bir dış bağlantı ikonu koyabilirsin ama tek başına bıraktığın anda o bilgi ekran okuyucuya ulaşmıyor. İkona aria-hidden="true" verip açıklamayı görsel olarak gizlenmiş bir metinle taşımak en dayanıklı yöntem.

Karar sırası

Önce geri tuşunu düzelt, sonra pencere kararını konuş. Uygulaman geri tuşuna dayanıklı hale geldiğinde yeni pencere ihtiyacı listesi kendiliğinden kısalır ve geriye sadece kullanıcının bir işi yarıda bırakmadan referansa bakması gereken durumlar kalır. Fonksiyonel mi içerik odaklı mı sorusunu tamamen bırakabilirsin; o ayrım tarayıcıların tek pencereli olduğu döneme aitti.