متشکرم (نسخه 2022)

می دانید، این زمانی از سال است که کریس به طور معمول بازتابی بزرگ از سال گذشته منتشر می کند. این اولی در سال 2007 منتشر شد، همان سالی که CSS-Tricks شروع به کار کرد، و آن را تا سال 2021 ادامه یافت بدون از دست دادن یک ضربه من که خودم در تمام آن سال‌ها خواننده CSS-Tricks بودم، از دیدن این تغییر متنفرم.

بنابراین، ما اینجا هستیم! سال 2022 مطمئناً یک سال هکووا از نظر انتقال بود. در این زمان سال گذشته، ما به دنبال اهدافی برای سال آینده بودیم (که به آنها خواهیم رسید) اما به DigitalOcean پیوستیم. این یک تغییر بزرگ دریایی بود (جناسی در نظر گرفته شده) و با این حال شما در تمام راه با ما ماندید. واقعاً برای من بسیار معنی دارد که بسیاری از شما به اینجا می آیید تا مطالبی را بخوانید که من و تعداد زیادی از نویسندگان مهمان دیگر در اینجا منتشر می کنیم. این فقط یک جامعه (یا هیچ سرگرمی) بدون شما نیست.

متشکرم!

این آخرین پستی است که امسال در حالی که تابلوی Gone Fishin خود را برای تعطیلات آویزان می کنیم منتشر می کنیم. ما برمی گردیم ژانویه 9 با انبوهی از محتویات تازه از فر.

خوب، اینجاست که ما شروع به کندوکاو در تجزیه و تحلیل سایت می کنیم. این چیزی است که ما همیشه در مورد آن شفاف بوده ایم و به انجام آن ادامه خواهیم داد. اینطور نیست که شماره‌های ما در جعبه سیاه غیرمحدود باشد، و امید این است که اشتراک‌گذاری آنها به نحوی به شما و کسب‌وکارتان کمک کند.

ترافیک کلی

به طور کلی، گوگل آنالیتیکس در مجموع نشان می دهد 64m بازدید از صفحه برای کل سال یعنی واییییی نسبت به سال گذشته 88 متر کاهش یافته است که در نگاه اول هشدار دهنده است. منظورم این است که چه کسی می خواهد یک را ببیند ٪۱۰۰ کاهش ترافیک سال به سال؟

اما دلیل خوبی برای آن وجود دارد زیرا ما یک را منتشر کردیم وای امسال محتوای کمتری دارد همه ما می دانیم که کریس نویسنده ای پرکار بود (و هنوز هستالبته)، اغلب در روز چندین پست را بیرون می اندازد. مثل این است که ما سازنده ترین مشارکت کننده خود را در بخش عمده سال از دست دادیم. بیایید فعالیت انتشارات در چند سال اخیر را با هم مقایسه کنیم:

• 2020: 1,183 مقالات
• 2021: 890 مقالات
• 2022: 390 مقالات

کاهش 27 درصدی در بازدید از صفحه با توجه به انتشار ما بسیار کمتر است ٪۱۰۰ مقالات کمتر نسبت به سال گذشته و بسیار زیاد 67% کمتر از کل سال 2020

هوم، من احساس نمی کنم 67 درصد کمتر کار می کنم…

و همه اینها با این هشدار همراه است که این همان چیزی است که ما از Google Analytics دریافت می کنیم. در سال‌های گذشته، کریس این اعداد را با آمارهای موجود مقایسه کرده است CloudFlare را (لایه CDN که در بالای سایت قرار دارد) و Jetpack (افزونه ای که سایت وردپرس خود میزبان ما را به ویژگی های SaaS-y WordPress.com متصل می کند). نتایج همیشه به‌طور مداوم ناسازگار هستند تا جایی که من حتی حوصله نگاه کردن به آن را ندارم. (بسیار خوب، شاید فقط Jetpack ... که 59.9 میلیون بازدید از صفحه را نشان می دهد - به طرز عجیبی بیشتر از کل 2021 میلیون سال 55 است.)

مقالات، بر اساس اعداد

این چیزی است که من همیشه منتظر آن هستم هر سال! در اینجا ده مقاله برتر در سال 2022 آمده است در سال 2022 منتشر شد:

1. 6 ایده خلاقانه برای جلوه های شناور پیوند CSS - هارشیل پاتل
2. 10 خط اول کد منبع توییتر را برای من توضیح دهید - آناند چوداری
3. داغ ترین ابزارهای فرانت اند در سال 2021 چه بودند؟ - لوئیس لازاریس
4. دیالوگ های جاوا اسکریپت را با عنصر گفتگوی جدید HTML جایگزین کنید - مدز استومن
5. به منوی انتخاب، یک عنصر انتخابی کاملاً سبک، سلام کنید - پاتریک بروست
6. زمانی که کاربر صفحه ای را ترک می کند، به طور قابل اعتماد یک درخواست HTTP ارسال کنید - الکس مک آرتور
7. grid-template-columns - مجتبی سیدی
8. راهنمای کامل لایه‌های آبشار CSS - میریام سوزان
9. پرس و جوهای پایگاه داده CSS؟ مطمئنا می توانیم! - کریس کویر
10. CSS-Tricks به DigitalOcean می پیوندد! - کریس کویر

