Dziękuję (wydanie 2022)

Wiesz, o tej porze roku Chris zwykle publikuje duże podsumowanie minionego roku. The pierwszy została opublikowana w 2007 roku, w tym samym roku, w którym rozpoczęła się CSS-Tricks, i to trwał przez cały 2021 rok bez utraty rytmu. Będąc czytelnikiem CSS-Tricks przez te wszystkie lata, nie chciałbym widzieć tej zmiany.

I oto jesteśmy! Rok 2022 był z pewnością cholernie udanym rokiem, jeśli chodzi o zmiany. W zeszłym roku o tej porze zastanawialiśmy się nad niektórymi celami na nadchodzący rok (do którego dojdziemy), ale ostatecznie dołączyliśmy do DigitalOcean. To była ogromna zmiana morska (zamierzona gra słów), a mimo to pozostaliście z nami przez cały czas. To naprawdę wiele dla mnie znaczy, że tak wielu z was przychodzi tutaj, aby przeczytać rzeczy, które publikuję tutaj ja i wielu innych gościnnych pisarzy. To po prostu nie jest społeczność (ani żadna zabawa) bez was wszystkich.

Dziękuję Ci!

To ostatni post, który publikujemy w tym roku, gdy wieszamy nasz szyld Gone Fishin' na święta. Wrócimy Styczeń 9 z mnóstwem treści prosto z pieca.

OK, tutaj zaczynamy zagłębiać się w dane analityczne witryny. To jest coś, o czym zawsze byliśmy transparentni i nadal będziemy to robić. To nie jest tak, że nasze numery są w jakiejś czarnej skrzynce, która jest niedostępna, i mamy nadzieję, że udostępnianie ich w jakiś sposób pomoże Tobie i Twojej firmie.

Ogólny ruch

Ogólnie Google Analytics pokazuje łącznie 64m odsłon przez cały rok. To jest sposóbyyyy w porównaniu z zeszłorocznymi 88 mln, co na pierwszy rzut oka jest niepokojące. Mam na myśli, kto chce zobaczyć 27% spadek ruchu rok do roku?

Ale jest ku temu dobry powód, ponieważ opublikowaliśmy yyyy mniej treści w tym roku. Wszyscy wiemy, że Chris był płodnym pisarzem (i wciąż jest, oczywiście), często wypluwając wiele postów dziennie. To trochę tak, jakbyśmy stracili najbardziej produktywnego współpracownika przez większą część roku. Porównajmy działalność wydawniczą z ostatnich kilku lat:

• 2020: Artykuły 1,183
• 2021: Artykuły 890
• 2022: Artykuły 390

Spadek liczby odsłon o 27% jest o wiele mniej niepokojący, biorąc pod uwagę, że opublikowaliśmy 43% mniej artykułów niż w zeszłym roku, a aż ogrom 67% mniej niż ogółem w 2020 r.

Hmm, nie wydaje mi się, żebym pracował 67% mniej…

A wszystko to wiąże się z zastrzeżeniem, że to właśnie otrzymujemy z Google Analytics. W ostatnich latach Chris porównywał te liczby ze statystykami z Cloudflare (warstwa CDN, która znajduje się na górze witryny) i Jetpack (wtyczka, która łączy naszą samoobsługową witrynę WordPress z funkcjami SaaS-y WordPress.com). Wyniki są zawsze konsekwentnie niespójne do tego stopnia, że ​​tym razem nawet nie zawracam sobie głowy rozglądaniem się. (Dobra, dobra, może tylko Jetpack… który pokazuje 59.9 miliona odsłon — co dziwne więcej niż łącznie 2021 milionów w 55 roku.)

Artykuły, według numerów

To jest to, na co zawsze czekam każdego roku! Oto dziesięć najpopularniejszych artykułów w 2022 r zostały opublikowane w 2022 r:

