Спасибо (издание 2022 г.) PlatoBlockchain Data Intelligence. Вертикальный поиск. Ай.

Спасибо (издание 2022 г.)

Вы знаете, это время года, когда Крис обычно публикует большой обзор прошлого года. Первый был опубликован в 2007 году, в том же году, когда появились CSS-Tricks, и он продолжалось до 2021 года не пропуская ни секунды. Поскольку я сам все эти годы читал CSS-Tricks, мне бы не хотелось видеть это изменение.

Итак, мы здесь! 2022 год был чертовски удачным с точки зрения перехода. В это же время в прошлом году мы ставили перед собой некоторые цели на предстоящий год (к которым мы и доберемся), но в итоге присоединились к DigitalOcean. Это было серьезное изменение (каламбур), и все же вы остались с нами на всем пути. Для меня действительно очень много значит, что многие из вас приходят сюда, чтобы прочитать то, что публикую я и множество других приглашенных писателей. Это просто не сообщество (или какое-то развлечение) без вас всех.

Спасибо!

Это последний пост, который мы публикуем в этом году, поскольку мы вешаем нашу табличку «Ушли на рыбалку» на праздники. Мы вернемся Январь 9г. с потоком контента, который только что из духовки.

Хорошо, здесь мы начинаем копаться в аналитике сайта. Это то, о чем мы всегда говорили открыто и будем продолжать делать. Это не значит, что наши номера находятся в каком-то закрытом черном ящике, и мы надеемся, что их обмен каким-то образом поможет вам и вашему бизнесу.

Общий трафик

В целом, Google Analytics показывает в общей сложности 64m просмотров страниц за весь год. Это Wayyyyy по сравнению с прошлогодними 88 миллионами, что на первый взгляд настораживает. Я имею в виду, кто хочет увидеть 27% падение трафика по сравнению с прошлым годом?

Но для этого есть веская причина, потому что мы опубликовали ууууу меньше контента в этом году. Мы все знаем, что Крис был плодовитым писателем (и все еще, конечно), часто выкладывая по несколько постов в день. Это похоже на то, что мы потеряли нашего самого продуктивного участника большую часть года. Сравним издательскую активность за последние несколько лет:

  • 2020: 1,183 статьи
  • 2021: 890 статьи
  • 2022: 390 статьи

Падение просмотров страниц на 27 % не так уж важно, учитывая, что мы опубликовали 43% меньше статей, чем в прошлом году, и колоссальный 67% меньше, чем в целом за 2020 год.

Хм, я не чувствую, что работаю на 67% меньше…

И все это с оговоркой, что это именно то, что мы получаем от Google Analytics. В прошлые годы Крис сравнивал эти цифры со статистикой из Cloudflare (уровень CDN, который находится поверх сайта) и Jetpack (плагин, который соединяет наш собственный сайт WordPress с функциями SaaS-y WordPress.com). Результаты всегда последовательно противоречивы до такой степени, что на этот раз я даже не утруждаю себя осмотром. (Хорошо, ладно, может быть, просто Jetpack… который показывает 59.9 млн просмотров страниц — как ни странно, больше, чем 2021 млн в 55 году.)

Статьи в цифрах

Это то, чего я всегда с нетерпением жду каждый год! Вот десять лучших статей 2022 года, которые были опубликованы в 2022 году:

  1. 6 креативных идей для CSS эффектов при наведении ссылки — Харшил Патель
  2. Объясните мне первые 10 строк исходного кода Twitter — Ананд Чоудхари
  3. Какие инструменты интерфейса были самыми популярными в 2021 году? — Луи Лазарис
  4. Замените диалоги JavaScript новым элементом диалога HTML — Мэдс Стоуманн
  5. Поздоровайтесь с selectmenu, полностью настраиваемым элементом select. — Патрик Броссет
  6. Надежная отправка HTTP-запроса, когда пользователь покидает страницу — Алекс Макартур
  7. grid-template-columns — Моджтаба Сейеди
  8. Полное руководство по каскадным слоям CSS — Мириам Сюзанна
  9. Запросы к базе данных CSS? Мы можем точно! — Крис Койер
  10. CSS-Tricks присоединяется к DigitalOcean! — Крис Койер

Я на самом деле удивлен, что последний не был выше в списке. И я действительно в восторге, увидев там одного из Аламанака, особенно потому, что Моджтаба скинул все свойства CSS Grid за последние полтора года, и он выбил его далеко за пределы стадиона. Я думал, что хорошо разбираюсь в сетке, пока не начал читать все золотые самородки, которые он упаковал в каждую недвижимость. Там так многому можно научиться, а Моджтаба умеет ясно объяснять сложные вещи. Я надеюсь обновить Руководство по CSS-сетке со всей этой свежей информацией (но об этом чуть позже).

