Совет 1: Как сделать свой баннер

Создание собственного сайта - важный шаг в развитии человека и выгодный ход для молодой компании. К самым важным атрибутам любого сайта относятся информативность, удобство навигации и дизайн. Одной из наиболее значимых деталей дизайна, в свою очередь, является красочный и оригинальный баннер.
Вам понадобится
  • Редактор растровой графики Adobe Photoshop
Инструкция
1
Сначала нужно определиться с размером баннера. Чаще всего баннеры занимают всю (или практически всю ширину) сайта и имеют небольшую высоту. Поэтому в начале нужно узнать ширину своего сайта (сделать это можно как средствами html, так и программой DreamWeaver, использующейся для разработки сайтов) и определиться с высотой вашего баннера.
2
Создаем новый документ в программе Adobe Photoshop (версия в данном случае весомой роли не играет). Ширину и высоту нового документа задаем в пикселях, Фон предпочтительно использовать белый или черный, дабы он не отвлекал вас о процесса создания баннера. Затем его можно заменить на более интересный цвет (который подбирается немного светлее, или наоборот, темнее основного фона сайта). Когда размеры и фон выбраны, можем нажимать "ОК" и приступать к созданию интересного баннера.
3
Как правило, баннер состоит из графической информации - ряда небольших картинок и текста (на котором представлена в нескольких словах важнейшая информация - о чем и для кого данный web-ресурс). Для того, чтобы разместить на баннере небольшие картинки, открываем в отдельных окнах исходные изображения или уже готовые клипарты и перетаскиваем на баннер, используя инструмент "лассо", которым выделяем объект. Нужно применить сочетание клавиш CTRL+C для копирования рисунка. Дальше мы делаем окно баннера активным щелчком по нему, нажимаем CTRL+V - и нужный графический объект размещен на баннере.
4
Добавление текстовой информации намного проще. Используем инструмент "текст" (иконка - заглавная буква "Т"), и на активном окне создания баннера печатаем нужные слова. Изменить цвет текста можно, используя панель атрибутов "Текст", также можно использовать инструмент "Пипетка" для подбора нужного цвета из элементов баннера.

Совет 2: Как сделать свой баннер бесплатно

В интернете существует большое количество уроков, обучающих созданию баннеров, однако часто в них требуются углубленные знания различных емких программ, достаточно сложных для начинающего web-мастера. Если же вы хотите сделать красочный баннер быстро и несложным способом, вам поможет в этом стандартный графический редактор Paint, который входит в сборку ОС Windows.
Вам понадобится
  • стандартная программа Paint, программа Gif Animator