1. 6 kreatywnych pomysłów na efekty najechania na link CSS — Harszil Patel
2. Wyjaśnij mi pierwsze 10 wierszy kodu źródłowego Twittera — Ananda Chowdhary’ego
3. Jakie były najgorętsze narzędzia front-endowe w 2021 roku? — Ludwik Łazaris
4. Zastąp okna dialogowe JavaScript nowym elementem okna dialogowego HTML — Madsa Stoumanna
5. Przywitaj się z selectmenu, w pełni stylowym elementem wyboru — Patryk Brosset
6. Niezawodnie wysyłaj żądanie HTTP, gdy użytkownik opuszcza stronę — Alexa MacArthura
7. grid-template-columns — Mojtaba Seyedi
8. Kompletny przewodnik po warstwach kaskadowych CSS — Miriam Zuzanna
9. Zapytania bazy danych CSS? Oczywiście, możemy! — Chrisa Coyiera
10. CSS-Tricks dołącza do DigitalOcean! — Chrisa Coyiera

Właściwie jestem zaskoczony, że ostatni nie był wyżej na liście. I jestem naprawdę podekscytowany, widząc tam jednego z Alamanachu, zwłaszcza że Mojtaba odłupał wszystkie właściwości siatki CSS przez ostatnie półtora roku i wybił go z boiska. Myślałem, że dobrze sobie radzę z siatką, dopóki nie zacząłem czytać wszystkich samorodków złota, które pakował w każdą posiadłość. Jest tam tak wiele do nauczenia się, a Mojtaba ma talent do jasnego wyjaśniania skomplikowanych rzeczy. Mam nadzieję, że zaktualizuję Przewodnik po siatce CSS z tymi wszystkimi świeżymi informacjami (ale o tym za chwilę).

Uwielbiam też widzieć tam przewodnik CSS Cascade Layers! Świetnie się bawiłem, pracując nad nim z Miriam. Gdybyś tego nie wiedział, ona jest redaktorem spec. To przyjemność (i naprawdę zaszczyt) gościć tutaj jej prace i udostępniać je nam wszystkim do zakładek i odniesienia.

Oto 11-20 na zachętę:

11. Animacja z podstawowym JavaScriptem —Md Shuvo
12. Flutter dla programistów Front-End Web — Obumuneme Nwabude
13. Siatka CSS i niestandardowe kształty, część 1 — Temani Afif
14. Pisz HTML, sposób HTML (nie sposób XHTML) — Jensa Olivera Meierta
15. Przewodnik po 4 nowych funkcjach kolorystycznych CSS — Chrisa Coyiera
16. Fajne efekty najechania, które wykorzystują właściwości tła — Temani Afif
17. Stwórzmy mały język programowania — Panie Shuvo
18. Fajne efekty CSS Hover, które wykorzystują przycinanie tła, maski i 3D — Temani Afif
19. Doskonały spis treści z HTML + CSS — Mikołaj C. Zakas
20. Odcisk palca oparty na CSS — Chrisa Coyiera

Wszystkie posty, które zostały opublikowane w 2022 roku składają się 4.8m odsłon lub o 7.8% wszystkich odsłon. Naszym najczęściej oglądanym artykułem jest zawsze stary Przewodnik po Flexboksie który zdobył 5.8m wyświetleń w tym roku. Chciałbym, aby nasza nowa zawartość prześcignęła ten jeden element i wierzę, że łatwo by się to stało, gdybyśmy utrzymali tempo publikacji. Wróćmy do matematyki na serwetkach, ale moglibyśmy mieć około 67 milionów odsłon, gdybyśmy opublikowali 540 artykułów więcej, aby dorównać liczbie opublikowanych artykułów w zeszłym roku.

Jeśli cofniemy się o kilka kroków, zobaczymy najczęściej oglądane artykuły z ostatniego roku, niezależnie od tego, kiedy zostały opublikowane:

1. Kompletny przewodnik po Flexbox
2. Kompletny przewodnik po sieci
3. Idealny obraz tła całej strony
4. Kształty CSS
5. Zapytania o media dla urządzeń standardowych
6. Za pomocą SVG
7. Jak skalować SVG
8. Trójkąt CSS
9. Gradientowe obramowania w CSS
10. Skróć ciąg za pomocą wielokropka
11. Jak używać @font-face w CSSie

Tak, prawie identyczny jak w zeszłym roku. I rok wcześniej. I rok wcześniej. I… no, prawie. „Gradient Borders in CSS” to nowość, podbijająca box-shadow obiekt z listy. Wszystko inne z czwartego miejsca na zaledwie zamienionych miejscach.

