نقاش المستخدم:FShbib/مشاريع/الصفحة الرئيسية 2020

تحديث الصفحة الرئيسية

مرحبًا @ASammour وIbrahim.ID وجار الله وزكريا ووهراني وعلاء وباسم وOmar2040: حسب هذه التذكرة فينبغي إصلاح الصفحة الرئيسية بحلول 13 يوليو.. في هذه الصفحة عدّلت الصفحة الرئيسية لتناسب نسخة الجوال، وأصلحت بعض القوالب الأخرى، لكن تبقّى قالب {{مقدمة الصفحة الرئيسية 2}}.. الاختلاف على نسخة سطح المكتب سيكون في أن طول الأعمدة سيكون مختلفًا عن السابق ما لم تكن هنالك طريقة لضبط طولها.. أحتاج آرائكم وملاحظاتكم والأهم خبراتكم قبل أن أُطبّقه إن شاء الله.. تحياتي.. --شبيب..^ناقشني 02:04، 10 يونيو 2020 (ت ع م)

 تعليق: أهلا أخي @FShbib: شكرا لك عمل ممتاز، لدي بعض الملاحظات ربما تفيد:

• بخصوص {{مقدمة الصفحة الرئيسية 2}} فنحتاج لتغيير محتواه مثلا في قسم البوبات من بدل الجدول نستخدم قائمة، القائمة تساعدة أكثر في التصميم المستجيب لمواقع الويب. طبعا نجرب ذلك في قالب منفصل
• الصفحة تبدو طويلة جدا على الموبايل ربما من الأفضل إخفاء بعض الأقسام الغير الضرورية.
• أخيرا في هذه النسخة لم تستخدم الجدول كما في الصفحة الرئيسية لهذا العمودين غير متساويين.طبعا توجد هناك تقنيات تساعد لضبط الأعمدة وأرى في هذه الحالة Flexbox تقنية مناسبة رغم أنها تحتاج لتركيز وتجربة منفصلة مؤقتا إلا أنها حاليا أشهر وأفضل تقنية صممتها رابطة الشبكة العنكبوتية (w3c) حيث تساعد على ضبط العناصر بشكل تلقائي على جميع الأجهزة والشاشات، وإليك مرجع للتأكد CSS Flexible Box Layout Module Level 1 ، رغم أن حالتها ليست Recommendation بل فقط Candidate Recommendation إلا أنها أصبحت تستخدم في الويكي خاصة على الواجهات المخصصة للموبايل، عيبها الوحيد هو عدم دعمها للمتصفحات القديمة وبالضبط الإصدارات القديمة لإنترنت إكسبلورر أما بخصوص باقي المتصفحات فيمكن استخدام Vendor Prefixes لدعمها، على أي حال في حال عدم موافقة باقي الزملاء فهناك تقنيات أخرى تساعد على التصميم وشكرا --Omar2040 (نقاش) 11:53، 10 يونيو 2020 (ت ع م)
  • صحيح عمر القالب كما ذكرت يحتاج لتعديل.. هذا نموذجٌ آخر باستخدام Grid، وأعتقد أنه أفضل.. أيضًا أخفيت قسم "قيل" و"الصحيح في اللغة" و"هل تود إنشاء مقالة؟" من نسخة الجوال.. بانتظار بقيّة الآراء.. --شبيب..^ناقشني 20:01، 10 يونيو 2020 (ت ع م)

شكرا لك أخي @FShbib: تصميم ممتاز للغاية .. بكل تأكيد تقنية grid أفضل من flexbox حيث تدعم كلا البعدين، لكن المشكلة الوحيدة حاليا هو عدم دعمها نهائيا للمتصفح إنترنت إكسبلورر وبإمكانك التجريب على المتصفح وأيضا الاصدارات القديمة لباقي المتصفحات، ربما الصفحة الرئيسية يجب تظهر بشكل ممتاز عند أكبر عدد من المستخدمين في العالم، لكن في حال جعل متصفح انترنت اكسبلورر خارج الحسابات فبكل تأكيد أدعم استخدام تقنية grid في حال عدم استخدام flexbox، فقط كملاحظة أخيرة التاريخ المكتوب في التذكرة 13 يوليو وليس يونيو . شكرا وبالتوفيق --Omar2040 (نقاش) 21:57، 10 يونيو 2020 (ت ع م)

