التخطي إلى المحتوى الرئيسي
pdf?stylesheet=default
Blackboard Help

أفضل الممارسات: تخصيص علامة تجارية

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

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

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

file:ar-sa/Learn/Sandbox/ar-sa/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/easy.png صفحة تسجيل الدخول المخصصة وصفحة المدخل

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

صفحة المدخل -  - صفحة المدخل هي أول صفحة ويب يراها المستخدمون عند وصولهم إلى Blackboard (ما لم يتم تجاوز هذا الإعداد). يمكنك إضافة رسالة ترحيب مخصصة وصورة بالإضافة إلى إضافة وحدات نمطية تحتوي على معلومات مهمة وفي حينها. ويتطلب إنشاء وحدات نمطية مخصصة وجود خبرة في HTML و CSS. لمعرفة المزيد، يرجى مراجعة الوحدات النمطية وتخصيص صفحة المدخل.

أفضل الممارسات في تصميم صفحة المدخل

عادة ما تكون صفحة المدخل كصفحة "المؤسسة الخاصة بي"، هي أول صفحة سيراها المستخدم عند دخوله Blackboard Learn. وقد يؤدي الأهتمام بتصميم وترتيب محتوى الوحدة النمطية على هذه الصفحة إلى تعزيز علامتك التجارية وتحسين تجربة المستخدم. ويمكنك تحقيق ذلك في خطوتين من الخطوات العامة:

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

لا تختص أفضل الممارسات الأخرى التي تُستخدم في تصميم صفحة المدخل بنوع هذه الصفحة، لكن تتضمن تلك النوعيات التي أخذتها في الاعتبار بالفعل عند تحديد شكل "العلامة التجارية" ومضمونها.

إمكانية الوصول

  • استخدم معدلات تباين يمكن الوصول إليها (http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html)
  • اجعل النص قابلاً للقراءة باختيار أشكال الخط والأحجام وارتفاعات الخط
  • تجنب استخدام صور للنص
  • تجنب الخلفيات المنقوشة
  • تأكد أن الارتباطات تحمل أسماء ذات مغزى بدلاً من "النقر هنا"
  • ضّمن الارتباطات في W3C وصفحات إمكانية الوصولالخاصة بنا