Мне также нравится видеть руководство по каскадным слоям CSS! Мне было так весело работать над ним с Мириам. Если бы ты этого не знал, она редактор спецификации. Это удовольствие (и честь, на самом деле) разместить ее работу здесь и сделать ее доступной для всех нас, чтобы добавить в закладки и сослаться на нее.

Вот 11-20 для пинков:

  1. Анимация с помощью базового JavaScript —М-д Шуво
  2. Flutter для веб-разработчиков интерфейса — Обумунэмэ Нвабуде
  3. CSS-сетка и пользовательские фигуры, часть 1 — Темани Афиф
  4. Пишите HTML, в стиле HTML (не в стиле XHTML) — Йенс Оливер Мейерт
  5. Экскурсия по 4 новым цветным функциям CSS — Крис Койер
  6. Крутые эффекты при наведении, использующие свойства фона — Темани Афиф
  7. Давайте создадим крошечный язык программирования — М-р Шуво
  8. Крутые эффекты наведения CSS, использующие обрезку фона, маски и 3D — Темани Афиф
  9. Идеальное оглавление с помощью HTML + CSS — Николас С. Закас
  10. Отпечатки пальцев на основе CSS — Крис Койер

Все посты, опубликованные в 2022 году, составляют 4.8m просмотров страниц или о 7.8% всех просмотров страниц. Наша самая просматриваемая статья всегда самая старая Руководство по флексбоксу который собрал 5.8m просмотров в этом году. Я бы хотел, чтобы наш новый контент опередил этот элемент, и я считаю, что это легко произошло бы, если бы мы продолжали публикацию в том же темпе. Вернемся к математике на салфетке, но мы могли бы получить около 67 миллионов просмотров страниц, если бы мы опубликовали еще 540 статей, чтобы соответствовать количеству опубликованных статей в прошлом году.

Если сделать несколько шагов назад, то можно увидеть самые просматриваемые статьи за прошлый год вне зависимости от того, когда они были опубликованы:

  1. Полное руководство по Flexbox
  2. Полное руководство по сетке
  3. Идеальное фоновое изображение на всю страницу
  4. Формы CSS
  5. Медиа-запросы для стандартных устройств
  6. Использование SVG
  7. Как масштабировать SVG
  8. CSS треугольник
  9. Градиентные границы в CSS
  10. Обрезать строку с многоточием
  11. Как это работает? @font-face в CSS

Да, почти так же, как в прошлом году. И годом ранее. И годом ранее. И… ну, почти. «Градиентные границы в 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 XNUMX подписчиков в целях соблюдения требований, и в результате их число резко сократилось. Если вас исключили из списка, вы можете повторно подписаться здесь.

Хорошие новости? Мы все еще делаем рассылку! Мы на самом деле запустил его в августе после пятимесячного перерыва. У нас была еженедельная каденция, но теперь она раз в месяц, пока ваш покорный слуга ее пишет. Я очень надеюсь вернуть его к еженедельной публикации. (Я скучаю по тебе, Робин!)

Обновления сайта

Если быть честным, в основном это было для того, чтобы удержать корабль на плаву. Если не считать незначительных доработок и технического обслуживания, сайт практически остался на том же уровне, что и в прошлом году.

В 2023 году все изменится. Если вы следите за нашими ежемесячными За кадром обновлений, то вы знаете, что мы планируем перенести CSS-Tricks из WordPress в ту же самодельную CMS, которую DigitalOcean использует для всех своих (звездных) контент сообщества.

Эта работа началась пару месяцев назад и должна быть завершена в течение первой половины года. Вы можете поспорить, что мы будем держать вас в курсе по пути. Кроме свежий дизайн и новый бэк-энд, это должно быть обычным делом. Если у вас есть какие-либо вопросы об этой работе и о том, что она означает для вашего любимого внешнего издания, пожалуйста, напишите мне. в комментариях or напиши мне письмо.

Если вы еще не видели его, вот несколько композиций, которые собрал наш дизайнер Логан Лиффик:

обзор целей на 2021 год

