Позднее Ctrl + ↑

Подснежники

Два дня назад было сухо и тепло. Девчонки ходили без шапок и в лёгких весенних курточках. Красота! Илья подумал: «Пора!» И поменял резину на летнюю. О, эта музыка для ушей! Когда машина едет совершенно неслышно и никого не пугает своими стальными шипами.

Кто-то там на верху посмотрел на всё это и снисходительно улыбнулся. Что, Илья, хочешь лета? Ну нельзя же быть таким нетерпеливым. И подсыпал снега. Ведь, чем дольше ждёшь тепла, тем приятнее, когда оно наступает. Всё для тебя, мой любимый человек!

Илья с утра смотрит в окно: кругом всё бело. Ехать никуда нельзя. Спасибо тебе, Вселенная, за твоё великолепное чувство юмора! И пошел пешком во двор фотографировать подснежники.

— Это не подснежники! Они как-то по-другому называются.
— Но это ведь цветы?
— Да.
— Они ведь под снегом.
— Ага.
— Значит подснежники!

А сам напевает про себя из Чайфа:

А у нас как всегда, всё не так, как в Париже!
Снегу в апреле выпало нам по колено!
Я готов доставать уже зачехленные лыжи,
И что странно, я сегодня в Париж не хочу совершенно!

О подсчёте звонков в Яндекс Метрике

Я на днях зашел на один из сайтов, которые сам же когда-то верстал. И обнаружил странный баг вёрстки: все номера телефонов на сайте превратились в странный градиент. Вот как на картинке.

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

Я стал разбираться, и оказалось, что это не баг, а фича. И не вёрстки, а Яндекс-Метрики.

Метрика собирает статистику по звонкам с сайта. На мобильных устройствах это просто: тапнул на номер телефона — позвонил. Звонок засчитался. А с десктопом сложнее, ведь с него нельзя позвонить. Посетители с десктопа смотрят номер на мониторе, а набирают его в смартфоне. Проблема.

Поэтому Яндекс использовал такой фокус: заблюрить часть номера. Чтобы посмотреть номер нужно провести по нему мышкой. Этот ховер мышки и засчитывается в статистку.

По мне решение весьма спорное. Когда я первый раз с этим столкнулся, мне было вовсе не очевидно, что тут надо водить мышкой. Я подумал, что это какая-то проблема с сайтом. И что из-за этой проблемы не получится узнать номер телефона.

Вот если бы рядом с градиентом разместить какую-нибудь подсказку, что номер можно открыть. Проще всего написать прямым текстом: «Нажмите здесь чтобы открыть номер». Но это сложно вписать в дизайн. Лучше подошел бы какой-нибудь значок.

Я написал небольшой скрипт, который скрывает часть номера телефона. Также как Яндекс Метрика. А поверх градиента рисует иконку с глазом. Намекает, что номер можно посмотреть если нажать на него.

Честно, это решение тоже мне не нравится. Возможно, оно будет понятнее посетителям. Но всё ещё выглядит как костыль и ведёт себя также. Раздражает тем, что прячет информацию и требует лишних движений чтобы её получить.

Думаю, скрывать номер телефона в угоду сбору статистики — изначально плохая идея. Типа, мы будем рады, если вы нам позвоните. Но просто так номер вам не скажем. Сначала станцуйте.

Я вместо фокусов с градиентами просто экстраполировал бы статистику с мобильных на десктопы. Сейчас тенденция такова, что 80% посещений приходится на мобильные устройства. Так вот, можно умножить количество звонков с мобильных на 1,25 и получить приблизительно все звонки с сайта.

Да, число будет не точное. Здесь для справедливости нужно сказать, что и ховер мышкой тоже не отличается точностью. Ведь он может быть случайным. Здесь для меня странно: почему выбрали не клик? Похоже, чтобы с большей вероятностью донести до пользователя смысл ховера. Пусть даже и случайно.

В общем, у меня пока нет хорошего решения для данной проблемы. Моё мне не нравится, яндексовское тоже. Хорошо было бы предоставить выбор владельцу сайта: использовать градиент или считать звонки только с мобильных устройств. Жаль, Метрика не даёт такого выбора.

Картинка для страницы 404

Мне нравятся красивые сайты. Иногда я захожу в портфолио какой-нибудь известной web-студии и рассматриваю работы. Выбор цветовых сочетаний, шрифтов, графика и анимация — всё это очень интересно. Мне тоже всегда хотелось научиться творить такую же красоту. Увы, художник из меня не очень хороший. Поэтому я выбрал путь разработчика.

