web-gelistirme-sc.com

Yaygın web uygulaması kullanılabilirliği var mı?

Web uygulamaları için kullanılabilirlikle ilgili yaygın hatalar nelerdir?

75
tobeannounced

Üzerinde gecikme olmayan CSS/Javascript açılır menüleri sayesinde "diyagonal sorunu" yaşarsınız ( Jakob Nielsen aracılığıyla)

alt text

81
jessegavin

onay kutularına tıklanabilir etiketler ve diğer form alanlarını koymamak.

yapmak çok kolay . HTML <label> etiketine bakın.

74
Patrick McElhaney

Kötü form doğrulama tasarımı.

Doğrulama başarısız olan bir form gönderdiğimde ve uygulama aşağıdakilerden herhangi birini yaptığında nefret ediyorum:

  • Form yeniden yüklendiğinde alanlar BLANK olur. Bu, iPhone'umda bir web uygulamasına kaydolurken başıma geldi. 8'den fazla tarla olduğu için asil bir şekilde kızdım.
  • Her form gönderimi için yalnızca bir doğrulama hatası görüntüler.
  • Formun üst kısmında hataların bir özetini sunmaz.
  • Geçersiz alan girişlerini görsel olarak vurgulamaz.
74
jessegavin

Formlardaki Birincil ve İkincil eylem düğmeleri söz konusu olduğunda kötü tasarım.

http://www.lukew.com/resources/articles/psactions.asp

alt text

55
jessegavin

Kullanıcılar tarayıcılarında (veya farelerinde) geri ve ileri düğmelerini kullanır. Yenile düğmesini de kullanıyorlar. Bu yüzden web sitenizdeki form gönderilerine dikkat edin.

Kimse bunu sevmiyor ...

enter image description here

Bu iletişim kutusu, verilerin gönderildiği sayfayı yenilediğinizde görünür. Neyse ki, method = "get" veya mümkünse method = "post" kullanılarak hemen ardından gerektiğinde bir yönlendirme kullanılarak önlenebilir. Uzunluk veya güvenlik nedeniyle bir gönderi kullanmanız gerekiyorsa, bu iletiden kaçınmak için yönlendirme form eyleminden farklı bir URL'ye gitmelidir.

52
Steve Wortham

JavaScript bağlantıları.javascript:loadPage(34576) için yeni bir sekmeyi aç tıklatamazsınız.

43
Casey Chu

Gerekli olmadığında kayıt formlarında zorunlu kişisel bilgileri istemek.

Örnekler:

  • bir web sitesinde bu bilgilerin işe yaramayacağı bir adres sorma
  • "Gerçek" bir isim girmeye zorlama
  • ...

Bu bilgileri zorunlu kılmak, gerçekten kirli olmayan bir veritabanını "kukla", "[email protected]" vb.

Ayrıca, bu bilgilerin hiçbirini değiştirememek gerçekten kötü bir tasarımdır.

37
Julien N

çapalarda target = "_ blank" en yaygın olanlardan ve en çok nefret ettiğimden biridir. Benim görüşüme göre bunun mantıklı olduğu bazı durumlar var.

Web Tasarımında Bilinen En İyi 10 Hata listesi: http://www.useit.com/alertbox/9605.html

30
Nacho

geri düğmesi işlevi devre dışı bırakıldığında veya kullanıcının beklediği gibi değiştirildiğinde. Özel iletişim kutusu/ışık kutuları/iframe kullanan uygulamalarda bunu çok görüyorum.

30
jessegavin

"Parolanızı mı unuttunuz?" bağlantısını tıklattıktan sonra şifremi net bir şekilde göndererek 1 bir kez buldum. Sevgili Jeff Atwood bunu oldukça iyi kapattı " Muhtemelen Şifreleri Yanlış Saklıyorsunuz "

1 Kuşkusuz, bu bölüm daha çok bir programlama sorun , ama ben de bir kullanılabilirlik sorunu olarak düşünüyorum.

26
Jared Harley

Onay kutularını radyo düğmesi olarak kullanma veya tersi.

24
Gelatin

Hesabınızı hiçbir yerde kapatamazsınız veya hesabınızı nerede kapatacağınızı gerçekten zorlaştırmazsınız.

İdeal olarak, bir bölüm "Hesap" veya benzer şekilde ifade edilen bir şey ve o sayfada, istediğiniz diğer tüm şeylerin yanı sıra, "hesabımı kapat" yazan açık bir şekilde etiketlenmiş bir bağlantı veya düğme olmasını istersiniz. Bunu, kullanıcıların neden ayrıldıklarını soran veya geri bildirimde bulunmaya davet eden bir sayfa ile takip edebilirsiniz, ancak tüm bu şeyler, gerçek "hesabımı kapat" (veya silme, kaldırma vb.) Harekete geçirici mesajıyla karşılaştırıldığında daha az kullanılmalıdır. .

