Hata Mesajı Örnekleri: Kötü, İyi ve Harika, Baştan Yazıldı
Sekiz hata mesajı, ham bir koddan insanların aksiyon alabileceği bir metne tırmandı. Her basamağın açıklaması, harika olanların arkasındaki üç satırlık formül ve bir sonraki incelemeniz için kontrol listesi.
Harika bir hata mesajı insanlara üç şey söyler: ne oldu, neden oldu ve sırada ne yapmalı, üstelik bunu yapan bir butonla. Çoğu ürün ilkinde durur, birçoğu da bir kodu aşamaz. Aşağıda kötüden harikaya tırmanan sekiz hata mesajı, her basamağın gerekçesi ve yazacağınız bir sonraki mesajda kullanabileceğiniz bir formül var.
Kötüden harikaya ne değişir
Kötü
Harika
Kötü mesaj sunucu için yazılmıştır. 403 gerçek bir durum kodudur ve doğrudur, ama okuyan kişi işine yarayacak hiçbir şey öğrenmez. Harika mesaj insan için yazılmıştır: dosyayı adlandırır, özel olduğunu açıklar, kimin açabileceğini söyler ve sonraki adımı tek dokunuşa çevirir.
Her basamak bir şey ekler:
| Basamak | İnsanlara ne verir | Hâlâ neyi eksik bırakır |
|---|---|---|
| Kötü | Bir kod ya da "başarısız" gibi belirsiz bir kelime | Ne oldu, neden, ne yapmalı |
| İyi | Ne olduğu, sade kelimelerle | Neden ve sırada ne var |
| Harika | Ne oldu, neden ve butonda sonraki adım | Karar vermeleri gereken hiçbir şey |
1. Erişim yok
Kötü
Error 403.
Bir durum kodu. Geliştirici için doğru, geri kalan herkes için boş.İyi
Bu dosyaya erişiminiz yok.
Ne olduğunu okuyanın diliyle söyler. Yine de onu çıkmazda bırakır.Harika
Bu dosya özel. Sam'den erişim iste, açıldığında sana haber verelim.
Nedenini (özel olması), kimin çözebileceğini (Sam) ve sonrasında ne olacağını söyler. Buton Erişim İste, yani istemek tek dokunuş.
403, kişinin giriş yaptığı ama izni olmadığı anlamına gelir. Bu ayrım metin için önemli: tekrar giriş yapmaları gerekmiyor, birinin dosyayı paylaşması gerekiyor.
2. Reddedilen kart
Kötü
İşlem başarısız.
Öznesi olmayan bir "başarısız". Kart mıydı, mağaza mı, bağlantı mı?İyi
Kartınız reddedildi.
İnsanların aksiyon alabileceği nedeni söyler.Harika
Kartınız reddedildi. Bankanız onay vermedi. Başka bir kart deneyin ya da bankanızdan onay isteyin.
Sorunu kişiye değil bankaya yükler ve iki çıkış yolu sunar. Buton Başka Kart Kullan, yani hızlı olanı.
Ödeme hataları en çok parayı ve en çok mahcubiyeti taşır. Kimseyi suçlamayın ve çıkış yolunu aynı ekranda tutun.
3. Çok büyük bir dosya
Kötü
Yükleme hatası.
Her şey olabilir, bu yüzden insanlar aynı dosyayı tekrar dener ve aynı duvara çarpar.İyi
Bu dosya çok büyük.
Neden var, ama ne kadar büyük olduğu yok.Harika
Bu video 2,4 GB. Sınır 2 GB. Biraz kısaltıp tekrar dene.
İki sayı da var, böylece fark küçük görünür. Buton Videoyu Kısalt, uygulamadan çıkmadan çözer.
İşin içinde bir sınır varsa sınırı söyleyin. İnsanlar kendilerine hiç söylenmeyen bir sayıyı düzeltemez.
4. Çevrimdışı olmak
Kötü
Ağ hatası.
Bir şey bozulmuş gibi, belki de iş kaybolmuş gibi duyulur.İyi
Çevrimdışısınız.
Sade, ama herkesin aklına gelen ilk endişe "değişikliklerim gitti mi?"Harika
Çevrimdışısın. Değişiklikların bu telefonda kayıtlı ve bağlandığında senkronize olacak.
Endişe sorulmadan cevaplanır. Buton Tekrar Dene.
5. Oturumun kapanması
Kötü
Error 401: Unauthorized.
"Unauthorized" suçlama gibi okunur ve yine bir kod.İyi
Oturumunuzun süresi doldu.
Doğru, ama "oturum" bir geliştirici kelimesi.Harika
Oturumun kapandı. 30 gün geçti. Tekrar giriş yap, seni buraya geri getirelim.
Nedenini açıklar ve insanların yerini kaybetmeyeceğine söz verir. Buton Giriş Yap.
401, 403'ün tam tersi durumdur: kişi giriş yapmamıştır ya da girişinin süresi dolmuştur. Onları giriş ekranına göndermek çözümdür, kaldıkları yere döneceklerini söylemek de tereddüt etmek için gereken sebebi ortadan kaldırır.
Üç tane daha, sıfırdan yazıldı
Aynı kurallar yukarıdaki beşinin kapsamadığı durumlar için de geçerli. Bu üçü bizim kendi örneklerimiz.
Kötü
Error 500. Bir şeyler ters gitti.
Kod hiçbir şey eklemez, "bir şeyler" de bilmediğimizi itiraf eder.İyi
Değişikliklerinizi kaydedemedik.
Sorunu üstlenir ve neyin başarısız olduğunu söyler.Harika
Değişikliklerini kaydedemedik. Bu bizim tarafımızda, seninle ilgili değil. Metnin hâlâ burada, bir dakika sonra tekrar dene.
Kimin hatası olduğunu ve hiçbir şeyin kaybolmadığını söyler. Buton Tekrar Kaydet.
Kötü
Too many requests.
Muhtemelen zaten sinirli olan bir insana makine dili.İyi
Çok fazla deneme. Daha sonra tekrar deneyin.
Net, ama "daha sonra" bir dakika da olabilir bir gün de.Harika
Çok fazla deneme. Güvenliğin için giriş 15 dakika duraklatıldı. Bunun yerine şifreni şimdi sıfırlayabilirsin.
Bekleme süresini, nedeni ve daha hızlı bir yolu verir. Buton Şifreyi Sıfırla.
Kötü
Geçersiz bağlantı.
Kişinin bir şeyi yanlış yazdığını ima eder.İyi
Bu davetin süresi doldu.
Gerçek neden, suçlama yok.Harika
Bu davetin süresi doldu. Davetler 7 gün geçerli. Maya'dan yenisini göndermesini iste.
Bağlantıların neden sona erdiğini ve kimin çözebileceğini söyler. Buton Yeni Davet İste.
Formül: ne oldu, neden, sırada ne var
Yukarıdaki her harika mesaj aynı üç satıra oturur:
[What happened, in the reader's words.]
[Why, in one short sentence.]
[What to do next.] [Button: the next step as a verb]
| Mesaj | Ne oldu | Neden | Sırada ne var |
|---|---|---|---|
| Erişim yok | Bu dosya özel | Sadece davet edilenler açabilir | Erişim İste |
| Reddedilen kart | Kartınız reddedildi | Bankanız onay vermedi | Başka Kart Kullan |
| Çok büyük | Bu video 2,4 GB | Sınır 2 GB | Videoyu Kısalt |
| Çevrimdışı | Çevrimdışısın | Değişiklikler bu telefonda kayıtlı | Tekrar Dene |
| Oturum kapandı | Oturumun kapandı | 30 gün geçti | Giriş Yap |
"Neden" satırı ekiplerin ilk kestiği satırdır ve bir sonraki destek talebini durduran da odur.
Bir sonraki inceleme için kontrol listesi
- Ham kod yok. 403, 401 ve 500 loglarda kalsın, mesajda olmasın.
- Suçlama yok. "Bankanız onay vermedi", "Geçersiz kart girdiniz" değil.
- Sayıları söyleyin. Bir boyut sınırı, bir bekleme süresi, kaç gün olduğu.
- Tek buton, fiil olarak adlandırılmış. "Videoyu Kısalt", "Tamam" değil.
- Neyin korunduğunu söyleyin. Hiçbir şey kaybolmadıysa söyleyin.
- Girişte hesapları doğrulamayın. "Yanlış şifre" bir yabancıya hesabın var olduğunu söyler. Bunun yerine "Bu e-posta ve şifre eşleşmiyor" deyin.
- Sonra rengi kontrol edin. Hatayı kelimeler taşır, renk ve ikon onları destekler. Hata mesajı rengi yazımızda açık ve koyu temada kullanılacak kırmızılar var.
Yazı
Hata mesajı rengi: #FF0000 yerine kullanılacak 8 kırmızı
Bu yazının kardeşi: kelimeler burada, renkler, ikonlar ve kod orada.
SSS
İyi bir hata mesajı nasıl yazılır?
Ne olduğunu sade kelimelerle, neden olduğunu tek kısa cümleyle ve sırada ne yapılacağını söyleyin. Sonraki adımı fiil olarak adlandırılmış bir butona koyun, mesela Tekrar Dene ya da Başka Kart Kullan.
Kötü hata mesajı örnekleri nelerdir?
Ham kodlar ve belirsiz kelimeler: "Error 403", "Error 401: Unauthorized", "İşlem başarısız", "Yükleme hatası" ve "Ağ hatası". Her biri doğrudur ve hiçbiri insanlara ne yapacaklarını söylemez.
Hata mesajları hata kodlarını göstermeli mi?
Mesajın kendisi olarak hayır. Kod destek ekibine ve geliştiricilere yardımcı olur, o yüzden loglarda tutun ya da destek ekibiniz isterse gerçek mesajın altında küçük bir metin olarak gösterin.
401 ve 403 hata mesajı arasındaki fark nedir?
401, kişinin giriş yapmadığı ya da girişinin süresinin dolduğu anlamına gelir, bu yüzden mesaj onları girişe yönlendirmelidir. 403, giriş yaptıkları ama izinleri olmadığı anlamına gelir, bu yüzden mesaj onlara erişimi kimin verebileceğini söylemelidir.
Bir giriş hatası neden "yanlış şifre" dememeli?
Çünkü hesabın var olduğunu doğrular, bu da hesap tahmin eden birine yardımcı olur. Güvenlik rehberleri, yanlış e-posta ya da yanlış şifre için tek bir genel mesaj önerir.
Kaynaklar
- HTTP durum kodları: MDN'de 403 Forbidden ve 401 Unauthorized.
- Error-message guidelines, Nielsen Norman Group.
- Writing, Apple Human Interface Guidelines.
- Authentication and error messages, OWASP Cheat Sheet Series.
- İlk olarak UX Brainy üzerinde bir carousel olarak yayımlandı.
Want every error, empty and loading state written and designed as one system? Our team designs product UI with the words in it from the first draft.
Get Started
