Блог Ивана Самойлика

Про «оригинальный» дизайн

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

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

Это имиджевые сайты, которые напрямую не продают, но косвенно влияют на продажи. Владелец завода должен похвастаться сайтом перед друзьями. Заводы через сайт не продают товар, все ок. Еще такие сайты делают банки.

Если вы требуете от студии чего-то «оригинального», то сайт может плохо продавать товар. Лучший вариант — не мудрить, собрать со всех конкурентов крутые идеи и сделать сайт, который впитает только лучшее. А зацепить клиента не дизайном, а ценой и сервисом. Попробуйте, это работает. Если цена большая, а сервис плохой, но хороший дизайн, то вы скоро закроетесь.

Пример такого сайта:

demilie.ru

Листаешь страницу, а она творит такой. Круто, спору нет.

Но они переборщили. Плавные переходы и красочные картинки не дают прочитать текст, хочется просто листать и смотреть. Я посмотрел всю страницу, но до сих пор ничего не знаю о компании.

Где брать идеи

Чтобы сделать крутой сайт, надо собрать кучу идей. Идеи можно брать везде: таблички, указатели, буклеты, сайты большие и маленькие, инструкции, афиши. Можно взять в одном месте и применить в другом. Тогда выйдет оригинально и круто, но делать все в рамках шаблонного сайта. Когда меню сверху, телефон справа, а текст не скачет и не плавает.

20 мая   дизайн

Какие ссылки покупать

Я не покупаю ссылки давно, но когда покупал, у меня были правила.

Тематические сайты, но не обязательно. Если у вас строительный сайт, купите ссылку на строительном информационном сайте. Хотя ссылка на новостном сайте в пресс-релизе или интервью — хорошая ссылка.

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

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

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

Посещаемость — важна. Материал должны читать, делиться им в социальных сетях, сохранять сайт в закладки. Если статьи не читают, а материал не распространяют, то грех такой ссылке, которую никто не увидит и не кликнет.

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

П.С. Все от обратного — не работает. Если на сайте много ссылок — не покупайте там, потратите зря деньги. На биржах 99% сайтов — фуфло. Пишите владельцам сайтов лично, создавайте свои проекты, размещайте партнерский контент на других сайтах и берите интервью у профессионалов. Это все классно работает, но стоит денег, хотя не всегда.

Роботс.тхт

Не важен, но иногда все-таки важен.

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

Если вы его не заполнили, все равно сайт появится в поисковиках. Но если заполнили с ошибкой — поисковик удалит страницы или покажет не те.

Зачем нужен

Вы говорите поисковикам: сюда иди, здесь важная информация, а здесь у меня системные страницы, сюда нельзя. Робот прочитает и скажет «окей».

Поисковые роботы яндекса и гугла не единственные, кто будут заходить на сайт. Есть специализированные роботы: одни ищут имейл и телефон, микроразметку ищет другой робот, медийный робот ищет картинки и видео.

Что туда писать

Напишите: название бота, куда ему запрещен доступ, как часто он может к вам заходить на сайт, адрес сайтмэпа и главное зеркало.

У Яндекса есть инструкция:
https://yandex.ru/support/webmaster/controlling-robot/robots-txt.xml

Там все правила: как писать название робота и какие бывают, как запретить вход на отдельную страницу или всю категорию, как разрешить вход, показан синтаксис, чтобы робот правильно все прочитал.

Про ошибки

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

Если использовать стандартный роботс — все будет работать. Возможно, будут лишние страницы в поиске, но поисковик сам их уберет со временем.

2017   роботс

Зачем мониторить сайты конкурентов

Чтобы красть идеи.

Хорошо заимствовать идеи. Все в мире знать нельзя. А когда долго занимаешься одним проектом — мылится глаз и не видишь очевидные вещи. Так что допускать глупые ошибки нормально. В писательстве это опечатки, в дизайне — нарушение теории близости.

Что можно красть у конкурентов

  1. Фишки в дизайне. Как устроено меню, шапка, поиск. Что сделано плохо, а что хорошо. На чем сделан акцент. Какая полезная информация для посетителей у них есть. Что угодно.
  2. Структура каталога. Когда собрал семантику и думаешь что достаточно. А потом видишь у конкурента страницы с более узкими запросами и делаешь то же самое. На практике узкие запросы дают мелкие плоды. Но зависит от региона.
  3. Оптимизация сайта. Это тайтл, текст и тд. Смотришь как сделано и как сидит страница в поиске. А потом пробуешь то же самое, вдруг даст плюс. Это игра в удачу.
  4. Рекламные каналы. Где присутствует, а еще важнее, где их нет. Какие объявления, картинки, слова написаны. На какие страницы идет трафик, откуда. Где платят деньги за поднятие объявлений, сколько, как часто. С кем запартнерились, что пиарят.