Ой, даже смотреть не решаюсь. Все усилия, затраченные на интеграцию с DigitalOcean и поиск нового ритма, отняли у всех время, оставив очень мало времени для достижения целей Криса, а именно:

  • Больше внимания SEO. Я поставлю нам здесь проходной балл. Правда в том, что Крис и я уже копались в этом до приобретения. Мы заменили плагин Yoast SEO на RankMath, воспользовавшись встроенными в редактор инструментами, которые помогут нам научиться оптимизировать наши сообщения для результатов поиска. И чтобы было ясно: речь идет не столько об увеличении трафика для получения большего дохода от спонсорства, сколько о признании того, что поиск является основным способом, которым такие читатели, как вы, находят нас, и облегчении поиска того, что вы ищете. Это особенно верно сейчас, когда нас поддерживает DigitalOcean, и мы меньше полагаемся на спонсорство, чем раньше.
  • 🚫 Еще одна цифровая книга. Замах и промах! Ну, на самом деле мы никогда не замахивались, во-первых, и не лезли в коробку для отбивающего, если уж на то пошло. (Разве так работают спортивные аналогии?) Крис опубликовал книгу Величайшие CSS-трюки в 2020 году и сделал платным подписчиком CSS-Tricks привилегию. Идея состояла в том, чтобы сделать еще один в этом году, но мы избавились от платных подписок и открыли The Greatest CSS Tricks для всех желающих бесплатно.
  • ???? Больше экспериментов в социальных сетях. Неа! Но это может быть и к лучшему, учитывая, где сейчас находится Twitter. Возможно, в следующем году нам придется поэкспериментировать в этой области больше по необходимости, чем из интереса. Твиттер всегда был каплей в пресловутом ведре трафика CSS-Tricks; настолько, что инвестировать в него похоже на то, чтобы положить яйца не в ту корзину, э-э, ведро. Не знаю. Часть меня просто хочет посидеть, сложа руки, и посмотреть, как все сложится, прежде чем решиться на что-то новое или необычное.

2023 постановка целей

Новый год, новые цели, не так ли? Позвольте мне вставить несколько слов в уста команды и сформулировать то, что я считаю главным приоритетом для нас в 2023 году:

  • Плавная миграция сайта. Ничто не сделало бы меня счастливее1 чем беззаботный переход на архитектуру DigitalOcean. Но да ладно, мы все знаем удалось всегда приходит, когда пришло время. На этом сайте более 7,000 статей, написанных за 15 лет, и 19 версий сайта в тот промежуток времени. Существует так много настраиваемых типов сообщений, настраиваемых полей, шаблонов страниц, функциональных плагинов, интеграций и базы данных размером более 6 ГБ для перемещения и сопоставления с существующей системой. Хорошо, что у нас есть команда первоклассных разработчиков, чтобы взяться за это!
  • Опубликовать 1-2 новых руководства. На самом деле, я хотел бы стремиться выше. Мы перешли от девяти новых руководств в 2020 году к ничтожному одному новому руководству в 2021 году и еще одному в прошлом году: Мириам Полное руководство по каскадным слоям CSS. У меня есть список еще из 10, которые я хотел бы написать, но думаю, что мы установим очень низкую планку, учитывая наш недавний послужной список. Ранее я упоминал, что хотел бы включить работу Моджтабы в Альманахе в существующее руководство по CSS Grid. Это немалый объем работы, и я буду считать ее достижением цели, если мы сможем ее осуществить.
  • Расширьте Альманах. Это мой лунный выстрел. Я хотел бы видеть больше типов документации там. У нас есть псевдоселекторы и свойства, и это всегда было здорово. Но, черт возьми, подумайте обо всех других вещах, которые мы могли бы там иметь: функции, at-правила, единицы измерения, селекторы, значения свойств и т. д. Мы только царапаем поверхность того, что могло бы быть там! Если мы получим хотя бы один из них, я буду в place-self: heaven.

Спасибо так, так, so много!

Это работа моей мечты, и у меня бы ее не было без таких читателей, как вы. Не могу поверить, что прошло восемь лет с тех пор, как была опубликована моя самая первая статья, и что я все еще здесь, работать с учиться у самых ярких умов в нашей области. Я мог бы болтать (больше, чем уже сделал) о том, как много значит для меня сообщество CSS-Tricks, но на самом деле все сводится к тому, что… спасибо, спасибо, Спасибо. От всего сердца, Спасибо.

И спасибо всем замечательным людям здесь, в DigitalOcean, которые создали отличный дом для CSS-Tricks. Особое спасибо Хейли Миллс, Сидни Россман Райх, Брэдли Кучи, Карен Диги, Дэвиду Бергу, Мэтту Кроули, Логану Лиффику и Кирстин Келлогг за то, что они лично ввели меня в курс дела и заставили чувствовать себя здесь как дома. Это прекрасное место.

Вперед, мы идем!

Отметка времени:

Больше от CSS хитрости