web design uiOctober 30, 20266 min read

نصوص الأزرار: لماذا "OK" هو النص الخاطئ للزر وماذا تكتب بدلًا منه

الزر يجب أن يقول ما سيحدث عند الضغط عليه. لماذا تفشل OK وYes وNo وSubmit، وقاعدة الفعل أولًا خلف إرشادات Apple نفسها، وستة بدائل للنسخ، واختبار من خمس ثوانٍ لأي نافذة حوار.

By Boone
XLinkedIn
Button Labels: Why "OK" Is the Wrong Button Text and What to Write Instead

زر مكتوب عليه OK يجبر الناس على إعادة قراءة السؤال ليعرفوا ماذا تعني OK. "OK، احذفها؟" أو "OK، لا بأس؟" نص الزر يجب أن يسمّي ما سيحدث عند الضغط عليه، حتى لا يضطر أحد إلى البحث في مكان آخر. إليك القواعد الأربع، كل واحدة مبنية من جديد جنبًا إلى جنب، وستة بدائل يمكنك نسخها.

لماذا تفشل OK

تجيب OK عن السؤال في رأس من كتبها. على القارئ أن يحتفظ بالعنوان في ذاكرته، ويعيد بناء الجملة وفي آخرها OK، ثم يقرر هل هذا ما يريده. في نافذة حوار تدميرية هذه مقامرة، لأن الزرين متشابهان والخطير منهما لا يعلن أنه خطير.

وينطبق الأمر نفسه على Yes وNo وSubmit وContinue وConfirm. كلها إجابات عن سؤال أو خطوة عامة في نموذج، وليست الشيء الذي سيحدث فعلًا. حين لا يحمل النص الفعل، يضطر العنوان والنص التوضيحي إلى حمله، والناس يضغطون قبل أن يقرؤوا.

تقول Apple ذلك في إرشادات الواجهة البشرية (Human Interface Guidelines) الخاصة بالتنبيهات: استخدم عنوانًا من كلمة أو اثنتين يصف نتيجة اختيار الزر، وفضّل الأفعال والعبارات الفعلية المرتبطة مباشرة بنص التنبيه. ورقتنا عن أمثلة رسائل الخطأ تغطي الكلمات المحيطة بالزر. أما هذه فعن الزر نفسه.

الإصلاح 1: قل ما يفعله

OK

نافذة حوار بعنوان Delete this photo فيها زران، Cancel وزر أسود مكتوب عليه OK

Delete

نافذة الحوار نفسها وفيها زر Delete أحمر بدل OK
السؤال فيه فعل، فيستعيره الزر. على اليسار، الزر الأسود OK هو الذي يُدفع الناس نحوه ولا يسمّي شيئًا. على اليمين، الزر يقول Delete وهو أحمر، فيتفق النص واللون على ما أوشك أن يحدث.

انسخ الفعل مباشرة من العنوان. "Delete this photo?" تأخذ Delete، و"Block this account?" تأخذ Block.

إذا لم يتسع الفعل للزر، فالعنوان على الأرجح غامض، فأصلح العنوان.

الإصلاح 2: اترك Yes وNo، وأبقِ على Cancel

No / Yes

نافذة حوار بعنوان Leave without saving فيها زران، No وYes

Cancel / Leave

نافذة الحوار نفسها وفيها زر Cancel رمادي وزر Leave أحمر
"Leave without saving?" متبوعة بـ No وYes فخ صغير. هل تعني No: لا، لا تغادر؟ أم: لا، لا تحفظ؟ على اليمين، Cancel هي دائمًا طريق العودة وLeave هي طريق الخروج، فلا يمكن إساءة فهم أي منهما.

Yes وNo تجبران القارئ على مطابقة جوابه مع الجملة. Cancel هي الكلمة العامة الوحيدة التي تستحق البقاء، لأن معناها لا يتغير: تراجع، ولا شيء يحدث. إرشادات Apple تقول الشيء نفسه: تجنب Yes وNo، واستخدم Cancel دائمًا للزر الذي يلغي الإجراء.

الإصلاح 3: سمِّ النتيجة

Submit

ملخص طلب بإجمالي $24.00 وزر أسود مكتوب عليه Submit

Pay $24.00

ملخص الطلب نفسه وزر أسود مكتوب عليه Pay $24.00
Submit تصف ما يفعله النموذج، لا ما يفعله الشخص. Pay $24.00 تذكر الإجراء والمبلغ، فتصبح آخر ضغطة قبل إنفاق المال هي آخر فحص أيضًا.

أفضل نص للزر كثيرًا ما يحمل المفعول به أو المبلغ: Send $50 وCreate Account وView Invoice وSave Draft. وهذا أهم ما يكون في اللحظات التي تكلّف شيئًا، كالدفع أو الإرسال أو الحذف، لأن الزر هو آخر ما يُقرأ قبل الالتزام.