О заголовках

Заголовок — важная штука.

Привлекает внимание. Первый взгляд бросается на него, чтобы понять «я там или нет», и если там, то можно читать дальше. Здесь работает принцип контраста, когда заголовок выделяется на фоне всего остального.

Бросается в глаза. Выделить можно любым способом: написать другим шрифтом, жирнее или в разы крупнее обычного текста, подчеркнуть или в рамку засунуть. Он может вылазить сбоку, посередине, выровнен по левому или правому краю. Что душе угодно, лишь бы был заметен.

Создает контраст, иначе на его не обратят внимание. Этот и пункты выше — связаны. Если вокруг будут элементы такого же размера — заголовок сольется с ними и контраста не будет. А значит непонятно что читать первым.

***

Говорит о пользе: научится новому, узнать что-то, развлечься.

Выполняет три функции: рекламную, навигационную и информационную.

  • Рекламная функция заголовка — затащить человека в статью. Навигационная — помогает найти нужное. Информационная — рассказывает важные мысли.

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

  • Статью «Как Россия нагнула Европу» прочитают все, потому что всем нужно развлекаться и отвлекаться от проблем.

Специфические заголовки для профессиональной аудитории. Популярность в интернете не получите, но получите признание в узком кругу.

  • Статью «Как кризис в России отразился в странах СНГ» прочитаю мало людей, но это будут «ваши» люди.

Заголовки бывают назывные и транзитивные. Назывные говорят «о чем тут?», транзитивные — «что тут сказано». Их можно использовать вместе.

  • Назывной — Как СССР победила Германию. Транзитивный — Россия всех победила.

Непреднамеренное унижение человека в рекламе

Эта реклама висит в маршрутке. И вроде бы в ней нет ничего плохого.

На листовке написано: «Наши люди в булочную на такси ездят». Но читается как: «Мы возим людей, которые богаче вас, потому что вы ездите на маршрутке».

А добивают словами «наши люди», намекая что вы не их люди, и «в булочкую», мол, вы с работы на работу, а наши с утра за круассанами едут, чтобы вкусно позавтракать.

Текст на листовке сработает в одном случае. Если компания ищет тех, кто по утрам ездит в булочную на маршрутке, но не против ездить на чем-нибудь другом. Тогда они попали в точку. Но я таких людей не знаю.

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

Ограничьте выбор

Предложите три варианта, а не двадцать три.

Увидел в одном интернет-магазине длинную страницу с предложением по рассрочке.

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

28 предложений от пяти банков. Рассрочка и лизинг от 1 до 12 месяцев. Чтобы прочитать страницу уйдет полчаса, чтобы выбрать рассрочку — вечность.

Вышло полотно, в котором сложно определиться. Выбрать 5 месяц или 8? Лизинг или рассрочку? А какой банк лучше?

Как правильно

Показать три рассрочки на 3-6-12 месяцев от одного банка. Расписать все условия. Спросить в банке о частых вопросах и написать ответы на странице.

Есть эксперимент с продажей джема.
Суть такова: при одинаковой проходимости и количестве дегустаций, 6 видов джема сделают больше выручки, чем 30.

Как клиенты принимают решения, Большие планы.

Чем больше выбор, тем больше сомнений и шанса ошибиться. Проще отказаться от выбора, чем сделать неправильный.

О фотографиях команды

Показывайте настоящие фото.

Фотографии нужны для чего-то. Запомнить лицо человека перед встречей, чтобы не перепутать. Записать имя и должность. Узнать номер телефона, найдя человека по лицу или имени.

Фотосток — плохо. Не делайте так. Не ставьте фотографию только потому, что так нарисован дизайн. Напишите крупными буквами «Команда», но не ставьте левых людей.

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

Нет фоток — не показывайте. Заказывают услугу из-за компетенции, а не внешнего вида сотрудников.

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

Фотографии тех, кто отвечает за результат. Эти люди будут общаться с клиентами и решать их проблемы, хорошо бы представить их заранее.

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