Mówiąc o właściwościach w Almanachu, chcę zobaczyć, do czego najczęściej odwoływaliście się w zeszłym roku:

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

Jeden pseudo na górze, a potem tylko właściwości. Ciekawe, biorąc pod uwagę, że relacyjny pseudoselektor działa jak :has(), :is(), :where() są nowe dzieci w bloku.

Newsletter

Liczby tutaj są zbyt chaotyczne, aby wyciągnąć jakiekolwiek odkrywcze wnioski. Po przejściu do DigitalOcean musieliśmy wyczyścić naszą listę ponad 91 XNUMX subskrybentów w celu zapewnienia zgodności, w wyniku czego liczba ta gwałtownie spadła. Jeśli zostałeś skreślony z listy, możesz ponownie zasubskrybować tutaj.

Dobre wieści? Newsletter nadal pracujemy! właściwie odpalił go ponownie w sierpniu po pięciomiesięcznej przerwie. Byliśmy w rytmie tygodniowym, ale teraz jesteśmy raz w miesiącu, podczas gdy twój naprawdę jest autorem. Mam nadzieję, że uda mi się wrócić do cotygodniowej publikacji. (Tęsknię za tobą, Robinie!)

Aktualizacje witryny

Jeśli mam być szczery, chodziło głównie o utrzymanie statku na powierzchni. Poza kilkoma drobnymi poprawkami i konserwacją, strona jest mniej więcej tam, gdzie była o tej porze w zeszłym roku.

W 2023 roku to się diametralnie zmieni. Jeśli śledzisz nasz miesięcznik Za kulisami CSS aktualizacje, to wiesz, że planujemy migrację CSS-Tricks z WordPress do tego samego samodzielnego CMS, którego DigitalOcean używa do wszystkich swoich (gwiezdnych) zawartość społeczności.

Prace te rozpoczęły się kilka miesięcy temu i powinny zakończyć się w pierwszej połowie roku. Możesz założyć się, że będziemy Cię informować na bieżąco. poza tym świeży design i nowy back-end, powinno działać jak zwykle. Jeśli masz jakieś pytania dotyczące tej pracy i jej znaczenia dla Twojej ulubionej publikacji typu front-end, skontaktuj się ze mną w komentarzach or napisz do mnie e-maila.

Jeśli jeszcze tego nie widziałeś, oto kilka kompozycji, które przygotował nasz projektant, Logan Liffick:

Przegląd celów na 2021 rok

Oj, waham się, czy nawet spojrzeć. Cały wysiłek włożony w integrację z DigitalOcean i znalezienie nowego rytmu zdominował czas wszystkich, pozostawiając niewiele cennego miejsca na złamanie celów Chrisa, którymi były:

• ✅ Więcej koncentracji na SEO. Tutaj wystawię ocenę pozytywną. Prawda jest taka, że ​​Chris i ja już wkopaliśmy się w to po piętach przed przejęciem. Zamieniliśmy wtyczkę Yoast SEO na RankMath, korzystając z narzędzi w edytorze, które pomagają nam dowiedzieć się, jak zoptymalizować nasze posty pod kątem wyników wyszukiwania. I żeby było jasne: nie chodzi o zwiększenie ruchu w celu zwiększenia przychodów ze sponsoringu, ale o uznanie, że wyszukiwanie jest głównym sposobem, w jaki czytelnicy tacy jak Ty nas znajdują, i ułatwienie znalezienia tego, czego szukasz. Jest to szczególnie prawdziwe teraz, gdy jesteśmy wspierani przez DigitalOcean i polegamy na sponsorach znacznie mniej niż kiedyś.
• 🚫 Kolejna cyfrowa książka. Huśtawka i pudło! Cóż, tak naprawdę nigdy nie zamachnęliśmy się na pierwszym miejscu ani nie weszliśmy na stanowisko pałkarza, jeśli o to chodzi. (Czy tak działają analogie sportowe?) Chris opublikował książkę pt Najlepsze sztuczki CSS w 2020 roku i uczynił z tego zaletę bycia płatnym subskrybentem CSS-Tricks. Pomysł polegał na zrobieniu jeszcze jednego w tym roku, ale pozbyliśmy się płatnych subskrypcji i udostępniliśmy The Greatest CSS Tricks, aby każdy mógł się nimi cieszyć bezpłatnie.
• ???? Więcej eksperymentów w mediach społecznościowych. Nie! Ale to może być najlepsze, biorąc pod uwagę, gdzie Twitter jest w tej chwili. Być może w przyszłym roku będziemy zmuszeni do eksperymentowania w tej dziedzinie bardziej z konieczności niż z ciekawości. Twitter zawsze był kroplą w przysłowiowym wiadrze ruchu CSS-Tricks; tak bardzo, że inwestowanie w to przypomina wkładanie naszych jajek do niewłaściwego koszyka, er wiadra. Nie wiem. Część mnie chce po prostu usiąść z założonymi rękami i zobaczyć, jak sprawy się potoczą, zanim zdecyduję się na coś nowego lub innego.