العفو عمر، وشكرًا لك على ملاحظاتك القيّمة.. لا أعلم إلى متى سننتظر مايكروسوفت لتتخلّص من ذلك المتصفح الكئيب، لذا سأرى ما يُمكنني فعله بـ flexbox في الفترة القادمة.. شكرًا لك لم أنتبه للتاريخ .. --شبيب..^ناقشني 22:23، 10 يونيو 2020 (ت ع م)

@FShbib: بالتوفيق. --- مع تحياتي - وهراني 00:10، 14 يونيو 2020 (ت ع م)

•  تعليق: @ASammour وIbrahim.ID وجار الله وزكريا ووهراني وعلاء وباسم وOmar2040: هذا نموذجٌ آخر باستخدام flexbox، أرجو التجربة لو تكرمتم.. طبعًا النسخة تعمل على إنترنت إكسبلورر في سطح المكتب بعكس grid.. أي ملاحظات مرحب بها قبل التطبيق في 13 يوليو.. تحياتي.. --شبيب..^ناقشني 05:15، 9 يوليو 2020 (ت ع م)
• @FShbib: ألف شُكر لك على هذا المجهود--باسم^{راسلني (☎)} 07:15، 9 يوليو 2020 (ت ع م)
• @FShbib: شكرًا لجهودك، فقط لو أمكن محتوى قسم مشاريع شقيقة يكون في المنتصف، أعتقد سيظهر بشكل أجمل. تحياتي.--جار الله (نقاش) 07:46، 9 يوليو 2020 (ت ع م)
• نموذج flexbox ممتاز جداً وresponsive، تم تجربته على عدة احجام شاشات وبلا أي مشاكل --إبراهيـمـ ✪ (نقاش) 08:43، 9 يوليو 2020 (ت ع م)
  • شكرًا لردودكم وفحص النموذج زملائي.. @جار الله: القالب مقسم لثلاثة أعمدة بالعرض الكامل لأجل توزيع أفضل للأعمدة لاختلاف الشاشات وأحجام النصوص.. تقليل العرض من أجل التوسيط سيضغط القائمة لذلك الأفضل إبقاءها كما هي.. --شبيب..^ناقشني 22:12، 9 يوليو 2020 (ت ع م)

@FShbib: راجعت مقترحك بمقاييس مختلفة لشاشة العرض ولم ألاحظ عيبا فيها. أعتقد بأنه علينا ضبط حجم محتويات أقسام مثل مقالة اليوم المختارة - مقالة اليوم الجيدة باعتماد حجم معين (مثلما هو الحال في الويكي الانجليزي) لتفادي المفاجئات.--- مع تحياتي - وهراني 14:55، 10 يوليو 2020 (ت ع م)

 تعليق: شكرا لك أخي شبيب على مجهودك لإخراج الصفحة بتنسيق ممتاز، حاليا أشهر التقنيات الموجودة في تصميم الويب يوجد flexbox و grid بالأضافة إلى multi-column لكن flexbox تدعم أكبر عدد من المتصفحات عكس باقي التقنيتين، في المستقبل القريب ستعوض grid تقنية flexbox في العديد من الاستخدامات عندما ستدعم أكبر عدد من المتصفحات بسبب ميزة دعم بعدين. بالنسبة للصفحة الرئيسية المقترحة فهي تطابق المعايير المطلوبة وتأكد هنا ، ولدي بعض الملاحظات:

• محتوى مقدمة الصفحة الرئيسية يعطل التصميم المستجيب لأنه يستخدم الجدول، ينصح بعدم استخدام الجدول في التنسيق، أضف إلى ذلك قائمة البوابات متداخلة مع الأيقونات لاحظ ذلك بتصغير النافدة، يمكن استخدام قائمة وإعطاء ul أو id المحتوية على القوائم الخاصية colmun-width مثلا بقيمة 10em أو أي خاصية أخرى تساعد في جعل القائمة مناسبة لتغير الشاشات.
• من الأفضل تجنب الوحدات الثابثة ك px حيث من الأفضل استخدام em أو % خاصة في الخاصيات width و padding و margin .. كل هذا لتنسيق أفضل
• من الأفضل اخفاء قسم بوابة مختارة من نسخة الجوال
• لم يعد استخدام بادئة mp ضروري سواء في الصفحة أو styles.css

هذا كل شيء وشكرا مجددا على المجهود المتواصل لتطوير الصفحة --Omar2040 (نقاش) 18:18، 10 يوليو 2020 (ت ع م)

اعتمدت التصميم الآن في الصفحة الرئيسية.. @وهراني: هل تقصد بضبط حجم المحتويات تقليل المحتوى في الأقسام؟ أعتقد في فترة سابقة عانينا من مشكلة وأصلحها الزميل @باسم: بإضافة النصوص.. أخي @Omar2040: قالب المقدمة فعلًا يحتاج لوقفة أرجو أن تكون منك، وسأعمل بعض التجارب عليها، فما أحاول فعله هو جعلها كقائمة أفقية في نسخة الجوال وليس قائمة بالتراتب، طالع ويكيبيديا الإنجليزية مثلًا.. بخصوص الوحدات أرجو توضيح ما تقصد بالتحديد وسأطبّقه إن شاء الله.. أخفيت قسم البوابة في نسخة الجوال لأنها أصلًا غير صالحة للعرض، أما البادئة ففضلت إبقائها للتفريق فقط بين الكلاسات.. تحياتي للجميع.. --شبيب..^ناقشني 20:36، 12 يوليو 2020 (ت ع م)

أهلا أخي شبيب حقيقة العمل على تنسيق الصفحة الرئيسية يحتاج لوقت ومجهود أكثر مما يبدو نظريا شكرا جزيلا لك على تطويرها، بخصوص قالب المقدمة فقد أضفت النمط المناسب لتنسيق الجداول على الجوال، يبدو هذا حلا نهائيا لكن كما قلت الجداول دلاليا ليست للتنسيق خاصة في سطح المكتب عند تصغير النافذة، لذلك سنعيد تصميم قالب المقدمة باستخدام التقنيات الحديثة وبما أن المقدمة أصبحت تظهر جيدا على نسخة الجوال فسنأخذ الوقت الكافي لذلك، وأرى أنك في الطريق الصحيح ولو سمحت سأتابع معك في ملعبك هنا، وبخصوص الوحدات ما أقصده مثلا بدل إعطاء width قيمة 200px من الأفضل إعطاءها القيمة 31.25em طبعا هناك أدوات للتحويل لكن حاليا كل شيء جيد بخصوصها .. فقط كملاحظة أخيرة أرجو حماية الصفحة ويكيبيديا:الصفحة الرئيسية/styles.css على مستوى المحررين فهي مهمة. وشكرا لك --Omar2040 (نقاش) 11:19، 13 يوليو 2020 (ت ع م)

جميل جدًا، شكرًا لك عمر على التعديل، الآن بإمكاننا أخذ الوقت لتحسين الأمور الأخرى.. تحياتي لك.. --شبيب..^ناقشني 18:13، 13 يوليو 2020 (ت ع م)

• خلاصة: أجرى الزميل @Omar2040: مشكورًا تحسينات كبيرة على الصفحة الرئيسية، واعتمدت النسخة اعتمادًا نهائيًا في 30 أغسطس 2020.. للمزيد أرجو مطالع هذا النقاش المفصل.. تحياتي.. --شبيب..^ناقشني 22:47، 30 أغسطس 2020 (ت ع م)