هل يجب أن تتوسع مواقع الويب عند تغيير حجم النافذة؟

StackOverflow https://stackoverflow.com/questions/27381

  •  09-06-2019
  •  | 
  •  

سؤال

أنا أطرح هذا السؤال من وجهة نظر سهولة الاستخدام فقط:هل يجب أن يتوسع/يمتد موقع الويب لملء منطقة العرض عند تغيير حجم نافذة المتصفح؟

أعلم بالتأكيد أن هناك سلبيات واضحة:

  • من الصعب قراءة أعمدة النص الواسعة
  • يمكن أن تكون كتابة html/css باستخدام النسب المئوية أمرًا مؤلمًا
  • فهو يجعلك عرضة لتمديد تصميمك إلى ما هو أبعد من حدوده إذا كانت الصورة واسعة جدًا، أو تمت إضافة كتلة نصية طويلة جدًا.(انظر أنه من الصعب ترميز html/css)

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

يحرر:لقد لاحظت أن عرض تجاوز سعة المكدس ثابت، ولكن يتم تغيير حجم رعب الترميز.يبدو أن جيف ليس لديه تفضيل قوي في كلتا الحالتين.

هل كانت مفيدة؟

المحلول

HTML الخام يفعل ذلك تمامًا.هل تقوم بتغيير بياناتك بحيث لا تظهر بشكل جيد في النوافذ ذات الحجم العشوائي؟

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

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

نصائح أخرى

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

يجب أن يكون التصميم سلسًا ضمن حدود معقولة.

استخدام CSS لديه min-width و max-width الخصائص (التي تعمل في كل متصفح، بما في ذلك IE7+) لمنع التصميم من التمدد أكثر من اللازم.

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

كما قال الناس، يعتمد الأمر حقًا على المعلومات التي يعرضها الموقع.هناك مثالان جيدان هما StackOverflow وGoogle Images.

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

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

في الأساس، ضع في اعتبارك أن العين تكره قراءة الأسطر الطويلة من النص، وقم ببناء تصميمك على ذلك.يمكنك تصميم موقعك بحيث عندما تقوم بزيادة حجم الخط، فإن جميع التخطيطات تتكيف بشكل جيد معه (الموقع الوحيد الذي يمكنني التفكير فيه للقيام بذلك هو www.geektechnique.org - اضغط على ctrl and -/= أو ctrl+scrollwheel, ، ويتغير عرض التخطيط مع حجم الخط)

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

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

أعتقد أن ذلك يعتمد على محتوى الموقع.تركز مواقع مثل SOFlow والمنتديات والمواقع الأخرى على قراءة الكثير من التفاصيل، لذا فإن امتلاك المزيد من العقارات للقيام بذلك يعد فائدة كبيرة في رأيي.كلما كان التمرير العمودي أقل، كان ذلك أفضل.

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

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

ملحوظة:إذا كنت تستخدم وظيفة التكبير/التصغير في متصفحك، فإن التخطيط الثابت يسحق النص، بينما يسمح التخطيط المرن بشغل الشاشة بأكملها.

ربما تكون هذه مجرد مشكلة في المتصفح، لكنها بالتأكيد حجة لصالح السوائل

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

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

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

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

لماذا لا تستخدمها وتجعل حجم صفحتك جيدًا دون الاعتماد على "قياس كل شيء" الأقل مرونة في FF3 والذي يعد في الحقيقة مجرد حل بديل للمواقع التي تستخدم تخطيطًا ثابتًا غبيًا يعتمد على البكسل؟

يقول الكثير من الناس أشياء مثل "هذه مسألة ذوق" أو "لا أحب الخطوط الكبيرة على شاشة بيكسل عالية". عدد البكسلات لا علاقة لها به ، وهي ليست مسألة ذوق.إنها مسألة DPI، والتي ترتبط مباشرة بدقة العرض وحجم الخط.إذا كان تخطيطك يتلاءم مع DPI للخطوط (من خلال تحديده في ems على سبيل المثال، واستخدام SVG)، فسينتهي بك الأمر بمواقع ويب جميلة جدًا وواضحة جدًا تعمل بشكل مثالي مع أي شاشة عرض.

http://www.boutell.com/newfaq/creating/anyresolution.html

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


التعديل لعام 2012:نعم، يجب أن يستجيب موقع الويب الخاص بك لحجم النافذة التي يتم عرضه فيها.

هناك العديد من الأماكن لقراءة المزيد عن هذا، بما في ذلك:

من المحتمل أن يكون هناك تصميم وسط بين التصميمات الثابتة والمرنة.يمكنك تصميم موقع يشبه السوائل ولكن قم بتعيين خاصية CSS max-width إلى 1024 (أو أيا كان).هذا يعني أنك تحصل على تخطيط مرن عندما window width أقل من 1024 و fixed width عندما يكون أكبر.

بعد ذلك، لن يضطر مستخدمو الشاشات الضيقة (مثل eee 701 الذي يبلغ حجمه 800 بكسل) إلى تحريك شريط التمرير الأفقي لقراءة كل سطر، ولا يحصل مستخدمو الشاشة العريضة (الذين لا يعرفون كيفية تغيير حجم نافذة المتصفح الخاصة بهم) على 500 حرف ، فقرة عالية مكونة من حرف واحد.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top