TGViewer
mefody.dev mefody.dev @mefody_dev · 5.39K subscribers
Post #68 1.81K
Стилизуй свой RSS

Дэрек Кэй предлагает интересное. Если у вас есть блог, или вы делаете новостной сайт, или сайт с какой-то обновляемой базой знаний, то скорее всего вы уже прикрутили RSS-ленту. Я, например, RSS пользуюсь постоянно, подписан много на кого через Feedly.

И вот пользователь переходит по прямой ссылке на RSS-ленту. Скорее всего он увидит месиво из XML-тегов и их содержимого. Казалось бы, ну и ладно, это же для автоматики страница, а не для людей.

Но у нас ведь есть древний способ стилизовать XML-документы — XSLT. В прошедшем недавно ЯЛФ CTF как раз было задание, где нужно было в XML-документе поиграться со стилями и получить нужный для ответа флаг.

Как это работает:
1. Вы заводите XML-документ с данными. RSS — это подмножество XML.
2. К нему прикрепляете XSL-стили. <?xml-stylesheet href="/rss.xsl" type="text/xsl"?>.
3. Внутри XSL описываете шаблон представления данных. По сути — HTML с дополнительными возможностями шаблонизации, среди которых циклы, фильтрация, работа с «объектами», условия и прочее.
4. Туда же добавляете обычные CSS-стили, потому что уже есть привычный HTML-шаблон с тегами и классами, если нужно.
5. Если в RSS-ленту зайдёт робот, он не будет ничего делать со стилями и просто распарсит вашу ленту, как ему надо. То есть ничего не меняется.
6. Если зайдёт по прямой ссылке реальный пользователь, он увидит красивую ленту в стиле вашего сайта. Можно, например, приделать инструкцию, как подписаться на эту ленту.

XSLT сейчас скорее мёртв, чем жив, и хорошо — с ним мороки было очень много, не самый DX-приятный способ писать сайты. Но браузеры всё ещё его поддерживают, чтобы не сломались сайты, которые писали в древности. Поэтому можно использовать эту древнюю технологию для таких вот интересных экспериментов.

https://darekkay.com/blog/rss-styling/
Darek Kay Style your RSS feed How to make your RSS feed look nice and provide useful information at the same time.
  • 👍 11
  • 🤯 8
  • 🤔 3
  • 🤩 1
More from @mefody_dev
  1. Sep 28, 2026View Transitions Toolkit Брамус делится своей коллекцией утилит, чтобы можно было более уд…
  2. Sep 25, 2026Эффект одометра Люблю такие демки, когда на чистом CSS делают что-то необычное, для чего я…
  3. Sep 23, 2026Цена ошибок гидрации В React есть много ухищрений, чтобы серверный кусок страницы обновилс…
  4. Sep 16, 2026Какие анимации более производительные: CSS или JS? Лучше пару раз увидеть, чем много откуд…
  5. Sep 14, 2026Единица измерения lh Если коротко, то 1lh = 1 line height. И это не размер шрифта, который…
  6. Sep 11, 2026<mermaid-element> Ещё одна полезная библиотека. Брамус собрал кастомный элемент, которому…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →