Урок 7. Как сделать баннер методом тройного «Б»

Приветствую вас! Сегодня покажу, как быстро сделать броский баннер в магазин Ярмарки Мастеров. Используем метод утроенного «Б». Не знаете, что это такое? Читайте дальше)

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

методом тройного «Б» — Быстро, Броско, Бесплатно!

Все просто и легко. Хотя, присутствует одно «Но». Если готовый баннер можно загружать только в формате картинки (к примеру, как в Ярмарке Мастеров) надо уметь делать скриншот-снимок экрана. Подробнее об этом напишу ниже.

Напоминаю, что баннеры на ЯМ могут размещать только Мастера с оплаченной Клубной Картой.

Это — новый баннер в моем магазине на ЯМ. Вчера я быстренько сделала его в онлайн-генераторе «Арт Баннер студия». «Онлайн» — значит, не придется что-то скачивать, устанавливать. главное, иметь выход в интернет в это время.

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

1-banner-dlja-jarmarki-masterov

Заходим на страницу сайта http://www.artbanner.com.ua/generator-bannerov-onlayn Видим такую картину. Изображение с вашим баннером будет отражаться в окне, которое сейчас мною обведено красным цветом. Каждый раз смотрите, как и что там меняется.

2-kak-sozdat-bannery-besplatno-samomu

 

Выберем макет размером 728×90. Последовательность действий показана стрелками.
Выполним команды для загрузки фото для фона: «Выберите файл» — «Закачать». Ждем пару секунд, пока загрузится, кликаем «Обновить».

3-vybrali-razmer-maketa-dlja-bannera

Изображение появилось, на нем пунктиром обозначен баннер того размера, который выбран. Остается выбрать нужную область на картинке, которая станет фоном в баннере. Для этого левой кнопкой мышки перемещаем рамку куда нужно (синяя рамочка). Нажимаем «Продолжить».

4-zakachali-izobrazhenie-dlja-fona

Далее правим «Текст». Поясню, что означают разные стрелки.

  • Синие. Впишите предложение/слово, которое будет отражаться на баннере. У меня будет два предложения на баннере, поэтому, я вписываю их в два первых окна. В первом слова «Душевное вязание», во втором «для Вас». Чтобы передвинуть его вверх-вниз, влево/вправо, двигайте бегунки в соответствующих направлениях. Для того, чтобы разместить текст правее, поставьте курсор перед текстом, нажмете клавишу «пробел» на клавиатуре (самая длинная).
  • Красные. Задаем размеры и оттенки цвета.
  • Розовые. Выбираем подходящий шрифт, из большого количества, которые нам предложат после того, как кликнем «Пример».
  • Желтые. Каждый раз жмите «Обновить», чтобы увидеть обновления.

5-zadali-vse-vazhnye-parametry-bannera

Когда убедились, что все нас устраивает, открываем третий раздел «Рамка». Пара щелчков мышью — выбрали цвет и размер рамочки.

6-sdelali-ramku

Теперь используем функцию «Эффекты», название говорит само за себя. Покликайте по ним, вы увидите, как меняются оттенки баннера. Я добавила контрастности, чтобы вязаное полотно смотрелось броско.

7-ispolzuem-jeffekty

Все, баннер практически готов! Жмем «Сохранить». Видим, что предлагается Html-код для web-страниц. Он пригодится, когда создается кликабельный баннерок. Например, такой сейчас стоит у меня в блоге. Нажав на него, посетитель попадает прямо на страницу моего магазина.

Однако, в ЯМ такой способ не подходит. Там надо загружать фотографию, а не код к ней. Поэтому, я  сделала скриншот-снимок готового изображения баннера. Используйте клавиатурные клавиши Ctrl + PrtSc или специальные программки (у меня FastStone Capture).

8-sohranjaem

Затем, в этом фоторедакторе подогнала размеры (обязательно уберите галочку напротив «Сохранять соотношение»). Если вы еще не знаете про этот отличный ФР, очень рекомендую.  Он на русском языке, многофункциональный. Можно быстро создать прозрачную надпись на фото, сделать белый фон, украсить красивыми рамками, сжать «вес» (важный момент для вебмастеров), изменить размеры и мн. др. Как его правильно скачать и пользоваться описано в уроках рубрики «Фоторедактор Fhotofiltre».

Внимание!
С октября 2018 г. на Ярмарке Мастеров обновление: баннер магазина теперь крупнее. Новые размеры: 1260 х 200 пикселей.

9-redatiruem-v-fotoredaktore
Остается загрузить готовый баннер к себе в магазин. И — подождать, когда он пройдет модерацию.

Теперь вы знаете метод тройного «Б», который позволяет Быстро, Броско, Бесплатно создать баннер для своего магазина или блога. Если остались неясные моменты, не стесняясь, спрашивайте в комментариях, разберемся вместе.

С уважением, Сауле Вагапова

Печать