22
Rahul
  • Süper katı doğrulaması olan alanlar. Örneğin, bir posta kodu yazdıysanız ve "V5X4O4" çalışıyor ancak "V5X 4O4" çalışmıyorsa.

  • Metin etiketi veya başlığı olmayan simgeler (üzerine gelindiğinde veya üstünde değil).

  • Bir başlık kesiliyorsa, fareyle üzerine gelindiğinde tam başlığı içeren bir ipucu görebilmeniz gerektiğini düşünüyorum.

  • Önemli düğmeler, reklam veya promosyon malzemesi lehine son kullanıcılardan gizlendiğinde. Paypal'ın "Hesap olmadan devam et" düğmesini düşünün.

    • İZİN OLMADAN OYNANAN SES! Lol - Ayrıca, sessiz düğmesi yok.
21
Motolix

JavaScript devre dışı bırakıldığında sitenizin zarif bir şekilde bozulmamasını sağlamak.

19
GSto

Soru biraz fazla genel ve aslında bir tartışma konusu.

Tekrar tekrar gördüğüm bir şeye katkıda bulunabilirim:

"Tümünü temizle" düğmesi olan formlar.

  • Bunlardan bazıları hem "gönder" hem de "tümünü temizle" düğmelerini aynı şekilde tasarlayarak eşit ağırlık verir.
  • "Açık" ın solda ve sağda "gönder" olduğu bazı örnekleri ilk basmasına neden olan örnekler gördüğümden (şu anda aklınızda belirli bir bağlantı yok ...) bahsetmiyorum son alandan ayrılırken imlecine en yakın düğme.

"Net" bir düğme için hiçbir neden görmüyorum, ancak kesinlikle ısrar ederseniz, kullanıcı için sadece basit ve açık bir eyleme izin veren çok ince bir bağlantı kullanın.

18
Dan Barak

Gerçekten kayıt gerektirmeyen bazı temel işlemleri gerçekleştirmek için kayıt olmak zorunda. Veya "tek tıklamayla" bir kayıt yöntemine izin verin.
Kullanıcının karar verme hakkı olmalıdır. Ben çok fazla web sitesinde bir sürü "bir kerelik kullanım" hesapları ile sonuçlanır!

Gerekli olmaması gereken bazı örnekler:

  • dosya indirme (örnek bir dosyayı indirmenize izin vermek için kaç "kod" web sitesi kaydolmanızı istiyor?)
  • arama (evet, bazı forumlar kayıtlı olmayan kullanıcılar için aramayı devre dışı bırakır)
  • bir makaleye erişim (erişimi ücretsiz olduğunda)
  • ...
17
Julien N

Değişken durum çubukları olan siteler

Meebo Bar gibi. Bunlar iğrençtir ve nadiren kullanışlı işlevsellik sağlar. Gereksiz yer kaplarlar ve dikkat dağıtıcı balonlar açarlar.

16
Gelatin

"Yaratıcı" olmak ve arama çubuğunuzu bir sekme/bağlantı/vb. Arama teklif ederseniz, avlamak zorunda kalmak yerine bir kutu hazır bulundurun!

16
agartzke

En büyük evcil hayvanım, bir veya daha fazla nedenden e-posta adreslerindeki artı işaretlerini doğru bir şekilde desteklemeyen sitelerdir. Web siteleri çoğu zaman '@' işaretinden önce '+' işaretli bir e-posta adresini doğrulamaz. En kötüsü, bir sitenin adresi kabul etmesi, ancak daha sonra verilerden kaçmaması ve/veya görünümünün doğru şekilde görüntülenmemesi ve ya içinde bir boşluk bulunan bir adrese veya '+' nın iki tarafı birlikte e-posta göndermeye çalışmasıdır. .

PHP ile yazılmış bu ücretsiz doğrulayıcı tüm RFC'leri ve ilgili hatalarını takip eder.

15
waymost

Birçok site, ziyaret edilen bağlantılar için farklı renkler kullanmaz.

Jakob Nielsen: Ziyaret Edilen Bağlantıların Rengini Değiştirin

12
Marc Dong

Güvenli bir HTTPS bağlantısında çalışan ancak bir HTTP bağlantısından içerik yükleyen Web Uygulamaları. Bir yandan bu gayet iyi, ancak IE kullanıcılar için (tipik olarak ben değilim) için güvenlik uyarısı garip ve kafa karıştırıcı kullanıcılar için ...

Her sayfada reddetmek sadece son derece ağırlaştırıcı olmakla kalmaz, aynı zamanda ifadeler gariptir ve IE8 + ve IE8 + için düğme eylemleri farklıdır.

Eski IE iletişim kutusu:

alt text

Yeni IE iletişim kutusu:

alt text