Тем не менее, я занимаюсь оформлением собственных проектов, в которых я одновременно и кодер, и дизайнер. Я создаю простенькие иллюстрации и пиктограммы. Здесь я позволяю своей душе художника развернуться. И, должен сказать, рисование — это ничуть не проще, чем программирование.

Например, недавно мне пришла в голову отличная метафора для иллюстрации на страницу 404. Эта страница специально для тех случаев, когда пользователь пытается перейти по несуществующему адресу. Я придумал нарисовать три сосны. Существует ведь такая поговорка: «Заблудиться в трёх соснах». Вот и моя картинка будет символизировать, что посетитель заблудился на сайте.

Здесь не нужен какой-то сложный рисунок в стиле реализма. Достаточно обозначить деревья контуром и добавить немного штриховки. Это мне вполне по силам. Чтобы смысл метафоры был понятнее, пусть сосны будут нарочито кривыми. Похожими на цифры 404. А ещё я добавил сову чтобы сделать рисунок интереснее. Она будет смотреть на посетителя и создавать атмосферу мрачности.

Скетч я нарисовал обычным карандашом на бумаге. А затем обвёл его пером на графическом планшете. Это Wacom One, который я недорого приобрёл на Авито специально на тот случай, если захочется порисовать. Удобный девайс. Спасибо продавцу Ирине за отличную сохранность.

Сначала было сложно, не хватало навыков работы с графическим пером. Ровные линии получались далеко не с первого раза. Некоторые приёмы рисования я не знал и приходилось их находить интуитивно либо гуглить. Хоткеи тоже учил на ходу. Первая версия рисунка мне не понравилась. Я перерисовал некоторые детали, и получилась вторая версия. Она выглядит гораздо лучше.

В целом, получилось неплохо, я доволен. А главное — к концу работы над рисунком я уже намного увереннее владел пером. Нужные линии получались с первого раза почти на автомате, и я гораздо меньше стал пользоваться ластиком. Думаю, если практиковаться больше и чаще, то можно будет перейти к рисункам посложнее.

Обновление сайта Такси 42

Весь январь и целую половину февраля плотно занимался редизайном сайта Такси 42. Давно пора было сделать это. Сайт создан в 2016 году и ещё ни разу не обновлялся. Он сильно устарел и пользоваться им было неудобно. Он даже не был адаптивным. Для сайта с онлайн-заказом такси это губительно.

Редизайн — это мягко сказано. На самом деле, поменять оформление и добавить адаптивности — это самое простое. Ведь никакой особой красоты здесь не требовалось. Сайт оформлен аккуратно, но весьма просто. Самой сложной частью работы стала полная переработка формы заказа.

Во-первых, здесь очень много функционала. Например, можно заказать разные типы такси: легковое и грузовое. А ещё есть геолокация, адресные подсказки, дополнительные опции, заказ на время, расчёт стоимости и многое другое.

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

Особенно много хлопот доставила интеграция с ЮKassa. Оплачивать такси можно не только наличными, но и банковской картой. Спасибо ребятам, которые взяли на себя работу на стороне бэкенда: телефонию, формирование платежа, холдирование средств, возврат денег при отмене заказа и др.

Мне оставалось сделать удобную форму авторизации и совместить её с формой ввода платёжных данных от ЮKassa. Но и с этим пришлось порядком повозиться.

Кстати, хотя моя работа — это фронт, я успел поучаствовать и в бэкенде. Это, собственно, Java-сервлет по приёму заказа. В остальном серверная часть здесь обширная и сложная. Поэтому и на фронте хватает работы. Много обращений к различным сервисам и асинхронщины.

Конечно, не всё удалось сделать идеально. Много интересного функционала запланировано на будущее. Например, новые виды заказов: доставка, трансферы, буксировка и др. А ещё возможность заказа такси не только в Иваново, но и в других городах и регионах.

В общем, работы над сайтом ещё непаханое поле. Сейчас подключил метрику, смотрю вебвизор и логи чтобы оперативнее пофиксить возможные баги, если таковые обнаружатся. После первого дня работы полёт нормальный 🚀. А в будущем я надеюсь ещё часто возвращаться к сайту 🚕 Такси 42 в своих заметках. Будет много интересного.

Кот

У нас в подъезде появился кот. Сидит третий день на лестничной площадке на десятом этаже. Мелкий, ему наверно где-то полгода. Отличный аппетит. Если покормить и погладить, то мурчит, как трактор.

