السلام عليكم، هل التصميم المتجاوب يعتمد كلياً على إستخدام النسبة المئوية ؟؟
أم سيسـبب ذلك مشكلة فيما بعد ؟
.
.
وأيضاً ما أفضل الطرق للتعامل مع الصور في التصميم المتجاوب؟
التصميم المتجاوب لا يعتمد على النسب بشكل كامل، ولكنه لا يخلو منها أيضا،
فمثلا، أنا أحدد عرضا لغرض ما، فليكن حامل الصفحة
.wrapper {
width: 100%;
max-width: 50em;
}
في المثال أعلى اعتمدت على جعل العرض يأخذ كامل الشاشة يعني 100%
ولكن للأشخاص الذين يملكون شاشة بعرض أكبر من 50em
فإن العرض سيقدر ب50em فحسب أو 800 بكسل، وهكذا تستعمل النسب
أيضا يجب استعمال grids التي تجعل المحتوى متوافق، وتستعمل media queries،
لتستعملها تقوم بعمل 3 أو 4،
وتحدد أنت نقط التحول أو (BreakPoint)
طبعا لا تحددها حسب أعراض الشاشات، مثلا 320 و 480 و1024، بل على تصميم الموقع الخاص بك،
بالنسبة لسؤالك حول الصور، قرأت سابقا بعض المقالات في smashingMagazine وأريد أن أشاركهم معك
أزيدك من الشعر بيتاً.
النسب المئوية تستخدم لتحقيق مفهوم مغاير للتصميم التجاوبي، وهو ما يدعى بالتصميم المرن (Fluid Design).
حيث أن التصميم التجاوبي، كما ذكر الأخوة، يعتمد على Media Queries لتحديد نقاط كسر (Breakpoints)، وهي النقاط التي تعيد عندها توزيع العناصر بما يناسب حجم شاشة العرض.
في حين أن التصميم المرن يستخدم لمد الواجهة على كامل أو معظم المساحة المتوفرة.
يمكن دمج المفهومين (التجاوبي والمرن) أو استخدام أحدهما دون الآخر.
لا يشترط الاعتماد على النسب المئوية، يعتمد أيضاً على Media Queries لتحديد ستايل مختلف لكل عرض شاشة (موبايل، لابتوب، شاشات كبيرة، إلخ).
لا أعتقد أن التصميم المتجاوب يمكن أن يسبب أي مشكلة، ﻷنه مصمم ليعمل على مختلف أنواع الشاشات.
يمكنك استخدام إحدى المنصات الموجودة لهذا الغرض، مثل: Zurb Foundation أو Twitter Bootstrap.
التعليقات