كيفية استخدام المساحات السلبية لإنشاء مواقع مذهلة

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

اشترك في قناتنا على اليوتيوب

ما هو الفضاء السلبي؟

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

أمثلة على الفضاء السلبي

المساحة السلبية - ونظيرتها ، المساحة الإيجابية - في جميع أنواع الفن والتصميم ، بما في ذلك تصميم الويب. لنلق نظرة على شعار FedEx. ترى حروفًا أرجوانية وبرتقالية ، أليس كذلك؟ هناك سهم هناك ، رغم ذلك ، في المساحة البيضاء:

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

الطاووس NBC يفعل نفس الشيء:

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

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

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

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

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

أنواع الفضاء السلبي

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

Micro مقابل Macro Negative Space

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

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

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

النشط مقابل الفضاء السلبي السلبي

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

وإليك مثال على الفضاء السلبي السلبي:

الفضاء السلبي والتكوين

المساحة السلبية مهمة للتكوين لعدة أسباب:

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

اختيار التوازن الصحيح للمساحة السلبية والإيجابية

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

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

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

ترتيب المواقع ذات النص الثقيل بمساحة سلبية

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

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

على الرغم من أن العناصر الموجودة في HostingDude قريبة من بعضها البعض ، إلا أن العناصر الموجودة على موقع New York Times تبدو موحدة أكثر بفضل المساحة الإضافية بينها. يسهل على العين فهم الصفحة ، مما يمنحها تصميمًا أكثر اكتمالًا وتماسكًا. عندما تتاح للعين الفرصة للراحة ، فإنها تكون قادرة على استيعاب ما تراه بشكل أفضل. الفضاء السلبي يعتقد أن الأقل هو الأكثر.

تفكيك النص بمسافة سلبية

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

شرح نقطة الفضاء السلبي للعملاء

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

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

تغليف

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

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

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

تصميم موقع سفر؟ من المحتمل أنك ستستخدم مساحة كبيرة من الماكرو. تحقق من تقريرنا حول سمات Divi Child لمواقع السفر.

صورة مميزة عبر StockVector / Shutterstock.com