نصائح لتصميم موقع متعدد اللغات مع ConveyThis

نصائح لتصميم موقع ويب متعدد اللغات مع ConveyThis: تعزيز تجربة المستخدم والوصول العالمي من خلال استراتيجيات التصميم العملية.
أنقل هذا العرض التوضيحي
أنقل هذا العرض التوضيحي
نصائح تصميم متعدد اللغات

تحتوي العديد من مواقع الويب الآن على العديد من خيارات اللغة حتى يتمكن زوارها من جميع أنحاء العالم من التصفح بشكل مريح. لقد ساعد الإنترنت في جعل السوق تجربة عالمية، لذلك من خلال وجود موقع على شبكة الإنترنت، فقد فتحت أبواب عملك أمام كل شخص لديه اتصال بالإنترنت. ومع ذلك، إذا كانوا لا يفهمون اللغة، فلن يبقوا. موقع متعدد اللغات سهل.

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

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

العلامة التجارية المتسقة

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

لذلك ، يجب أن تظل عناصر التصميم مثل التخطيط وأسلوب العلامة التجارية الخاص بشركتك كما هي عبر جميع اللغات.

هذا هو السوبر من السهل القيام به في WordPress مع ConveyThis ، أن يحدد تماما النص بغض النظر عن الموضوع الذي اخترته (حتى لو كان مخصص!) ويترجم تلقائيا ، حتى لو كنت تعمل مع الإضافات الأخرى.

سيساعدك هذا في الحصول على نموذج عام بنفس المظهر لجميع اللغات ، وبالتالي تجربة المستخدم نفسها.

الصفحة الرئيسية لـ Airbnb تعمل بشكل رائع كمثال ، دعنا نلقي نظرة على النسخة الأسترالية:

متعدد اللغات

وها هي النسخة اليابانية:

BFG3BDujbVIYhYO0KtoLyGNreOFqy07 PiolkAVvdaGcoC9GPmM EHt97FrST4OjhbrP0fE qDK31ka

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

محولات اللغة واضحة

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

يوصى بشدة أن تكون أسماء اللغات بلغتهم الخاصة. "Español" بدلاً من "Spanish" على سبيل المثال ستعمل العجائب. يقوم Asana بهذا ، يحتوي موقعه على مربع منسدل به خيارات اللغة المتاحة.

بدون عنوان 3

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

"اللغات" أفضل من "المناطق"

تجعلك العديد من العلامات التجارية العالمية الكبيرة تقوم بتغيير المناطق لتتمكن من قراءة الموقع بلغتك. هذه فكرة رهيبة تجعل التصفح أكثر صعوبة للزوار. تعمل مواقع الويب هذه على افتراض أنك تتصفح في المنطقة التي تتحدث فيها اللغة ، لذلك تحصل على النص بلغتك ولكن قد لا تحصل على المحتوى الخاص بالمنطقة التي تهتم بها.

الصورة التالية مأخوذة من موقع Adobe على الويب:

vXH8q9Ebaz0bBmsIjXwrrdm FLGBdOQK86pf3A3xU6r BZB0hL5ICjrxSiv67P vOTNbP2pFSp17B530ARONrjgjryMZYqcQl5 WQuEAYvm6LarZbXFsMD9AiSX mEzsJilUu4a

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

mbauMzr80nfc26dg2fEg0md0cxau0Hfp

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

1l3Vpc9jCrtXorq3xIhcXx9cl8L svuH9FBeMcNHNJ4A8j6dgnjXJgkfloLwmWyra1FstnQSvXR8C9ccnAGE Us2dCg4qSqnGzjbxDMx

على سبيل المكافأة ، يمكنك "تذكر" اللغة التي اختارها المستخدم ، لذا فمنذ الزيارة الأولى فصاعدًا لن يضطروا إلى التبديل بعد الآن.

الكشف التلقائي عن الموقع

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

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