Один стиль фоток. Белая стена, дневной свет, человек обрезан по плечи, взгляд в камеру.

  • Домашние фотки, с вечеринки, селфи, разная отдаленность до лица — не пойдет. Если в одном стиле, но с одним отличием, то ничего страшного. Фон разный, а остальное — одинаковое, то все ок. Главное, чтобы фотографии смотрелись гармонично друг с другом.

Серый мелкий текст

Подозрительный.

Мелкий текст неплох, если он весь мелкий:

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

Бросается в глаза, когда вокруг него крупный. Поставьте его отдельно, куда-нибудь на поля и добавьте воздуха, тогда он будет захватывать внимание и выглядеть важным. Мелким текстом подписывают фотографии и пишут в сносках.

Этот текст выделяется, потому что стоит сбоку и мельче основного.

Этот же текст, но серым цветом:

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

Стало в разы хуже. Кажется, что нас хотят обмануть, иначе зачем так прятать. Там будет написано: гарантии нет, доставка платная, комплектация и цвет может отличаться от фотографии, товар б/у, сломано что-то в нем.

Мелким текстом пишут гадости

Не будьте плохим человеком.

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

Если решили писать мелкий текст, то:

  1. Старайтесь не использовать шрифт с засечками.
  2. Подберите контрастный цвет.
  3. Попробуйте ограничить ширину и поменять интерлиньяж.
2016   текст

Похожие товары в интернет-магазине

Мало кто умеет грамотно пользоваться блоком с похожими товарами. Добавляют его, лишь бы предложить «что-нибудь еще». С самим модулем никто работает, хотя он напрямую влияет на продажи.

Зачем нужен

Чтобы больше заработать денег и помочь клиенту с выбором. Но это не способ манипуляции. Вы должны предлагать нужный товар в нужное время. Это могут быть дополнительные аксессуары или аналог товара. К айфону 5 на 16 гб можно предложить чехлы и наушники, а можно показать этот же айфон, но с другим объемом памяти.

Где показывать

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

Снизу покажите аналоги, достаточно четыре—шесть позиций, чтобы не потеряться в выборе. Выглядит это так: человек перешел на страницу товара, посмотрел фотографии, изучил характеристики, почитал описание. Если не решился на покупку — его встречает блок с похожим товаром и начинается все заново. Хотя есть вероятность, что он уйдет раньше, например, в середине описания или после просмотра фото.

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

Сколько показывать товаров

Зависит от дизайна и разрешения экрана.

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

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

Правило внутреннего и внешнего о расстоянии между объектами.

Что показывать

Покажите картинку, заголовок и цену. Не нужно лепить рейтинг, название категории, логотип производителя, кнопку «купить». Блок приглашает посмотреть товар, а не продает.

Аналоги. Характеристики товаров должны совпадать. Если продаете морозильник на 4 камеры серого цвета, не стоит показывать на 8 камер красного. Цены не должны сильно отличаться, если товар стоит 200 долларов, можно предложить за 180 и 230, но 250 уже много.

Аксессуары. Вдогонку продайте недорогой товар, к морозильнику предложите удлинитель на два метра. Покупка происходит на контрасте цен, к морозильнику за 200 долларов не жалко купить удлинитель за пару баксов.

Как формировать список товаров

Рандомно. Подойдет любой стандартный алгоритм. Он будет выводить товар из той же категории, но не особо вдумываясь: популярные, с похожим названием или просто вразнобой. Это нехороший вариант, но подойдет, если в магазине небольшой ассортимент.

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

На основе статистики. Система собирает данные и формирует связи между товарами. К телефону предложит карту памяти и наушники, к велосипеду — клаксон. Если клаксон продается плохо, система заменит его на звонок.

Разница между ручным управлением и на основе статистики — автоматизация. Вы один раз продумываете правила и система сама все делает.

Как сделать

Плохо. Впихните лишние элементы, поставьте блок не туда, неправильно расставьте акценты, покажите много товаров.

Что здесь не так:

  1. Листалка по бокам прячет товар.
  2. Товар разного цвета.
  3. Текст больше картинки.
  4. Разные габариты у морозильников.
  5. Рейтинг, звезды ни о чем не говорят.
  6. Код, он полезен только менеджеру.
  7. Кнопка «в корзину» лишняя, никто так быстро не покупает товар.
  8. Ссылка «сравнить все», непонятно что с чем будет сравниваться.


Хорошо. Покажите картинку, заголовок и цену. Не мудрите.

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

Ctrl + ↓ Ранее