Webp — это новый формат изображений, благодаря которому круто уменьшается их размер, а качество остается тем же. Например, png файл размером 1 мб. можно конвертировать в 200-100 кб. файл webp в зависимости от степени сжатия.
Заявки с сайта могут поступать разными способами — на электронную почту, в телеграм, по СМС. Чтобы не запутаться в информации нужна система обработки заявок. Такая система называется CRM. Самые популярные русскоязычные — Битрикс24 и АмоСРМ.
Но начинать лучше с чего-то попроще. Например, сервис Трелло отлично справляется с хранением и обработкой большого количества заказов. Для примера я создал доску с демо заявками. Можете посмотреть на карточки заявок и сами все покликать.
Трелло — это канбан доска состоящая из отдельных колонок. В каждой колонке свои карточки. Одна карточка — одна заявка. Удобство в том, что карточки-заявки можно перетаскивать мышкой между колонками. Таким образом одна заявка может как-бы пройти по всей воронке продаж.
Давайте попробую объяснить подробнее.
На шаттерстоке настолько много изображений, что часто сложно найти нужное тебе по стилю. Я со временем выработал собственный алгоритм поиска.
Когда видишь несовершенства чужих систем и понимаешь как это можно исправить, то первая реакция — посоветовать как сделать лучше. Потом вспоминаешь, как кому-то советовал «не в тему» и первый импульс уходит. Начинаешь думать, стоит ли рассказывать свои идеи или нет.
Во-первых, конечно, не стоит давать непрошенные советы или рассказывать свои идеи, когда явно видно, что человеку не до них. Но если очень хочется, то можно заранее подумать будет ли твой совет полезен человеку или нет.
Если решение находится на поверхности, например, реализовано у большинства конкурентов в бизнесе знакомого, то скорее всего он уже о нем и сам знает. А если не знает, то значит и не собирается ничего менять. Нет такой потребности.
Гораздо лучше привносить что-то новое из других сфер. Например, видя проблему на автомойке приятеля рассказать как решается похожая проблема в дизайне. Тогда существует большая вероятность, человек и его конкуренты до этого не додумались.
Если в открытую спрашивают «как сделать лучше», то, конечно, нужно вываливать все, что ты об этом думаешь. Человек ищет решение и просит поучаствовать в мозговом штурме.
Сделал шаблон для быстрого создания сниппета, в комментариях к нему расписал основные моменты.
Если для макета использовать платные фотографии с фотостоков, то их не хочется покупать до тех пор, пока заказчик не принял концепцию дизайна. Фотостоки это понимают и предлагают скачать изображение для предпросмотра на которые наложены водяные знаки.
Бывает так, что долго вырезаешь какое-нибудь изображение по контуру, заказчик принимает концепцию, покупаешь изображение и приходится его заново вырезать. Это раздражает.
Взял за правило всегда вырезать изображения в маску. С помощью нее можно быстро перенести вырезанный контур на новое идентичное изображение, но без водяных знаков. Чтобы выделить контур маски нужно зажать cmd (ctrl) и кликнуть на ее значок — 
.
В Битрикс24 можно удобно интегрировать все формы сайта. С помощью приложения «Перехватчик» можно прописать name форм в системе, вставить один скрипт и все заявки с сайта будут превращаться в лиды. Очень быстро и удобно.
Но при интеграции с contacts form 7 возникла проблема — страница, которая должна работать по ajax перезагружалась каждый раз после сабмита формы вне зависимости от того, отправлено письмо или нет.
Проблему решил убрав с помощью js значение атрибута action у форм — $('form.wpcf7-form').attr('action', 'javascript:void(0);');
Upd: Техподдержка сказала, что можно сделать проще. В настройках приложения выбрать опцию «Прекращать работу формы», тогда скрипт не будет перезагружать страницу.
При установке виджета «Открытые линии» от Битрикс24 на сайт столкнулся с проблемой, что после загрузки всего контента он вначале добавляет свой html код сразу после открытия тега body, а потом стили. В итоге сайт мерцал на долю секунды. Было не очень.
Наверняка ошибка где-то на моей стороне, но быстрый анализ ее не нашел. Кеширования не было, все стили подключались последовательно. Проблема решилась добавлением нулевой высоты обертке виджета.
.bx-crm-widget-wrapper{
height: 0px;
}
Начать чат
<a href="whatsapp://send?phone=79523722135">Написать в вотсаппе</a>
Начать чат через сайт вотсаппа
<a href=" https://api.whatsapp.com/send?phone=79523722135">Написать в вотсаппе</a>
Начать чат с сообщением
<a href="whatsapp://send?text=Привет, как дела?&phone=+79523722135">Написать в вотсаппе</a>
Начать чат
<a href="viber://chat?number=79523722135">Написать в вайбере</a>
Добавить контакт
<a href="viber://add?number=79523722135">Добавить в вайбере</a>
В вайбер номер телефона нужно добавлять без плюса.
Начать чат
<a href="tg://resolve?domain=egmalt">Написать в телеграме</a>
Начать чат
<a href="skype:egmalt?chat">Написать в скайпе</a>
Позвонить
<a href="skype:egmalt?call">Позвонить в скайпе</a>
Начать чат
<a href="https://www.messenger.com/t/egmalt">Написать в фейсбуке</a>
Начать чат
<a href="https://vk.me/egmalt">Написать в вконтакте</a>
Показать в картах
<a href="maps:ll=55.758401,37.633017">Москва, Бол. Златоустинский пер. 9</a>
Собираю для себя коллекцию js скриптов на одной доске в трелло, которые можно использовать для разработки сайтов. Решил сделать ее публичной — trello js склад.
Один скрипт — одна карточка. Карточки разбиты на столбы по темам. Сверху — наиболее полезные скрипты, снизу наименее или те, которые я еще не пробовал. Пока все субъективно.
В некоторых карточках есть минималистичная инструкция по применению, они отмечены зеленым тегом 
. Изображения к карточкам — анимированные гифки.
Решил, что теперь я буду брать в работу некоммерческие проекты. Это могут быть лендинги, сайты, интерфейсы, калькуляторы, конструкторы, дизайн. Для моих друзей или людей, которые хотят сделать полезный проект.
В школе задали нарисовать свою осьминожку навыков. Какими я вижу свои скиллы сейчас и через год.