عند تصميم موقعك متعدد اللغات، لا تختر بين اكتشاف اللغة تلقائيًا ومحول اللغة، فالأخير إلزامي بينما الأول اختياري.

العلامات ليست بدائل مناسبة لاسم لغة

هناك 21 دولة ناطقة باللغة الإسبانية و 18 دولة ناطقة باللغة الإنجليزية ، وفي الصين ، هناك 8 لهجات أساسية ، لذا فإن الأعلام ليست بدائل رائعة لأسماء اللغات. بالإضافة إلى ذلك ، قد لا تكون العلامات مؤشرات مفيدة لأنها قد تربك أولئك الذين لا يتعرفون عليها.

كن مرنًا مع مساحة النص

قد يكون هذا تحديًا ، لكن لا يمكن إنكار أن الترجمات لا تشغل نفس المساحة مثل النص الأصلي ، فقد يكون بعضها أقصر ، والبعض الآخر قد يكون أطول ، وقد يحتاج البعض حتى إلى مساحة رأسية أكبر!

wsEceoJKThGv2w9Qzxu gim H YPX39kktoHXy4vJcu aanoASp V KDOu90ae7FQpaIia1YKMR0RELgpH2qiql319Vsw

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

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

موقع Flickr متعدد اللغات ، فلنلقِ نظرة على زر "العروض" الأصلي:

mi0VUOKft9BUwkwgswENaj31P2AhB2Imd8TxbekEY3tDB FbkUj14Y2ZkJEVC9Cu kifYc0Luu2W

تبدو رائعة ، كل شيء رائع ، لكن "المشاهدات" تبين أنها كلمة أطول في اللغات الأخرى ، وتتطلب مساحة أكبر.

FParMQU h2KHVVvEMwFqW6LWDN9IF V89 GlibyawIA044EjbSIFY1u4MEYxoonBzka6pFDyfQztAoreKpsd33ujCAFjPj2uh EtmtZy2l

في الإيطالية يتطلب مساحة أكبر بثلاثة أضعاف!

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

توافق خطوط الويب وترميز مواقع الويب

وفقًا لـ W3C ، يوصى بشدة أن تقوم بتشفير صفحة الويب الخاصة بك باستخدام UTF-8 ، والذي يسمح بالحروف الخاصة.

الأمر بسيط جدًا ، إعلان UTF يبدو هكذا

fbnRHXPPyY2OPijzOvFkH0y كه

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

تم التقاط الصورة التالية من Google Fonts ، وكما ترى ، يمكنك اختيار تنزيل أي إصدارات البرامج النصية التي تحتاجها. تلك اللغات التي تحتوي على عدد أكبر من الأحرف تعمل على إنشاء ملفات خطوط أكبر ، لذا ضع ذلك في الاعتبار عند اختيار الخطوط وخلطها.

tqld4w0nWjQGM9wtgp14c lhZSHppXp rYBRGFVjGTTcs8ghcedYxQUBqqWHLnt9OgAY 0qbDnNpxlclU

فيما يتعلق باللغات من اليمين إلى اليسار

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

هذا هو تصميم Facebook للغات من اليسار إلى اليمين ، مثل الإنجليزية.

T538ZEA t77gyTvD EANq7iYfFuZEpJdCNZSqODajCjtiSQFk0Dyii ZVWBXy0G3gAaTKFFYDJ LjK4czPyFPbrIpV2

وهذا هو التصميم المعكوس للغات من اليمين إلى اليسار ، مثل العربية.

EVTgCyVWk1ncmoRJsUrQBPVs6yF Et1WGOdxrGcCYfD5o6QVXSPHR16RamvBSIOLcin3qlTmSBZGyuOI7izJ6DlTo3eeFpU rQchvaz332E5dsCl9RT

انظر عن كثب ، لقد انعكس وضع كل شيء في التصميم.

