web-gelistirme-sc.com

Tamam / İptal düğmeleri sağa mı yoksa ortalanmış mı?

Diyaloglarıma Tamam/İptal düğmelerini nereye koymalıyım? Altta ortalanmış mı yoksa hizalanmış sağda mı? Her ikisini de gördüm ve kişisel olarak umursamıyorum, ancak başvurum boyunca tutarlı bir görünüm oluşturmak istiyorum. Bunun için herhangi bir yönerge var mı yoksa ne istersem yapmalıyım?

46

Bunun bu soru için de geçerli olduğunu ve cevap verdiğini düşünüyorum:

(Spoiler: Önemli değil .)

Bu gibi durumlarda, genellikle ne yaptığınız önemli değildir . Her iki seçim de lehine iyi argümanlara sahiptir ve hiçbir seçeneğin kullanılabilirlik felaketlerine yol açması olası değildir. Belirli koşullar için "doğru" seçimi seçerseniz bazı kullanıcılara 0,1 saniye kazandırabilir, ancak bu seçimin ne olduğunu bulmak için yeterince ayrıntılı bir araştırma yapmaya değmez. Kullanılabilirlik kaynaklarınızı temel performans göstergelerinizi% 83 veya daha fazla değiştirebilecek şeylere harcamak daha iyidir.

Daha fazla bilgi: seit.com/alertbox/ok-cancel.html

45
Nacho

Uyumdan bahsederken, tutarlı olmaktan başka doğru bir cevap yoktur.

Ancak, düğmelerin hizalanması düğmelerin konumlandırılması veya mantıksal sırası ile ilişkilidir.

Düğmelerin ** konumlandırılmasında uygulanabilecek iki genel paradigma vardır.

  1. Okuma Sırası - Okuma sırasında karşılaşılan ilk düğme birincildir (Tamam) ve sonraki seçeneklere göre öncelik verilir (İptal)
  2. İleri/Geri - İleri ilerleme veya eylem (Tamam), sağa doğru hareketle ilişkilendirilirken Geri veya Geri Al (İptal), sola hareketle ilişkilendirilir.

Düğmelerin hizalanması kullanıcının algılanan paradigmasını etkileyebilir. Bu nedenle, bazı hizalama ve pozisyon kombinasyonları çelişkili olabilir ve bu nedenle kullanıcılar için kafa karıştırıcı olabilir.

alt text

** bu soldan sağa okumayı varsayar; belki sağdan sola okuma dilleri için aynı değildir.

35
g .

Uygulamanıza ve hedef işletim sisteminize uygun olanı yapın.

Ancak, belirttiğiniz gibi, uygulamanızda tutarlı olmak muhtemelen daha önemlidir.

24
ChrisF

Onları doğru hizalamanın daha iyi (ve daha genel) olduğunu düşünüyorum.

4
megubyte

Her zaman sağdalar ve kullanıcı onların sağda olmasını bekliyor. Onları yeterince boşluk bıraktığınızdan emin olun ve birincil eylemi vurgulamak için onlara farklı stiller verin.

3
giancarlo

En olası eylemi (bu durumda Tamam) sağa yerleştirmeyi ve solda gri renkli veya daha az olası eylemi (bu durumda İptal) kolaylaştırmak için bir tür renk vermeyi tercih ederim form arka planının çizgileri boyunca bir renk.

Onları yan yana koymak kötü bir tasarım olduğunu düşünüyorum. "Beni düşündürme" yaklaşımını izleyerek iptal etmem gerektiğinde - durup düğmeyi ararım, ancak diğer zamanlarda sadece otomatik olarak hareket etmek istiyorum.

Ayrıca i.stackexchange adresindeki bu soruya bakın .

3
idophir

Platformunuza bağlıdır. Windows düğmeleri sağ taraftaki <TAMAM> <İptal> ve Mac OSX'i <İptal> <TAMAM> sırasıyla yerleştirir. Diğer cevaplar gibi .... tutarlı olun. Düğme yerleşimi için sağ alt tarafı tercih ederim.

