Пишу о поиске баланса между продуктивностью и кайфом от жизни
Делюсь личным опытом выстраивания привычек в режиме номада
Техлид и наставник
Связаться со мной: @Fudjik
https://dfurtsev.ru
Post #341
318
Когда большую часть кода пишет ИИ, в какой-то момент хочется добавить что-то своё
Я люблю синий цвет и много пространства — и у меня есть своя гора Фудзи, которую я вставил везде где только можно. В иконке сайта, на 404-странице, в картинках предпросмотра блога. Откуда такая приверженность Фудзи — можно догадаться по нику, но это уже отдельная история)
Фишка в том, что вся картинка нарисована программно через SVG. Я описал как должно выглядеть, ИИ попытался простыми фигурами это нарисовать, а дальше я сам докрутил код. Получилось векторное изображение, которое масштабируется как угодно — могу использовать и в маленькой иконке, и в большом баннере.
Дальше начал разбираться, как Телеграм и другие соцсети формируют предпросмотр ссылки. Оказывается есть OG-картинки — Open Graph Image, уже их соцсети считывают для отображения. И ими можно управлять на стороне сайта.
Сразу захотелось для каждого поста в блоге формировать свою такую картинку. Тоже с Фудзи, но ещё и с заголовком, тегами, именем. Взял ту же SVG-основу, добавляю текст, формирую полный SVG-файл и конвертирую в PNG — чтобы точно отдавался всем соцсетям нормально. Ещё и с соотношением сторон 1:1.91, как просят соцсети. Вообще неожиданное соотношение)
И всё это генерируется автоматически при сборке сайта добавляю новый пост, и картинка предпросмотра создаётся сама через скрипт.
Такой простой интерес и любопытство открывают вещи, о которых раньше и не думал. И хочется делиться и рассказывать
и вот такой предпросмотр получается
https://dfurtsev.ru/about
Я люблю синий цвет и много пространства — и у меня есть своя гора Фудзи, которую я вставил везде где только можно. В иконке сайта, на 404-странице, в картинках предпросмотра блога. Откуда такая приверженность Фудзи — можно догадаться по нику, но это уже отдельная история)
Фишка в том, что вся картинка нарисована программно через SVG. Я описал как должно выглядеть, ИИ попытался простыми фигурами это нарисовать, а дальше я сам докрутил код. Получилось векторное изображение, которое масштабируется как угодно — могу использовать и в маленькой иконке, и в большом баннере.
Дальше начал разбираться, как Телеграм и другие соцсети формируют предпросмотр ссылки. Оказывается есть OG-картинки — Open Graph Image, уже их соцсети считывают для отображения. И ими можно управлять на стороне сайта.
Сразу захотелось для каждого поста в блоге формировать свою такую картинку. Тоже с Фудзи, но ещё и с заголовком, тегами, именем. Взял ту же SVG-основу, добавляю текст, формирую полный SVG-файл и конвертирую в PNG — чтобы точно отдавался всем соцсетям нормально. Ещё и с соотношением сторон 1:1.91, как просят соцсети. Вообще неожиданное соотношение)
И всё это генерируется автоматически при сборке сайта добавляю новый пост, и картинка предпросмотра создаётся сама через скрипт.
Такой простой интерес и любопытство открывают вещи, о которых раньше и не думал. И хочется делиться и рассказывать
и вот такой предпросмотр получается
https://dfurtsev.ru/about
- 👍 4
- 🔥 4
- 🤮 1