Соседи в домовом чате спрашивают друг друга, чья потеряшка? Никто не сознаётся. На второй день общими усилиями выяснили, что этот кот жильцов, которые снимали у нас в подъезде квартиру. Теперь они съехали, а кота просто оставили. Есть шанс, что забыли. Хотя на третьи сутки-то точно забрали бы. Значит, специально оставили. Бывают такие люди.

Вчера ходили его кормить раза три. Натаскали ему мяса из супа. Он ест. Когда мясо в супе почти закончилось, стал есть супные же макароны, картошку и морковку ) Остальные соседи тоже подкармливают. Причитают в чате: как же теперь быть котику? А сами не забирают. Звонили в приют для животных. Там отказали, т. к. у самих места нет уже. Только попросили фотку для объявления. Вдруг заберет кто-нибудь.

Между тем, в чате появились фотки первых какашек. На ночь кота стала пускать одна соседка. Но взять его на совсем не может. У неё свой кот и он ругается. Поэтому утром выпускает потеряшку обратно в подъезд. Ситуация накаляется, а выхода не видно.

У меня в детстве был кот. Мы были с ним лучшими друзьями. Но это было совсем в другое время и в другом мире. У нас дома даже лотка никакого не было. Кот сам ходил на улицу. Бывало, по весне убежит и три дня его нету. На четвертый день явится. Весь худющий, в репьях и пахнет подвалом. Орёт, жрать просит. Поест, попьёт и снова на три дня убежит. Такой был кот.

А сейчас как? Гулять с ним я не буду. А одного на улицу не пущу. Страшно за него. На улице чего только нет. И машины, и дурные люди, и болезни всякие. И что, он будет всю жизнь жить в квартире? Говорят, надо кастрировать. Что за жизнь такая? Либо тебя кастрируют, либо собаки загрызут.

В общем, решение не из лёгких. Надеюсь, кота таки пристроят. Либо он всё-таки подружится с соседкиным котом. Иначе придётся идти покупать лоток. Будет большим везением, если кот к нему уже приучен.

Новый старт

Ура, это случилось! Не думал, что успею. Символично получилось, что именно в последний день года я закончил доработку своего сайта. И запускаю на нём блог. Буду писать в него об интересных случаях, которые встречаются в моей работе. И вообще всякое о жизни.

Зачем всё это нужно? Для денег, естественно! За ушедший год рынок труда в IT заметно просел. Сейчас моя работа меня устраивает и даже нравится. Но на случай форс-мажора (стучу три раза по дереву), лучше подстраховаться заранее.

Я знаю, чтобы классного специалиста заметили, нужен нетворкинг. Для начала не помешает хорошее резюме, портфолио, заполненные профили в соцсетях и прочее такое. В общем, нужно засветиться в сети.

А если серьёзно, говорят, что среди программистов много интровертов. Вот и я такой же. Но даже самому отъявленному интроверту нужно иногда поделиться своим дивным внутренним миром. Я давно заметил, что у меня неплохо получается строчить заметки. Почему бы не выкладывать их? Это и будет моим окном для общения.

Теперь про техническую часть. Она интересная. Сайт работает на смеси двух движков. Wordpress и Эгея. Скрестил ежа с ужом. Ёж — это, конечно, Вордпресс. У него весьма обширная функциональность. Много разных функций, плагинов, кнопок. Как иголок у ежа. А уж, — это Эгея. У неё есть одна особенность: нельзя прятать посты под кат. Потому страницы длинные, как змея. Кстати, приходит как раз год змеи. Ещё одно символичное совпадение.

Получился такой гибрид очень просто. Сначала я решил делать блог на Вордпрессе. Стал делать под него тему оформления и запутался: чем здесь отличаются категории от тэгов? Показались невнятными объяснения о том, что категории — это общее, а теги — узкое.

Я вспомнил, что есть ещё такой движок для блога — Эгея. Она давно развивается, а её автор, — Илья Бирман, — спец в пользовательских интерфейсах вообще и в блогах в частности. Я посмотрел Эгею, а там категорий нет вообще. Только тэги. Это меня устроило. И вообще Эгея показалась мне удобной. Вот я и решил её попробовать.

Но Эгея — только для блога. А остальные страницы будут у меня на Вордпрессе. Не зря же под него тему делал. Пришлось попыхтеть чтобы расшарить тему на два разных движка. Получилось, по-моему, неплохо.

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

Пользуясь сайтом, вы соглашаетесь с использованием Cookie