Wyznaczanie celów na 2023 r

Nowy rok, nowe cele, prawda? Pozwólcie, że włożę kilka słów w usta zespołu i przedstawię, co uważam za najważniejsze priorytety dla nas w 2023 roku:

• Płynna migracja witryny. Nic nie uczyniłoby mnie szczęśliwszym¹ niż bezproblemowe przejście do architektury DigitalOcean. Ale daj spokój, wszyscy wiemy coś zawsze pojawia się, gdy nadejdzie czas. Ta witryna zawiera ponad 7,000 artykułów, które zostały napisane w ciągu 15 lat, a było ich 19 wersji serwisu w tym przedziale czasowym. Jest tak wiele niestandardowych typów postów, niestandardowych pól, szablonów stron, wtyczek funkcjonalnych, integracji i bazy danych, która ma ponad 6 GB, aby przenieść ją i zmapować do istniejącego systemu. Dobrze, że mamy zespół najlepszych programistów, którzy się tym zajmą!
• Opublikuj 1-2 nowe przewodniki. Naprawdę chciałbym mierzyć wyżej. Przeszliśmy od dziewięciu nowych przewodników w 2020 r. do marnego jednego nowego przewodnika w 2021 r. i kolejnego w ubiegłym roku: Miriam's Kompletny przewodnik po warstwach kaskadowych CSS. Mam listę jeszcze 10, które chciałbym napisać, ale myślę, że postawimy poprzeczkę bardzo nisko, biorąc pod uwagę nasze ostatnie osiągnięcia. Wspomniałem wcześniej, że chciałbym włączyć pracę Mojtaby z Almanachu do istniejącego przewodnika po siatce CSS. To niemała ilość pracy i liczę ją na poczet celu, jeśli uda nam się ją wykonać.
• Rozwiń Almanach. To jest mój księżycowy strzał. Chciałbym zobaczyć tam więcej rodzajów dokumentacji. Mamy pseudoselektory i właściwości, co jest świetne i zawsze było. Ale, rany, pomyśl o wszystkich innych rzeczach, które moglibyśmy tam mieć: funkcjach, regułach at, jednostkach, selektorach, wartościach właściwości itp. Zarysowujemy tylko powierzchnię tego, co mogłoby się tam zmieścić! Jeśli dostaniemy choć jeden z nich, to ja wchodzę place-self: heaven.

Dziękuję tak, tak so dużo!

To moja wymarzona praca i nie miałabym jej bez takich czytelników jak Ty. Nie mogę uwierzyć, że minęło osiem lat od opublikowania mojego pierwszego artykułu i że wciąż tu jestem, pracy z ucząc się od najbystrzejszych umysłów w naszej dziedzinie. Mógłbym rozwodzić się (więcej niż dotychczas) o tym, ile znaczy dla mnie społeczność CSS-Tricks, ale tak naprawdę sprowadza się to do… dziękuję, dziękuję, dziękuję. Z głębi mojego serca, dziękuję.

I dzięki wszystkim wspaniałym ludziom z DigitalOcean, którzy stworzyli wspaniały dom dla CSS-Tricks. Specjalne przybicie piątki dla Haley Mills, Sydneya Rossmana Reicha, Bradleya Kouchiego, Karen Digi, Davida Berga, Matta Crowleya, Logana Lifficka i Kirstyn Kellogg za przybliżenie mnie osobiście i sprawienie, że czuję się tu mile widziany. To świetne miejsce.

Naprzód, jedziemy!