ご存知のように、これは通常、クリスが過去 XNUMX 年間の大きな振り返りを公開する時期です。 の 最初の1つ CSS-Tricks が始まったのと同じ 2007 年に公開されました。 2021年までずっと続いた ビートを逃さずに。 私自身、長年 CSS-Tricks の読者だったので、その変化は見たくないものです。
それで、ここにいます！ 移行に関して言えば、2022 年は確かに大変な年でした。 昨年のこの時点で、来年のいくつかの目標を検討していましたが (これは後で達成します)、DigitalOcean に参加することになりました。 それは大規模な海の変化でした (しゃれが意図されていました)、それでもあなたはずっと私たちに固執しました. 多くの皆さんがここに来て、私や他の多くのゲスト ライターがここで公開しているものを読んでいることは、私にとって本当に大きな意味があります。 皆さんがいなければ、それはコミュニティ（または楽しいもの）ではありません。
ありがとうございました！
これは、ホリデー シーズンに向けてゴーン フィッシングの看板を掲げる今年最後の投稿です。 我々は戻ってきます 9年 XNUMX月 オーブンで焼きたてのコンテンツが満載です。
OK、ここからサイトの分析を掘り下げていきます。 これは私たちが常に透明性を保ってきたものであり、今後も継続していきます。 私たちの数字が立ち入り禁止のブラックボックスに入っているわけではありません.数字を共有することで、あなたとあなたのビジネスに何らかの形で役立つことを願っています.
全体的なトラフィック
全体として、Google アナリティクスは合計で 64m 年間のページビュー。 それは わーい 一見驚くべき昨年の 88m から減少しています。 つまり、誰が見たいですか 視聴者の３８%が 前年比トラフィックの減少？
しかし、それには正当な理由があります。 わーい 今年は内容が少なめ。 私たちは皆、クリスが多作の作家だったことを知っています（そして まだです、もちろん)、しばしば XNUMX 日に複数の投稿を吐き出します。 XNUMX 年の大半で最も生産的な貢献者を失ったようなものです。 過去数年間の出版活動を比較してみましょう。
- 2020： 1,183の記事
- 2021： 890の記事
- 2022： 390の記事
ページビューが 27% 減少したことは、私たちが公開したことを考えるとそれほど問題ではありません 視聴者の３８%が 昨年よりも記事が少なく、なんと 67% 2020年の全体合計よりも少ない。
うーん、仕事が 67% 減っているような気がしません…
そして、これはすべて、Google アナリティクスから得られるものであるという警告が伴います。 過去数年間、Chris はこれらの数値を CloudFlare (サイトの上にある CDN レイヤー) と ジェットパック (自己ホスト型 WordPress サイトを WordPress.com の SaaS-y 機能に接続するプラグイン)。 結果は常に矛盾しているので、今回は調べようとも思いません。 (よし、よし、たぶんただの Jetpack … 59.9 万のページビューを示しています — 奇妙なことに、2021 年の合計 55 万を超えています。)
記事、数字による
毎年楽しみにしている作品です！ 2022年のトップXNUMXの記事は次のとおりです 2022年に公開されました:
- CSS リンク ホバー効果の 6 つのクリエイティブなアイデア — ハーシル・パテル
- Twitterのソースコードの最初の10行を私に説明してください — アナンド・チャウダリー
- 2021 年に最もホットなフロントエンド ツールは何でしたか? — ルイス・ラザリス
- JavaScript ダイアログを新しい HTML ダイアログ要素に置き換える — マッツ・ストーマン
- 完全にスタイル可能な選択要素であるselectmenuにこんにちはと言ってください — パトリック・ブロセット
- ユーザーがページを離れたときに HTTP 要求を確実に送信する — アレックス・マッカーサー
grid-template-columns— モジタバ・セイディ- CSS カスケード レイヤーの完全ガイド — ミリアム・スザンヌ
- CSSデータベースクエリ？ もちろんできるよ！ — クリス・コイヤー
- CSS-TricksがDigitalOceanに参加します！ — クリス・コイヤー
最後のものがリストの上位になかったことに、私は実際に驚いています。 特にモジタバが削り取ったからです すべての CSS グリッド プロパティ 過去XNUMX年半の間、彼はそれを球場の外に打ち出しました。 彼が各物件に詰め込んだ金塊をすべて読み始めるまで、私はグリッドをうまく処理できると思っていました。 そこには学ぶことがたくさんあり、Mojtaba には複雑なことを明確に説明するコツがあります。 を更新したいと思います CSS グリッド ガイド 新鮮な情報がすべて含まれています (ただし、これについては後で詳しく説明します)。
そこにある CSS Cascade Layers ガイドも見たいです! ミリアムと一緒に仕事をするのはとても楽しかったです。 あなたがそれを知らなかったら、 彼女は仕様書の編集者です. 彼女の作品をここにホストし、私たち全員がブックマークして参照できるようにすることは、喜ばしいことです (そして本当に光栄です)。
キックの11-20は次のとおりです。
- 基本的な JavaScript を使用したアニメーション —マッド・シューボ
- フロントエンド Web 開発者向け Flutter ――おぶむねめんわぶで
- CSS グリッドとカスタム形状、パート 1 — テマニ・アフィフ
- HTML、HTML Way（XHTML Wayではない）を書く — イェンス・オリバー・メイエルト
- 4つの新しいCSSカラー機能のホイッスルストップツアー — クリス・コイヤー
- 背景プロパティを使用するクールホバー効果 — テマニ・アフィフ
- 小さなプログラミング言語を作ろう — Md シューボ
- 背景クリッピング、マスク、および3Dを使用するクールなCSSホバー効果 — テマニ・アフィフ
- HTML+CSSを使用した完璧な目次 — ニコラス・C・ザカス
- CSS ベースのフィンガープリンティング — クリス・コイヤー
2022年に公開されたすべての投稿が構成されています 4.8m ページビュー、または約 視聴者の３８%が すべてのページビューの。 私たちの最も閲覧された記事は常に古き良きものです フレックスボックス ガイド 獲得した 5.8m 今年の視聴回数。 私は、私たちの新しいコンテンツがその 67 つの項目を上回ることを望んでいます。発行のペースを維持していれば、それは簡単に実現できたと思います。 ここでナプキンの計算を戻しますが、昨年の公開記事数に合わせてさらに 540 件の記事を公開していれば、約 XNUMX 万ページビューだった可能性があります。
少し遡ると、公開時期に関係なく、過去 XNUMX 年間で最も閲覧された記事を見ることができます。
- Flexboxの完全ガイド
- グリッドの完全ガイド
- 完璧なフルページの背景画像
- CSSの形
- 標準デバイスのメディアクエリ
- SVG の使用
- SVG をスケーリングする方法
- CSSトライアングル
- CSS のグラデーション ボーダー
- 省略記号で文字列を切り捨てる
- 使用方法
@font-faceCSSで
うん、去年とほぼ同じ。 そして一昨年。 そして一昨年。 そして… まあ、ほとんど。 「CSS のグラデーション ボーダー」が新しくなり、 box-shadow リストからのプロパティ。 XNUMX 位からの他のすべては単に場所を交換しただけです。
Almanac のプロパティといえば、この XNUMX 年間で最も参照されたものを確認したいと思います。
::after/::beforetransitionbox-shadowscrollbarjustify-contentflex-wrapgapoverflow-wrapanimationwhite-space
上部に疑似が XNUMX つあり、その後はプロパティだけです。 興味深いのは、リレーショナル疑似セレクターが次のように機能することを考えると、 :has(), :is(), :where() ブロックの新しい子供たちです。
ニュースレター
ここでの数字は、洞察に満ちた結論を導き出すにはあまりにも乱雑です。 DigitalOcean に移行した後、コンプライアンスのために 91 人以上のサブスクライバーのリストをスクラブする必要があり、その結果、その数は激減しました。 リストから外された場合、 ここで再購読できます.
良いニュース？ まだまだニュースレターやってます！ 私たちは実際に XNUMX月に再び解雇した XNUMXヶ月の活動休止後。 私たちは毎週のリズムでしたが、あなたが本当にそれを作成している間、今では月に一度です. 私はそれを毎週の出版物に戻すことを願っています. （会いたいよ、ロビン！）
サイトの更新
正直に言うと、船を浮かせておくことが主な目的でした。 いくつかのマイナーな調整とメンテナンスを除けば、このサイトは昨年のこの時期とほぼ同じです。
それは 2023 年に大きく変わるでしょう。 CSSシーンの裏側 更新すると、CSS-Tricks を WordPress から、DigitalOcean がそのすべての (恒星) に使用するのと同じ自作の CMS に移行することを計画していることがわかります。 コミュニティ コンテンツ.
その作業は数か月前に開始され、今年の上半期に完了する予定です。 途中で最新情報をお届けします。 以外にも 新鮮なデザイン そして新しいバックエンド、それはいつものようにビジネスであるべきです. その仕事と、それがお気に入りのフロントエンド パブリケーションにとって何を意味するかについて質問がある場合は、私に連絡してください。 コメントで or 私にメールを撃って.
まだご覧になっていない場合は、デザイナーの Logan Liffick がまとめたコンプをいくつかご紹介します。
2021年の目標の見直し
おい、見るのもためらってる。 DigitalOcean と統合し、新しいリズムを見つけるために費やしたすべての努力が、全員の時間を支配し、Chris の目標を達成するための貴重な時間をほとんど残しませんでした。
- ✅ SEOにもっと集中。 ここで合格点をあげます。 真実は、Chris と私は、買収前にすでにこの問題に真剣に取り組んでいたということです。 Yoast SEO プラグインを RankMath に置き換え、エディター内ツールを利用して、検索結果の投稿を最適化する方法を学びました。 はっきりさせておきたいのは、トラフィックを増やしてスポンサー収入を増やすということではなく、検索があなたのような読者が私たちを見つける主要な方法であることを認識し、探しているものを見つけやすくすることです。 これは、DigitalOcean の支援を受け、以前よりもスポンサーシップへの依存が減った今では特に当てはまります。
- 🚫 もうひとつのデジタルブック。 スイングとミス！ そもそも、私たちは実際にスイングしたり、バッターボックスに足を踏み入れたりしたことはありません。 （これがスポーツの類推の仕組みですか？）クリスは本を出版しました 最高の CSS トリック 2020 年に、有料の CSS-Tricks サブスクライバーであることの特典にしました。 今年はもう XNUMX つやろうという考えでしたが、有料のサブスクリプションを廃止し、The Greatest CSS Tricks を誰もが無料で楽しめるようにしました。
- 🚫 より多くのソーシャル メディアの実験。 いいえ！ しかし、現時点で Twitter が正しい位置にあることを考えると、それは最善の策かもしれません。 来年は、興味よりも必要性から、この分野での実験を余儀なくされるかもしれません。 Twitter は常に、CSS-Tricks トラフィックのことわざのバケツに一滴の水を垂らしてきました。 それに投資すると、卵を間違ったバスケットに入れているように感じます。 私は知らないよ。 私の一部は、新しいことや違うことを決める前に、自分の手に座って、物事がどのように揺れ動くかを見たいと思っています.
2023年の目標設定
新年、新しい目標ですよね？ チームの口にたくさんの言葉を入れて、2023年に向けて最優先事項であると私が感じるものを投影させてください。
- スムーズなサイト移行。 何も私を幸せにすることはありません1 DigitalOcean のアーキテクチャへのスムーズな移行ではありません。 でもさあ、私たちは皆知っています 何か 時間になると必ず出てきます。 このサイトには、7,000 年以上にわたって書かれた 15 以上の記事があります。サイトの 9 つのバージョン その時間帯に。 非常に多くのカスタム投稿タイプ、カスタム フィールド、ページ テンプレート、機能プラグイン、統合、および既存のシステムに移動してマッピングする 6 GB を超えるデータベースがあります。 ここに一流の開発者のチームがいて、それを引き受けてくれるのは良いことです!
- 1 ～ 2 の新しいガイドを公開します。 本当はもっと上を目指したい。 2020 年の 2021 つの新しいガイドから、XNUMX 年には XNUMX つのわずかな新しいガイドに、そしてこの XNUMX 年にはもう XNUMX つの新しいガイドになりました: ミリアムの CSS カスケード レイヤーの完全ガイド. 書きたいリストがあと 10 ありますが、最近の実績を考えると、ハードルを非常に低く設定すると思います。 Almanac での Mojtaba の作業を既存の CSS Grid ガイドに組み込みたいと前に述べました。 それは少なからずの仕事であり、それをやり遂げることができれば、私はそれを目標に数えたいと思います.
- アルマナックを展開します。 これは私のムーンショットです。 そこにもっと多くの種類のドキュメントを見たいと思っています。 疑似セレクターとプロパティがありますが、これは素晴らしいものであり、常にそうでした。 しかし、まあ、関数、@ 規則、ユニット、セレクター、プロパティ値など、そこに含めることができる他のすべてのものについて考えてみてください。 それらのXNUMXつでも取得できれば、私は参加します
place-self: heaven.
ありがとうございます so 多く！
これは私の夢の仕事であり、あなたのような読者がいなければ、それはできなかったでしょう. 最初の記事が公開されてから XNUMX 年が経ち、まだここにいることが信じられません。 での作業 私たちの分野で最も優れた頭脳から学びます。 CSS-Tricks コミュニティが私にとってどれだけの意味があるかについては、(私がすでに持っている以上に) とりとめのないことを言うことができますが、実際のところ、それは… ありがとう、ありがとう、 ありがとうございました. 心の底から、 ありがとうございました.
そして、CSS-Tricks の素晴らしい家を作ってくれた DigitalOcean のすばらしい人々に感謝します。 Haley Mills、Sydney Rossman Reich、Bradley Kouchi、Karen Digi、David Berg、Matt Crowley、Logan Liffick、Kirstyn Kellogg に特別なハイタッチをして、個人的に最新情報を入手し、ここに歓迎されていると感じさせてくれました。 それは素晴らしい場所です。
進め、行くぞ！