راجع مقالة Robert Dodis حول تصميم اللغات من اليمين إلى اليسار للحصول على مزيد من المعلومات حول كيفية القيام بذلك.

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

اختر الرموز والصور المناسبة

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

فيما يلي مثال على صورة كان لا بد من استبدالها لأنها لم تكن مناسبة ثقافيًا. يرجى ملاحظة أنه لن تكون كل الصور مسيئة للآخرين ، فربما تولد اللامبالاة عندما تريد أن يكون الناس فضوليين ومهتمين بمنتجك.

هذه هي الصفحة الرئيسية لكلارين للغة الفرنسية ، وتظهر امرأة قوقازية. وها هي النسخة الكورية مع امرأة كورية سفيرة للعلامة التجارية.

I0XpdO9Z8wCAyISgVJtZVhwOOehAR1BYLkEKpzL1Cw7auye4NVvt7S YIgE30VXOxYqOXilRDqLAMyJzCJc tecDWVsRpE4oyyj9QFvOB0sKQNA0

نوع المرئيات التي قد تسيء إلينا هي تلك التي قد تبدو بريئة من بعض الثقافات ، لكنها في نظر ثقافة مختلفة تعرض سلوكيات غير قانونية أو محظورة ، على سبيل المثال ، تصوير المثلية الجنسية أو تمكين المرأة.

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

TsA5aPbhznm2N vv qL
(مصدر الصورة:سرقة الكيوي)

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

على سبيل المثال ، هذه الأيقونات الثلاثة التي تصور الأرض ، أولها صُمم للجمهور الأسترالي ؛ والثاني للجماهير الأفريقية. والأخير مناسب لجمهور أكبر وعالمي حيث لا توجد منطقة معينة مميزة.

cx90RYDHGTToOiC umNKG9d8QM JDZzP0SFaSBobQduZ14CZwpuuKrgB1eUothyoAHsoxd77nQVgvnaocQm3oW R6X3bRxeHdjJ

أخيرًا وليس آخرًا ، يمكن لـ ConveyThis ترجمة أي نص ، طالما أنه غير مضمن في صورة. لن يتمكن البرنامج من تحديد ما هو مكتوب عليه ، لذا سيبقى باللغة الأصلية ، لذا تجنب تضمين النص.

اختيار الألوان

كما ذكرنا في القسم السابق ، تفسر الثقافات الصور بشكل مختلف ويحدث نفس الشيء مع الألوان. معانيها ذاتية.

على سبيل المثال ، في بعض الثقافات ، اللون الأبيض هو لون البراءة ، لكن البعض الآخر قد يختلف ، إنه لون الموت. يحدث الشيء نفسه مع اللون الأحمر ، في الثقافات الآسيوية يتم استخدامه في الاحتفالات ولكن في بعض البلدان الأفريقية ليس له دلالة إيجابية لأنه مرتبط بالعنف.

ومع ذلك ، يبدو أن اللون الأزرق هو الأكثر أمانًا من بين جميع الألوان ، ويرتبط عادةً بالمعاني الإيجابية مثل الهدوء والسلام. تستخدم العديد من البنوك اللون الأزرق في شعاراتها لأنه قد يعني أيضًا الثقة والأمان.

توضح هذه المقالة الاختلافات في معاني الألوان في جميع أنحاء العالم ، وهي مفيدة جدًا لبدء البحث عن أفضل الألوان لموقعك متعدد اللغات.

تعديلات التنسيق

ضع في اعتبارك تجنب استخدام الأرقام فقط عند كتابة التواريخ لأن هناك العديد من الطرق المختلفة لكتابتها ، في الولايات المتحدة يكون التنسيق الرسمي هو mm / dd / yyyy وإذا كان بإمكانك فقط رؤية الأرقام بعض المستخدمين من البلدان الأخرى الذين يستخدمون أنظمة مختلفة (مثل dd / mm / yyyy). لذا فإن خياراتك هي: التأكد من أن النسخ المترجمة لها تنسيق التاريخ الذي تم تعديله أو كتابة الشهر بأحرف بحيث يقوم ConveyThis دائمًا بكتابة التاريخ الصحيح.