Инструкция
1
На панели «Пуск» выберите пункт «Все программы», затем «Стандартные». Кликните программу Paint, чтобы она открылась.
Как сделать свой баннер бесплатно
2
Чтобы баннер получился интересным и эффектным, вы можете заранее скачать несколько вариантов изображений по нужной для вас теме. Выберите наиболее подходящую из них, которая будет представлять рекламу вашей продукции или услуги.
3
Чтобы загрузить выбранную картинку в редактор Paint, нажмите на значок в левом верхнем углу, затем выберите пункт «Открыть».
Как сделать свой баннер бесплатно
4
В открывшейся вкладке обзора файлов найдите выбранное изображение, выделите его и нажмите «Открыть» (или просто дважды кликните по нему).
Как сделать свой баннер бесплатно
5
Выделите главный информационный элемент вашего изображения: «Изображение» - «Выделить» - «Прямоугольная область» (или с помощью курсора).
Как сделать свой баннер бесплатно
6
Задайте выделенному элементу нужную форму, двигая квадратики выделения курсором. Например, вы можете немного сдвинуть изображение вправо, чтобы освободить свободное пространство для надписи с левой стороны будущего баннера.
Как сделать свой баннер бесплатно
7
Чтобы обрезать выделенную область, нажмите «Изображение» - «Обрезать».
Как сделать свой баннер бесплатно
8
Измените размер изображения: «Изображение» - «Изменить размер».
Как сделать свой баннер бесплатно
9
В окне изменения размера задайте нужный размер в пикселях в ширину и в высоту. Для задания произвольных параметров уберите галочку напротив пункта «Сохранять пропорции».
Как сделать свой баннер бесплатно
10
Нажмите на на значок в левом верхнем углу - «Сохранить как» - «Изображение в формате GIF».
Как сделать свой баннер бесплатно
11
В открывшемся окне в строке «Тип файла» будет установлен формат GIF (*gif). Задайте имя файла и сохраните его, нажав «Сохранить».
Как сделать свой баннер бесплатно
12
Чтобы вставить на баннер текстовую информацию, активизируйте инструмент «Текст».
Как сделать свой баннер бесплатно
13
На панели инструмента ввода текста выберите нужные размер, шрифт, цвет, тип и расположение шрифта. Растяните рамку для ввода текста на нужные длину и ширину и введите текст.
Как сделать свой баннер бесплатно
14
Можно добавить на баннер какие-либо дополнительные элементы. Или, например, оформить его в рамочку: «Фигуры» - «Прямоугольник» - выбрать толщину и цвет рамки - курсором мыши растянуть рамку по краям изображения. Затем снова сохраните файл, но под другим именем.
Как сделать свой баннер бесплатно
15
Теперь нужно создать еще один файл с другим текстом. Откройте первый сохраненный файл (без текстовой информации) и нанесите на него новый текст и прочие элементы описанным выше образом. Как вариант, просто сотрите ластиком предыдущий текст, чтобы внести новый (если фон белый). Если фон другого цвета, кликните его пипеткой и закрасьте этим цветом текст. Готовый баннер сохраните, как описано выше.
Как сделать свой баннер бесплатно
16
Итак, у вас есть под рукой два одинаковых файла с разным текстом. Это будут два слоя, которые нужно объединить, чтобы текст баннера постоянно изменялся. Эту операцию можно легко сделать в небольшой программе для создания анимированных GIF'ов MS GIF Animator.
17
Установив программу на компьютер, откройте ее двойным кликом.
Как сделать свой баннер бесплатно
18
В панели инструментов Gif Animator нажмите значок Open/«Открыть» (или Ctrl+O), в поле «Папка» выберите свою папку с созданными GIF-файлами. Затем двойным щелчком мыши выберите файл, который станет вторым слоем вашего баннера, чтобы другой файл (первый слой) лег сверху, т.к. в этой программе анимация создается в обратном порядке.
Как сделать свой баннер бесплатно
19
Откройте первый слой инструментом добавления Insert/«+» (или Ctrl+I).
20
Сгруппируйте слои инструментом Select All/«Выделить все» (или Ctrl+L) .
21
Перейдите во вкладку Animation и поставьте галочку напротив пунктов Repeat forever («Всегда повторять») и Looping («Выполнение цикла»).
22
Во вкладке Image установите скорость кадров - к примеру, 1/80, оптимально.
23
Нажмите инструмент Preview (или Ctrl+R), чтобы просмотреть результат.
24
Сохраните баннер с помощью инструмента сохранения Save (или Ctrl+S). Ваш баннер готов, теперь его можно размещать.
Обратите внимание
Чтобы избежать большого веса баннера, лучше ограничиться 2-4 слоями.
Совет полезен?
Анимация текста происходит способом замены слоев, поэтому аналогичные действия можно применить и к основному фону.
Источники:
  • Как сделать баннер онлайн бесплатно
Обратите внимание
Очень важно определиться с тем, какой баннер вам нужен - анимированный или статичный. Если на вашем сайте имеется множество текстовой информации, обязательной для прочтения, лучше использовать статичную картинку - она не будет отвлекать посетителей от важных материалов.
Полезный совет
Несмотря на тот факт, что сделать интересный и оригинальный баннер в фотошопе может практически каждый, для серьезных сайтов и порталов имеет смысл обратиться к опытному дизайнеру с портфолио. Найти дизайнеров-фрилансеров можно на специализированных ресурсах, например на www.demiart.ru.
Источники:
  • Урок создания баннера
Поиск
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500