ما هو القرب في تصميم المواقع وكيف يمكنك استخدامه؟

إنه لأمر رائع كيف يعمل العقل البشري. هل تساءلت يومًا عن الطريقة التي يتعامل بها الناس مع عالمهم بصريًا؟

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

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

ما هو القرب في تصميم الويب؟

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

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

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

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

كيف تستخدم القرب في تصميم المواقع؟

مساحة بيضاء

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

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

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

إنشاء تسلسل هرمي مرئي

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

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

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

تحسين فهم المحتوى

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

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

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

لديك تخطيط يمكن مسحه ضوئيًا

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

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

التأكيد على بعض العناصر

التأكيد هو أحد المفاهيم الحيوية القصوى لتصميم تجربة الشخص (UX). إن إعطاء الأسبقية لعوامل محددة أو مادة المحتوى على صفحة الويب هي واحدة من أكبر مسؤوليات مكان غير عادية للمصممين.

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

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

من الجدير حقًا أن نذكر أنه ربما يكون من الصعب التعرف على التفاصيل التي تجذب أكبر قدر من الاهتمام على صفحة الإنترنت. لذلك نشجع على تطبيق برنامج تخطيط الإنترنت لإنشاء نموذج أولي للتخطيط الخاص بك والتحقق من صحته من خلال الاختبار 5-2.

اعرض نموذجك الأولي للأفراد الذين يشكلون جمهورك لمدة 5 ثوانٍ ، ثم اسألهم بعد ذلك ، "ما هي العوامل الأساسية التي قد تتذكرها؟" إذا قاموا باستدعاء التفاصيل (أو العوامل) التي تريدهم أن يروها ، فأنت على ما يرام.

توجيه عين المشاهد من خلال المحتوى

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

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

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

تغليف

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

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

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