الأخطاء التي من المرجح أن تكون قد ارتكبت بالفعل كمصمم ويب

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

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

استخدام الفلاش

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

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

استخدام صور كبيرة حقًا

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

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

• GruntJS- صورة
• ImageOptim

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

يستخدم العديد من المصممين الآن SVG. يستخدمون الرموز لتحريك الرسومات ورسمها في بيئة المتصفح. وبالتالي ننتهي مع تحميل صفحة متسارع وعناصر مختلفة ملفتة للنظر.

يجب أن نسلط الضوء أيضًا على حقيقة أن الصور الكبيرة ستؤدي إلى تعقيد تصميم الويب بسبب عامل عدم الاستجابة. نحن نتحدث عن عنصر تصميم حدد الارتفاع والعرض. ستقوم المتصفحات بقياس الصور ولكن لدينا نفس حجم الملف.

يعمل W3C الآن على استخدام “ <picture> ” كعنصر HTML5. سيسمح ذلك باستدعاء صور بأحجام مختلفة بناءً على عرض شاشة العرض. عندما يحدث هذا ، ستكون التجربة أفضل بكثير للمشاهد ولكن حتى التنفيذ ، يجب تجنب الصور الأكبر حجمًا.

باستخدام عرض وارتفاع ثابتين

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

وضع افتراضات حول التصميم المناسب

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

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

استخدام مؤثرات وصور متحركة كثيرة جدًا

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

هناك مشكلتان كبيرتان مرتبطة بالإفراط في استخدام الرسوم المتحركة والتأثيرات:

• يتم زيادة وقت تحميل الصفحة
• ستكون التأثيرات والرسوم المتحركة مشكلة بالنسبة لأجهزة الكمبيوتر القديمة

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

روابط التصميم بشكل غير صحيح

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

عدم استخدام DRY In CSS

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

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

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

رشيقة الانحطاط

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

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

تحسين تدريجي

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

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

مشاكل الملاحة - كونها غير سهلة الاستخدام

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

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

عدم التركيز على المحتوى

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

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

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

الاستنتاجات

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

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

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