شكرًا لك (إصدار 2022) ذكاء بيانات PlatoBlockchain. البحث العمودي. منظمة العفو الدولية.

شكرًا لك (إصدار 2022)

كما تعلم ، هذا هو الوقت من العام الذي ينشر فيه كريس عادةً انعكاسًا كبيرًا للسنة الماضية. ال أول واحد تم نشره في عام 2007 ، وهو نفس العام الذي بدأ فيه CSS-Tricks ، وكان استمر على طول الطريق حتى عام 2021 دون أن يفوتك أي إيقاع. بعد أن كنت قارئًا لـ CSS-Tricks بنفسي طوال تلك السنوات ، كنت أكره رؤية هذا التغيير.

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

شكرا لك!

هذا هو آخر منشور ننشره هذا العام حيث نعلق علامة Gone Fishin الخاصة بنا في الأعياد. سوف نعود ٢٨ مع فيض من المحتوى الطازج من الفرن.

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

حركة المرور بشكل عام

بشكل عام ، يعرض Google Analytics ما مجموعه 64m مرات مشاهدة الصفحة للعام بأكمله. هذا ييييي أقل من 88 مليون في العام الماضي ، وهو أمر ينذر بالخطر للوهلة الأولى. أعني من يريد أن يرى أ 27% انخفاض في حركة المرور على أساس سنوي؟

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

  • 2020: المواد 1,183
  • 2021: المواد 890
  • 2022: المواد 390

يعتبر الانخفاض بنسبة 27٪ في مشاهدات الصفحة أقل إثارة للقلق بالنظر إلى ما نشرناه 43% مقالات أقل من العام الماضي ، وهائلة 67% أقل من الإجمالي الإجمالي لعام 2020.

حسنًا ، لا أشعر أنني أعمل أقل بنسبة 67٪ ...

وكل هذا يأتي مع تحذير مفاده أن هذا هو ما نحصل عليه من Google Analytics. في السنوات الماضية ، قارن كريس هذه الأرقام بإحصائيات من كلودفلاري (طبقة CDN الموجودة أعلى الموقع) و Jetpack ل (المكون الإضافي الذي يربط موقع WordPress المستضاف ذاتيًا بميزات SaaS-y الخاصة بـ WordPress.com). دائمًا ما تكون النتائج غير متسقة إلى الحد الذي لا أزعجني فيه البحث هذه المرة. (حسنًا ، حسنًا ، ربما فقط Jetpack ... الذي يُظهر 59.9 مليون مشاهدة للصفحة - بشكل غريب أكثر من 2021 إجمالي 55 مليونًا.)

المقالات بالأرقام

هذا ما أتطلع إليه دائمًا كل عام! فيما يلي أهم عشرة مقالات في عام 2022 تم نشرها في عام 2022:

  1. 6 أفكار إبداعية لتأثيرات CSS Link Hover - هارشيل باتيل
  2. اشرح لي الأسطر العشرة الأولى من كود مصدر تويتر - أناند شودري
  3. ما هي أهم أدوات الواجهة الأمامية في عام 2021؟ - لويس لازاريس
  4. استبدل مربعات حوار JavaScript بعنصر حوار HTML الجديد - مادس ستومان
  5. قل مرحبًا لـ selectmenu ، وهو عنصر محدد قابل للنمط بالكامل - باتريك بروسيت
  6. يمكنك الاعتماد على إرسال طلب HTTP عندما يغادر المستخدم الصفحة - أليكس ماك آرثر
  7. grid-template-columns - مجتبى سيدي
  8. دليل كامل لطبقات CSS Cascade - ميريام سوزان
  9. استعلامات قاعدة بيانات CSS؟ طبعا نحن نستطيع! - كريس كويير
  10. تنضم CSS-Tricks إلى DigitalOcean! - كريس كويير

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

أحب رؤية دليل CSS Cascade Layers هناك أيضًا! لقد استمتعت كثيرًا بالعمل مع ميريام عليها. إذا كنت لا تعرف ذلك ، إنها محررة للمواصفات. إنه لمن دواعي سروري (وشرف حقًا) استضافة عملها هنا وإتاحته لنا جميعًا لوضع إشارة مرجعية عليه.

إليك 11-20 للركلات:

  1. الرسوم المتحركة باستخدام JavaScript أساسي —مد شوفو
  2. Flutter لمطوري الويب الأمامي - أوبونيمي نوابود
  3. شبكة CSS والأشكال المخصصة ، الجزء الأول - تماني عفيف
  4. اكتب HTML ، طريقة HTML (ليس بطريقة XHTML) - جنس أوليفر ميرت
  5. جولة Whistle-Stop لـ 4 ميزات ألوان جديدة لـ CSS - كريس كويير
  6. تأثيرات التحويم الرائعة التي تستخدم خصائص الخلفية - تماني عفيف
  7. لنقم بإنشاء لغة برمجة صغيرة - ام دي شوفو
  8. تأثيرات التحويم الرائعة في CSS التي تستخدم قصاصات الخلفية والأقنعة والأبعاد الثلاثية - تماني عفيف
  9. جدول محتويات مثالي مع HTML + CSS - نيكولاس سي زاكاس
  10. البصمات المستندة إلى CSS - كريس كويير

