it-swarm.asia

العرض الثابت مقابل العرض الديناميكي

لقد لاحظت أن عددًا أكبر من المواقع انتقلت إلى تخطيط ذي عرض ثابت ، حيث يؤدي تغيير حجم نافذة المتصفح إلى ظهور أشرطة التمرير ، بدلاً من تصميم مرن ، حيث يؤدي تغيير حجم المتصفح إلى "مسح" مكونات الصفحة .
تعتبر مواقع StackExchange مثل هذا الموقع مثالًا على التخطيط الثابت. GMail و iGoogle مثالان على التصميم المرن. ما هي أسباب اختيار واحد على الآخر؟

15
BenV

يمكن أن يكون تحقيق تصميمات أكثر تعقيدًا أمرًا صعبًا للغاية من خلال تصميم العرض المتغير. لذلك أتصور أن يلعب دوراً.

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

بالطبع إذا كان لديك موقع به مساحة أعلى من سعرها (مثل محرّر مستندات Google وخرائط Google) ، فأنت تريد حقًا استخدام نظام عرض متغير لاستخدام كل المساحة المتاحة.

11
Kris

ثابت مع هو أسهل بكثير لمطوري المواقع المعقدة. أيضًا ، ستكون معظم مواقع العرض الثابت حوالي 1000 بكسل. السبب هو أن 1٪ فقط من المتصفحات يستخدمون 800x640 بينما يستخدم 0٪ 640x480. تحقق من أحدث الإحصائيات هنا . هذا لا يشمل المحمول على الرغم من. وهي لعبة كرة مختلفة تمامًا.

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

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

8
Ben Hoffman

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

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

3
Dan Diplo

وفقًا لـ Jakob Nielsen ` 113 إرشادات تصميم لإمكانية استخدام الصفحة الرئيسية :

67 استخدم نسقًا سائلًا بحيث يتم ضبط حجم الصفحة الرئيسية على دقة شاشة مختلفة.

إنها أيضًا واحدة من إرشادات تصميم الصفحة الرئيسية العشرة الأكثر انتهاكًا :

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

1
melhosseiny

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

1
Alan

ماذا عن الاختلاط؟ يعرض هذا القسم # محتوى بعرض ثابت (70 م) إذا كان هناك مساحة كافية - وإلا فسيتم تقليص القسم إلى 80٪ من نافذة منفذ العرض/المستعرض.

#content {
    margin: 0 auto 2em 0;
    width: 70em;
    max-width: 80%; }
0
feeela

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

0
paulmorriss