الخطايا السبع المميتة في تصميم الويب التي ستقضي على مستقبلك كمصمم!!
لاحظت الكثير من الأخوة مؤخرا يشاركون تصميماتهم فأردت أن أعطيهم بعض الملاحظات للتطور أكثر.
لتصبح مصمم ويب محترف هنالك خطايا سبع مدمرة عليك تجنبها بشكل كامل وإلا قل وداعًا لموقعك ومسيرتك المهنية !
لاحظت الكثير من الأخوة مؤخرا يشاركون تصميماتهم فأردت أن أعطيهم بعض الملاحظات للتطور أكثر.
لتصبح مصمم ويب محترف هنالك خطايا سبع مدمرة عليك تجنبها بشكل كامل وإلا قل وداعًا لموقعك ومسيرتك المهنية !
⬅️1- اللون الرمادي على خلفية بيضاء
موضة جديدة في لتصميم انتشرت في السنوات الأخيرة ويعتبرها العديد أنها محزنة جدًا في الواقع: استخدام لون رمادي فاتح للنص على خلفية بيضاء اللون.
موضة جديدة في لتصميم انتشرت في السنوات الأخيرة ويعتبرها العديد أنها محزنة جدًا في الواقع: استخدام لون رمادي فاتح للنص على خلفية بيضاء اللون.
في بعض الأحيان يسبب ضعف تباين الألوان عند جمعه مع المحارف الصغيرة مشكلة لمن يعانون من مشاكل في الرؤية، مما يجعل القراءة الصفحة أو الكلام فيها غير مريح حتى بالنسبة للأشخاص الذين يكون نظرهم 10 على 10!
في الحقيقة السبب وراء استخدام النص الرمادي هو فكرة نبيلة أخرى، ألا وهي أن زيادة التبياين قد تسبب اجهادًا للعين، هذا صحيح لكن المهم أن تصل للتباين الصحيح للألوان، وهو ما بين التباين الشديد للأسود والأبيض والتأثير الشبحي للرمادي على أبيض الذي يظهر كالضباب.
⬅️ 2-النوافذ الشرطية
النوافذ الشرطية أو Modals تمثل رعبًا بالنسبة لتجربة المستخدم، وقد اجتاحت الويب في السنوات الأخيرة، مضيفةً الواجب الروتيني لإغلاق نافذة منبثقة إلى عملية زيارة العديد من المواقع.
النوافذ الشرطية أو Modals تمثل رعبًا بالنسبة لتجربة المستخدم، وقد اجتاحت الويب في السنوات الأخيرة، مضيفةً الواجب الروتيني لإغلاق نافذة منبثقة إلى عملية زيارة العديد من المواقع.
وهي سيئة بشكل خاص على الموبايل، وقد تجعل تصفح موقع ما محبطًا للغاية أو من المستحيل الوصول إليه.
يوفر موقع MODALZ MODALZ MODALZ نصائح حول خيارات بديلة عندما تأتيك الرغبة باستخدام النوافذ الشرطية.
يوفر موقع MODALZ MODALZ MODALZ نصائح حول خيارات بديلة عندما تأتيك الرغبة باستخدام النوافذ الشرطية.
يمكنك أن تستبدل النوافذ الشرطية بالكائنات القابلة للتوسيع expanding element أو مربع حوار غير شرطي، وربما يكون من الملائم البدء من جديد واستخدام صفحة جديدة.
⬅️ 3-حجوم الصور الكبيرة والعشوائية !
الصور كبيرة الحجم من أكبر الكوارث التي تجعل من المحبط تحميل صفحات موقعك، أو باللغة المحكية تجعل الصفحة ثقيلة! وتحسين حجم الصور من أسهل الأمور التي يمكنك فعلها لتحسين أداء موقعك.
الصور كبيرة الحجم من أكبر الكوارث التي تجعل من المحبط تحميل صفحات موقعك، أو باللغة المحكية تجعل الصفحة ثقيلة! وتحسين حجم الصور من أسهل الأمور التي يمكنك فعلها لتحسين أداء موقعك.
يمكنك العودة إلى الكتاب الإلكتروني Essential Image Optimization، من أجل تعلم المزيد حول كيفية تحسين حجم الصور. لكن إن كنت لا تمتلك طول البال الكافي، فالمؤلف يتيح لك أداة the tl;dr في أعلى الصفحة، التي توجهك نحو مصادر لضغط الصور الآلي، وأدوات أخرى فعالة إن لم ترغب بأتمتة العملية.
⬅️ 4-رمي أهمية الأداء عرض الحائط !
الإحصائيات غير دقيقة بهذا الشأن، لكن كمستخدم يمكنني أن أقول: لو استغرق موقعك أكثر من بضعة ثواني للتحميل، ستشهد جحافل تغادر موقعك بلمح البصر!
في الواقع سيتجه معظم المستخدمين لتصفح مواقع سريعة لا تخدم أهدافهم على انتظار تحميل
الإحصائيات غير دقيقة بهذا الشأن، لكن كمستخدم يمكنني أن أقول: لو استغرق موقعك أكثر من بضعة ثواني للتحميل، ستشهد جحافل تغادر موقعك بلمح البصر!
في الواقع سيتجه معظم المستخدمين لتصفح مواقع سريعة لا تخدم أهدافهم على انتظار تحميل
الموقع الذي يرغبون به حقًا ويحوي المعلومات التي يريدونها!
وبالطبع، فإن هذا التعصب ضد البطء له تأثير كبير على تحويل الزوار لموقعك. فوفقًا للأرقام، قد يؤدي إبطاء وقت التحميل من 2.4 إلى 3.3 ثوان إلى فقدان ربع معدل تحويلات الزائر إلى مشتري.
وبالطبع، فإن هذا التعصب ضد البطء له تأثير كبير على تحويل الزوار لموقعك. فوفقًا للأرقام، قد يؤدي إبطاء وقت التحميل من 2.4 إلى 3.3 ثوان إلى فقدان ربع معدل تحويلات الزائر إلى مشتري.
من الواضح أن السرعة يجب أن تكون في أعلى قائمة أولوياتك إن كنت تريد تقديم تجربة مستخدم جيدة ومضاعفة معدل التحويل لديك… ومن ناحية أخرى فكر كمستخدم قبل أن تفكر كمصمم!
⬅️ 5-استخدام اطار العمل الخاطئ!
إن خصصت وقتًا لتعلم إطارات العمل الكبيرة مثل React أو Angular فستغريك حتمًا لتستخدمها في كل مشاريعك، لكن وضع مقادير كبيرة من الأكواد المتسلسلة وتقديم تكنولوجيا معقدة والعديد من البهارات والتفاصيل لموقع بسيط لا يعتبر خيارًا حكيمًا!
إن خصصت وقتًا لتعلم إطارات العمل الكبيرة مثل React أو Angular فستغريك حتمًا لتستخدمها في كل مشاريعك، لكن وضع مقادير كبيرة من الأكواد المتسلسلة وتقديم تكنولوجيا معقدة والعديد من البهارات والتفاصيل لموقع بسيط لا يعتبر خيارًا حكيمًا!
لم قد “تصنع من الحبة قبة” عندما يكون الموقع الستاتيكي أسرع وأكثر مرونة؟
في بعض الأحيان يكون كتابة كل شيء من الصفر هو القرار الصحيح للمشاريع المعقدة جدًا، حيث تمنحك تحكمًا أكبر بمحتوى الموقع وينتهي بك الأمر مع أساس كود مرن أكثر وتفاصيل أقل!
في بعض الأحيان يكون كتابة كل شيء من الصفر هو القرار الصحيح للمشاريع المعقدة جدًا، حيث تمنحك تحكمًا أكبر بمحتوى الموقع وينتهي بك الأمر مع أساس كود مرن أكثر وتفاصيل أقل!
⬅️6-حجم الخط المجهري 🧐
هنالك العديد من الأسباب التي تدفعك كمصمم لتستخدم حجم نص صغير: منها الرغبة بوضع الكثير من المحتوى في أول جزء من الصفحة المرئية على الشاشة، وكون النص الكبير غير أنيق البتة لسبب أو لآخر!
هنالك العديد من الأسباب التي تدفعك كمصمم لتستخدم حجم نص صغير: منها الرغبة بوضع الكثير من المحتوى في أول جزء من الصفحة المرئية على الشاشة، وكون النص الكبير غير أنيق البتة لسبب أو لآخر!
بالإضافة لذلك، قد يكون حجم الخط الافتراضي في بعض إطارات العمل غير ملائم تمامًا لأهدفك التصميمية!
هنالك فوائد كثيرة من استخدام النص الأكبر – أنه يحسن من قابلية القراءة، ويعمل بشكل أفضل عند القراءة عن مسافة
هنالك فوائد كثيرة من استخدام النص الأكبر – أنه يحسن من قابلية القراءة، ويعمل بشكل أفضل عند القراءة عن مسافة
بعيدة نوعًا ما (لنقل أن موقعك يعرض على تلفاز ذكي)، كما يحسّن التأثير البصري وقابلية الاستخدام.
هناك أثر جانبي آخر مثير للاهتمام لاستخدام خط أكبر هو أنه يحسن كتابة الإعلانات لأنه يشجعك على استخدام كلمات أقل!
هناك أثر جانبي آخر مثير للاهتمام لاستخدام خط أكبر هو أنه يحسن كتابة الإعلانات لأنه يشجعك على استخدام كلمات أقل!
⬅️ 7-عدم جعل المستخدم أولوية
كيف ينتهي بك الأمر بتصميم موقع سيء للغاية؟ ببساطة خذ طلبات العميل بعين الاعتبار وتجاهل احتياجات المستخدم كليًا!
كثرة طلبات العميل صاحب الموقع قد لا تصب دومًا في مصلحة المستخدم. كثرة الإعلانات والحشو في الصفحات، الألوان المؤذية للعين
كيف ينتهي بك الأمر بتصميم موقع سيء للغاية؟ ببساطة خذ طلبات العميل بعين الاعتبار وتجاهل احتياجات المستخدم كليًا!
كثرة طلبات العميل صاحب الموقع قد لا تصب دومًا في مصلحة المستخدم. كثرة الإعلانات والحشو في الصفحات، الألوان المؤذية للعين
وكثرة الأشكال المتحركة والنوافذ المنبثقة، قد تكون جذابة للنظر وملفتة للانتباه لكن ستجعل تجربة المستخدم مزعجة للغاية!
أنت توجه موقعك لمستخدم وهذا ما عليك التركيز عليه ..
أنت توجه موقعك لمستخدم وهذا ما عليك التركيز عليه ..
جاري تحميل الاقتراحات...