2
sysscore

bence "TAMAM" veya öncelikli eylem düğmeniz aşağıdaki nedenden dolayı solda olmalıdır 1: Kullanıcıların iyi bir yüzdesi formlarda veya iletişim kutularında klavye kullanır ve kullanıcı sol tarafta ise sekme yoluyla en uygun eyleme ulaşmak için daha az zaman alır . 2: Göz çevirme veya Fitt Yasası 3: Konuşma modunda araç kullanırken veya uygulamaya erişirken kör bahisleri (yarı kör) veya uygulamayı kullanmayı düşünün. 4: eylem olarak en az fiilleri kullanmayın

Bu forumda mevcut çok sayıda konu var, lütfen bunlardan geçin

Ayrıca, önerilerimin küçük cihazlar için olmadığını da unutmayın.

2
Hemchandra

Doğrusal bir işlem için (yükleyici gibi), "İleri" düğmelerini sağa (Batı ortamında) hizalamak daha sezgisel olabilir.

Düğmelerinizin sırasının daha önemli olduğunu söyleyebilirim. Windows'ta "Tamam düğmesi" her zaman solda ve "İptal düğmesi" sağdadır. Kullanıcılar okumadıkları için, Tamam ve İptal düğmelerini (bazı taşınan Mac uygulamalarının yaptığı gibi) değiştirmek, kullanıcıyı karıştırır.

2
Petrus Theron

