كيفية استخدام الرصيد في تصميم الويب
إن تحقيق التوازن في تصميم الويب يتطلب بعض التفكير والجهد والمهارة ، لكنه يستحق كل هذا العناء. إن الشيء العظيم في التوازن ، والذي يمكن تطبيقه على فئة التصميم الأوسع ككل ، هو أنها تحافظ على ما تخلقه من فوضى مفرطة ومفرط في التحميل تخفق في تقديم تجربة المستخدم. بعبارة أخرى ، يتأكد التوازن في تصميم الويب من أنك تصرّف كمصمم تمامًا لوضعية الاعتدال. ليس كثيرا ، ولكن ليس قليلا جدا. لا صاخبة جدا ، ولكن ليس دقيق جدا. إنها تحافظ على تصميمك بالكامل في وئام بينما لا تزال تصيب جميع أهداف الاستخدام الخاصة بعملائك. الآن هذه مهارة لوضع بالتأكيد في مربع أدوات المصمم الخاص بك! في هذه المقالة ، سننظر في كيفية دمج التوازن الجيد في مواقع عملائك.
توازن متماثل
أحد الأمثلة الأكثر شيوعًا للتوازن الذي تواجهه عند تصفحك لمواقع الويب هو التناظر ، على الرغم من أنك قد لا تدرك ذلك ، لأنه تم عرضه بسلاسة. التماثل هو إرضاء للعين بالفطرة ، ويخلق تصميمًا منظمًا بشكل جيد من الناحية الجمالية والمتناغمة. يتم تعريف التوازن المتماثل عن طريق وضع عناصر متساوية على جانبي المحور المركزي الأفقي أو الرأسي. بعبارة أخرى ، كلا جانبي خط الغطس الخيالي في منتصف الصفحة هما بشكل أساسي صوران متطابقة لبعضهما البعض. في حين أن بعض النقاد قد يشطبون هذا النوع من التوازن على أنه ممل أو متوقّع ، إلا أنه رغم ذلك صمد أمام اختبار الزمن ويبقى أحد أفضل الطرق لإظهار التوازن في تصميم الويب.
موقع سيسكو اختارت الذهاب لهذا النهج المجرب والاختباري والحقيقي للتصميم. لاحظ كيف يتوازن الموقع تمامًا عبر المحور الرأسي. إذا اتخذت خطًا وهميًا وقسمته إلى أسفل الصفحة الرئيسية لـ Cisco ، فستلاحظ ما يلي:
- نفس عدد العناصر في شريط التنقل (بما في ذلك رمز البحث) على كلا الجانبين
- العنوان الرئيسي و subheadline متساويان في كلا الجانبين
- تم توسيط زر الحث على اتخاذ إجراء تمامًا
- نفس العدد من العناصر تحت عنوان "المهام السريعة" على كلا الجانبين
في حين أن الموقع قد لا يكون الموقع الأكثر إثارة على الإطلاق ، فإنه لا يجب أن يكون ذلك منذ أن تبيع الشركة معدات الشبكات. بالإضافة إلى ذلك ، الموقع قابل للاستخدام والوظيفية ، كلا الصفات التي يمكن أن يقدّرها عملاؤه. دعونا ننظر إلى أمرين آخرين للتناظر:
IWC شافهاوزن ، صانع الساعات السويسري ، لديه موقع يتميز بتوازن أفقي متناسق. إذا قسمنا الصفحة عبر محور مركزي إلى أسفل ، فإن كلا الجانبين يمتلكان التناظر.
الشيء نفسه ينطبق على موقع Beanstalk App . يتميز التصميم المركزي البسيط بتصميمه البسيط ، ويمر محوره الأوسط في منتصف الصفحة الرئيسية ، مما يترك نصفين من الصفحة مع ميزان أفقي متماثل.
التوازن غير المتماثل
التناقض القطبي للتماثل ، التوازن غير المتماثل ممكن أيضا. لا تنخدع بحقيقة أن اللاتناسق يعني عدم وجود تكافؤ بين الأجزاء! كما سترى قريبًا ، يحقق التوازن غير المتماثل نظامًا من الأثقال الموازنة في التصميم أيضًا ... ليس بالطرق التي قد تتوقعها. يمكن تمثيل عدم التماثل بعدد من الطرق على صفحة الويب. على سبيل المثال ، يمكن لنصف الشاشة ، رأسيًا أو أفقيًا ، أن يتباهى بعنصر أكثر قوة بينما قد يكون للنصف الآخر عناصر أكثر دهاءً. وعلى الرغم من عدم المساواة هذه ، سواء في القوة أو الأعداد ، فإن التوازن ينشأ من خلال تجاور العناصر المتناقضة. بهذه الطريقة ، يمكن أن يكون التباين جميلا حقا ، وربما أكثر من التماثل الواضح ، لأنه يلعب على مفهوم الاختلاف لخلق التوازن. هذا هو التناقض في التصميم ، لكنه يعمل بشكل جيد على أي موقع. التوازن غير المتماثل هو بالتالي أكثر إثارة للاهتمام وأكثر إثارة للتفكير من التماثل يمكن التنبؤ به. تستحضر مواضيع الحداثة والطاقة والعجب. على المصممين أن يلاحظوا ، مع ذلك ، أن خلق عدم التماثل في الصفحة يتطلب عملاً أكثر من التناظر المنتظم. بعد كل شيء ، عليك أن تمثل العلاقات بين عناصر التصميم الأكثر تعقيدًا.
هوندا يعطينا مثال واضح وضوح الشمس على عدم التماثل في تصميم الويب. في الجزء السفلي من الصفحة ، تستخدم الشركة تصميمًا قائمًا على البطاقة ، ولكن هذا ينتج شكلاً غير منظم إلى حد ما ، في حين أنه جذاب وملون بشكل مرئي ، يؤدي إلى نقص في المساواة على جانبي المحور المركزي الأفقي أو الرأسي. فمن ناحية ، تكون البطاقات نفسها دائمًا أطوالًا مختلفة ، أفقًا ، وفشل في التكدس دائمًا في أي عمود أو صف موحد. هذا يخلق عدم تناسق كبير مثير للاهتمام للنظر فيه. انها تقريبا مثل متاهة صغيرة على الصفحة الرئيسية لشركة السيارات! هناك أيضًا أمثلة أخرى مثيرة للاهتمام:
Typographisme هي حالة مثالية لعدم التماثل في تصميم الويب. يحتوي موقعها على عنصرين غير متوازنين. كل من شعار TG والختم الأخضر في اليمين ، الزاوية العليا يخلقان عدم التماثل.
نسخ مكررة "عدم التماثل هو أكثر وضوحا. ويفتخر موقعها بتصميم العناصر العائمة التي لن تصطف بشكل متناسق مع النصف الآخر ، سواء كان المحور المركزي عموديًا أو أفقيًا. وعموما ، فإنه يعطي مظهرا لافتا للنظر من المثير للاهتمام أن تأخذ فيه.
توازن نصف قطري
التوازن الشعاعي بسيط جدا. كما يوحي الاسم ، يحدث التوازن الشعاعي عندما تنبثق جميع عناصر التصميم على صفحة في نقاط متساوية من نقطة مركزية موحدة. لذا إذا كنت تقسّم الصفحة رأسياً أو أفقياً على طول المحور المركزي ، فإن عناصر الجانبين ستكون بنفس القدر أو قريبة من النقطة المركزية. بعض الأمثلة الأساسية للتوازن الشعاعي هي أشياء مثل أشعة الشمس القادمة من نقطة مركزية أو بركة تحتوي على مجموعة من التموجات على سطحها. ما يجعل هذا الشكل من التوازن أكثر خصوصية هو أن تأثير الإشعاع يسير في كلا الاتجاهين: تماما كما أن الاهتمام ينطلق من النقطة المركزية ، فإنه يؤدي أيضا إلى ذلك بسبب المركز المشترك. وبسبب هذا ، فإن الحفاظ على نقطة محورية أمر سهل.
أفضل مثال على التوازن الشعاعي - وهو أمر نادر للغاية على مواقع الويب ، وخاصة الصفحات الرئيسية - هو مدونة فيديو . إنه مثال للتوازن الشعاعي ، حيث أن كل شيء يشع إلى الخارج من النقطة المركزية للنوع الأبيض "Vlog.it".
كل أنواع التوازن
الآن ، يجب أن يكون من الواضح أن جميع أنواع التوازن لديها بعض الروابط المشتركة. هناك عوامل موحدة تظهر باستمرار في أي تصميم تتميز بتوازن جذاب ومثير للاهتمام. التوازن في تصميم الويب هو من حولك. من المحتمل أنك أهملت تقديره على جميع المواقع المختلفة التي قمت بتصفحها طوال حياتك. ولكن هذا فقط لأن التوازن ليس هو أول ما تفكر به عند التنقل في أي موقع. ومع ذلك ، فإن التوازن مهم لتصميم الموقع. إنه لا يوفر فقط لمسات جمالية مثيرة للاهتمام من وجهة نظر بصرية. كما أنه يمكن أن يساعد على تجربة المستخدم من خلال جعل المعلومات المرئية على الموقع أسهل في استيعابها ، وهذا لا يعني شيئًا لتحسين التنقل في الموقع أيضًا. يمكن للمصممين السعي لتحقيق توازن أفضل في تصميم الويب الخاص بهم عن طريق إيلاء المزيد من الاهتمام الوثيق للانسجام والأثقال الموازنة والمقاومة البينية. النتيجة النهائية للتوازن الجيد تدفع أرباحًا لا حصر لها لعملائك وتجربة المستخدم.