علاوة على ذلك ، أثناء استخدام النظام الإمبراطوري في الولايات المتحدة ، تستخدم معظم البلدان النظام المتري ، لذلك ستحتاج إلى تحديد ما إذا كان من المناسب لموقعك تغيير القياسات.

أفضل مكون إضافي للترجمة لـ WordPress

هناك العديد من الخيارات عندما يتعلق الأمر بإضافة مكون إضافي للترجمة إلى موقع WordPress الخاص بك ولا تعمل جميعها بنفس الطريقة ، وستختلف النتائج. مع Convey - هذا يضمن لك التكامل المثالي بغض النظر عن تصميم موقع الويب الخاص بك.

هذا هو الخيار الأفضل لترجمة مواقع الويب مع 92 لغة متوفرة. إنه مكون إضافي موثوق به في WordPress سيسمح لك بالحصول على إصدار قوي متعدد اللغات من موقع الويب الخاص بك بسرعة. يمكنه فهم تصميم الموقع والكشف عن كل النص وترجمته. يتضمن ConveyThis أيضًا محررًا بديهيًا لتخصيص النص.

يتضمن هذا زرًا لمحوّل اللغة بحجم واحد يناسب الجميع والذي يعمل مع أي موقع افتراضيًا ، ولكن يمكنك أيضًا تعديله بقدر ما تريد. نتبع أيضًا مبادئ التصميم المذكورة في هذه المقالة:

  • علامة تجارية متسقة في جميع إصدارات الموقع باللغات.
  • مسح محوّل اللغة وخيار اختيار اللغة المفضلة.
  • يتم تشفير مواقع الويب باستخدام UTF-8 تلقائيًا.
  • واجهات مناسبة للغات من اليمين إلى اليسار

ConveyThis: حل موقع متعدد اللغات يمكنك الوثوق به

ويعتقد عادة أن ترجمة الموقع هو عملية معقدة. ولكن ليس هناك حاجة لتأجيل ذلك لأنك لا تريد التعامل مع الصداع. انها ليست شاقة على الإطلاق! مع ConveyThis ، يصبح تحويلًا مباشرًا. إنه سلس وسريع.

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

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

التعليقات (4)

  1. النهاية في الأفق لجوجل ترجمة لمواقع الويب! – ConveyThis
    8 ديسمبر 2019 الرد

    [...] النص المتعلق بالحاسوب في اللغة السويدية. ساعدت عناصر مثل هذه فريق التصميم على صياغة مسار للعملاء الذين يزورون النظام الأساسي ، لتجربة ترجمة سهلة وتجنب فهرس التمرير المنسدل كما كان سابقًا [...]

  2. محرك بحث عالمي الأمثل لجميع منصات اللغة - ConveyThis
    10 ديسمبر 2019 الرد

    [...] تتم صياغة الأفكار حول النظام الأساسي متعدد اللغات وقاعدة العملاء ، فيما يلي نظرة على المكون النصي للغة [...]

  3. تحويل WooCommerce متعدد اللغات - ConveyThis
    19 مارس 2020 الرد

    [...] والحصول على اللغوي من فريق ConveyThis لإلقاء نظرة وتحريرها حتى تتمكن من التأكد من أن صياغة ولهجة مناسبة لقيم متجرك و [...]

  4. كيف للتخصيص هو WooCommerce؟ – ConveyThis
    23 مارس عام 2020 الرد

    [...] أن العناصر المرئية دائمًا ما تكون محملة جدًا بالمعنى الثقافي ، ولدى الجماهير المختلفة توقعات مختلفة حول كيفية عرض المتاجر [...]

اترك تعليق

لن يتم نشر عنوان بريدك الإلكتروني. الحقول المطلوبة محددة*