A JQuery Plugin for Optimal Use of Screen Space
يعد تحسين كيفية استخدام المساحة على الشاشة أحد المكونات الرئيسية لتصميم الويب الجيد ، وخاصةً التصميم المتجاوب.
هناك عدد من الطرق للتعامل مع هذا النوع من التحدي ، وأكثرها شيوعًا هو الترتيب التلقائي للعناصر داخل الحاوية الرئيسية. إنها فعالة ، وعندما يتم تنفيذها جيدًا ، فإنها تُنشئ تصميمًا جذابًا وعمليًا على حد سواء.
إذا كنت تصمم موقعًا متجاوبًا ، فستجد بالتأكيد الحاجة إلى إعادة ترتيب المحتوى بطريقة ديناميكية ، استنادًا إلى حجم شاشة جهاز المستخدم. يعتبر تنسيق الترتيب التلقائي منطقيًا ، لأنه يقلل من الوقت المستغرق في تخصيص نقاط التوقف لكل صفحة وكل عنصر.
يمكن للمواقع ذات المحتوى المتغير باستمرار (مثل المدونات أو المتاجر عبر الإنترنت) الاستفادة بشكل خاص من الترتيب التلقائي. بعد كل شيء ، هل تريد حقًا الدخول في الشفرة لموقع العميل الخاص بك وتعديل نقاط التوقف والتخطيط إذا قرروا فجأة البدء في كتابة مشاركات مدونة أطول أو أقصر؟
إن القيام بكل هذا من الصفر يتطلب وقتًا طويلاً ويتخطى قدرات معظم المصممين الذين ليسوا مطورين أيضًا. بدلاً من ذلك ، من المنطقي استخدام مكون إضافي أو إطار عمل موجود مسبقًا.
تعتبر JavaScript (بما في ذلك jQuery والمكتبات الأخرى) هي الطريقة الأكثر شيوعًا لإنشاء هذا النوع من التخطيط ، على الأرجح بسبب توافقها الواسع عبرها. هكذا تعمل الجهود الحالية مثل vGrid و Wookmark و Masonry.
Freetile.js هو برنامج jQuery plugin تمكّن هذا النوع من التخطيط الديناميكي المنظم. تم استخدامه كمحرك خلف Assemblage و Assemblage Plus لما يقرب من عامين ، وهو متوفر الآن في النهاية كمشروع مستقل مفتوح المصدر.
يختلف الأمر عن الجهود الحالية في هذا الفضاء لعدة أسباب. إنه يسمح باستخدام أي عناصر حجم بدون الحاجة إلى شبكة عمود ذات حجم ثابت. هذا يحررك من الاضطرار إلى تحديد عرض العمود المناسب لعناصرك. ويمكنك تخصيص الخوارزمية التي تقيم مواقف الإدراج المحتملة لكل العناصر ، مما يسمح لك بالتعبير عن التفضيلات مثل المحاذاة والقرب.
لديه روتين للرسوم المتحركة الذكية التي تجعل من السهل التمييز بين العناصر التي ينبغي أن تكون متحركة والتي لا ينبغي. تحديد الرسوم المتحركة داخل الكود سهل أيضًا.
استخدام Freetile.js بسيط للاستخدام. حتى إذا لم تكن متقنًا في جافا سكريبت ، فيجب أن تكون قادرًا على اكتشاف استخدامه بسرعة.
تم ترخيص Freetile.js بموجب ترخيص BSD ، ويتوفر عبر GitHub.
هل استخدمت Freetile.js؟ ماذا بنيت؟ تبادل الخبرات الخاصة بك في هذه التعليقات.