كانت الحياة أكثر بساطة عندما كان على مصممي الويب الاهتمام بشأن تنسيق المواقع لأجهزة الكمبيوتر المكتبية فقط, كان من السهل التصميم لمعظم الشاشات والشاشات ، حجم واحد كان يناسب معظمها, ثم زاد رواج استخدام شبكة المحمول.
منذ بدء شبكة المحمول بالظهور ، كانت إحدى المناظرات الكبرى هي ما اذا كان افضل ,تصميم موقع متكيف ومستجيب ويتغير ليتلاءم مع البوابات المختلفة أو لتصميم موقع محمول مستقل [معروف بالعاميه كـ m (dot) التصميم المعتاد http: //m.site.com بنية عنوان URL].
من أجل مناقشتنا اليوم ، سنعتبر تصميم (dot) ماضيًا ، نظرًا لأنه لم يعد يعتبر من أفضل الممارسات لأنه ينطوي على إنشاء موقع جديد تمامًا به صور أقل وملاحة (navigation) مبسطة.لذا ، مع أخذ ذلك في الاعتبار ، فلنلقِ نظرة على الطرق المختلفة لتصميم نمط بوابات متعدد المداخل.
ما هو تصميم الويب المتجاوب وتصميم الويب التكييفي؟
مرة أخرى في أوائل القرن ، كان النقاش في موضوع ما الافضل عند تصميم الويب: تخطيط ثابت مقابل تخطيط مرن, تم تعيين تخطيطات تصميمات مرنه مع نسب مئوية ،تمتد لتلائم إطار المتصفح ، بينما تم حد التخطيطات الثابتة في تخطيط واحد محدد بواسطة عرض البكسل الذي تم تعيينه من قبل المصمم.
لم يكن أي من هذه الأساليب سليم لا عيب فيه, نفعت النماذج المرنه على أحجام شاشات متعددة ، ولكنها بدت نحيلة وغير جذابة على الشاشات العريضة. عملت التصاميم الثابتة بشكل جيد على الشاشات التي صممت من أجلها ولكن كان من المستحيل استخدامها على غيرها.
الموضوعان الجوهريان في السنوات الأخيرة كانا و مازالا تصميم الويب المتجاوب وتصميم الويب التكيفي, على الرغم من أن كلتا الطريقتين تقومان بتلبية توصيات Google في إمكانية الوصول إلى المواقع محافظا على أداء جيد وقوي ، إلا أن لكل طريقة مزاياها وعيوبها.
بادئ ذي بدء ، يشبه تصميم الويب التكيفي (AWD) التصميم الثابت القديم في أنه يستخدم تصميمات ثابتة بناءً على نقاط توقف, يعمل AWD على اكتشاف حجم الشاشة وتحميل التخطيط او التصميم المناسب لها, وهذا ينطوي على تصميم (على الأقل) تصاميم لستة عروض شاشات مختلفه, انه لمن المتعب تصميم وتطوير موقع مع AWD لعدة أحجام مختلفة للشاشات.
يمنحك هذا الأسلوب قدرًا معينًا من التحكم في إستراتيجية الشكل والمحتوى التي لن تجدها بالضرورة في التصميم المتجاوب, ولكن على المدى الطويل ، فإن تصميم ما لا يقل عن ست “مواقع جديدة” من البدايه عمل متعب ولا يجب عليك فعله مع تصميم الويب سريع الاستجابة.
- تقول Careins Careins في موقع Next Web أنه يجب عليك “التفكير في استخدام التصميم التكييفي إذا:
- التجارب الخاصة بالجهاز هي الاولويه و الضروره:
- يمكنك في الواقع إنشاء تجارب مختلفة لكل من هذه الأجهزة ؛
- يمكنك التعامل مع القوالب والموارد التكيفية والحفاظ عليها ؛
أوتعمل قاعدة المستخدمين لديك على الوصول إلى معلوماتك على العديد من الأجهزة المختلفة (إذا أظهرت التحليلات أن 70 بالمائة من المستخدمين يستخدمون جهازًا واحدًا ، فقد لا تكون واجهة المستخدم التكيفية تستحق وقتك او مجهودك). “من ناحية أخرى ، لا يمنحك تصميم الويب سريع الاستجابة (RWD) قدرًا كبيرًا من التحكم في المحتوى والأسلوب (الشكل) مثل AWD ، ولكنه لا يتطلب الكثير من العمل في الإنشاء والصيانة, RWD هو كمثل سليل التصميم المرن, فهو يتكيف مع حجم الشاشة بغض النظر عن الجهاز المستهدف, يستخدم المتجاوب (Responsive) استعلامات وسائط CSS لتغيير الأنماط استنادًا إلى الجهاز المستهدف ثم يتم تحميل الصفحة وفقًا لحجم شاشة جهازك.
“التصميم المستجيب يستوجب وقتًا أقل في العمل على الإنشاء والصيانة”.
نظرًا لأن RWD يقوم بتبديل المحتوى وتحريكه حول الشاشة من أجل ملائمة نافذة الجهاز بسلاسة ، يجب عليك إيلاء اهتمام خاص للتسلسل الهرمي المرئي للتصميم أثناء تنقلاته,ولهذا يجب الاختبار على أجهزة متعددة وفي مستعرضات متعددة في متناول اليد.
يشعر العديد من المصممين أن التصميم المتجاوب هو الأكثر تحديًا لأن عليهم التخطيط لعدد لا نهائي من التصاميم لاحجام الشاشات. حتى مع هذا العيب، يعطي هذا النوع من التصاميم دائمًا شفرة أكثر نظافة وقدرة على التكيف بشكل أفضل ، بحيث يتم تصميمه مع اخذ المستقبل في الاعتبار.
لما التصميم المتجاوب هو مستقبل الويب
مازلت لا تصدق ان التصميم متجاوب هو التصميم الافضل؟ ماذا عن هذا:
إنه أكثر متعة لقرائك, لا توجد حدود متأصلة لأبعاد الشاشة كما هو الحال مع AWD, في حين أن تصميمات المواقع المتجاوبة يمكنها العمل بشكل جيد على أي حجم للشاشة ، إلا أن التصاميم التكيفية تعمل فقط على الشاشات التي تستطيع مخططاتها (layout) القيام بها.
التصاميم سريعه الاستجابة تقوم بالتحميل أسرع.
يحتاج موقع الويب المتكيف إلى تحميل جميع التخطيطات الممكنة المصمم بها بينما تحتاج مواقع الويب المتجاوبة فقط إلى تحميل الموقع الذي يعمل على جميع الأنظمة الأساسية.
مستقر نظرًا لأنه لا يقتصر على أحجام الشاشات التي تحددها ، فستتحمل صفحتك بمظهرً رائع على هاتف Samsung أو iPhone القادم (ناهيك عن الأجهزة اللوحية وأجهزة Smartwatches) ، بغض النظر عن أبعاد الشاشة.
علاوة على ذلك ، يتم دمج التصميم المتجاوب تلقائيًا في مشروعاتك (ليس لديك عذر)! الأدوات المتجاوبة هي مبدأ أساسي في Studio بحد ذاته. هذا يسمح للمستخدم بسهولة وسرعة إنشاء إصدارات مختلفة من نفس المكونات والقيود المستجيبه للشاشات ( various versions of the same screen leveraging components and responsive constraints.).
مرحبًا بك في عالم يمكن أن تعمل فيه إصدارات iPad و iPhone و Android والأجهزة المحموله داخل ملف تصميم مركزي وذلك بالقليل من الجهد, تسمح لك لوحات dartboards في Studio بمشاهدة التغييرات في الوقت الفعلي عند ضبط الأبعاد بدلاً من البحث عن نقاط الخطأ (الضعف) المحتمله عن طريق التجربة والخطأ.
جميع الصور بتصرف من المصدر
ترجمة : ضحى عماد، إعداد: جميل جدعون
Invisionapp – الكاتب: Will Fanguy المصدر:https://www.invisionapp.com/inside-design/benefits-responsive-web-design/