Dolayısıyla, kullanıcı olarak "yalnızca tam sayfayı yüklemek istiyorsanız" (örneğin, "git" düğmesini arıyorsanız) ... Yes IE6 ve IE7'de, ancak varsayılan olmayan No IE8 + 'da.

Not: Bir geliştirici olarak iletişim kutusunun amacının ne olduğunu ve Microsoft'un neden değiştirdiğini tam olarak biliyorum ama son kullanıcılar için özellikle IE8'de onları karıştırıyor. Son kullanıcılar "izin", "onay" vb. İsteyen bir iletişim kutusu görürler ve iletişim kutusunu okumadıkları için "tamam" veya "evet" seçeneğini tıklamayı beklerler. Kullanıcıların okuması gerektiği iddia edilebilir, ancak geliştiricilerin kaçınılabiliyorsa karışık içeriklere sahip olmadıklarından emin olmaları daha kolaydır.

12
scunliffe

Çıkış bağlantısını aramak zorunda. Bir sayfada oturum açtım ve bazılarında, işim bittiğinde oturum kapatma düğmesini veya bağlantısını aramam gerekiyor.

12
thursdaysgeek

Son zamanlarda hiçbir zaman bir kullanılabilirlik sorunu olduğunu düşünmediğim bir şey fark ettim:

İşlemleri kullanılabilir hale getirmek için fareyle üzerine gelin. Örneğin, bir Tweet'in üzerine gelmenin retweet ve yanıt komutlarını görüntülediği Twitter.com'daki gibi.

Bu, dokunmatik tabanlı cihazlarda hiç işe yaramaz. Vurgulu yok!

Bir başka evcil hayvanım, yeni bir sekmede dış bağlantıları açmayan web siteleridir. Bak, bir ağaca göz atıyorum. Beklediğim her alanın bir şubeyi temsil etmesini bekliyorum, işim bittiğinde sekmeyi kapatacağım. Kesinlikle on kez 'geri' tıklayarak şube yukarı seyahat istemiyorum.

11
Swizec

Kullanıcıların istediklerini gizlemek ve bunun yerine onlara SİZİN ne istediklerini vermek.

Örnek olarak müşteri desteği verilebilir. Bazı şirketler, telefon numarası/posta vb. İle büyük bir yağ kutusu listelemek yerine, yardım almak için bir FAQ) gösterir ve bu sayfada herhangi bir iletişim bilgisi yoktur.

11
googletorp

Siz kaydırdıkça ekranın her iki tarafında yukarı ve aşağı "kayan" menü yapılarına sahip siteler. Neden yaptıklarını görebiliyorum, ama genellikle çok dikkat dağıtıcıdır ve tasarımcının umduğu gibi "kaygan" değildir.

Bahsettiğim bir örnek burada görülebilir: http://www.deluxe-menu.com/floatable-menu-sample.html

9
Sk93

Kabul edilen yanıtı iki kez gösteren KG siteleri.

8
Gelatin

A List Apart'ın Aza Raskin'in bir makalesi var: "Geri Almak İstediğinizde Asla Uyarı Kullanmayın".

http://www.alistapart.com/articles/neveruseawarning/

Kullanıcılar "uyarı" pop-up'larını göz ardı etme veya beğenmeme eğilimindedir, ancak bir kullanıcıya "geri alma" şansı vermek çok daha kullanıcı dostudur.

7
mg1075

Captcha'lar

bu günlerde oldukça popüler olmalarına rağmen, özellikle de bilmedikleri kelimeleri tanımayan (veya klavyelerinde ýáěíč gibi özel karakterlere sahip olmayanlar) bir erişilebilirlik sorunu olarak kabul edilirler.

kişisel olarak, bu işlevselliği sunmak için basit rasyonel sorular kullanmayı tercih ediyorum

örnek: lütfen on bir numaradan sonra gelen bir sonraki tam sayıyı yazınız

6
user3409

Çok fazla işlemci ve bellek kullanan siteler

Genellikle çeşitli posta listelerinden programlama soruları/cevapları ile açık bir sürü sekme var ve bu sitelerin birçoğu bazı ağır javascript oluyor (Adblock'u yüklemek yardımcı oldu, ancak yine de ağır siteler var). Chrome ile nihayet hangi sekmelere neden olduğunu görebiliyorum.

Yeni geliştirilmiş Google görsel arama, cpu'yu ağır bir işe sokuyor ve birkaç yüz megabayt kaplıyor. Çok kaynak aç.

5
neoneye

Sayfanızda, fare imlecini üzerine koyarsanız renk değiştiren statik öğelere sahip olmak, ancak üzerlerine tıkladığınızda hiçbir şey yapmamak. Aynı ligde: tıklanabilir bölgenin metinle sınırlı olduğu köprüler veya düğmeler.

4
Tommy Carlier

Kök URI'den bir alt dizine veya alt alana yönlendirme (www kaldırılmıyor/eklenmiyor).

0
Gelatin