УдовлетворительноХорошоОтлично (голосов: 2, в среднем: 5,00 из 5)
Загрузка...
К записи "Урок 7. Как сделать баннер методом тройного «Б»" 15 комментариев
  1. Лада:

    Здравствуйте, спасибо за подробности, го на момент сохранения, не понятно. Сжимать фото. Я не умею. Где смотреть не знаю. Может с момента сохранения подробнее написать??

    • Сауле Вагапова:

      Здравствуйте, Лада. Обычно рекомендуется сжимать фото перед публикацией на сайтах. Делается это для того, чтобы уменьшить их «вес». Например, фото, что я тут ниже показываю, имело вес 60 Kb. Я его сжала до 15 Kb, т.е. в четыре раза. Когда на сайте много фото, это приводит к тому, что страницы долго-долго загружаются. Посетителям это не нравится, и они могут просто уйти только по этой причине.

      Сжать фото можно или на онлайн-сервисах (т.е. прямо в интернете). Или, я делаю это в фоторедакторе Fhotofiltre вот так (показано на скриншот-снимке ниже). Когда фото готово, жму «Файл» — «Сохранить как». Появляется такое окно, в котором надо сдвинуть бегунок влево, уменьшая вес фото, таким образом сжимая его. Сразу жму «Просмотр» и вижу, как меняется фото (как бы бледнеет немного). И тут же видно, как меняется «Размер файла». Если все устраивает, жму «Ок» и сохраняю фото.

      Как сжать фото

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

  2. ЮЛИЯ:

    А как добавлять баннер на Ярмарку Вы нигде и не написали

    • Сауле Вагапова:

      Юлия, баннер размещается так. Войдите на свою страницу на Ярмарке мастеров в раздел «Профиль». Нажмите на подраздел «Изменить информацию».

      Добавляем баннер на ЯМ

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

      После этого надо подождать, пока модераторы одобрят Ваш баннер. Как баннер проходит модерацию, я писала подробно ТУТ.

  3. Татьяна:

    Cауле, здравствуйте, я какие фото не предлагала для баннера, их не пропускают из-за объема фото, незнаю что делать

    • Сауле Вагапова:

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

      Когда будете сжимать фото, обратите внимание на параметры «ширина» и «высота». Там обязательно уменьшайте значения чисел. Скорее всего, у Вас будет где-то 5000 с лишним, или 2000 и т.д. А Вы ставьте 600 — 700, качество фото не пострадает, а размер (вес) фото уменьшите.

  4. Татьяна:

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

    • Сауле Вагапова:

      Татьяна, здравствуйте. Смотрите, в чем дело: если Вы делаете баннер тоже, как я, для Ярмарки Мастеров (уточняю на всякий случай), то, когда Вы доходите до того места, где предлагается сохранить баннер и сгенерировать код, этого делать не нужно. Потому, что в Ярмарке Мастеров такой способ не подходит. На ЯМ надо загружать фотографию, а не код к ней.

      Поэтому, в статье у меня написано, что «я сделала скриншот-снимок готового изображения баннера. Используйте клавиатурные клавиши Ctrl + PrtSc или специальные программки (у меня FastStone Capture)». Вам надо сделать так же.

      При этом, Вы правильно заметили — надо смотреть, куда сохраняется скриншот, особенно, если будете сохранять с помощью клавиатуры. Я, к сожалению, не смогу в картинках показать, как именно это сделать, т.к. у меня программа для скриншотов FastStone Capture сразу включается.

      Но, не должно быть ничего сложного: когда сохраняете, посмотрите при нажатии кнопки «Сохранить» в самый верх окна, там должно быть прописано «Рабочий стол».

    • Сауле Вагапова:

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

      Пунктирная рамка

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

  5. Татьяна:

    Сауле еще раз здравствуйте, скажите пожалуйста, можно или нет поменять заглавное фото?

    • Сауле Вагапова:

      Татьяна, здравствуйте. Сейчас попробую разобраться по предыдущему Вашему вопросу )

      А по поводу этого вопроса пока не совсем поняла — а где находится заглавное фото, где его надо поменять?

      • Татьяна:

        Когда вставляешь не более 6 фотографий одного изделия, там одна фотография идет как заглавная, ее видят все, кто зашел на ЯМ, я бы хотела на некоторых своих изделиях ее поменять на более привлекательное фото, но не могу.

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

        • Сауле Вагапова:

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

          А вообще, должно легко меняться все местами. Заходим в свой магазин, в этом окне выбираем «Редактировать»

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

          По второму вопросу отвечала. да, в окошке ничего не надо писать, только сделать скриншот готового баннера и дальше все, как в статье. Если не удастся задать нужный размер баннеру, прикрепите его здесь, я Вам сделаю )

        • Татьяна:

          Не получается с баннером,с фото я справилась, а с баннером пока никак. Сауле спасибо Вам большое.

          • Сауле Вагапова:

            Хорошо, Татьяна, если удастся сделать скришот-снимок баннера, можете его здесь прикрепить к комментарию, я Вам быстро сделаю его требуемого размера, чтобы Вам осталось лишь отправить его на модерацию на ЯМ.

Оставить свой комментарий

Saule

Приветствую Вас! Меня зовут Сауле. В этом блоге я делюсь своими описаниями и фото-МК по вязанию крючком, спицами и машиной Silver Reed. А также, пишу о том, как красиво обработать фото и где продавать вязание. Буду рада, если это окажется полезным для Вас.

Комментарии в блоге

Ярмарка Мастеров - ручная работа, handmade

МОИ ПЛАТНЫЕ ОПИСАНИЯ/МК





Подпишитесь и скачайте два фото-МК бесплатно!


ПРИСОЕДИНЯЙТЕСЬ к нам ВКонтакте!
Любое использование материалов блога без согласия автора ВОСПРЕЩЕНО


Разрешается распечатка материалов блога (для Вашего личного пользования) с помощью кнопки "Печать" (в конце каждой статьи).

Посетите наши страницы в социальных сетях!

ВКонтакте.      Facebook.      Google Plus.      YouTube.      RSS.
Вверх
   Saule-blog.ru 2014 - 2018 ©Все права защищены . Политика конфиденциальности   //