Mix-blend-mode в CSS
Господа-сайтоделы, оказывается в CSS в районе 20 года завезли интересные свойства для картинок, которые работают как смешение слоев в фотошопе. Получается сейчас на не надо вырезать белый фон на фотографиях товара.
На примере сверху как было, а потом фоткам добавили свойство «darken» и стало как нужно, а то все лень было вырезать.
Вот вам выжимка из чата-жпт, а то без него никто бы и дальше про эти свойства не знал:
➖ normal — значение по умолчанию
➖ multiply — цвет элемента умножается на цвет фона и заменяет его
➖ screen — умножает цвет фона и цвет элемента, а затем дополняет результат. Итоговый цвет элемента будет ярче, чем background-color
➖ overlay — умножает или осветляет цвет элемента в зависимости от цвета фона. Режим, противоположный значению hard-light
➖ darken — цвет фона заменяется цветом элемента там, где элемент темнее, в остальных случаях цвет фона остаётся без изменений
➖ lighten — цвет фона заменяется цветом элемента там, где элемент светлее
➖ color-dodge — при этом значении цвет фона осветляется так, чтобы отразить цвет элемента
➖ color-burn — цвет фона затемняется так, чтобы отразить естественный цвет элемента
➖ hard-light — в зависимости от цвета элемента, это значение будет осветлять или умножать его
➖ oft-light — в зависимости от цвета элемента, это значение будет его затемнять или осветлять
➖ difference — вычитает более тёмный цвет из более светлого
➖ exclusion — похоже на difference, но с более низким контрастом
➖ hue — создаёт цвет, в котором оттенок берётся от элемента, а насыщенность и яркость — от фона;
➖ saturation — создаёт цвет, в котором насыщенность берётся от элемента, а оттенок и яркость — от фона
➖ color — создаёт цвет с оттенком и насыщенностью элемента и яркостью фона
➖ luminosity — создаёт цвет с яркостью элемента, а оттенок и насыщенность берёт от фона. Результат противоположен color
Ну все, теперь извращаться и развлекаться можно активее :)
Господа-сайтоделы, оказывается в CSS в районе 20 года завезли интересные свойства для картинок, которые работают как смешение слоев в фотошопе. Получается сейчас на не надо вырезать белый фон на фотографиях товара.
На примере сверху как было, а потом фоткам добавили свойство «darken» и стало как нужно, а то все лень было вырезать.
Вот вам выжимка из чата-жпт, а то без него никто бы и дальше про эти свойства не знал:
С помощью свойства mix-blend-mode можно смешать цвет элемента с расположенными ниже элементами или родительским фоном.
Ну все, теперь извращаться и развлекаться можно активее :)
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Утонули в чатиках…
Все, нафиг, приехали! Чатиков стало настолько много, что ты уже не понимаешь что и где там происходит. Где какие доступы были, какому Евгению надо рекламный пост разместить, какому Константину отчитаться о накрученных на картах отзывах, а какому Дмитрию дизайн сдать.
Вся эта вакханалия началась после плотного знакомства с корпоративными сайтами. Там может быть 3 уровня согласований, свои проджект-менеджеры, арт-директоры. Тебе могут написать в общий чат задачи, либо прислать в личку. Часть этого мне надо перекинуть прогеру, а у того вопросы, которые надо просто переслать вверх. Вобщем мы реально утонули и надо что-то решать, как то это дело разгребать.
Из задач - совместный рабочий таск с заказчиком, таймлайны (чтобы человек сразу видел на каком этапе проект, что сделано и что запланировано), ну и подгрузка файлов. Нам реально присылают комментарии вида «Владимир посмотрел сайт и сказал, что Элю лучше поменять на Анастасию» :) Кто такая Анастасия, что еще за Эля и вообще кто такой этот Владимир - нам в принципе не важно. Вы фотку залейте - мы поменяем. Это в 100 раз эффективнее!
Мы уже юзаем майндмейстер, я тут писал. Инструмент годный, рабочий и простой. Юзается для составления структур и презентаций. И вот у этой же команды есть https://www.meistertask.com за 150 евро в год. Trello наверное тоже самое, но мне простота мейстеров нравится, да и ограничений на размер диска нет. Ну и мобильная приложка имеется. А, еще авторизация по гугл-акку радует. Не реклама, чисто по-братски советую!
Православный битрикс24 нахер сразу. У них там такой функционал, что государством российским можно управлять, да еще и парой миллионов узбеков впридачу. Нам же надо на 3 человека + заказчика подключать. К тому-же данный инструмент должен облегчать работу, а не усложнять ее. Вобщем тумач!
Я пока не проплатил и юзаю триал, но вдруг есть что-то простецкое, функциональное и другое. Советуйте чем пользуетесь в общем.
UPD: посоны, у меня пока пост настаивался, мы уже юджайл (yougile) тестировать начали. Приложка для мака, уведомления, чатики, побольше функционала и главное все бесплатно! Прям вообще до 10 чел денег не берут. А халяву мы очень любим!
Все, нафиг, приехали! Чатиков стало настолько много, что ты уже не понимаешь что и где там происходит. Где какие доступы были, какому Евгению надо рекламный пост разместить, какому Константину отчитаться о накрученных на картах отзывах, а какому Дмитрию дизайн сдать.
Вся эта вакханалия началась после плотного знакомства с корпоративными сайтами. Там может быть 3 уровня согласований, свои проджект-менеджеры, арт-директоры. Тебе могут написать в общий чат задачи, либо прислать в личку. Часть этого мне надо перекинуть прогеру, а у того вопросы, которые надо просто переслать вверх. Вобщем мы реально утонули и надо что-то решать, как то это дело разгребать.
Из задач - совместный рабочий таск с заказчиком, таймлайны (чтобы человек сразу видел на каком этапе проект, что сделано и что запланировано), ну и подгрузка файлов. Нам реально присылают комментарии вида «Владимир посмотрел сайт и сказал, что Элю лучше поменять на Анастасию» :) Кто такая Анастасия, что еще за Эля и вообще кто такой этот Владимир - нам в принципе не важно. Вы фотку залейте - мы поменяем. Это в 100 раз эффективнее!
Мы уже юзаем майндмейстер, я тут писал. Инструмент годный, рабочий и простой. Юзается для составления структур и презентаций. И вот у этой же команды есть https://www.meistertask.com за 150 евро в год. Trello наверное тоже самое, но мне простота мейстеров нравится, да и ограничений на размер диска нет. Ну и мобильная приложка имеется. А, еще авторизация по гугл-акку радует. Не реклама, чисто по-братски советую!
Православный битрикс24 нахер сразу. У них там такой функционал, что государством российским можно управлять, да еще и парой миллионов узбеков впридачу. Нам же надо на 3 человека + заказчика подключать. К тому-же данный инструмент должен облегчать работу, а не усложнять ее. Вобщем тумач!
Я пока не проплатил и юзаю триал, но вдруг есть что-то простецкое, функциональное и другое. Советуйте чем пользуетесь в общем.
UPD: посоны, у меня пока пост настаивался, мы уже юджайл (yougile) тестировать начали. Приложка для мака, уведомления, чатики, побольше функционала и главное все бесплатно! Прям вообще до 10 чел денег не берут. А халяву мы очень любим!
Ля чего нарулил!
➖ Термопринтер за 4к наклейки печатать для сдэка и яндекс.маркета. Теперь я сам себе комнатный ПВЗ :) Кайфую с него, что аж поделиться решил
➖ Завел новых питомцев. Тараканы по цене взрослой стерляди, но я для них банку уже 4-ый месяц готовлю. Будем учиться размножать!
➖ Ну и прикиньте: сбылась мечта настоящего скуфа - ледобур mora nova. Раньше с девками бухали, теперь ледобуру радуюсь, потому что на озере никто тебе в уши не жужжит и в целом спокойнее :)
Развлечения на все новогодние праздники запланированы, будем кайфовать! Осталось на шуруповерт еще наковырять.
А с сайтами в следующем году разберемся. Всем добра!
Развлечения на все новогодние праздники запланированы, будем кайфовать! Осталось на шуруповерт еще наковырять.
А с сайтами в следующем году разберемся. Всем добра!
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Итоги года двадцать четвертого
Ну шо, где все итоги года у блогеров? Никто ничего не подводит, курсов не проводит, планов не строит, позитивом не делится… Одно нытье хроническое и заебавшая всех действительность.
⭐️ По ощущениям в этом году стало прям всех дохрена. Тарологов, психологов, авитологов, криптологов, маркетологов, казинологов, чатджипитологов, мылов ручной работы, разного калибра советчиков и прочего сброда, который занимается неведомой хуйней
⭐️ Предприниматели все бабки из оборота забрали, на депы в банк засунули, купили на сдачу ледобуров с лодками и свалили дауншифтить по деревням. Потому что гори оно все синим пламенем этим вашим бизнесом заниматься
⭐️ Вот где реально чес - это у самогонщиков с их лемончаллами по 300 рублей за бутыль и настойками черносливов. Там беготня как у Киркорова по голубым уголкам в телевизоре
⭐️ Пол страны дурачков порознь напокупали на базаре разного говна и потащились продавать его с минимальной маржой на вб
⭐️ Другая половина в криптошиткоины вложилась и сидят ждут ракетку. Недалеко от них в развитии и фондовики ушли. Которых единственных резко меньше стало в инфополе
⭐️ От телевизора блевать всех тянет, ютуб только из-за забора смотреть можно, яндекс вообще в край охуел и скоро просрет аудиторию, станет как ВК, рекламных инструментов не осталось, бюрократией и бумажками обложили в 3 конца. Доллары хер купишь
⭐️ Вебмастера спились до единого. Потому что сидят и ждут с февраля, что в Яндексе ошибка и вот-вот они о ней узнают, да раздадут обратно трафик инфопроектам
⭐️ Единственная гавань адекватности - блогеры. Не все конечно, но даже квадроберы вменяемее, чем ведущие первого канала. Вобщем я в новом году блогером хочу стать и продолжу копить на баню
👋 Не унывайте, короче! Так-то все норм… Прокачивайте стрессоустойчивость и недельку отдохните. А то этих сраных блогеров типа меня почитаешь, так у них всегда все плохо, а на самом деле у нас вчера продаж в магазине на 90к рублей было. Поэтому нытье - нытьем, а на деле нормально все, выживем! С наступающим!
Ну шо, где все итоги года у блогеров? Никто ничего не подводит, курсов не проводит, планов не строит, позитивом не делится… Одно нытье хроническое и заебавшая всех действительность.
Please open Telegram to view this post
VIEW IN TELEGRAM
7 часть: Если можно сделать лучше - берешь и делаешь лучше (было/стало)!
В первой части - улучшали карточку товара
Во второй части - отзывы и комментарии
В третей части - наконец-то хедер причесали
В четвертой - сделали бар, преобразовали мобильную менюху и добавили плавающую цену
В пятой - корзину
В шестой - просто все перерисовано!
А сейчас докопались снова до карточки товара. Просто она не подходила к новому уровню понимания проекта, решено было не тащить старые стили, а сделать новое.
Мы вообще очень сильно упоролись в е-комм в этом году. Проект во-первых для себя, во-вторых под конкурс, в-третьих - это наш выставочный образец «как мы умеем». Вообще умеем и для заказчиков наверное, если есть пара месяцев копошения и от 300к рублей, но это не тут опишу.
Реально сидим с ноября его верстаем, анимируем, дополняем, усложняем. И вроде вечер субботы, 21 час, пора бы уже четвертую кружку пенного заказывать в баре, а у меня творческие порывы. Хватанул бумажку, накидал проектировку и тут-же отрисовал.
Короче цените, все на скринах в галерее. На первом - самая первая версия карточки товара, на втором скрине - переделали и добавили конверсионности, на третьем как оно скоро будет в полном жире! Дальше макет товара целиком и из чего это все рождалось на бумажке под переливы гирлянды!
Кому пожирнее надо, то тут. Надеюсь стало лучше :)
В первой части - улучшали карточку товара
Во второй части - отзывы и комментарии
В третей части - наконец-то хедер причесали
В четвертой - сделали бар, преобразовали мобильную менюху и добавили плавающую цену
В пятой - корзину
В шестой - просто все перерисовано!
А сейчас докопались снова до карточки товара. Просто она не подходила к новому уровню понимания проекта, решено было не тащить старые стили, а сделать новое.
Мы вообще очень сильно упоролись в е-комм в этом году. Проект во-первых для себя, во-вторых под конкурс, в-третьих - это наш выставочный образец «как мы умеем». Вообще умеем и для заказчиков наверное, если есть пара месяцев копошения и от 300к рублей, но это не тут опишу.
Реально сидим с ноября его верстаем, анимируем, дополняем, усложняем. И вроде вечер субботы, 21 час, пора бы уже четвертую кружку пенного заказывать в баре, а у меня творческие порывы. Хватанул бумажку, накидал проектировку и тут-же отрисовал.
Короче цените, все на скринах в галерее. На первом - самая первая версия карточки товара, на втором скрине - переделали и добавили конверсионности, на третьем как оно скоро будет в полном жире! Дальше макет товара целиком и из чего это все рождалось на бумажке под переливы гирлянды!
Кому пожирнее надо, то тут. Надеюсь стало лучше :)
Media is too big
VIEW IN TELEGRAM
Делать шаловливым ручкам на праздниках было нечего, поэтому мы заморочились дичайшей залупистикой с магазином. Чтобы оно все вертелось, считалось, наводилось и менялось как будто руки у нас из правильного места выросли.
Чувствительность на галерее еще надо поправить, но остальное все работает идеально и даже не глючит.
Ну явно ж такое удобнее для покупателя? Видно, что заморочились, кунилининг навели, все пиксели причесали и поэтому даже с небольшим оверпрайсом продавать можно. Конкуренты с сайтами из палеозоя только в демпинг умеют, а мы вот так :)
Чувствительность на галерее еще надо поправить, но остальное все работает идеально и даже не глючит.
Ну явно ж такое удобнее для покупателя? Видно, что заморочились, кунилининг навели, все пиксели причесали и поэтому даже с небольшим оверпрайсом продавать можно. Конкуренты с сайтами из палеозоя только в демпинг умеют, а мы вот так :)
Секту свидетелей mobile-first можно поздравить!
Наконец-то доля мобильного трафика в русском сегменте интернетов в 24 году превысила долю десктопа. Это следует из ежегодного отчета CloudFlare. Мобильные устройства обеспечили 41,3% глобального трафика во всем мире, а вот в России уже 51%.
Теперь как правильно читать эту статистику. Люди в B2B и B2C секторах на работах работают не с мобил и покупают ровно также. Поэтому тут доля десктопа выше 80%. А вот все развлекалово происходит как раз с мобил.
Поэтому мы-разрабы - за вас конечно всех рады, что мобильный траф растет, но десктоп версию делать однозначно не перестанем. Потому что наш конечный продукт в основном - это сайты компаний, а не лента с жопами и котиками, которую листают в туалете.
Но мировой статистике мы верим сквозь пальцы и открываем за год яндекс метрику у магазина. А видим там 35% мобильного, 10% планшетного и чуть больше 50% десктопного (еще даже телевизоры есть, но их совсем мало).
Поэтому все остается без изменений в подходах. Мобильная версия конечно важна в корпоративках и магазинах, но десктоп все равно важнее и надо по-прежнему начинать с него. Потому что именно на десктопе реализуется весь возможный функционал, а мобила потом из этого кастрируется.
Наконец-то доля мобильного трафика в русском сегменте интернетов в 24 году превысила долю десктопа. Это следует из ежегодного отчета CloudFlare. Мобильные устройства обеспечили 41,3% глобального трафика во всем мире, а вот в России уже 51%.
Теперь как правильно читать эту статистику. Люди в B2B и B2C секторах на работах работают не с мобил и покупают ровно также. Поэтому тут доля десктопа выше 80%. А вот все развлекалово происходит как раз с мобил.
Поэтому мы-разрабы - за вас конечно всех рады, что мобильный траф растет, но десктоп версию делать однозначно не перестанем. Потому что наш конечный продукт в основном - это сайты компаний, а не лента с жопами и котиками, которую листают в туалете.
Но мировой статистике мы верим сквозь пальцы и открываем за год яндекс метрику у магазина. А видим там 35% мобильного, 10% планшетного и чуть больше 50% десктопного (еще даже телевизоры есть, но их совсем мало).
Поэтому все остается без изменений в подходах. Мобильная версия конечно важна в корпоративках и магазинах, но десктоп все равно важнее и надо по-прежнему начинать с него. Потому что именно на десктопе реализуется весь возможный функционал, а мобила потом из этого кастрируется.
Ну шо там? Как новый год и застолья? Готовы новые страницы своей жизни писать? Или все о несправедливости думаете?
Мы врываемся с 2-х ног в любимую работу! А праздники прошли по плану )))
Мы врываемся с 2-х ног в любимую работу! А праздники прошли по плану )))