جميع المنشورات التي تم نشرها في عام 2022 تتشكل 4.8m أو ما يقرب من 7.8% من جميع مشاهدات الصفحة. مقالتنا الأكثر مشاهدة هي دائمًا دليل Flexbox التي حصدت 5.8m وجهات النظر هذا العام. أود أن أرى المحتوى الجديد يفوق هذا العنصر ، وأعتقد أن هذا كان سيحدث بسهولة إذا واصلنا وتيرة النشر. عودة إلى رياضيات المناديل هنا ، لكن ربما نكون قد قمنا بحوالي 67 مليون مشاهدة للصفحة إذا نشرنا 540 مقالة أخرى لتتناسب مع عدد المقالات المنشورة في العام الماضي.

إذا عدنا بضع خطوات إلى الوراء ، فيمكننا رؤية المقالات الأكثر مشاهدة من العام الماضي ، بغض النظر عن تاريخ نشرها:

  1. دليل كامل إلى Flexbox
  2. دليل كامل للشبكة
  3. صورة خلفية كاملة للصفحة الكاملة
  4. أشكال CSS
  5. استعلامات الوسائط للأجهزة القياسية
  6. باستخدام SVG
  7. كيفية قياس ملف SVG
  8. مثلث CSS
  9. حدود التدرج في CSS
  10. السلسلة المقطوعة مع القطع الناقص
  11. طريقة الاستخدام @font-face في CSS

نعم ، مطابق تقريبًا للسنة الماضية. والسنة السابقة. والسنة السابقة. و ... حسنًا ، تقريبًا. "Gradient Borders in CSS" جديد ، يصطدم بـ box-shadow الممتلكات خارج القائمة. كل شيء آخر من النقطة الأربعة في مجرد أماكن متبادلة.

بالحديث عن الخصائص في التقويم ، أريد أن أرى ما أشرت إليه جميعًا في العام الماضي:

  1. ::after / ::before
  2. transition
  3. box-shadow
  4. scrollbar
  5. justify-content
  6. flex-wrap
  7. gap
  8. overflow-wrap
  9. animation
  10. white-space

واحد زائف في الأعلى ولا شيء سوى خصائص بعد ذلك. مثير للاهتمام ، بالنظر إلى أن وظائف المحدد الزائف العلائقي مثل :has(), :is()و :where() هم أطفال جدد في المبنى.

بريدك الإلكتروني

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

الاخبار الجيدة؟ ما زلنا نصدر النشرة الإخبارية! نحن في الواقع أطلقها احتياطيًا في أغسطس بعد توقف دام خمسة أشهر. كنا في إيقاع أسبوعي ، لكننا مرة واحدة في الشهر الآن بينما تقوم بتأليفها حقًا. آمل بالتأكيد أن أعيدها إلى مطبوعة أسبوعية. (اشتقت لك يا روبن!)

تحديثات الموقع

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

سيغير ذلك وقتًا كبيرًا في عام 2023. إذا كنت تواكب أخبارنا الشهرية خلف CSScenes التحديثات ، فأنت تعلم أننا نخطط لترحيل CSS-Tricks من WordPress إلى نفس نظام إدارة المحتوى المنزلي الذي تستخدمه DigitalOcean لجميع (ممتاز) محتوى المجتمع.

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

إذا لم تكن قد شاهدته بعد ، فإليك بعض التراكيب التي وضعها مصممنا ، لوجان ليفيك:

