"ميريام سوزان" هي مؤلفة وفنّانة ومطوّرة على الويب في مدينة دنفر بولاية كولورادو، وتعمل حاليًا على تطوير مواصفات رائعة في CSS مثل Container Query (استعلامات الحاوية) وCascade Layers.
هذه المشاركة جزء من Designcember. احتفال بتصميم الويب من إنشاء web.dev
ميريام سوزان هي مؤلفة وفنانة ومطورة ويب في دنفر بولاية كولورادو. وهي أيضًا مؤسِّسة شريكة لـ OddBird (وكالة ويب)، وكاتبة في فريق CSS Tricks، بالإضافة إلى أحد أعضاء فريق Sass الأساسي، وخبيرة W3C المدعوون في مجموعة CSS Working Group. ركّزت مؤخرًا على تطوير ميزات CSS جديدة، مثل "طبقات Cascade Layers" و"طلبات بحث الحاوية" و"النطاق". "ميريام" هي روائية وكاتبة مسرحية وموسيقية منشورة بلا إنترنت. وتحدّثنا عن عملها مع Sass وCSS.
راشيل: لقد تعرّفت للمرة الأولى على عملك بسبب إطار عمل الشبكة Susy، ما الذي دفعك لإنشاء ذلك؟
ميريام: في عام 2008، كان التصميم على الويب عبارة عن تجربة مختلفة تمامًا. ابتعد المطورون من تخطيط الجدول إلى شبكات عائمة أكثر دلالية (ولكنها لا تزال مختلة). وشهدت "أطر الشبكة" المكونة من 12 عمودًا ومقاسًا واحدًا يناسب الجميع شبكة من 12 عمودًا وكانت الشبكة محدّدة مسبقًا (ثابتة عادةً) مع مجموعة من فئات CSS المحددة مسبقًا. وإذا أردت مزيدًا من التخصيص، يمكنك استخدامه بمفردك. وكان من الواضح أن مواقع الويب تحتاج إلى أن تصبح أكثر استجابة، ولكن طلبات البحث عن الوسائط لم تكن متاحة بعد، وكان هناك عدد كبير من مشاكل توافق المتصفح حول الأعداد العائمة للسوائل.
كنت أستخدم أسلوب أنظمة CSS الذي تتبعه "ناتالي داون"، والذي اتسم بذكاء في الاستجابة لكل من أحجام الخطوط وإطارات العرض، ولكنني شعرت بالإحباط بسبب جميع عمليات الاختراق المتكررة المطلوبة المتعلقة بالرياضيات والمتصفحات. في الوقت نفسه، بدأت Sass في جذب بعض الاهتمام، وهي مناسبة تمامًا لما أحتاجه. كانت المسودة الأولى لـ "سوزي" بسيطة جدًا: مرّت بمزيجَين فقط لإجراء الحسابات وإضافة النصائح التي أحتاج إليها. وكان الهدف أن يكون الحد الأدنى من المطلوب، وإخراج التعليمة البرمجية الأساسية فقط. شبكات قابلة للتخصيص تمامًا، بدون أي فئات محددة مسبقًا.
راشيل: كيف انتقلت من العمل على المعالج الأولي لخدمة مقارنة الأسعار (CSS) إلى العمل على مواصفات CSS؟ هل تعتقد أن العمل على المعالج الأولي كان خلفية جيدة لكتابة المواصفات؟
ميريام: من واقع خبرتي، هناك الكثير من التداخل، وما زلتُ أتفاعل مع كلا الجانبين. مع ذلك، أعتقد أنّ هذا يعود إلى فريق Sass بشكل خاص، بقيادة ناتالي وايزنباوم، الذي يأخذ وجهة نظر طويلة الأمد تحاول تطوير أدوات تتكامل بسلاسة مع تطوير معايير الويب. عند التفكير في مستقبل معايير الويب الأساسية، لا بدّ من اعتماد حلول أكثر من الحلول "المعتقدة" التي تشكّل حلاً واحدًا يناسب الجميع بهدف تحقيق المرونة على المدى الطويل.
كيف يمكننا إنشاء أدوات تحترم تنوع احتياجات وأساليب المطوّرين، مع الاستمرار في تشجيع وتسهيل إمكانية الوصول وغير ذلك من الاعتبارات المهمة؟
راشيل: لدينا مجموعة من العناصر في CSS والتي تحلّ محلّ الوظائف التي كانت في السابق جزءًا من Sass. هل هناك أسباب قوية تجعلك تستخدم برنامجًا مثل Sass؟
ميريام: نعم، بالنسبة إلى بعض الأشخاص، ولكن ما مِن إجابة عالمية هنا. خذ المتغيرات كمثال. وتكون متغيرات Sass ذات نطاق لغوي، ويتم تجميعها على الخادم، مع هياكل بيانات منظّمة مثل القوائم والعناصر، ومعالجة الألوان، وما إلى ذلك. ويُعدّ هذا أمرًا رائعًا لمنطق نظام التصميم الذي لا يحتاج إلى تشغيله في المتصفّح.
هناك بعض التداخل بين متغيرات CSS، ويمكنها أيضًا تخزين القيم، ولكنها توفر مجموعة مختلفة تمامًا من نقاط القوة والضعف المستندة إلى التسلسل المتتالي. لا يمكن لخدمة Sass معالجة الخصائص المخصّصة، بينما لا يمكن لخدمة CSS معالجة البيانات المنظَّمة. كلاهما مفيد وكلاهما قوي - ولكن قد تختلف احتياجاتك الخاصة.
أعتقد أنه من الرائع عندما يتمكن الأشخاص من التخلص من الأدوات التي لم يعدوا بحاجة إليها، وقد لا تتطلب بعض المشروعات متغيرات من جانب الخادم والعميل. ممتاز. ولكن من السهل للغاية افتراض أنهما متطابقان، وأن أحدهما يحلان محل الآخر. ستكون هناك دائمًا حالات استخدام لبعض منطق التصميم لتحدث من جهة الخادم، وبعضها يحدث من جانب العميل - حتى إذا وصلنا إلى مرحلة توفر فيها اللغات نفس الميزات في الأساس. يعمل معالجو البيانات المسبق معنا على المدى الطويل.
راشيل: هل هناك ما فاجأك لأنك انخرطت بشكل أكبر في عملية وضع المعايير، أو أي شيء تعتقد أنه قد لا يكون الشعب على دراية به بشكل عام؟
مريم: قبل بدء المشاركة في الفعالية، بدا الأمر كصندوق أسود غامض وسحري، ولم أكن متأكدًا ممّا يمكن توقّعه. كنت قلقًا من أنّه قد لا تتوفّر لديّ معرفة كافية بالعناصر الداخلية للمتصفّح من أجل المساهمة، ولكن في الواقع أنّهم لا يحتاجون إلى المزيد من مهندسي المتصفِّح. إنهم بحاجة إلى المزيد من المطورين والمصممين الذين يقومون بإنشاء مواقع الويب والتطبيقات في البرية.
لقد تفاجأت عندما وجدت أن عددًا قليلاً جدًا من الأشخاص المعنيين يركزون بشكل أساسي على المعايير، ولكن القليل جدًا منهم أيضًا يقومون بتطوير أو تصميم مواقع الويب بشكل أساسي. وتتألّف هذه الشبكة من "متطوعين" من المؤسسات الأعضاء (تتقاضى هذه المؤسسات غالبًا ما تدفعها تلك المؤسسات، ولكنّها ليست وظيفتها الأساسية) ولا يكون الاشتراك رخيصًا. هذا يحيد المشاركين عن المصممين والمطورين اليوميين، وخاصة أولئك الذين يقومون بعمل العملاء في الوكالات الصغيرة، أو العاملين المستقلين. وكان دوري كخبير مدعو أكون تطوعيًا تمامًا، وهو هواية باهظة الثمن، لو لم أجد تمويلاً خارجيًا لذلك العمل.
وفي الواقع، تكون العملية مفتوحة وعامة وتتطلب مشاركة المطوّرين، ولكن هناك دائمًا العديد من المحادثات التي يتم إجراؤها في الوقت نفسه، وقد يكون من الصعب العثور على ما تريد. خاصة إذا لم تكن وظيفتك اليومية.
راشيل: لطالما كانت طلبات البحث عن الحاويات نقطة مهمة بالنسبة إلى الكثير من مطوّري البرامج على الويب على مدى سنوات عديدة. أنا متحمس جدًا حقيقة حصولنا عليها. أشعر وكأنّ الكثير من الأشخاص يفكّرون في استخدام طلبات البحث في الحاويات. هل يشعرون بأنّهم يستطيعون إطلاق العنان لإبداعاتهم؟
مريم: بالتأكيد، مع أنّني لا أرى هذه الأمور منفصلة تمامًا. جميعنا لدينا وقت محدود، ونحاول كتابة تعليمات برمجية قابلة للصيانة وذات أداء. عندما يكون من الصعب القيام بشيء ما عمليًا، تقل احتمالية الإبداع باستخدام ما هو ممكن.
ومع ذلك، فإن مجال الويب تهيمن الآن على اهتمامات الشركات الكبيرة، ولذلك فإن هذه المخاوف المتعلقة بالأنشطة التجارية تحصل دائمًا على وقت بث أكثر من فناني الويب. وأعتقد أننا نفقد الكثير إذا تجاهلنا الإبداع على الويب كحالة أساسية لاستخدام الميزات. لقد كنتُ متحمسة جدًا لرؤية بعض العاملين في مجال فن CSS وهم يلعبون مع النموذج الأولي لاستعلام الحاوية. أنشأ Jhey Tompkins عرضًا توضيحيًا ذكيًا وتفاعليًا للستائر الافتراضية في CSS كتعليق على المشاركة المضحكة القديمة المناهضة لـ CSS. أعتقد أن هناك المزيد لاستكشافه في هذا المجال، ولا أطيق الانتظار لمعرفة ما يبتكره الآخرون.
ركّزت المحادثة أيضًا على طلبات البحث المستندة إلى الحجم، باعتبارها حالة الاستخدام الأصلية، لكنني متحمّس لمعرفة ما يفعله المستخدمون باستخدام طلبات بحث الأنماط، وهي القدرة على كتابة أنماط شرطية بالاستناد إلى قيمة سمة أو متغيّر CSS. إنها ميزة قوية للغاية، ومعظمها لم يتم استكشافها حتى الآن. أعتقد أنه يفتح المزيد من الفرص الإبداعية!
راشيل: هل هناك أي إجراءات لا يمكننا تنفيذها (أو في المستقبل) بشأن CSS قد تكون مفيدة؟
مريم: أنا متحمسة جدًا بشأن بعض المواصفات الأخرى التي كنت أعمل عليها. ستمنح الطبقات المتتالية المؤلفين مزيدًا من التحكّم في المشاكل المتعلّقة بالخصوصية، ومن المفترض أن يساعد النطاق في استخدام أدوات اختيار أكثر دقة. لكن كلاهما مخاوف معمارية عالية المستوى. يتحمّس الفنان للحصول على المزيد من العناصر، مثل عناصر إيقاف/تفعيل CSS، أو طريقة وصفية لإنشاء أنماط تفاعلية، أو "المخططات الزمنية" لحاوية، ما يتيح لنا نقل القيم بسلاسة بين الوسائط أو النقاط الفاصلة للحاويات. هذا له آثار عملية للغاية على أسلوب الخط سريع الاستجابة، ولكنه من شأنه أيضًا أن يفتح الكثير من الفرص الإبداعية للفن سريع الاستجابة والرسوم المتحركة.
راشيل: من الذي يجري حاليًا أعمالًا شيّقة أو مسلّية أو إبداعية على الويب؟
ميريام: لا أعرف بالضبط ما الإجابة عن هذا السؤال: هناك العديد من الأشخاص الذين يؤدون عملاً إبداعيًا في مجالات مختلفة. هناك الكثير من المعايير الشيّقة التي يتم العمل عليها حاليًا من خلال كل من CSSWG وOpen-UI، بما في ذلك بعض أعمالك المتعلقة بتقسيم النتائج. لكنني غالبًا ما أجد أكبر قدر من الإلهام من فناني الويب، وكيف يستخدم المستخدمون هذه الأدوات في الإنتاج بطرق غير مرتبطة مباشرةً بالتجارة. أشخاص مثل Jhey أو لين فيشر أو يوان تشوان أو العديد من الأشخاص الآخرين الذين يتخطون حدود الإمكانات التي يمكن لتكنولوجيات الويب تنفيذها بشكل مرئي وتفاعلي. حتى الأشخاص الذين يقومون بمزيد من الأعمال المتعلقة بالأعمال يمكنهم تعلم الكثير من أساليبهم الفنية.
أقدّر أيضًا فن الويب الذي يتكوّن من مفاهيم أكثر تفصيلاً، مثل بن غروسر، الذي يدفعنا باستمرار إلى إعادة النظر في ما نريده من الويب، ووسائل التواصل الاجتماعي على وجه الخصوص. اطلع على قناة minus.social الجديدة على سبيل المثال.
راشيل: يمكنك متابعة آخر أخبار ميريام على خدمات CSS على css.oddbird.net والاطّلاع على آخر الأخبار التي تنوي تنفيذها من خلال موقعها الإلكتروني على الرابط miriam.codes وTwitter @TerribleMia.