في تصميم المواقع : الأقل .. أفضل !

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

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

الأقل .. أفضل

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

 

تنازل عن الأشياء الغير ضرورية

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

 

إختزل حتى النهاية

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

 

كل التفاصيل مهمة

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

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

– جعلنا عمق التصفح في الموقع هو مستوى واحد بدءاً من الصفحة الرئيسية ، أي لا صفحات فرعية من الصفحات الفرعية .

– نظمنا المحتوى في 5 أقسام ، كل قسم في قائمة لا تحتوي على أكثر من 5 عناصر.

– تلوين القسم و الصفحة التي يتواجد بها الزائر لكي يعرف في أي جزء من الموقع يتصفح.

– عنوان الصفحة مع وصف مختصر لها بحجم H1 في أعلى الصفحة و لا يجاورها شيء

– صورة معبرة مريحة للعين و ليست ملفته جداً كي لا تشغل الزائر

– محتوى موجه ، لا عبارات رنانه او تسويقية مبالغ فيها

– بيانات الإتصال بالمؤسسة موجودة في جميع صفحات الموقع بدون إستثناء

– مساحات بيضاء كبيرة لراحة العين و توزيع التصميم

– وصف بجانب كل حقل من حقول النماذج (الحقول التي قد يصعب فهمها)

تصميم المواقع

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

 

لوّن بالحد الأدنى

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

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

 

المساحات البيضاء

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

 

أخيراً ، كل ما سبق ذكره هو مجرد مبادئ عامة لمدرسة من مدارس التصميم (التبسيط للحد الأدنى) و لكن الذوق الشخصي يلعب دور كبير هناً ، فما قد تراه مناسب قد لا يراه الآخرون كذلك 🙂

  • Ahmed

    احس أن الأمر اتخذ شكل الدعايا للشركة أكثر من انه مقاله توعية

    • ريان العسيري

      أحسن الظن يا أخي و قدم للكاتب لو كلمة شكر ، تركت كل المادة العلمية في المقالة و مسكت في ذكره لإسم المؤسسة ؟

      شكراً اخي ناصر و جزاك الله عنا خير الجزاء

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

  • تم تطبيق كثير من هذة الارشادات المهمة في تصميم مدونتي
    مقالة مميزة
    شكرا

    • SALMAN

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

      جرب اللون الأبيض أفضل

      • اللون الاحمر ما هو الا خلفية للير المضافة والتي تجعل اللون نبيتي فاتح
        في السنة المقبلة سوف نراعي استخدان الالوان الفاتحة لارضاء المزيد من الزوار
        شكرا

      • الأخ الكريم بانوراما
        صدقني الخلفية الحمراء غير مناسبة ومزعجة
        راجع مقالة الأخ مشهور الدبيان هنا
        http://uxfix.com/2009/08/22/tip-using-colors-red-yellow-and-green/

  • أشكرك على هذه المقالة ..

    ألم تبالغوا قليلاً في الإكثار من المساحات البيضاء هنا ؟
    http://www.ds.com.sa

  • زهير الصدر

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

  • الحامدي

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

  • بدر بدر

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

  • شكرا مقال اكثر من رائع

  • ابو محمد

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

  • disqus_eNvjZlit3C

    ياناصر الناصر

    اولا كيف تقدم استشارة لشركة انت تملكها

    وهذه الدعاية بالاسلوب الرخيص ليس مستغرب على امثالك

    فانت وشركتك صاحب اكبر عملية نصب وسرقة وانا واحد منهم وهي الموقع الشامل منتدى مدى الحياة ومدونة واستضافة

    وفعليا تعمل لايام فقط ويتوقف الموقع والمدونة ايضا ولا دعم بعدها مع ان الاتفاق دعم سنة ولكن

    اعلم اننا في دار التحصيل وغدا دار الوقوف اما الجبار العادل

    وسوف تندم على كل ريال اخذته في غير وجه حق

    حسبي الله عليك ونعم الوكيل

  • amal

    موضوع رائع وقيم جزاكم
    الله خيرا

    شركة تصميم مواقع |شركة استضافة مواقع

    |تصميم مواقع

    http://www.e-daama.blogspot.com

  • شكرا لك … واعتقد ان الصفحات العربية باتت اليوم تحمل لمسات ابداعية وهناك الكثير من الأمثلة التي تطبق هذا النموذج الي انني اعيب عليها صغر حجم الخط … واعتقد ان ذلك يتنافي مع هذه النوعية من التصميم .. الا تتفق معي ؟

تعليقات عبر الفيسبوك