2021 مراجعة الهدف

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

  • المزيد من التركيز على تحسين محركات البحث. سأعطينا درجة النجاح هنا. الحقيقة هي أنني وكريس كنا نحفر بالفعل في هذا الأمر قبل الاستحواذ. لقد استبدلنا مكوّن Yoast SEO الإضافي بـ RankMath ، مستفيدين من أدوات التحرير الموجودة به لمساعدتنا على تعلم كيفية تحسين منشوراتنا لنتائج البحث. ولكي نكون واضحين: لا يتعلق الأمر بزيادة حركة المرور للحصول على المزيد من عائدات الرعاية بقدر ما يتعلق بإدراك أن البحث هو الطريقة الأساسية التي يجدها القراء مثلك ، ويسهل عليك العثور على ما تبحث عنه. هذا صحيح بشكل خاص الآن لأننا مدعوم من DigitalOcean ونعتمد على الرعاية بطريقة أقل مما اعتدنا عليه.
  • 🚫 كتاب رقمي آخر. تأرجح وتفوت! حسنًا ، لم نتأرجح أبدًا في المقام الأول ، أو صعدنا إلى صندوق الخليط لهذه المسألة. (هل هذه هي الطريقة التي تعمل بها المقارنات الرياضية؟) نشر كريس كتابًا عن أعظم الحيل CSS في عام 2020 وجعلها ميزة لكونك مشتركًا مدفوعًا في CSS-Tricks. كانت الفكرة هي عمل واحدة أخرى هذا العام ، لكننا تخلصنا من الاشتراكات المدفوعة وفتحنا The Greatest CSS Tricks حتى يستمتع بها الجميع مجانًا.
  • 🚫 المزيد من التجارب على وسائل التواصل الاجتماعي. لا! ولكن قد يكون هذا هو الأفضل ، بالنظر إلى موقع Twitter الصحيح في هذه اللحظة. قد نضطر إلى تجربة هذا المجال في العام المقبل بدافع الضرورة أكثر من الاهتمام. لطالما كان موقع Twitter نقطة انطلاق في المجموعة التي يضرب بها المثل في حركة مرور CSS-Tricks ؛ لدرجة أن الاستثمار فيه يبدو وكأنه وضع بيضنا في السلة الخطأ ، أو دلو. لا أدري. جزء مني يريد فقط الجلوس على يدي ورؤية كيف تهتز الأمور قبل اتخاذ قرار بشأن أي شيء جديد أو مختلف.

2023 تحديد الأهداف

عام جديد ، أهداف جديدة ، أليس كذلك؟ اسمح لي بوضع مجموعة من الكلمات في فم الفريق وعرض ما أشعر أنه من أهم الأولويات بالنسبة لنا ونحن نتجه إلى عام 2023:

  • ترحيل سلس للموقع. لا شيء يجعلني أكثر سعادة1 من انتقال خالٍ من الفواق إلى هندسة DigitalOcean. لكن هيا ، نعلم جميعًا شيء دائما يأتي عندما يحين الوقت. يحتوي هذا الموقع على أكثر من 7,000 مقالة تمت كتابتها على مدار 15 عامًا ، وكان هناك 19 إصدارات للموقع في تلك الفترة الزمنية. هناك العديد من أنواع المنشورات المخصصة ، والحقول المخصصة ، وقوالب الصفحات ، والمكونات الإضافية للوظائف ، والتكاملات ، وقاعدة بيانات يزيد حجمها عن 6 جيجابايت للانتقال والتعيين إلى نظام موجود. من الجيد أن لدينا فريقًا من المطورين المتميزين هنا للقيام بذلك!
  • انشر دليلين جديدين. في الواقع ، أود أن أهدف إلى مستوى أعلى. انتقلنا من تسعة أدلة جديدة في عام 2020 إلى دليل تافه واحد جديد في عام 2021 ، وآخر في العام الماضي: ميريام الدليل الكامل لطبقات CSS Cascade. لدي قائمة بعشرة أخرى أود كتابتها ، لكن أعتقد أننا سنضع المعيار منخفضًا للغاية نظرًا لسجلنا الأخير. لقد ذكرت سابقًا أنني أرغب في دمج عمل مجتبى في التقويم في دليل CSS Grid الحالي. هذا ليس قدرًا ضئيلًا من العمل وسأحسبه نحو الهدف إذا تمكنا من تحقيقه.
  • قم بتوسيع التقويم. هذه هي طلتي. أرغب في رؤية المزيد من أنواع التوثيق هناك. لدينا محددات وخصائص زائفة ، وهو أمر رائع وكان دائمًا كذلك. لكن ، جيز ، فكر في كل الأشياء الأخرى التي يمكن أن تكون لدينا هناك: الدوال ، القواعد ، الوحدات ، المحددات ، قيم الخصائص ، إلخ. نحن فقط نخدش سطح ما يمكن أن يحدث هناك! إذا حصلنا على واحدة من هؤلاء ، فسأكون فيها place-self: heaven.

شكرا لك so كثير!

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

وبفضل جميع الأشخاص الرائعين هنا في DigitalOcean الذين صنعوا موطنًا رائعًا لـ CSS-Tricks. حفلات أعياد الميلاد الخاصة للغاية إلى هالي ميلز ، وسيدني روسمان رايش ، وبرادلي كوتشي ، وكارين ديجي ، وديفيد بيرج ، ومات كرولي ، ولوجان ليفيك ، وكيرستين كيلوج ، لأنهم ساعدوني شخصيًا على مواكبة السرعة وجعلني أشعر بالترحيب هنا. إنه مكان رائع.

إلى الأمام ، نذهب!

الطابع الزمني:

اكثر من الخدع المغلق