← Tüm blog yazıları
Tasarım

Akordeon menü ne zaman işe yarar?

Yaklaşık 1 dk okuma
Bir satırı açık, diğerleri kapalı soru-cevap akordeonu.
Görsel: Bu blog için AI ile üretilmiş kavramsal kapak; gerçek ürün ekran görüntüsü veya kaynak kurumun görseli değildir.

Bir sayfada çok sayıda kısa soru varsa bütün yanıtları açık göstermek okumayı uzatabilir. Akordeon, başlıkları görünür tutup ayrıntıları kullanıcı isteğiyle açar. Ancak önemli bilgiyi saklamak için kullanıldığında keşfetmeyi zorlaştırabilir.

Bana kalırsa akordeonun başarısı ekranı ne kadar temiz gösterdiğiyle ölçülmemeli. Asıl soru, kapalı bölümde ne olduğunun anlaşılması. Fiyatı veya karar için gerekli koşulu yalnızca sayfa kısa görünsün diye saklamayı doğru bulmam. Ayrıntıyı isteyen açabilsin; ama önemli bilgiye ulaşmak bir tahmin oyununa dönüşmesin.

Temel fikir

W3C örüntüsünde başlık içindeki kontrol bir düğme gibi çalışır; açık veya kapalı durumu programatik olarak ifade edilir. Tıklanabilir görünen metnin klavyeyle de çalışması gerekir. Bir panel açıldığında diğerlerinin kapanması ise içerik ihtiyacına göre seçilecek ayrı bir davranıştır.

Bir örnek üzerinden

Bir teslimat rehberinde Dosyaları hangi formatta alırım? sorusu kendi yanıtını açabilir. Buna karşılık hizmet fiyatını veya kritik teslim koşulunu kullanıcı akordeonu keşfetsin diye saklamak iyi değildir. İki cevabı karşılaştırmak gerekiyorsa birden çok panelin açık kalması yararlı olabilir.

Nereden başlamalı?

Başlıkları tek başına okuyarak aranan bilgiyi tahmin etmeyi dene. Detaylar gibi genel bir başlık yerine gerçek soruyu kullan. Akordeonun amacı tıklama sayısını artırmak değil, sayfayı taramayı kolaylaştırmaktır.

Benim yaklaşımım

Bir hizmet sayfasında sık sorulan soruları akordeonla sunmayı düşünebilirim. Başlıkları yalnızca “Detaylar” diye yazmak yerine gerçek sorularla adlandırırım. Bölümü açınca cevabın ilk cümlede gelmesini isterim. Uzun bir açıklamanın en sonunda önemli koşulu öğrenmek, sade görünen tasarımın avantajını ortadan kaldırır.

Kaynaklar

W3C APG — Accordion Pattern

Aklına takılan bir şey mi var?

Yazıyla ilgili sorunu veya proje fikrini paylaş.

WhatsApp’tan yaz