الإصلاح 4: كلمة أو اثنتان

خمس كلمات

زر أحمر عريض مكتوب عليه Yes, Delete My Account Forever

كلمتان

زر أحمر مكتوب عليه Delete Account
نص زر يحتاج إلى جملة علامة على أن نافذة الحوار فوقه لم تؤدِّ عملها. ضع العواقب في النص التوضيحي واترك الزر للإجراء.

النصوص القصيرة تنجو أيضًا من الترجمة والشاشات الصغيرة. زر من خمس كلمات بالإنجليزية يصير أطول في الألمانية أو الروسية ويبدأ بالالتفاف أو القطع. كلمتان تتركان مجالًا للتمدد.

البدائل الستة

بدلًا منقلمتى
OKDeleteبعد "Delete this photo?"
YesLeaveبعد "Leave without saving?"
SubmitPay $24.00في ملخص الدفع
Click HereView Invoiceفي رابط أو زر يفتح شيئًا
ContinueCreate Accountفي نهاية نموذج التسجيل
ConfirmSend $50بعد ملخص التحويل

متى تكون OK صحيحة

تسمح Apple باستخدام واحد فقط: التنبيهات الإعلامية، حيث لا شيء لتقرره ووظيفة الزر الوحيدة إغلاق الرسالة. "Your session has ended" مع زر OK لا بأس بها. أي شيء فيه خيار يستحق فعلًا. وحتى في التنبيه الإعلامي قد تكون كلمة أدق مثل Got It أو Sign In Again أفضل حين تصف الخطوة التالية.

اختبار الخمس ثوانٍ

غطِّ العنوان والنص واقرأ الأزرار وحدها. إذا ظل بوسع الشخص أن يعرف ما سيفعله كل زر، فالنصوص صحيحة. وإذا لم يستطع، فالنص يتكئ على السؤال ليعني شيئًا.

طبّقه على كل نافذة حوار في منتجك، وعلى الإشعارات المنبثقة، وعلى الزر الوحيد في كل نموذج. يستغرق دقائق وهو أرخص تعديل نصي يمكن لفريق أن يجريه. أما للاختيار بين نافذة حوار وورقة سفلية أصلًا، فانظر النافذة المنبثقة مقابل الورقة السفلية.

الأسئلة الشائعة

ماذا يجب أن يقول الزر بدلًا من OK؟

الفعل الوارد في السؤال. نافذة تسأل "Delete this photo?" يجب أن يكون زرها Delete. OK تناسب فقط تنبيهًا يُعلم ولا يطلب قرارًا.

هل استخدام Yes وNo على الأزرار سيئ؟

غالبًا نعم. تجعل الناس يطابقون الجواب مع الجملة ويسيئون فهمه، كما في "Leave without saving?" استخدم فعلًا للإجراء وCancel للتراجع. إرشادات Apple تقول بتجنب Yes وNo في التنبيهات.

هل أستخدم Cancel أم No؟

Cancel. معناها دائمًا التراجع دون أن يحدث شيء. أما No فقد تعني أشياء مختلفة بحسب صياغة السؤال.

كم كلمة يجب أن يحمل نص الزر؟

كلمة أو اثنتان. سمِّ النتيجة، مثل Delete Account أو Pay $24.00، وضع أي شرح في النص التوضيحي أعلاه.

لماذا Submit نص سيئ للزر؟

Submit تقول ما يفعله النموذج، لا ما يحصل عليه الشخص أو ينفقه. نص مثل Pay $24.00 أو Send Message أو Create Account يسمّي النتيجة، والمبلغ حيث يهم.

ماذا تقول Apple عن أزرار OK؟

تقول إرشادات الواجهة البشرية من Apple بتجنب OK عنوانًا للزر الافتراضي ما لم يكن التنبيه إعلاميًا بحتًا، وبتفضيل الأفعال التي تصف نتيجة الضغط.

المصادر

  • إرشادات الواجهة البشرية من Apple، Alerts: عنوان من كلمة أو اثنتين يصف نتيجة اختيار الزر، وأفعال وعبارات فعلية ترتبط مباشرة بنص التنبيه، وOK في التنبيهات الإعلامية فقط، وتجنب Yes وNo، وCancel عنوانًا للزر الذي يلغي إجراء التنبيه. وتقول أيضًا بتجنب OK عنوانًا للزر الافتراضي ما لم يكن التنبيه إعلاميًا بحتًا.
  • نوافذ الحوار وملخص الطلب أعلاه أمثلة من إعدادنا. وعدد الكلمات، بما فيه "Yes, Delete My Account Forever" ذات الكلمات الخمس، محسوب من النصوص المعروضة.
  • نُشر أولًا على شكل كاروسيل على UX Brainy.

Want every button, dialog and error in your product to say exactly what it does? Our team designs app UI and writes the words inside it.

Get Started

More from Brainy Papers

Keep reading