Bence tasarıma bağlı. Formunuz için standart bir tasarım kullanıyorsanız, Tamam/İptal düğmelerini sağ tarafa yerleştiririm (http://bit.ly/9IzQo0), ancak formlarınızı değiştirmek için CSS kullanıyorsanız, onları yerleştiririm merkezde (http://www.tumblr.com/register).

1
rgaspary

Form alanlarınız sola hizalanmışsa, düğmelerinizi de sola hizalamak mantıklı görünmektedir. Kullanıcıların gözlerinin gerçekte nereye gittiğine ve ne kadar hızlı tepki verdiklerine dair bazı araştırmalar: http://www.lukew.com/ff/entry.asp?571

Bu, bu iki seçeneğin sola hizalanmasının en iyi tasarım seçimi olduğunu göstermektedir - özellikle yukarıdaki form kontrolleri de sola hizalandığında. “Gönder” ve “İptal” düğmelerini sol tarafa yerleştirmek, insanların gözlerinin yolculuk için daha az mesafe olduğu anlamına geliyordu.

Göz hareketleri açısından, insanlar [sağa ​​hizalı düğmeli bir seçenek] kullanırken en az verimliydiler.

1
Luke

Bu tür konuları vaka bazında eleştirmenin kolay olduğunu düşünüyorum, ancak herkesin fikirlerini ve/veya test sonuçlarını dile getirirken tüm bir tasarım sistemini ve/veya desen kütüphanesini düşünmesi gerektiğini düşünüyorum. Gerçek şu ki, içeriğe ve teste bağlı olarak, bazıları solda Tamam ve sağda Tamam ile daha yüksek dönüşüm gösterebilir.

Bununla birlikte, tüm bir tasarım sistemini düşünürken, tutarlılığın bireysel sol/sağ testlerde en iyi sonucu verdiğinden daha iyi olduğunu düşünüyor musunuz? "Ödeme Profilini Sil", tersine çevrilemez bir şey vb. Gibi ciddi olumsuz dışsallıklar olduğunda, CTA'yı bu örneklere sola yerleştirip iptal ederseniz, "ileri" işlemi kasıtlı olarak ters çevirmek istediğinizi kabul ediyorum. sağda.

Ancak, bunu göz önünde bulundurarak bile, kullanıcıların çoğunun Windows kullanıcısı olduğunu (şu anda) hayal edelim ve aşamalı bir ilerleme ödeme akışına gidiyorsunuz. "Ödeme" veya "Devam" seçeneğinin sağda, arkada veya solda iptal olmasını beklersiniz. Bu, çoğu modal kullanım iptali/Ok düzeni için (Vakıf hariç) de geçerlidir, ancak bireysel A/B testlerini savunan veya daha yüksek bir dönüşüm gerçekleştiren testler kullanan kişiler için iyi bir jive değildir. sol, sağa karşı.

Şahsen, test deneyiminde, CTA'lar en iyi şekilde çalışır, ancak her zaman insanların en solda CTA'ları gösteren bir stil kılavuzu veya tasarım deseni olan metriklerin ne olduğunu merak ediyorum.

1
Arondale
  1. Kardeş olduklarını ima etmek için birbirine yakın oldukları sürece düzen önemli değil. Yani, Tamam ve İptal düğmeleri farklı şeyler yapar, ancak aynı öğeyi etkiler.
  2. Soldan sağa bir dil için düğmeleri ortaya koyup sağa yaslardım.
  3. Tamam düğmesini markayla eşleşen bir renkle vurgulayacağım.
0
Tim Huynh

Genellikle solda Tamam, sağda İptal kullanıyorum.

Bu kalıbı değiştirdiğimi görebildiğim tek durum (ve bu saçları bölmek, size dikkat etmek), kullanıcının geri alınamaz eylemleri (yani, hesabımı sil, tüm insanları öldür, vb.) eylem hakkında düşünmeye zorlamak veya varsayılan eylemi daha güvenli bir seçenek olmaya zorlamak istemektedir.

0
drivingmenuts

Gutenberg Diyagramı 'ya göre, terminal alanı (kullanıcı sayfanın içeriğini taradıktan sonra sitenin son çağrısını gösterir) ekranın sağ alt köşesidir. Batılı okuyucuların doğal okuma şekli nedeniyle, bu konumda düğmelere sahip olmak, bu konumdaki göz atmalarını tamamladıkları için kullanıcı yorgunluğunu azaltır. Düğmeler sol altta bulunursa, kullanıcılar genellikle terminal alanında bitirir ve eylemlerini yapmak için geri çağırmaya dayalı olarak sola dönmek zorunda kalırlar. Bu desen hem açılır pencereler için hem de ekran düzenleme/ekleme için geçerlidir.

Bu genel desen, düğmelerin konumlandırılma sırası için de geçerlidir. İptal etmeden önce Tamam'ı listelerseniz, kullanıcı istediği seçeneği seçmeden önce neredeyse tüm seçeneklerini görüntüleyecektir. Çoğu durumda, kullanıcı İptal üzerinde Tamam'ı tıklamak isteyecektir. Bu, Tamam'ı, ardından İptal'i görüntüleyip ardından Tamam'a geri döndükleri anlamına gelir. Çok küçük ama yine de iş ekledi.

0
Brad Hutchison

Burada harika cevaplar. Kimseden bahsetmediğim şey, bir GUI'de hedefleri tıklama hızını (ve kolaylığını) belirleyen Fitt Yasasıdır. Birincil düğmelerin nereye yerleştirileceğine dair biraz bilim verir.

Temel olarak Fitts Yasası ( https://en.wikipedia.org/wiki/Fitts%27s_law ), hedefin ve mesafenin büyüklüğünün, hedefi vurmak için öngördüğü zaman üzerinde etkili bir şekilde hareket ettiğini belirtir. Bir düğme bir "kutunun" köşesinde olduğunda, hedef boyut tartışmasız sonsuzdur (tek gerçekten sonsuz hedef boyutlar, bilgisayar ekranınızın, imlecin tek başına durduğu köşeleridir). Hız her zaman birincil faktör olmasa da, konfor (kullanım kolaylığı) olmalıdır.

Etkileşimli demo (köşesiz!): http://simonwallner.at/ext/fitts/

0
Rashcom