علم الجمال

  • استخدم الألوان التي تتطابق مع "العلامة التجارية" والشكل
  • اجعل شكل الخط قابلاً للقراءة
  • استخدم رسومات عالية الجودة
  • رتب الوحدات النمطية بحيث تملء الصفحة
  • أنشئ تدرج هرمي مرئي بحيث يسهل الإطلاع على المحتوى
  • تجنب التخطيط/المحتوى المزدحم، الضوضائي المكتظ للصفحة
  • حدث محتوى الصفحة بشكل دوري
  • إذا أمكن، طبق تقنيات "تصميم الاستجابة" بحيث يتم تغيير حجم المحتوى حسب الحجم المناسب لشاشات العرض (http://en.wikipedia.org/wiki/Responsive_web_design)

تلميح

  • إذا شعرت بالتقيد من قبل تخطيط الوحدة النمطية الافتراضي لـ Learn، فاعمد إلى تحرير صفحة المدخل لكي تستخدم عمود واحد مليء بوحدة نمطية واحدة (وواحدة فقط) لـ html. ويمكنك تحرير HTML المخصص في وحدة نمطية واحدة لكي تستخدم أي مخطط ترغب فيه، لكي تحاكي الاتجاهات الموجودة في صفحات الفهرس الأخرى.

file:ar-sa/Learn/Sandbox/ar-sa/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/sort-of-easy.png عناصر تحكم GUI

عناصر التحكم بـ GUI - يمكنك التحكم بسهولة في تغيير شكل العلامة التجارية ومضمونها بتحديد مجموعة من الالوان وخيارات التخطيط الخاصة بتثبيت Learn. يمكنك:

  • تغيير لون مجموعة محددة من عناصر واجهة المستخدم
  • تحديد صورة شعار وارتباط لعنوان URL محدد
  • تحديد خيارات التخطيط وألوان علامة تبويب النظام.

أنت لست بحاجة إلى وجود أية معلومات لـ HTML أو CSS لإجراء هذه التغييرات. ويمكنك رؤية تحديداتك من خلال جزء المعاينة قبل إجراء تغيير واسع على مستوى النظام. ويمكن حفظ كل تحديدات ألوانك كـ"لوح الألوان".

file:ar-sa/Learn/Sandbox/ar-sa/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/middle.png لوح الألوان وشكل النظام

لوح الألوان - يأتي Blackboard Learn مع أكثر من اثنتي عشرة لوح ألوان. ويمكنك تحديد لوح من ألواح الالوان هذه لعلامتك التجارية الافتراضية. ويمكنك تغيير الألوان في اللوح باستخدام واجهة المستخدم أو يمكنك تنزيل اللوح وإجراء التغييرات باستخدام أداة تحرير CSS أو تحرير النص. 

شكل النظام  - يُعد شكل النظام هو طبقة CSS التي تحدد شكل مؤسستك ومضمونها. ويمكنك تحديد الشكل الذي تم تزويده من قبل Blackboard Learn أو تصميمه بنفسك. ويُعد تنزيل شكل موجود لاستخدامه كقالب أسهل الطرق لإنشاء الشكل الخاصة بك. قم بإجراء تغييراتك باستخدام أداة تحرير CSS أو تحرير النص. 

file:ar-sa/Learn/Sandbox/ar-sa/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/complex.png لوح الألوان المخصص

لوح الألوان المخصص - وسع نطاق تخصيص واجهة المستخدم بإنشاء لوح الألوان الخاص بك ليطابق مخطط ألوان وشعار والعلامة التجارية لمؤسستك. يشتمل Blackboard Learn على ألواح ألوان متعددة تطبق ألوان مختلفة على النظام. ويمكنك تحرير لوح ألوان موجود ليطابق متطلباتك الخاصة.

أفضل الممارسات في تصميم لوح الوان مخصص

عند تحديد الألوان للوحك المخصص تذكر بضعة عناصر من أفضل الممارسات هذه.

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

file:ar-sa/Learn/Sandbox/ar-sa/Learn/9.1_SP_12_and_SP_13/Administrator/180_User_Interface_Management/040_Brands_and_Themes/Best_Practice_Customizing_Brand/most-complex.png شكل النظام المخصص

شكل النظام المخصص - يمكنك تحويل واجهة المستخدم الخاصة بتثبيت مؤسسة Learn بالكامل بإنشاء شكل نظام مخصص. وتُعد هذه الطريقة هي أكثر الطرق من حيث التكلفة والتعقيد، مما يتطلب مراجعة وتحرير أكثر من 12000 سطر من التعليمات البرمجية. فهو يُعد أفضل خيار لمطابقة واجهة مستخدم Blackbaord Learn بالهوية المرئية لمؤسستك، لكنه يتطلب اختبارًا مستمرًا لكل إصدار جديد لـ Learn.

أفضل الممارسات في تصميم شكل نظام مخصص

"تصميم شكل النظام المخصص" هو عبارة عن مشروع كبير ولا يمكن اعتباره مشروع جانبي. وستحتاج إلى وجود خبرة معينة في CSS و DOM. بالإضافة إلى ذلك، ستحتاج إلى وجود بيئة متطورة لتطوير الشكل واختباره وصيانته.

  • الألوان - ابحث عن الهوية البصرية لمؤسستك. والفرص تتمثل في وجود دليل أنماط لمؤسستك يتضمن قسمًا من ألوان العلامة التجارية للمؤسسة. وتأكد من ترجمة اختيارات تركيبة الألوان لمخطط ألوان مناسب للاستخدام في واجهة المستخدم.
  • تناغم الألوان - إن الفهم العام لمخططات الألوان الأحادية والمماثلة والمتممة يؤدي إلى تحديد الألوان التي تنسجم معًا مع ألوان العلامة التجارية لمؤسستك.
  • متطلبات إمكانية الوصول  - يُعد الإطلاع أمر هام جدًا لضمان وجود التباين بشكل كافٍ في شكل النظام الناتج ويمكن الوصول إليه (http://www.w3.org/TR/WCAG/)
  • الخطوط - يمكنك تحديد خطوط مختلفة لعلامتك التجارية. اختبر الخطوط للتأكد من أنه يمكن عرضها في أنظمة تشغيل مختلفة. ويمكنك أيضًا تقديم خطوط مخصصة بتضمينها مع الشكل الخاص بك والرجوع إلى هذه الخطوط باستخدام قاعدة @font-face. وتأكد من إمكانية دعم الخطوط المخصصة للغات التي تقوم بتدريسها.
  • الرموز - يمكنك إعادة تصميم رموز معينة واستخدامها في التطبيق كصور للخلفية.

تغيير الإدارة للعلامة التجارية المخصصة

عند تقييمك لترقية ما واختبارها من المهم جدًا تنزيل أية تخصيصات في حال احتياجها إلى استعادة. استخدم الأداة Theme DIFF لمقارنة تغييرات CSS من إصدار واحد من Learn إلى الآخر. ستسهل هذه الأداة من اكتشاف المكان الذي أجريت فيه التغييرات في CSS بحيث يمكنك تقييم مدى تأثير هذا على عمليات التخصيص التي تقوم بها. 

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

أشكال نظام مخصصة وتثبيت Building Blocks الجديدة

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

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

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

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

علامات تجارية مختلفة لتثبيت Same Learn

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