من واقعاً متعجبم که آخرین مورد در لیست بالاتر نبود. و من واقعاً از دیدن یکی از Alamanac در آنجا خوشحال شدم، به خصوص به این دلیل که مجتبی در تمام ویژگی های CSS Grid در طول یک سال و نیم گذشته و او آن را از زمین توپ بیرون زد. فکر می‌کردم دسته خوبی روی شبکه دارم تا اینکه شروع کردم به خواندن تمام قطعات طلایی که او در هر ملک بسته‌بندی می‌کرد. چیزهای زیادی برای یادگیری وجود دارد و مجتبی در توضیح واضح چیزهای پیچیده مهارت دارد. من امیدوارم که به روز رسانی راهنمای گرید CSS با تمام آن اطلاعات تازه (اما در مورد آن در کمی بیشتر).

من دوست دارم راهنمای لایه‌های آبشار CSS را نیز در آنجا ببینم! کار کردن با میریام روی آن بسیار لذت بردم. اگر نمی دانستی، او یک ویرایشگر برای مشخصات است. میزبانی کار او در اینجا و در دسترس قرار دادن آن برای نشانک گذاری و ارجاع برای همه ما یک لذت (و واقعاً افتخار است).

در اینجا 11-20 برای ضربات است:

11. انیمیشن با جاوا اسکریپت پایه -Md Shuvo
12. Flutter برای توسعه دهندگان وب فرانت اند -اوبومونم نوابود
13. CSS Grid and Custom Shapes، قسمت 1 - تمانی عفیف
14. HTML بنویسید، روش HTML (نه راه XHTML) - ینس الیور مایرت
15. یک تور Whistle-Stop از 4 ویژگی جدید رنگ CSS - کریس کویر
16. جلوه های Hover جالب که از ویژگی های پس زمینه استفاده می کنند - تمانی عفیف
17. بیایید یک زبان برنامه نویسی کوچک بسازیم - Md Shuvo
18. جلوه های شناور CSS جالب که از برش پس زمینه، ماسک و سه بعدی استفاده می کنند - تمانی عفیف
19. یک فهرست کامل از مطالب با HTML + CSS - نیکلاس سی زکاس
20. اثر انگشت مبتنی بر CSS - کریس کویر

همه پست هایی که در سال 2022 منتشر شده اند را تشکیل می دهند 4.8m بازدید از صفحه یا در مورد ٪۱۰۰ از تمام بازدیدهای صفحه پربازدیدترین مقاله ما همیشه ol است راهنمای فلکس باکس که به دست آورد 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 در 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 بسیار تغییر خواهد کرد. اگر با ماهنامه ما همراه بوده اید پشت صحنه CSS به‌روزرسانی‌ها، پس می‌دانید که ما قصد داریم CSS-Tricks را از وردپرس به همان CMS خانگی که DigitalOcean برای همه (ستاره‌ای) خود استفاده می‌کند، منتقل کنیم. محتوای جامعه.

این کار چند ماه پیش شروع شد و باید در نیمه اول سال انجام شود. شما می توانید شرط بندی کنید که در طول مسیر شما را به روز خواهیم کرد. علاوه بر الف طراحی تازه و یک بک‌اند جدید، باید طبق معمول کار کند. اگر سؤالی در مورد آن کار و معنای آن برای انتشارات مورد علاقه خود دارید، لطفاً به من سر بزنید در نظرات or به من ایمیل بزن.

اگر هنوز آن را ندیده‌اید، در اینجا چند کامپوزیت وجود دارد که طراح ما، لوگان لیفیک، گردآوری کرده است:

بررسی گل 2021

اوه، من حتی برای نگاه کردن هم مردد هستم. تمام تلاشی که برای ادغام با DigitalOcean و یافتن یک ریتم جدید انجام شد، بر زمان همه چیره شد و چیزهای گرانبهایی برای شکاف در اهداف کریس باقی نگذاشت که عبارت بودند از:

• ✅ تمرکز بیشتر سئو. اینجا به ما نمره قبولی میدم. حقیقت این است که من و کریس قبلاً قبل از خرید به دنبال این موضوع بودیم. ما افزونه Yoast SEO را با RankMath جایگزین کردیم و از ابزارهای درون ویرایشگر آن استفاده کردیم تا به ما کمک کند تا یاد بگیریم چگونه پست های خود را برای نتایج جستجو بهینه کنیم. و برای روشن بودن: افزایش ترافیک برای درآمد بیشتر حمایت مالی کمتر از تشخیص این است که جستجو راه اصلی یافتن ما توسط خوانندگانی مانند شما است و یافتن آنچه را که به دنبالش هستید برای شما آسان‌تر می‌کند. این به ویژه در حال حاضر صادق است که ما توسط DigitalOcean حمایت می‌شویم و کمتر از گذشته به حمایت‌های مالی متکی هستیم.
• 🚫 یک کتاب دیجیتالی دیگر. تاب و یک خانم! خب، ما هرگز در وهله اول تاب نخوردیم، یا برای آن موضوع وارد جعبه خمیر نشدیم. (آیا قیاس های ورزشی اینگونه عمل می کنند؟) کریس کتابی را منتشر کرد بهترین ترفندهای CSS در سال 2020 و آن را به یک امتیاز مشترک پولی CSS-Tricks تبدیل کرد. ایده این بود که امسال یکی دیگر را انجام دهیم، اما ما از شر اشتراک های پولی خلاص شدیم و The Greatest CSS Tricks را برای لذت بردن همه، رایگان باز کردیم.
• 🚫 آزمایش بیشتر در رسانه های اجتماعی جواب منفی! اما با توجه به اینکه توییتر در این ثانیه در کجا قرار دارد، ممکن است بهترین باشد. ممکن است سال آینده بیشتر از سر ناچاری مجبور شویم در این زمینه آزمایش کنیم تا علاقه. توییتر همیشه یک قطره در سطل ضرب المثل ترافیک CSS-Tricks بوده است. به حدی که سرمایه گذاری روی آن احساس می کند تخم مرغ هایمان را در سبد اشتباهی قرار می دهیم، ای سطل. نمیدونم. بخشی از من فقط می‌خواهد روی دستانم بنشیند و قبل از تصمیم‌گیری در مورد هر چیز جدید یا متفاوت، ببیند که اوضاع چگونه تکان می‌خورد.

هدف گذاری 2023

سال جدید، اهداف جدید، درست است؟ به من اجازه دهید دسته ای از کلمات را در دهان تیم قرار دهم و آنچه را که فکر می کنم اولویت های اصلی ما در سال 2023 است را پیش بینی کنم:

• مهاجرت آرام سایت هیچ چیز مرا خوشحال نمی کند¹ از یک حرکت بدون سکسکه به معماری DigitalOcean. اما بیایید، همه ما می دانیم چیزی همیشه وقتی زمان رفتن است بالا می آید. این سایت دارای بیش از 7,000 مقاله است که در طی 15 سال نوشته شده است و 1 مورد9 نسخه از سایت در آن بازه زمانی انواع پست سفارشی، فیلدهای سفارشی، قالب‌های صفحه، پلاگین‌های عملکردی، ادغام‌ها و پایگاه داده‌ای بیش از 6 گیگابایت برای جابجایی و نقشه‌برداری به یک سیستم موجود بسیار زیاد است. خوب است که ما تیمی از توسعه دهندگان درجه یک اینجا داریم که آن را به عهده بگیرند!
• 1-2 راهنمای جدید منتشر کنید. من دوست دارم بالاتر هدف بگیرم، در واقع. ما از نه راهنمای جدید در سال 2020 به یک راهنمای ناچیز در سال 2021 و یکی دیگر در سال گذشته رسیدیم: میریام راهنمای کامل لایه‌های آبشار CSS. من فهرستی از 10 مورد دیگر را دارم که دوست دارم بنویسم، اما فکر می کنم با توجه به سابقه اخیرمان، این نوار را بسیار پایین خواهیم گذاشت. قبلاً اشاره کردم که دوست دارم کارهای مجتبی را در سالنامه در راهنمای گرید CSS موجود بگنجانم. این کار کمی نیست و اگر بتوانیم آن را به پایان برسانیم، آن را برای هدف حساب می کنم.
• سالنامه را گسترش دهید. این مهتاب من است من دوست دارم انواع بیشتری از اسناد را در آنجا ببینم. ما شبه انتخابگرها و خواص داریم که عالی است و همیشه بوده است. اما، عزیزم، به همه چیزهای دیگری که می‌توانیم در آنجا داشته باشیم فکر کنید: توابع، قوانین، واحدها، انتخابگرها، ارزش‌های دارایی، و غیره. اگر حتی یکی از آن‌ها را داشته باشیم، من وارد آن می‌شوم place-self: heaven.

ممنونم، پس، so بسیار!

این شغل رویایی من است و بدون خوانندگانی مانند شما آن را نخواهم داشت. من نمی توانم باور کنم که هشت سال از انتشار اولین مقاله من می گذرد و من هنوز اینجا هستم، کار با از باهوش ترین ذهن ها در زمینه ما یاد بگیریم. من می توانم (بیشتر از آنچه قبلاً داشتم) در مورد اینکه جامعه CSS-Tricks چقدر برای من اهمیت دارد، صحبت کنم، اما آنچه که واقعاً به آن می انجامد این است که… متشکرم، متشکرم، متشکرم. از صمیم قلبم، متشکرم.

و با تشکر از همه افراد خوب اینجا در DigitalOcean که خانه ای عالی برای CSS-Tricks ساخته اند. هیلی میلز، سیدنی راسمن رایش، برادلی کوچی، کارن دیجی، دیوید برگ، مت کراولی، لوگان لیفیک و کرستین کلوگ به خاطر اینکه شخصاً من را به سرعت آماده کرده‌اند و احساس می‌کنم در اینجا بسیار خوش‌آمد می‌شوم، هیلی میلز، سیدنی راسمن رایش، فوق‌العاده ویژه هستند. این یک مکان عالی برای بودن است.

جلو، ما می رویم!